kenji/nixos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(firefox): improve autohide CSS for web-app profile

Browse Source 
Ensures both tabs and address bar hide and reveal together seamlessly.
This commit is contained in:
kenji
2026-01-05 14:48:18 -06:00
parent 6281f9ea6f
commit 109fdb4672
1 changed files with 31 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/firefox/profiles/web-app.nix
+31 -38
View File
@@ -70,61 +70,54 @@
}; };
userChrome = '' userChrome = ''
/* --- Floating Autohide Toolbox (Tabs Only) --- */ /* --- Floating Autohide Toolbox (Tabs + Address Bar) --- */
:root {
--toolbox-transition-duration: 0.2s;
--toolbox-transition-timing-function: ease;
}
/* Take toolbox out of the document flow so web content is 100% height */
#navigator-toolbox { #navigator-toolbox {
position: fixed !important; position: fixed !important;
top: 0; top: 0;
left: 0; left: 0;
width: 100%; width: 100%;
z-index: 9999 !important; z-index: 9999 !important;
background-color: var(--toolbar-bgcolor, #1c1b22) !important; transition: transform var(--toolbox-transition-duration) var(--toolbox-transition-timing-function) !important;
/* Start hidden */
transform: translateY(-100%) !important; transform: translateY(-100%) !important;
opacity: 0 !important; opacity: 0 !important;
transition: transform 0.2s ease, opacity 0.2s ease !important;
} }
/* Trigger zone */ /* Reveal on hover */
#navigator-toolbox::after { #navigator-toolbox:hover,
content: ""; #navigator-toolbox:focus-within {
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 10px;
z-index: 10000 !important;
}
/* Reveal when hovering */
#navigator-toolbox:hover {
transform: translateY(0) !important; transform: translateY(0) !important;
opacity: 1 !important; opacity: 1 !important;
} }
/* --- Hide specific bars --- */ /* Trigger zone at top of screen */
#navigator-toolbox::after {
/* Hide Navigation Bar (Address Bar) COMPLETELY */ content: "";
#nav-bar { position: absolute;
visibility: collapse !important; top: 100%; /* Below the hidden toolbox */
height: 0px !important; left: 0;
min-height: 0px !important; width: 100%;
padding: 0 !important; height: 5px; /* Size of the trigger area */
margin: 0 !important; z-index: 10000 !important;
} }
/* Hide Bookmarks Toolbar */ /* Remove native titlebar so it doesn't mess up height */
#titlebar {
appearance: none !important;
margin-bottom: -10px !important; /* Pull things up if needed */
}
/* Ensure content starts at top of screen */
#browser, #appcontent, tabbrowser, #tab-notification-deck {
margin-top: 0 !important;
}
/* Hide Bookmarks Toolbar permanently */
#PersonalToolbar { visibility: collapse !important; } #PersonalToolbar { visibility: collapse !important; }
/* Hide Titlebar */
#titlebar { appearance: none !important; }
/* Ensure TabsToolbar looks okay on its own */
#TabsToolbar {
border: none !important;
background: transparent !important;
}
''; '';
} }