style: standardise select styling in DiscountsManagement, HolidayHours, TodayCalendar
Update select element classes to consistent h-9, shadow-xs, bg-background, focus-visible ring styling. Ultraworked with [Sisyphus](https://github.com/code-yeongyu/oh-my-openagent) Co-authored-by: Sisyphus <clio-agent@sisyphuslabs.ai>
This commit is contained in:
@@ -499,7 +499,7 @@
|
|||||||
<select
|
<select
|
||||||
id="dc-scope"
|
id="dc-scope"
|
||||||
bind:value={form.scope}
|
bind:value={form.scope}
|
||||||
class="flex h-9 w-full rounded-md border border-gray-300 bg-transparent px-3 py-1 text-sm shadow-sm"
|
class="flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
>
|
>
|
||||||
<option value="all_bookings">All bookings</option>
|
<option value="all_bookings">All bookings</option>
|
||||||
<option value="first_booking_only">First booking only</option>
|
<option value="first_booking_only">First booking only</option>
|
||||||
@@ -534,7 +534,7 @@
|
|||||||
<select
|
<select
|
||||||
id="dc-ms-type"
|
id="dc-ms-type"
|
||||||
bind:value={form.milestone_type}
|
bind:value={form.milestone_type}
|
||||||
class="flex h-9 w-full rounded-md border border-gray-300 bg-transparent px-3 py-1 text-sm shadow-sm"
|
class="flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
>
|
>
|
||||||
<option value="per_user_booking_count">Per-user booking count</option>
|
<option value="per_user_booking_count">Per-user booking count</option>
|
||||||
<option value="global_booking_count">Global booking count</option>
|
<option value="global_booking_count">Global booking count</option>
|
||||||
@@ -563,7 +563,7 @@
|
|||||||
<select
|
<select
|
||||||
id="dc-ms-unit"
|
id="dc-ms-unit"
|
||||||
bind:value={form.milestone_unit}
|
bind:value={form.milestone_unit}
|
||||||
class="flex h-9 w-full rounded-md border border-gray-300 bg-transparent px-3 py-1 text-sm shadow-sm"
|
class="flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
>
|
>
|
||||||
<option value="months">Months</option>
|
<option value="months">Months</option>
|
||||||
<option value="years">Years</option>
|
<option value="years">Years</option>
|
||||||
|
|||||||
@@ -568,7 +568,7 @@
|
|||||||
<select
|
<select
|
||||||
bind:value={row.start_time}
|
bind:value={row.start_time}
|
||||||
disabled={!row.is_open}
|
disabled={!row.is_open}
|
||||||
class="w-24 text-sm"
|
class="flex h-9 w-24 rounded-md border border-input bg-background px-2 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
>
|
>
|
||||||
{#each Array(24) as _, hour (hour)}
|
{#each Array(24) as _, hour (hour)}
|
||||||
{#each TIME15 as min (min)}
|
{#each TIME15 as min (min)}
|
||||||
@@ -580,7 +580,7 @@
|
|||||||
</select>
|
</select>
|
||||||
</td>
|
</td>
|
||||||
<td class="py-2">
|
<td class="py-2">
|
||||||
<select bind:value={row.end_time} disabled={!row.is_open} class="w-24 text-sm">
|
<select bind:value={row.end_time} disabled={!row.is_open} class="flex h-9 w-24 rounded-md border border-input bg-background px-2 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50">
|
||||||
{#each Array(24) as _, hour (hour)}
|
{#each Array(24) as _, hour (hour)}
|
||||||
{#each TIME15 as min (min)}
|
{#each TIME15 as min (min)}
|
||||||
<option value="{String(hour).padStart(2, '0')}:{min}"
|
<option value="{String(hour).padStart(2, '0')}:{min}"
|
||||||
|
|||||||
@@ -935,7 +935,7 @@
|
|||||||
<p class="text-sm text-red-500">Closed today</p>
|
<p class="text-sm text-red-500">Closed today</p>
|
||||||
{:else}
|
{:else}
|
||||||
<select
|
<select
|
||||||
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 text-sm"
|
class="flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
bind:value={startSelectValue}
|
bind:value={startSelectValue}
|
||||||
onchange={() => {
|
onchange={() => {
|
||||||
const p = parseSelectValue(startSelectValue);
|
const p = parseSelectValue(startSelectValue);
|
||||||
@@ -963,7 +963,7 @@
|
|||||||
<p class="text-sm text-gray-400">No available end time after selected start</p>
|
<p class="text-sm text-gray-400">No available end time after selected start</p>
|
||||||
{:else}
|
{:else}
|
||||||
<select
|
<select
|
||||||
class="flex h-9 w-full rounded-md border border-input bg-transparent px-3 text-sm"
|
class="flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm shadow-xs ring-offset-background transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50"
|
||||||
bind:value={endSelectValue}
|
bind:value={endSelectValue}
|
||||||
onchange={() => {
|
onchange={() => {
|
||||||
const p = parseSelectValue(endSelectValue);
|
const p = parseSelectValue(endSelectValue);
|
||||||
|
|||||||
Reference in New Issue
Block a user