#599 fullscreen-exit button: icon only, no text label
In executive-meetings.tsx, the floating exit-fullscreen control was
a pill (`gap-1.5 px-3 py-1.5`) showing both a Minimize2 arrow and
the Arabic/English label "الخروج من ملء الشاشة" / "Exit fullscreen".
User asked for icon only.
Changes:
- Removed the `<span>{t(...)}</span>` label.
- Swapped pill classes for a circular icon button: `inline-flex
items-center justify-center rounded-full bg-[#0B1E3F] text-white
w-9 h-9 shadow-lg hover:bg-[#0B1E3F]/90 print:hidden`, keeping the
same `fixed top-3 end-3 z-50` positioning.
- Bumped the icon to `w-5 h-5` so it reads cleanly on its own.
- Added a `title` attribute (hover tooltip) mirroring the existing
`aria-label` — screen readers + mouse users still get the
localised "exit fullscreen" affordance.
- `data-testid="em-fullscreen-exit"` untouched, so existing tests
keep passing.
- No translation key changes; no change to the enter-fullscreen
toolbar button at L2958.
Verified `pnpm --filter @workspace/tx-os exec tsc --noEmit` clean.
This commit is contained in:
@@ -1040,10 +1040,10 @@ function ExecutiveMeetingsPageInner() {
|
||||
onClick={() => setIsFullscreen(false)}
|
||||
data-testid="em-fullscreen-exit"
|
||||
aria-label={t("executiveMeetings.fullscreen.exit", "Exit fullscreen")}
|
||||
className="fixed top-3 end-3 z-50 inline-flex items-center gap-1.5 rounded-full bg-[#0B1E3F] text-white px-3 py-1.5 text-xs sm:text-sm shadow-lg hover:bg-[#0B1E3F]/90 print:hidden"
|
||||
title={t("executiveMeetings.fullscreen.exit", "Exit fullscreen")}
|
||||
className="fixed top-3 end-3 z-50 inline-flex items-center justify-center rounded-full bg-[#0B1E3F] text-white w-9 h-9 shadow-lg hover:bg-[#0B1E3F]/90 print:hidden"
|
||||
>
|
||||
<Minimize2 className="w-4 h-4" />
|
||||
<span>{t("executiveMeetings.fullscreen.exit", "Exit fullscreen")}</span>
|
||||
<Minimize2 className="w-5 h-5" />
|
||||
</button>
|
||||
)}
|
||||
<header
|
||||
|
||||
Reference in New Issue
Block a user