Fluksio/app
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Dashboard name pill opaque: the look's card colour with a hairline border, no blur

Browse Source 
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016ezWcLmBCtTVKFPxfdK2MK
This commit is contained in:
Melvin Strobl
2026-10-14 22:19:34 +02:00
co-authored by Claude Opus 5.5
parent 2a9b39ddb1
commit 78498cbbf8
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/Dashboard/RoundFace.tsx
+4 -3
View File
@@ -354,14 +354,15 @@ export function RoundPanel({
)
}
/** A dashboard's icon and title, on the frosted surface: what a panel shows
* for a moment of a dashboard it has just landed on. */
/** A dashboard's icon and title: what a panel shows for a moment of a
* dashboard it has just landed on. Opaque, so the face under it does not
* read through the name. */
function NamePill({ dashboard }: { dashboard: Dashboard }) {
const Glyph = resolveIcon(dashboard.icon ?? "")
return (
<output
data-testid="dashboard-announce"
className="flex h-14 max-w-[280px] items-center gap-2.5 rounded-full border border-border bg-card/80 px-5 font-medium shadow-e2 backdrop-blur-md"
className="flex h-14 max-w-[280px] items-center gap-2.5 rounded-full border border-border bg-card px-5 font-medium text-card-foreground shadow-e2"
style={{ fontSize: 24 }}
>
{Glyph ? <Glyph className="size-6 shrink-0" aria-hidden /> : null}