tiennm99/loto
1
0
Fork 0
mirror of https://github.com/tiennm99/loto.git synced 2026-08-06 02:23:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(master): bigger token text + gray ring for uncalled numbers

Browse Source 
- Bump number text to text-lg / sm:text-xl so digits read clearly
  inside the circle
- Pink/green rings now indicate *called* state — uncalled numbers get
  a neutral slate-gray ring instead, so the board's call progression
  is the dominant signal at a glance
This commit is contained in:
tiennm99
2026-04-27 00:22:01 +07:00
parent 19e10fd1ce
commit 945e2fdf0a
1 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/routes/master/+page.svelte
+8 -8
View File
@@ -223,18 +223,18 @@
{isLast ? 'z-10' : ''}"
>
{#if hasNumber}
<!-- Token: cream/beige inner, ring colored by value (pink ≤49, green ≥50). -->
<!-- Token: cream inner when called (pink ≤49 / green ≥50 ring),
gray-ringed and dim when uncalled. -->
<div
class="flex items-center justify-center
w-[82%] h-[82%] rounded-full
text-sm sm:text-base font-bold tabular-nums
text-lg sm:text-xl font-bold tabular-nums
border-[3px] transition-all
{isLow
? 'border-pink-500 dark:border-pink-400'
: 'border-emerald-500 dark:border-emerald-400'}
{isCalled
? 'bg-amber-50 dark:bg-amber-100 text-rose-700 dark:text-rose-800'
: 'bg-slate-50/60 dark:bg-slate-700/40 text-slate-400 dark:text-slate-500 opacity-60'}
{!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'}
{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'
: ''}"