Watch
0
0
Fork
You've already forked hyperhive
0

Compare commits

..
2 changed files with 1 additions and 36 deletions

View file

@ -98,13 +98,11 @@ function NavLink({
href, href,
label, label,
active, active,
accent,
textRef, textRef,
}: { }: {
href: string; href: string;
label: string; label: string;
active: boolean; active: boolean;
accent: string;
textRef: (el: HTMLSpanElement | null) => void; textRef: (el: HTMLSpanElement | null) => void;
}) { }) {
return ( return (
@ -117,17 +115,6 @@ function NavLink({
<span <span
ref={textRef} ref={textRef}
class={"shell-nav-link-text" + (active ? " shell-nav-link-active" : "")} class={"shell-nav-link-text" + (active ? " shell-nav-link-active" : "")}
// Inline, not a CSS rule: the glow colour is this item's own
// `accent` (NAV_ITEMS), a different value per nav item, the
// same reason `.shell-nav-indicator`'s own colour is set this
// way rather than in Shell.css.
style={
active
? {
textShadow: `0 0 8px color-mix(in srgb, ${accent} 45%, transparent)`,
}
: undefined
}
> >
{label} {label}
</span> </span>
@ -280,18 +267,7 @@ export function Shell({ children }: { children: ComponentChildren }) {
return ( return (
<div class="shell"> <div class="shell">
<header class="shell-header"> <header class="shell-header">
<span <span class="shell-brand" style={{ color: navAccent }}>
class="shell-brand"
// Same glow recipe as the active nav tab / panel titles, riding
// `navAccent` — the same value `color` already uses here — so
// the brand's glow tracks the identical hop sequence as its own
// text colour instead of introducing a second, disagreeing
// accent source.
style={{
color: navAccent,
textShadow: `0 0 8px color-mix(in srgb, ${navAccent} 45%, transparent)`,
}}
>
{brand} {brand}
</span> </span>
<nav class="shell-nav" ref={navRef}> <nav class="shell-nav" ref={navRef}>
@ -301,7 +277,6 @@ export function Shell({ children }: { children: ComponentChildren }) {
href={item.href} href={item.href}
label={item.label} label={item.label}
active={item.href === location} active={item.href === location}
accent={item.accent}
textRef={(el) => { textRef={(el) => {
textRefs.current[item.href] = el; textRefs.current[item.href] = el;
}} }}

View file

@ -14,16 +14,6 @@
margin: 0; margin: 0;
font-size: 1em; font-size: 1em;
font-weight: 600; font-weight: 600;
/* Same subtle neon-glow recipe agent.css/dashboard's own headline
rules use (`text-shadow: 0 0 Npx color-mix(color, transparent)`) —
`currentColor`, not a fixed `--purple` like those two, since panel
titles don't carry one fixed accent (some are dynamic, e.g. an
agent's own name) and forcing one on plain `--fg` text would read
as a stray mismatched halo rather than a glow. Deliberately not
porting those UIs' uppercase+letter-spacing headline treatment
alongside it — that's their own typographic language, not part of
"the glow effect" itself. */
text-shadow: 0 0 8px color-mix(in srgb, currentColor 40%, transparent);
} }
.ui-panel-icon { .ui-panel-icon {
font-size: 1.2em; font-size: 1.2em;