tweak(dashboard): add html color pickers to all color fields

This commit is contained in:
Jake Fulmine 2023-06-03 12:45:22 +02:00
parent 99e6dc9d23
commit 3b0a7626de
4 changed files with 32 additions and 4 deletions

View File

@ -118,7 +118,14 @@
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Color:</Label>
<Input bind:value={input.color} type="text" placeholder={group.color} aria-label="group color"/>
<Row>
<Col xs={9}>
<Input type="text" bind:value={input.color} aria-label="group color value"/>
</Col>
<Col>
<Input class="p-0 w-100" on:change={(e) => input.color = e.target.value.slice(1, 7)} type="color" aria-label="color picker" />
</Col>
</Row>
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Icon url:</Label>

View File

@ -95,7 +95,14 @@
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Color:</Label>
<Input bind:value={input.color} type="text"/>
<Row>
<Col xs={9}>
<Input type="text" bind:value={input.color} aria-label="group color value"/>
</Col>
<Col>
<Input class="p-0 w-100" on:change={(e) => input.color = e.target.value.slice(1, 7)} type="color" aria-label="color picker" />
</Col>
</Row>
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Icon url:</Label>

View File

@ -149,7 +149,14 @@
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Color:</Label>
<Input bind:value={input.color} type="text" placeholder={member.color} aria-label="member color" />
<Row>
<Col xs={9}>
<Input type="text" bind:value={input.color} aria-label="member color value"/>
</Col>
<Col>
<Input class="p-0 w-100" on:change={(e) => input.color = e.target.value.slice(1, 7)} type="color" aria-label="color picker" />
</Col>
</Row>
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Avatar url:</Label>

View File

@ -139,7 +139,14 @@
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Color:</Label>
<Input bind:value={input.color} type="text" placeholder={input.color}/>
<Row>
<Col xs={9}>
<Input type="text" bind:value={input.color} aria-label="member color value"/>
</Col>
<Col>
<Input class="p-0 w-100" on:change={(e) => input.color = e.target.value.slice(1, 7)} type="color" aria-label="color picker" />
</Col>
</Row>
</Col>
<Col xs={12} lg={4} class="mb-2">
<Label>Avatar url:</Label>