tiennm99/loto
1
0
Fork 0
mirror of https://github.com/tiennm99/loto.git synced 2026-05-14 10:58:42 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(master): number text matches ring color

Browse Source 
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:
tiennm99
2026-04-27 00:39:02 +07:00
parent e80af4bb45
commit baccbf2dbd
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/master/+page.svelte
+10 -6
View File
@@ -178,7 +178,12 @@
? 'border-pink-500 dark:border-pink-400 shadow-pink-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}
</span>
</div>
@@ -204,10 +209,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
border-[3px] bg-amber-50 dark:bg-amber-100
text-rose-700 dark:text-rose-800
{isLow
? 'border-pink-500 dark:border-pink-400'
: 'border-emerald-500 dark:border-emerald-400'}"
? 'border-pink-500 dark:border-pink-400 text-pink-500 dark:text-pink-400'
: 'border-emerald-500 dark:border-emerald-400 text-emerald-500 dark:text-emerald-400'}"
>
{num}
</span>
@@ -248,8 +252,8 @@
{!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'
: isLow
? 'border-pink-500 dark:border-pink-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-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-emerald-500 dark:text-emerald-400'}
{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'
: ''}"