pmOS-tweaks/fenix-fox
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Move window control placeholder styles to shared stylesheet

Browse source
This commit is contained in:
MrOtherGuy 2019-02-09 00:03:13 +02:00
parent feba8a6403
commit 5e46b7a0a3
10 changed files with 140 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
chrome/Fx65_tabs_on_bottom.css
View file

@ -4,10 +4,19 @@ Use Fx65_tabs_on_bottom_menubar_on_top_patch if you
have menubar permanently enabled and want it on top
*/
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
Window controls will be all wrong without it
*/
:root{
--uc-titlebar-padding: 0px;
--uc-window-control-width: 138px
}
--uc-titlebar-padding: 0px; }
:root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px }
:root[tabsintitlebar="true"] #nav-bar{ --window-drag-space-width: 24px; }
@ -32,12 +41,6 @@ have menubar permanently enabled and want it on top
-moz-appearance: none !important;
}
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
}
.titlebar-placeholder,
#TabsToolbar .titlebar-spacer{ display: none; }
/* Also hide the toolbox bottom border which isn't at bottom with this setup */

27
chrome/hide_tabs_toolbar.css
View file

@ -1,25 +1,26 @@
/* Hide tabs toolbar Fx65+ */
:root{
--uc-toolbar-height: 32px;
--uc-window-control-width: 138px;
}
#navigator-toolbox{ --window-drag-space-width: 24px; }
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
Window controls will be all wrong without it
*/
:root{ --uc-toolbar-height: 32px; }
:root:not([uidensity="compact"]){--uc-toolbar-height: 38px}
#TabsToolbar{visibility: collapse}
#TabsToolbar{ visibility: collapse }
:root:not([inFullscreen]) #nav-bar{
margin-top: calc(0px - var(--uc-toolbar-height));
}
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
}
#toolbar-menubar{
min-height:unset !important;
height:var(--uc-toolbar-height) !important;

13
chrome/hide_tabs_with_one_tab.css
View file

@ -2,13 +2,12 @@
/* Firefox 65+ only */
/* !!USER!! - REMOVE ALL BUTTONS you can from the tabs toolbar */
/* Configurable window drag space */
#navigator-toolbox{
--window-drag-space-width: 20px;
}
:root[sizemode="normal"] #nav-bar{ --uc-window-drag-space-width: 20px }
#titlebar{ -moz-appearance: none !important; }
#tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox{ min-height: 0 !important; }
:root:not([customizing]) #tabbrowser-tabs .tabs-newtab-button,
:root:not([customizing]) #TabsToolbar .titlebar-button{
-moz-appearance: none !important;
@ -19,12 +18,14 @@
margin: 0 !important;
}
#tabbrowser-tabs .tabbrowser-tab{ height: var(--tab-min-height) }
#tabbrowser-tabs .tabbrowser-tab[first-visible-tab="true"][last-visible-tab="true"]{
visibility: collapse !important;
}
/* Button re-styling */
#tabbrowser-tabs .tabs-newtab-button:hover{ background-color: var(--toolbarbutton-hover-background) }
#tabbrowser-tabs .tabs-newtab-button > .toolbarbutton-icon{
padding: 0 !important;
transform: scale(0.6);
@ -32,11 +33,11 @@
}
/* Extra top padding in maximized window */
:root[sizemode="maximized"] > #navigator-toolbox{ padding-top:7px !important; }
/* Fix window controls not being clickable */
#toolbar-menubar:hover{
min-height: calc(var(--tab-min-height) + var(--space-above-tabbar) - 1px) !important;
height: calc(var(--tab-min-height) + var(--space-above-tabbar) - 1px) !important;
-moz-appearance: initial !important;
}
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar { padding: 0px var(--window-drag-space-width,0px) }
#nav-bar{ padding: 0 var(--uc-window-drag-space-width,0px) }

19
chrome/hide_tabs_with_one_tab_w_window_controls.css
View file

@ -2,10 +2,16 @@
/* Firefox 65+ only */
/* !!USER!! - REMOVE ALL BUTTONS you can from the tabs toolbar */
:root{ --uc-window-control-width: 138px; }
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
/* Configurable window drag space */
#navigator-toolbox{ --window-drag-space-width: 20px }
Window controls will be all wrong without it
*/
#titlebar{ -moz-appearance: none !important; }
/* We'll use window controls from menubar instead */
@ -30,6 +36,7 @@
/* Button re-styling */
#tabbrowser-tabs .tabs-newtab-button:hover{ background-color: var(--toolbarbutton-hover-background) }
#tabbrowser-tabs .tabs-newtab-button > .toolbarbutton-icon{
padding: 0 !important;
transform: scale(0.6);
@ -46,9 +53,3 @@
}
:root:not([customizing]) #toolbar-menubar[autohide][inactive] > #menubar-items{ pointer-events: none; opacity: 0 }
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
}

24
chrome/navbar_tabs_oneliner.css
View file

@ -1,12 +1,17 @@
/*Make tabs and navbar appear side-by-side tabs on right */
/* Modify these to change relative widths or default height */
#navigator-toolbox{ --uc-navigationbar-width: 40vw; --uc-toolbar-height: 40px; --window-drag-space-width: 20px}
#navigator-toolbox{
--uc-navigationbar-width: 40vw;
--uc-toolbar-height: 40px;
}
/* Override for other densities */
:root[uidensity="compact"] > #navigator-toolbox{ --uc-toolbar-height: 32px; }
:root[uidensity="touch"] > #navigator-toolbox{ --uc-toolbar-height: 40px; }
/* prevent urlbar overflow on narrow windows */
/* Dependent on how many items are in navigation toolbar ADJUST AS NEEDED */
@media screen and (max-width: 1000px){
@media screen and (max-width: 1100px){
#urlbar-container{ min-width:unset !important }
}
@ -18,16 +23,23 @@
#nav-bar{
margin-right:calc(100vw - var(--uc-navigationbar-width));
margin-top: calc(0px - var(--uc-toolbar-height));
padding-right: 0px !important;
}
/* Space to drag the window on both sides of navbar */
/* Space to drag the window on left side of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: 0px !important;
padding-left: var(--window-drag-space-width,0px)
padding-left: var(--uc-window-drag-space-width,20px);
}
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root:not([inFullscreen]) #nav-bar{
padding-left: calc(var(--uc-window-control-width,72px) + var(--uc-window-drag-space-width,20px));
}
.titlebar-buttonbox-container{ position: fixed; left: 0px; z-index: 3; }
}
/* 1px margin on touch density causes tabs to be too high */
.tab-close-button{ margin-top: 0 !important }
/* Hide dropdown placeholder */
#urlbar-container:not(:hover) .urlbar-history-dropmarker{margin-inline-start: -28px;}
#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }

32
chrome/navbar_tabs_oneliner_menu_buttons_on_right.css
View file

@ -1,9 +1,21 @@
/* Variation of oneliner where menubutton and overflow button are next to window controls (if window controls are on right side) */
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
Window controls will be all wrong without it
*/
/* Modify these to change relative widths or default height */
#navigator-toolbox{
--uc-navigationbar-width: 50vw;
--uc-window-control-width: 138px;
--uc-toolbar-height: 40px;
--window-drag-space-width: 20px
}
/* reserved space for overflow + menu buttons */
#navigator-toolbox{--uc-buttons-width: calc(56px + 4 * var(--toolbarbutton-outer-padding) + var(--uc-menubutton-padding,6px))}
@ -24,17 +36,19 @@
.titlebar-placeholder[type="pre-tabs"],.titlebar-spacer[type="pre-tabs"]{ width:8px !important}
#nav-bar{ margin-top: calc(0px - var(--uc-toolbar-height)); }
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
#nav-bar-customization-target{ margin-right: calc(100vw - (var(--uc-navigationbar-width)) - var(--uc-window-control-width) - var(--uc-buttons-width) - var(--uc-window-drag-space-width)) }
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
:root:not([inFullscreen]) #nav-bar{
padding-left: calc(var(--uc-window-control-width,72px) + var(--uc-window-drag-space-width,20px));
}
.titlebar-buttonbox-container{ position: fixed; left: 0px; z-index: 3; }
#nav-bar-customization-target{ margin-right: calc(100vw - (var(--uc-navigationbar-width)) - var(--uc-buttons-width) - var(--uc-window-drag-space-width)) }
}
#nav-bar-customization-target{ margin-right: calc(100vw - (var(--uc-navigationbar-width)) - var(--uc-buttons-width) - (3 * 46px) - var(--window-drag-space-width)) }
#TabsToolbar > :not(hbox){ position: relative !important; z-index: 2 }
.titlebar-placeholder[type="post-tabs"],
.titlebar-spacer[type="post-tabs"]{
width: calc(var(--uc-buttons-width) + var(--window-drag-space-width)) !important;
width: calc(var(--uc-buttons-width) + var(--uc-window-drag-space-width)) !important;
}
#PanelUI-button,#nav-bar-overflow-button{
margin: 0px !important;
@ -46,4 +60,4 @@
.tab-close-button{ margin-top: 0 !important }
/* Hide dropdown placeholder */
#urlbar-container:not(:hover) .urlbar-history-dropmarker{margin-inline-start: -28px;}
#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }

32
chrome/navbar_tabs_oneliner_tabs_on_left.css
View file

@ -1,12 +1,23 @@
/*Make tabs and navbar appear side-by-side tabs on left */
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
Window controls will be all wrong without it
*/
/* Modify these to change relative widths or default height */
#navigator-toolbox{
--uc-navigationbar-width: 40vw;
--uc-toolbar-height: 40px;
--window-drag-space-width: 20px;
--uc-window-control-width: 138px;
}
/* Override for other densities */
:root[uidensity="compact"] > #navigator-toolbox{ --uc-toolbar-height: 32px;}
:root[uidensity="compact"] > #navigator-toolbox{ --uc-toolbar-height: 31px;}
:root[uidensity="touch"] > #navigator-toolbox{ --uc-toolbar-height: 40px; }
/* prevent urlbar overflow on narrow windows */
@ -15,12 +26,11 @@
#urlbar-container{ min-width:unset !important }
}
#toolbar-menubar{ height:initial !important; }
#toolbar-menubar{ height: initial !important; }
#toolbar-menubar[inactive] > #menubar-items{ opacity: 0; pointer-events: none; }
#toolbar-menubar[inactive]{ margin-bottom: calc(0px - var(--uc-toolbar-height)) }
#TabsToolbar > .titlebar-buttonbox-container,
#TabsToolbar > .toolbar-items > spacer,
.titlebar-spacer[type="post-tabs"]{
display: none;
}
@ -39,14 +49,16 @@
padding-left: 0px !important;
}
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
@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-width) !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 }
/* Hide dropdown placeholder */
#urlbar-container:not(:hover) .urlbar-history-dropmarker{margin-inline-start: -28px;}
#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }

19
chrome/tabs_below_content.css
View file

@ -1,10 +1,13 @@
/* Modify this to change window drag space width */
/* IMPORTANT */
/*
Get EITHER
window_control_placeholder_support.css
OR
window_control_placeholder_support_mac.css
:root{
--uc-window-control-width: 138px;
}
Window controls will be all wrong without it
#navigator-toolbox{ --window-drag-space-width: 24px }
*/
.titlebar-buttonbox-container{
position: fixed;
@ -31,12 +34,6 @@
:root[sizemode="maximized"] > #navigator-toolbox{ padding-top: 8px !important; }
:root[sizemode="maximized"] #toolbar-menubar:not([autohide="false"]) .titlebar-buttonbox-container{ top: 8px }
/* Space to drag the window on both sides of navbar */
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--window-drag-space-width,0px));
padding-left: var(--window-drag-space-width,0px)
}
/* Move tabs below content */
:root:not([inDOMFullscreen]) #content-deck{ margin-bottom: var(--tab-min-height) }
#TabsToolbar{ position: fixed; bottom: 0px; width: 100vw; }

13
chrome/window_control_placeholder_support.css Normal file
View file

@ -0,0 +1,13 @@
/* Creates placeholders for window controls */
/* For window controls on RIGHT side of the window */
/* This is a supporting file used by other stylesheets */
:root{
--uc-window-control-width: 138px;
--uc-window-drag-space-width: 24px;
}
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-right: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
padding-left: var(--window-drag-space-width);
}

13
chrome/window_control_placeholder_support_mac.css Normal file
View file

@ -0,0 +1,13 @@
/* Creates placeholders for window controls */
/* For window controls on LEFT side of the window */
/* This is a supporting file used by other stylesheets */
:root{
--uc-window-control-width: 72px;
--uc-window-drag-space-width: 24px;
}
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
padding-left: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
padding-right: var(--window-drag-space-width);
}