riyadhafraa
4b29e593b0
Task #6: Display today's day name plus Hijri and Gregorian dates in the home page status bar so users see both calendars at a glance. Changes (artifacts/teaboy-os/src/pages/home.tsx): - Compute three values from the existing `time` state via Intl.DateTimeFormat: * dayName -> weekday: "long" (ar-SA / en-US) * hijriDate -> ar-SA-u-ca-islamic-umalqura / en-US-u-ca-islamic-umalqura * gregorianDate -> ar-SA-u-ca-gregory / en-US - Replaced the single time line in the topbar with a 3-row stack: Row 1: time (existing bold mono) Row 2: day · hijri (small muted) Row 3: gregorian (small muted) - Added `min-w-0`, `truncate`, and `gap-2` on the topbar flex so the date column shrinks gracefully on narrow widths and never pushes the username/controls off-screen. Username max-width reduced from max-w-32 to max-w-24 to give the centre slot room. Auto-refresh: - The existing 1-second `setInterval` already drives the `time` state, so all three values naturally roll over at midnight. Localization: - ar mode -> ar-SA = Arabic-Indic numerals on all three values. - en mode -> en-US = Latin numerals. - No new i18n keys required (separator is a neutral middle dot). Out of scope (untouched): time format, other status-bar controls, calendar view, calendar toggle. Verification: tsc --noEmit passes for teaboy-os. Layout reviewed for both LTR and RTL: each row truncates within the centre slot and the flex gap prevents collisions with neighbouring elements. Re-review fix: previous attempt used a single whitespace-nowrap row which could overflow on narrow widths; switched to stacked rows with truncation per the code-review feedback. Replit-Task-Id: 7c9442ee-4a8d-403a-8bea-1ce8c6d859e9