fix(components): replace remaining unthemed gray classes with semantic tokens
Replace text-gray-*, bg-gray-*, border-gray-*, divide-gray-*, placeholder-gray-*, focus:border-blue-*, focus:ring-blue-*, hover:bg-blue-*, and ring-brand-mint with their semantic-token equivalents (text-ink, bg-muted, border-line, etc.) across all pages and shared components so dark mode renders correctly everywhere. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -40,7 +40,7 @@ let { form } = $props();
|
||||
|
||||
<div class="grid grid-cols-1 gap-5 md:grid-cols-2">
|
||||
<div>
|
||||
<label for="firstName" class="mb-1 block text-sm font-medium text-gray-700"
|
||||
<label for="firstName" class="mb-1 block text-sm font-medium text-ink-2"
|
||||
>{m.form_label_first_name()} *</label
|
||||
>
|
||||
<input
|
||||
@@ -48,12 +48,12 @@ let { form } = $props();
|
||||
name="firstName"
|
||||
type="text"
|
||||
required
|
||||
class="block w-full rounded border border-gray-300 p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
class="block w-full rounded border border-line p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="lastName" class="mb-1 block text-sm font-medium text-gray-700"
|
||||
<label for="lastName" class="mb-1 block text-sm font-medium text-ink-2"
|
||||
>{m.form_label_last_name()} *</label
|
||||
>
|
||||
<input
|
||||
@@ -61,12 +61,12 @@ let { form } = $props();
|
||||
name="lastName"
|
||||
type="text"
|
||||
required
|
||||
class="block w-full rounded border border-gray-300 p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
class="block w-full rounded border border-line p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="md:col-span-2">
|
||||
<label for="alias" class="mb-1 block text-sm font-medium text-gray-700"
|
||||
<label for="alias" class="mb-1 block text-sm font-medium text-ink-2"
|
||||
>{m.form_label_alias()}</label
|
||||
>
|
||||
<input
|
||||
@@ -74,7 +74,7 @@ let { form } = $props();
|
||||
name="alias"
|
||||
type="text"
|
||||
placeholder={m.form_placeholder_alias()}
|
||||
class="block w-full rounded border border-gray-300 p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
class="block w-full rounded border border-line p-2 text-sm shadow-sm focus:border-ink focus:ring-ink"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user