📝(react) enhance Application demo form
This form was not using multi select, adding it provides a way to easily interact with all the form component in a single form making sure they all work.
This commit is contained in:
@@ -62,6 +62,7 @@ export const Application = () => {
|
|||||||
gap: "1rem",
|
gap: "1rem",
|
||||||
width: "400px",
|
width: "400px",
|
||||||
}}
|
}}
|
||||||
|
method="get"
|
||||||
>
|
>
|
||||||
<h1
|
<h1
|
||||||
className="fs-h3 fw-bold clr-greyscale-900"
|
className="fs-h3 fw-bold clr-greyscale-900"
|
||||||
@@ -83,6 +84,7 @@ export const Application = () => {
|
|||||||
},
|
},
|
||||||
]}
|
]}
|
||||||
fullWidth={true}
|
fullWidth={true}
|
||||||
|
clearable={true}
|
||||||
/>
|
/>
|
||||||
<div style={{ display: "flex", gap: "1rem" }}>
|
<div style={{ display: "flex", gap: "1rem" }}>
|
||||||
<Input label="First name" />
|
<Input label="First name" />
|
||||||
@@ -107,6 +109,28 @@ export const Application = () => {
|
|||||||
accept="application/pdf"
|
accept="application/pdf"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
<Select
|
||||||
|
label="Skills"
|
||||||
|
options={[
|
||||||
|
{
|
||||||
|
label: "Communication",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Teamwork",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Problem solving",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Leadership",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "Work ethic",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
multi={true}
|
||||||
|
fullWidth={true}
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
<TextArea label="Cover letter" fullWidth={true} rows={5} />
|
<TextArea label="Cover letter" fullWidth={true} rows={5} />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user