ginnoir/famapp
1
0
Fork 0
Code Issues 7 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: scope rail nav-label hiding to sidebar and fall back fab-only to sidebar on desktop

Browse Source
This commit is contained in:
ginnoir
2026-06-01 18:00:49 -05:00
parent b255aaeac1
commit a95f10fcde
3 changed files with 5 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/globals.css
+3 -3
View File
@@ -471,14 +471,14 @@
color: var(--ink-mute); color: var(--ink-mute);
font-variant-numeric: tabular-nums; font-variant-numeric: tabular-nums;
} }
:where(html[data-nav="rail"]) .nav-item { :where(html[data-nav="rail"]) .sidebar .nav-item {
width: 40px; width: 40px;
height: 40px; height: 40px;
padding: 0; padding: 0;
justify-content: center; justify-content: center;
} }
:where(html[data-nav="rail"]) .nav-label, :where(html[data-nav="rail"]) .sidebar .nav-label,
:where(html[data-nav="rail"]) .nav-count { :where(html[data-nav="rail"]) .sidebar .nav-count {
display: none; display: none;
} }
.sidebar-top .nav-item { .sidebar-top .nav-item {
src/app/layout.tsx
+1 -1
View File
@@ -69,7 +69,7 @@ const prePaintScript = `(function(){
var navStyle = localStorage.getItem('themeNavStyle') || 'rail-desktop'; var navStyle = localStorage.getItem('themeNavStyle') || 'rail-desktop';
var dataNav = navStyle === 'compact-rail' ? 'rail' var dataNav = navStyle === 'compact-rail' ? 'rail'
: navStyle === 'top-nav' ? 'top' : navStyle === 'top-nav' ? 'top'
: navStyle === 'fab-only' ? 'fab' : 'sidebar'; : 'sidebar';
if (window.matchMedia && window.matchMedia('(max-width: 759px)').matches) { if (window.matchMedia && window.matchMedia('(max-width: 759px)').matches) {
dataNav = navStyle === 'fab-only' ? 'fab' : 'bottom'; dataNav = navStyle === 'fab-only' ? 'fab' : 'bottom';
} }
src/modules/_core/themes.ts
+1 -2
View File
@@ -83,14 +83,13 @@ export const DEFAULT_THEME: ThemeState = {
// Map our nav style preference to the data-nav attribute we set on <html>. // Map our nav style preference to the data-nav attribute we set on <html>.
// On mobile (handled by NavModeProvider) we override to "bottom" or "fab". // On mobile (handled by NavModeProvider) we override to "bottom" or "fab".
// fab-only has no desktop equivalent — falls back to sidebar so the nav doesn't disappear.
export function navStyleToDataNav(style: NavStyle): "sidebar" | "rail" | "top" | "fab" { export function navStyleToDataNav(style: NavStyle): "sidebar" | "rail" | "top" | "fab" {
switch (style) { switch (style) {
case "compact-rail": case "compact-rail":
return "rail"; return "rail";
case "top-nav": case "top-nav":
return "top"; return "top";
case "fab-only":
return "fab";
default: default:
return "sidebar"; return "sidebar";
} }