mirror of
https://github.com/tiennm99/loto.git
synced 2026-10-15 12:14:34 +00:00
style(master): number text matches ring color
All three places where called numbers appear (hero, tracking grid token, history list) — digit color now follows the ring: pink for 1–49, emerald for 50–90. Drops the rose-700 fallback that was mismatched against both rings.
This commit is contained in:
1 parent
e80af4bb45
commit
baccbf2dbd
1 file changed
+10
-6
@@ -178,7 +178,12 @@
|
|||||||
? 'border-pink-500 dark:border-pink-400 shadow-pink-500/30'
|
? 'border-pink-500 dark:border-pink-400 shadow-pink-500/30'
|
||||||
: 'border-emerald-500 dark:border-emerald-400 shadow-emerald-500/30'}"
|
: 'border-emerald-500 dark:border-emerald-400 shadow-emerald-500/30'}"
|
||||||
>
|
>
|
||||||
<span class="text-5xl sm:text-6xl font-black tabular-nums text-rose-700 dark:text-rose-800">
|
<span
|
||||||
|
class="text-5xl sm:text-6xl font-black tabular-nums
|
||||||
|
{lastIsLow
|
||||||
|
? 'text-pink-500 dark:text-pink-400'
|
||||||
|
: 'text-emerald-500 dark:text-emerald-400'}"
|
||||||
|
>
|
||||||
{lastCalled}
|
{lastCalled}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -204,10 +209,9 @@
|
|||||||
class="inline-flex items-center justify-center w-8 h-8 sm:w-9 sm:h-9
|
class="inline-flex items-center justify-center w-8 h-8 sm:w-9 sm:h-9
|
||||||
text-sm sm:text-base font-black tabular-nums rounded-full
|
text-sm sm:text-base font-black tabular-nums rounded-full
|
||||||
border-[3px] bg-amber-50 dark:bg-amber-100
|
border-[3px] bg-amber-50 dark:bg-amber-100
|
||||||
text-rose-700 dark:text-rose-800
|
|
||||||
{isLow
|
{isLow
|
||||||
? 'border-pink-500 dark:border-pink-400'
|
? 'border-pink-500 dark:border-pink-400 text-pink-500 dark:text-pink-400'
|
||||||
: 'border-emerald-500 dark:border-emerald-400'}"
|
: 'border-emerald-500 dark:border-emerald-400 text-emerald-500 dark:text-emerald-400'}"
|
||||||
>
|
>
|
||||||
{num}
|
{num}
|
||||||
</span>
|
</span>
|
||||||
@@ -248,8 +252,8 @@
|
|||||||
{!isCalled
|
{!isCalled
|
||||||
? 'border-slate-300 dark:border-slate-600 bg-slate-50/40 dark:bg-slate-700/30 text-slate-400 dark:text-slate-500 opacity-70'
|
? 'border-slate-300 dark:border-slate-600 bg-slate-50/40 dark:bg-slate-700/30 text-slate-400 dark:text-slate-500 opacity-70'
|
||||||
: isLow
|
: isLow
|
||||||
? 'border-pink-500 dark:border-pink-400 bg-amber-50 dark:bg-amber-100 text-rose-700 dark:text-rose-800'
|
? 'border-pink-500 dark:border-pink-400 bg-amber-50 dark:bg-amber-100 text-pink-500 dark:text-pink-400'
|
||||||
: 'border-emerald-500 dark:border-emerald-400 bg-amber-50 dark:bg-amber-100 text-rose-700 dark:text-rose-800'}
|
: 'border-emerald-500 dark:border-emerald-400 bg-amber-50 dark:bg-amber-100 text-emerald-500 dark:text-emerald-400'}
|
||||||
{isLast
|
{isLast
|
||||||
? 'ring-2 ring-red-500 dark:ring-red-400 ring-offset-1 ring-offset-white dark:ring-offset-slate-800 scale-110 shadow-md'
|
? 'ring-2 ring-red-500 dark:ring-red-400 ring-offset-1 ring-offset-white dark:ring-offset-slate-800 scale-110 shadow-md'
|
||||||
: ''}"
|
: ''}"
|
||||||
|
|||||||
Reference in new issue
Block a user