mirror of
https://codeberg.org/claui/mobile-config-firefox.git
synced 2024-09-19 18:47:19 +02:00
d8f027a088
If native titlebar is enabled the rules would move tabs and navbar partially below native titlebar. Those rules are not needed anyway with native titlebar since window controls are in native titlebar.
107 lines
3.4 KiB
CSS
107 lines
3.4 KiB
CSS
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/navbar_tabs_oneliner_tabs_on_left.css made available under Mozilla Public License v. 2.0
|
|
See the above repository for updates as well as full license text. */
|
|
|
|
/*Make tabs and navbar appear side-by-side tabs on left */
|
|
|
|
/* IMPORTANT */
|
|
/*
|
|
Get window_control_placeholder_support.css
|
|
Window controls will be all wrong without it
|
|
*/
|
|
|
|
:root[uidensity="compact"]{
|
|
--tab-block-margin: 2px !important;
|
|
}
|
|
|
|
/* Modify these to change relative widths or default height */
|
|
#navigator-toolbox{
|
|
--uc-navigationbar-width: 45vw;
|
|
--uc-toolbar-height: 40px;
|
|
--uc-urlbar-min-width: 50vw; /* minimum width for opened urlbar */
|
|
}
|
|
|
|
#scrollbutton-up,
|
|
#scrollbutton-down{ border-block-width: 2px !important; }
|
|
|
|
/* Override for other densities */
|
|
:root[uidensity="compact"] #navigator-toolbox{ --uc-toolbar-height: 34px;}
|
|
:root[uidensity="touch"] #navigator-toolbox{ --uc-toolbar-height: 44px; }
|
|
|
|
:root[uidensity="compact"] #urlbar-container{
|
|
--urlbar-container-height: var(--uc-toolbar-height) !important;
|
|
padding-block: 0 !important;
|
|
}
|
|
:root[uidensity="compact"] #urlbar{
|
|
--urlbar-toolbar-height: var(--uc-toolbar-height) !important;
|
|
}
|
|
|
|
/* prevent urlbar overflow on narrow windows */
|
|
/* Dependent on how many items are in navigation toolbar and tabs-/nav-bar ratio - ADJUST AS NEEDED */
|
|
@media screen and (max-width: 1600px){
|
|
#urlbar-container{ min-width:unset !important }
|
|
}
|
|
|
|
:root[tabsintitlebar] #toolbar-menubar{
|
|
height: initial !important;
|
|
}
|
|
:root[tabsintitlebar] #toolbar-menubar[inactive] > :not(.titlebar-buttonbox-container){
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
:root[tabsintitlebar] #toolbar-menubar[inactive]{
|
|
margin-bottom: calc(0px - var(--uc-toolbar-height));
|
|
}
|
|
|
|
#TabsToolbar > .titlebar-buttonbox-container,
|
|
.titlebar-spacer[type="post-tabs"]{
|
|
display: none;
|
|
}
|
|
#TabsToolbar{
|
|
margin-right: var(--uc-navigationbar-width);
|
|
--tabs-navbar-shadow-size: 0px;
|
|
}
|
|
|
|
#tabbrowser-tabs{
|
|
--tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important;
|
|
}
|
|
|
|
#toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container{
|
|
min-height: var(--uc-toolbar-height) !important
|
|
}
|
|
#tabbrowser-tabs,
|
|
.tabbrowser-tab[pinned]{
|
|
min-height: var(--tab-min-height) !important;
|
|
}
|
|
#nav-bar{
|
|
margin-left: calc(100vw - var(--uc-navigationbar-width));
|
|
margin-top: calc(0px - var(--uc-toolbar-height));
|
|
}
|
|
|
|
/* Override style set in window_control_placeholder_support.css */
|
|
#nav-bar{ border-left-width: 0px !important }
|
|
#nav-bar::before{ display:none !important }
|
|
|
|
/* Rules specific to window controls on right layout */
|
|
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
|
|
:root:not([inFullscreen]) #TabsToolbar-customization-target > .titlebar-spacer[type="pre-tabs"]{
|
|
width: var(--uc-window-drag-space-post) !important;
|
|
display: -moz-box !important;
|
|
}
|
|
#TabsToolbar > .titlebar-buttonbox-container{ display: -moz-box; }
|
|
}
|
|
|
|
/* 1px margin on touch density causes tabs to be too high */
|
|
.tab-close-button{ margin-top: 0 !important }
|
|
|
|
/* Make opened urlbar overlay the toolbar */
|
|
#urlbar[open]:focus-within{
|
|
min-width: var(--uc-urlbar-min-width,none) !important;
|
|
right: 0 !important;
|
|
left: auto !important;
|
|
}
|
|
|
|
/* Hide dropdown placeholder */
|
|
#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }
|
|
|
|
/* Fix customization view */
|
|
#customization-panelWrapper > .panel-arrowbox > .panel-arrow{ margin-inline-end: initial !important; }
|