G'Day,
I earlier posted with respect to getting tabs to appear below the address and search bars on the browser. I managed to solve that issue; however, the solution ha… (funda kabanzi)
G'Day,
I earlier posted with respect to getting tabs to appear below the address and search bars on the browser. I managed to solve that issue; however, the solution has produced a curious side effect.
When the browser has entered Full-Screen, the tabs-bar does not disappear and appears as it would in a normal browser window while both the address and search bars have been hidden. Is there some way to fix this?
As well, on a Windows 8.1 lap-top, using the CSS below, the very top of the browser has been cut off. It is not possible to see the browser control icons nor is the menu-bar visible.
A screen capture is attached as well as the CSS which was suggested in my earlier post about getting the tabs below the address bar.
Thanks,
Jim
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
/* TABS: bottom - Firefox 65 and later - updated for 89+ */
/* https://searchfox.org/mozilla-release/source/browser/themes/shared/tabs.inc.css */
/* https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox */
/* ROOT - VARS */
/* you can adjust the CSS variables until it looks correct */
/* you can use the Browser Toolbox to get the toolbar heights */
--tab-toolbar-navbar-overlap: 0px !important;
--tab-min-height: 40px !important;
--tab-min-width: 50px !important;
--tab-caption: -5px; /* caption buttons on tab bar */
--tab-adjust: 3px; /* adjust tab bar */
--menubar-height: 40px; /*40px|41px=11px; caption buttons on menubar*/
--navbar-height: 40px; /*31px*/
--bookmarkbar-height: 26px;
--tabbar-top: calc(var(--menubar-height) + var(--navbar-height) + var(--bookmarkbar-height) + var(--tab-adjust)); /*89+*/
}
/* in case you enable extra toolbars in full screen mode */
--tab-adjust: 3px;
--menubar-height: 45px; /*30px*/
--navbar-height: 45px; /*31px*/
--bookmarkbar-height: 0px; /*26px*/
--tabbar-top: calc(var(--menubar-height) + var(--navbar-height) + var(--bookmarkbar-height) + var(--tab-adjust)); /*89+*/
}
/* TAB BAR - below nav-bar */
- navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
- TabsToolbar {-moz-box-ordinal-group:1000}
- TabsToolbar {
display: block !important;
position: absolute !important;
/* bottom: 0 !important; /* 68-88: BOTTOM */
top: var(--tabbar-top); /* 89+: TOP */
width: 100vw !important;
}
- tabbrowser-tabs {
width: 100vw !important;
}
/* navigator-toolbox - PADDING */
- |*:root:not([chromehidden*="toolbar"]) #navigator-toolbox {
padding-bottom: calc(var(--tab-min-height) + 1px) !important; /*ADJUST*/
background-color: var(--toolbar-bgcolor) !important;
}
/* TabsToolbar with menubar and titlebar hidden - rules for Firefox 65-73 */
- |*:root[tabsintitlebar]:not([inFullscreen="true"]):not([sizemode="maximized"])
#toolbar-menubar[autohide="true"] ~ #TabsToolbar{
}
/* TABS: height */
- tabbrowser-tabs,
- tabbrowser-tabs > .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] {
min-height: var(--tab-min-height) !important;
max-height: var(--tab-min-height) !important;
}
- TabsToolbar {
height: var(--tab-min-height) !important;
margin-bottom: 1px !important;
box-shadow: ThreeDShadow 0 -1px inset, -moz-dialog 0 1px !important; /*OPTIONAL*/
background-color: var(--toolbar-bgcolor) !important;
color: var(--toolbar-color) !important;
z-index: 1 !important;
}
/* indicators *//*
- |*:root[privatebrowsingmode=temporary] .private-browsing-indicator {
position: absolute !important;
display: block !important;
right: 0px !important;
bottom: 0px !important;
width: 14px !important;
pointer-events: none !important;
}
.private-browsing-indicator {display: none !important;}
.accessibility-indicator {display: none !important;}
/* Indicators - HIDE *//*
- |*:root:not([accessibilitymode]) .accessibility-indicator {display: none !important}
- |*:root:not([privatebrowsingmode=temporary]) .private-browsing-indicator {display: none !important}
- /
/* Drag Space */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
width: 20px !important;
}
/* Override vertical shifts when moving a tab */
- navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
padding-bottom: unset !important;
}
- navigator-toolbox[movingtab] #tabbrowser-tabs {
padding-bottom: unset !important;
margin-bottom: unset !important;
}
- navigator-toolbox[movingtab] > #nav-bar {
margin-top: unset !important;
}
/* Hide window-controls and caption buttons on Tab Bar */
- TabsToolbar #window-controls {display: none !important;}
- TabsToolbar .titlebar-buttonbox-container {display: none !important;}
