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 = ''
/* --- 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 {
position: fixed !important;
top: 0;
left: 0;
width: 100%;
z-index: 9999 !important;
background-color: var(--toolbar-bgcolor, #1c1b22) !important;
/* Start hidden */
transition: transform var(--toolbox-transition-duration) var(--toolbox-transition-timing-function) !important;
transform: translateY(-100%) !important;
opacity: 0 !important;
transition: transform 0.2s ease, opacity 0.2s ease !important;
}
/* Trigger zone */
#navigator-toolbox::after {
content: "";
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 10px;
z-index: 10000 !important;
}
/* Reveal when hovering */
#navigator-toolbox:hover {
/* Reveal on hover */
#navigator-toolbox:hover,
#navigator-toolbox:focus-within {
transform: translateY(0) !important;
opacity: 1 !important;
}
/* --- Hide specific bars --- */
/* Hide Navigation Bar (Address Bar) COMPLETELY */
#nav-bar {
visibility: collapse !important;
height: 0px !important;
min-height: 0px !important;
padding: 0 !important;
margin: 0 !important;
/* Trigger zone at top of screen */
#navigator-toolbox::after {
content: "";
position: absolute;
top: 100%; /* Below the hidden toolbox */
left: 0;
width: 100%;
height: 5px; /* Size of the trigger area */
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; }
/* Hide Titlebar */
#titlebar { appearance: none !important; }
/* Ensure TabsToolbar looks okay on its own */
#TabsToolbar {
border: none !important;
background: transparent !important;
}
'';
}