Refactor code to improve performance and readability
This commit is contained in:
panotaka
@@ -45,450 +45,181 @@
|
|||||||
"widget.use-xdg-desktop-portal.file-picker" = 1;
|
"widget.use-xdg-desktop-portal.file-picker" = 1;
|
||||||
};
|
};
|
||||||
userChrome = ''
|
userChrome = ''
|
||||||
/* # arcticfox - userChrome
|
/* ty to whoever made the origional "yet another sidebery config" as that is what ive gotten it from */
|
||||||
- under MPL 2.0
|
|
||||||
|
|
||||||
dragon's (very hacky) arc browser-like theme for firefox
|
|
||||||
ft. sidebery, and userchrome-toggle
|
|
||||||
|
|
||||||
!!! for the theme to work:
|
/* Sidebery */
|
||||||
- the side bar needs to always be visible
|
#main-window[titlepreface*="[S] "] .tabbrowser-tab {
|
||||||
and with sidebery (maybe TST but nothing guaranteed) opened
|
visibility: collapse;
|
||||||
- the order of the toolbar widgets should be:
|
|
||||||
[url-bar sidebar-toggle back forward reload spacer extensions overflow hamburger-menu]
|
|
||||||
you can change the order of some of those, but the url bar must be the first item
|
|
||||||
- preferencially have userchrome-toggle addon or something else to toggle keeping the
|
|
||||||
sidebar opened
|
|
||||||
- disable the bookmarks toolbar
|
|
||||||
- use flat color themes instead of ones with gradients or backgrounds, preferencially
|
|
||||||
themes from Firefox Color
|
|
||||||
|
|
||||||
when navigating this file you can use ctrl + f
|
|
||||||
(or whatever the 'find' shortuc is on your editor)
|
|
||||||
to jump to spefic parts:
|
|
||||||
|
|
||||||
## for sections
|
|
||||||
// for comments
|
|
||||||
** for thing you can change
|
|
||||||
|
|
||||||
!!! some extra warnings (drawbacks)
|
|
||||||
- the menu bar (activated with alt) doesn't work
|
|
||||||
- the bookmarks toolbar doesn't work
|
|
||||||
- the 'customise toolbar...' page will not let you rearrange
|
|
||||||
things in the toolbar, do it with the theme disabled
|
|
||||||
(can still put things in the overflow menu tho)
|
|
||||||
- there will be visual glitches in certain areas, for example
|
|
||||||
in some places the background may be transparent (showing behind the window)
|
|
||||||
and flicker
|
|
||||||
- pages and addons that expect ui elements to be in certain places may nor work
|
|
||||||
- some browser color themes may not work well or need some tweak
|
|
||||||
- some menus you open (or if change the addon in the sidebar) may toggle off the
|
|
||||||
window preface and not keep the sidebar open
|
|
||||||
- using addons that use the sidebar (for example firefox side view) is awkard
|
|
||||||
- might not work well depending on your window controls
|
|
||||||
|
|
||||||
*/
|
|
||||||
|
|
||||||
:root {
|
|
||||||
/* ** spacing around the web page and other things */
|
|
||||||
--spacing: .75rem;
|
|
||||||
|
|
||||||
/* ** sidebar width when open */
|
|
||||||
--sdb-wdt-max: 360px;
|
|
||||||
|
|
||||||
/* // sidebar width (don't change this setup) */
|
|
||||||
/* --sdb-wdt: var(--sdb-wdt-max); */
|
|
||||||
--sdb-wdt: 0;
|
|
||||||
|
|
||||||
/* ** theme border radius */
|
|
||||||
--br: 10px;
|
|
||||||
|
|
||||||
/* **? height of the toolbox (browser header/tool bar) */
|
|
||||||
--toolbox-height: 6.25rem;
|
|
||||||
|
|
||||||
/* ** transitions (mainly sidebar) duration */
|
|
||||||
--trans: .5s;
|
|
||||||
|
|
||||||
/* // browser background color, don't change this var */
|
|
||||||
--bbg: var(--lwt-accent-color-inactive, var(--lwt-accent-color));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* // hide the contens of the toolbox by default
|
#main-window[titlepreface*="[S] "] .titlebar-button {
|
||||||
// and give some padding area to be able to hover it
|
height: 40px;
|
||||||
*/
|
|
||||||
#navigator-toolbox {
|
|
||||||
padding-right: var(--spacing);
|
|
||||||
}
|
|
||||||
#navigator-toolbox > * {
|
|
||||||
opacity: 0%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* // when hovering the toolbox or sidebar, show them
|
#main-window[titlepreface*="[S] "] #nav-bar {
|
||||||
** you can change the 'preface' value
|
margin-top: -40px;
|
||||||
|
}
|
||||||
wish normal CSS had sass,stylus,less style nesting
|
#main-window[titlepreface*="[S] "][tabsintitlebar="true"] #nav-bar {
|
||||||
*/
|
margin-right: 137px;
|
||||||
#main-window[titlepreface*="|| "],
|
}
|
||||||
#main-window:has(#sidebar-box:hover),
|
#main-window[titlepreface*="[S] "] #titlebar-spacer {
|
||||||
#main-window:has(#navigator-toolbox:hover),
|
background-color: var(--chrome-secondary-background-color);
|
||||||
#main-window:has(#navigator-toolbox:focus-within),
|
|
||||||
#main-window:has(toolbarbutton[open="true"])
|
|
||||||
{
|
|
||||||
--sdb-wdt: var(--sdb-wdt-max);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#main-window[titlepreface*="|| "] #navigator-toolbox,
|
#main-window[titlepreface*="[S] "] #titlebar-buttonbox-container {
|
||||||
#main-window:has(#sidebar-box:hover) #navigator-toolbox,
|
background-color: var(--chrome-secondary-background-color);
|
||||||
#main-window:has(#navigator-toolbox:hover) #navigator-toolbox,
|
|
||||||
#main-window:has(#navigator-toolbox:focus-within) #navigator-toolbox,
|
|
||||||
#main-window:has(toolbarbutton[open="true"]) #navigator-toolbox
|
|
||||||
{
|
|
||||||
padding-right: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#main-window[titlepreface*="|| "] #navigator-toolbox > *,
|
#main-window[titlepreface*="[S] "] .titlebar-color {
|
||||||
#main-window:has(#sidebar-box:hover) #navigator-toolbox > *,
|
background-color: var(--toolbar-bgcolor);
|
||||||
#main-window:has(#navigator-toolbox:hover) #navigator-toolbox > *,
|
|
||||||
#main-window:has(#navigator-toolbox:focus-within) #navigator-toolbox > *,
|
|
||||||
#main-window:has(toolbarbutton[open="true"]) #navigator-toolbox > *
|
|
||||||
{
|
|
||||||
opacity: 100%;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* // background of the area around the web page */
|
|
||||||
.browserStack {
|
|
||||||
background: var(--bbg);
|
|
||||||
}
|
|
||||||
|
|
||||||
#appcontent {
|
|
||||||
height: 100vh;
|
|
||||||
/* // offset the web page up to fit the browser height */
|
|
||||||
margin-top: calc(var(--toolbox-height) * -1);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // for the toolbox to not hide in fullscreen */
|
|
||||||
#navigator-toolbox[inFullscreen="true"] {
|
|
||||||
margin-top: 0 !important;
|
|
||||||
}
|
|
||||||
/* // reset the web page offset when playing some video in fullscreen */
|
|
||||||
#main-window[inDOMFullscreen="true"] #appcontent {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#appcontent browser {
|
|
||||||
margin: var(--spacing);
|
|
||||||
margin-left: 0;
|
|
||||||
margin-top: var(--spacing);
|
|
||||||
border-radius: var(--br);
|
|
||||||
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
/* ** small details to separate the web page from the surroundings
|
|
||||||
// feel free to disable these, and use Adaptive Tab Bar Color to
|
|
||||||
make the entire browser fit the page color
|
|
||||||
*/
|
|
||||||
box-shadow: 0px 0px 7px #00000030;
|
|
||||||
border: 1px solid #fafafa30;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // remove margin from the dev tools */
|
|
||||||
#appcontent .devtools-toolbox-side-iframe {
|
|
||||||
margin: 0 !important;
|
|
||||||
}
|
|
||||||
#appcontent .devtools-toolbox-bottom-iframe {
|
|
||||||
margin: 0;
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // make status panel (the bar with url when you hover links)
|
|
||||||
* // fit better with theme
|
|
||||||
*/
|
|
||||||
#statuspanel {
|
|
||||||
margin-bottom: var(--spacing);
|
|
||||||
margin-right: var(--spacing);
|
|
||||||
}
|
|
||||||
#statuspanel-label {
|
|
||||||
background: var(--bbg) !important;
|
|
||||||
border: 1px solid #00000020 !important;
|
|
||||||
color: var(--toolbar-color) !important;;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // make find bar fit with theme */
|
|
||||||
findbar {
|
|
||||||
background: var(--bbg) !important;
|
|
||||||
border: none !important;
|
|
||||||
padding-top: 0 !important;;
|
|
||||||
}
|
|
||||||
|
|
||||||
/*
|
|
||||||
#sidebar-box {
|
|
||||||
display: block !important;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
/* // hide the sidebar header (only when sidebery opened)
|
|
||||||
** feel free to disable this
|
|
||||||
** or change the sidebarcommand to some other addon (get from browser dev mode)
|
|
||||||
*/
|
|
||||||
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] #sidebar-header {
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] #sidebar-header {
|
||||||
display: none;
|
visibility: collapse;
|
||||||
/* */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_sidebar.css made available under Mozilla Public License v. 2.0
|
||||||
|
See the above repository for updates as well as full license text. */
|
||||||
|
|
||||||
|
/* Show sidebar only when the cursor is over it */
|
||||||
|
/* The border controlling sidebar width will be removed so you'll need to modify these values to change width */
|
||||||
|
|
||||||
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] {
|
||||||
|
--uc-sidebar-width: 48px !important;
|
||||||
|
--uc-sidebar-hover-width: 250px;
|
||||||
|
--uc-autohide-sidebar-delay: 100ms; /* Wait 0.1s before hiding sidebar */
|
||||||
|
position: relative;
|
||||||
|
min-width: var(--uc-sidebar-width) !important;
|
||||||
|
width: var(--uc-sidebar-width) !important;
|
||||||
|
max-width: var(--uc-sidebar-width) !important;
|
||||||
|
z-index:1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"][positionend] {
|
||||||
|
direction: rtl;
|
||||||
|
}
|
||||||
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"][positionend] > *{
|
||||||
|
direction: ltr;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-box[positionend]:-moz-locale-dir(rtl){
|
||||||
|
direction: ltr;
|
||||||
|
}
|
||||||
|
#sidebar-box[positionend]:-moz-locale-dir(rtl) > *{
|
||||||
|
direction: rtl;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"] > #sidebar {
|
||||||
|
transition: min-width 115ms linear !important;
|
||||||
|
min-width: var(--uc-sidebar-width) !important;
|
||||||
|
will-change: min-width;
|
||||||
|
}
|
||||||
|
|
||||||
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:hover > #sidebar {
|
||||||
|
min-width: var(--uc-sidebar-hover-width) !important;
|
||||||
|
transition: min-width 100ms linear var(--uc-autohide-sidebar-delay), box-shadow 500ms linear !important;
|
||||||
|
box-shadow: 0 0 4px rgba(10,10,10, .5);
|
||||||
|
clip-path: inset(0px -15px 0px -15px);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Add sidebar divider and give it background */
|
||||||
|
|
||||||
|
#sidebar,
|
||||||
#sidebar-header {
|
#sidebar-header {
|
||||||
border: none !important;;
|
background-color: var(--toolbar-bgcolor) !important;
|
||||||
|
border-inline: 1px solid var(--chrome-content-separator-color);
|
||||||
|
border-inline-width: 0px 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* // hide the sidebar close button (closing the sidebar messes the theme) */
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:not([positionend]) > :-moz-locale-dir(rtl),
|
||||||
#sidebar-header #sidebar-close {
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"][positionend] > * {
|
||||||
display: none;
|
border-inline-width: 1px 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar-box {
|
/* Move statuspanel to the other side when sidebar is hovered so it doesn't get covered by sidebar */
|
||||||
padding-right: var(--spacing);
|
|
||||||
background: var(--bbg) !important;
|
|
||||||
|
|
||||||
min-width: 0px !important;
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:not([positionend]):hover ~ #appcontent #statuspanel {
|
||||||
width: var(--sdb-wdt) !important;
|
inset-inline: auto 0px !important;
|
||||||
overflow: clip;
|
}
|
||||||
transition: width var(--trans);
|
#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]:not([positionend]):hover ~ #appcontent #statuspanel-label {
|
||||||
|
margin-inline: 0px !important;
|
||||||
|
border-left-style: solid !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar-splitter {
|
/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_toolbar.css made available under Mozilla Public License v. 2.0
|
||||||
display: none;
|
See the above repository for updates as well as full license text. */
|
||||||
|
|
||||||
|
#PersonalToolbar{
|
||||||
|
--uc-bm-height: 20px; /* Might need to adjust if the toolbar has other buttons */
|
||||||
|
--uc-bm-padding: 7px; /* Vertical padding to be applied to bookmarks */
|
||||||
|
--uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */
|
||||||
|
|
||||||
|
/* 0deg = "show" ; 90deg = "hide" ; Set the following to control when bookmarks are shown */
|
||||||
|
--uc-autohide-toolbar-focus-rotation: 0deg; /* urlbar is focused */
|
||||||
|
--uc-autohide-toolbar-hover-rotation: 0deg; /* cursor is over the toolbar area */
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebar {
|
:root[uidensity="compact"] #PersonalToolbar{ --uc-bm-padding: 1px; }
|
||||||
overflow: clip;
|
:root[uidensity="touch"] #PersonalToolbar{ --uc-bm-padding: 7px }
|
||||||
/*border-radius: var(--br); */ /* // adds some visual glitches */
|
|
||||||
|
|
||||||
/* // keep the sidebar content in a specific size */
|
#PersonalToolbar:not([customizing]){
|
||||||
width: calc(var(--sdb-wdt-max) - var(--spacing) * 0.5);
|
position: relative;
|
||||||
margin-left: calc(var(--spacing) * 0.4);
|
margin-bottom: calc(0px - var(--uc-bm-height) - 2 * var(--uc-bm-padding));
|
||||||
}
|
transform: rotateX(90deg);
|
||||||
|
transform-origin: top;
|
||||||
#main-window #titlebar {
|
transition: transform 135ms linear var(--uc-autohide-toolbar-delay) !important;
|
||||||
overflow: clip;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // default state: Set initial height to enable animation */
|
|
||||||
#main-window #titlebar { height: 3rem !important; }
|
|
||||||
#main-window[uidensity="touch"] #titlebar { height: 3.35em !important; }
|
|
||||||
#main-window[uidensity="compact"] #titlebar { height: 2.7em !important; }
|
|
||||||
|
|
||||||
/* // hide the defaul tab bar and the private window label */
|
|
||||||
#tabbrowser-tabs,
|
|
||||||
#alltabs-button,
|
|
||||||
#new-tab-button,
|
|
||||||
#private-browsing-indicator-with-label
|
|
||||||
{
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
/* ** feel free to change this color */
|
|
||||||
--poiple: #6e00bc;
|
|
||||||
}
|
|
||||||
/* ** in private window, put an outline around the page and url bar */
|
|
||||||
#main-window[privatebrowsingmode="temporary"] #appcontent browser {
|
|
||||||
border: 1px solid var(--poiple);
|
|
||||||
}
|
|
||||||
#main-window[privatebrowsingmode="temporary"] {
|
|
||||||
--toolbar-field-border-color: var(--poiple) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navigator-toolbox {
|
|
||||||
padding-bottom: var(--spacing);
|
|
||||||
transition: width var(--trans);
|
|
||||||
border: none !important;
|
|
||||||
border-radius: 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.titlebar-buttonbox-container {
|
|
||||||
margin-top: .5rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
#navigator-toolbox {
|
|
||||||
width: var(--sdb-wdt);
|
|
||||||
height: var(--toolbox-height);
|
|
||||||
}
|
|
||||||
|
|
||||||
#navigator-toolbox > * {
|
|
||||||
transition: opacity var(--trans);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/* // show toolbar if sidebar is closed (so you can open it with the button) */
|
|
||||||
#main-window:has(#sidebar-box[hidden="true"]) #navigator-toolbox {
|
|
||||||
--sdb-wdt: var(--sdb-wdt-max);
|
|
||||||
|
|
||||||
border-radius: 0 0 var(--br) 0 !important;;
|
|
||||||
padding: 0 !important;
|
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
/* The following properties should allow the themes with trasparent toolbars to work */
|
||||||
#main-window:has(#sidebar-box[hidden="true"]) #navigator-toolbox > * {
|
background-color: transparent !important;
|
||||||
opacity: 100%;
|
background-repeat: no-repeat,no-repeat,var(--lwt-background-tiling);
|
||||||
|
--uc-bg-y: calc(-2 * (var(--tab-block-margin) + var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) - var(--tab-min-height) - 16px - var(--bookmark-block-padding));
|
||||||
|
background-position: top left,top left,var(--lwt-background-alignment,top left);
|
||||||
|
background-position-y:top,top,var(--uc-bg-y),var(--uc-bg-y),var(--uc-bg-y);
|
||||||
|
background-image: var(--toolbar-bgimage), linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image,var(--lwt-additional-images)) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* // hide sidebar button (when sidebar is open)
|
#PlacesToolbarItems > .bookmark-item,
|
||||||
// closing the sidebar messes up the theme
|
#OtherBookmarks,
|
||||||
*/
|
#PersonalToolbar > #import-button{
|
||||||
#main-window:has(#sidebar-box:not([hidden="true"])) #sidebar-button {
|
padding-block: var(--uc-bm-padding) !important;
|
||||||
display: none;
|
|
||||||
/* */
|
|
||||||
}
|
|
||||||
#main-window:has(#sidebar-box[hidden="true"]) #sidebar-button {
|
|
||||||
border: 1px solid #fafafaa0;
|
|
||||||
background: #fafafa20;
|
|
||||||
border-radius: var(--br);
|
|
||||||
margin: .25rem !important;;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#main-window:has(#sidebar-box[hidden="true"]) #appcontent browser {
|
#nav-bar:focus-within + #PersonalToolbar{
|
||||||
margin-left: var(--spacing);
|
transition-delay: 100ms !important;
|
||||||
|
transform: rotateX(var(--uc-autohide-toolbar-focus-rotation,0));
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ** WINDOWS - make the window buttons less huge
|
#navigator-toolbox:hover > #PersonalToolbar{
|
||||||
// uncomment if you're on windows.
|
transition-delay: 100ms !important;
|
||||||
recomended --wbt-wdt: 7rem
|
transform: rotateX(var(--uc-autohide-toolbar-hover-rotation,0));
|
||||||
*/
|
|
||||||
/*
|
|
||||||
.titlebar-buttonbox {
|
|
||||||
margin-right: var(--spacing);
|
|
||||||
border-radius: calc(var(--br) / 2);
|
|
||||||
max-width: 7.5rem;
|
|
||||||
justify-content: center;
|
|
||||||
overflow: clip;
|
|
||||||
}
|
}
|
||||||
.titlebar-buttonbox .titlebar-button {
|
|
||||||
padding: .75rem !important;
|
|
||||||
}
|
|
||||||
*/
|
|
||||||
|
|
||||||
|
#navigator-toolbox:hover > #nav-bar:focus-within + #PersonalToolbar {
|
||||||
|
transform: rotateX(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabbrowser-tab {
|
||||||
|
visibility: collapse;
|
||||||
|
}
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
/* ** width of the window control buttons (min max close)
|
margin-top: -40px;
|
||||||
that the toolbar should take into account
|
margin-right: 137px;
|
||||||
// change to 0 if using server side decorations
|
}
|
||||||
*/
|
.titlebar-button {
|
||||||
--wbt-wdt: 3.5rem;
|
height: 40px;
|
||||||
|
|
||||||
margin-top: -2.75rem;
|
|
||||||
width: calc(var(--sdb-wdt) - var(--wbt-wdt)) !important;
|
|
||||||
background: none !important;
|
|
||||||
margin-left: calc(var(--spacing) * -.75);
|
|
||||||
|
|
||||||
border: none !important;
|
|
||||||
box-shadow: none !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar.browser-toolbar {
|
|
||||||
overflow: visible !important;
|
/* Uncomment to enable compatibility for multi-row_bookmarks.css */
|
||||||
height: 3rem;
|
/* This would break buttons placed in the toolbar but that is likely not happening if you are using multi-row setup */
|
||||||
|
/*
|
||||||
|
#PersonalToolbar:not([customizing]){
|
||||||
|
position: fixed;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 0px !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
#urlbar-container {
|
|
||||||
position: absolute;
|
|
||||||
|
|
||||||
flex: 0 !important;
|
|
||||||
|
|
||||||
margin: 0;
|
|
||||||
top: 2.75rem;
|
|
||||||
|
|
||||||
overflow: visible !important;
|
|
||||||
box-sizing: border-box !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // put the url bar in the right position */
|
|
||||||
#urlbar {
|
|
||||||
width: calc(var(--sdb-wdt) - var(--spacing) * 1.5) !important;
|
|
||||||
margin-left: calc(var(--spacing) * 1);
|
|
||||||
height: 2.75rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar-background {
|
|
||||||
border-radius: var(--br) !important;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* // means when the suggestions list is showing */
|
|
||||||
#urlbar[breakout-extend="true"] {
|
|
||||||
padding: 0 !important;
|
|
||||||
width: calc(var(--sdb-wdt) - var(--spacing) * 1) !important;
|
|
||||||
margin-left: calc(var(--spacing) * 1.25);
|
|
||||||
border: 1px solid #fafafa40;
|
|
||||||
border-radius: var(--br);
|
|
||||||
|
|
||||||
box-shadow: 0px 3px 7px #00000030;
|
|
||||||
}
|
|
||||||
|
|
||||||
#main-window[privatebrowsingmode="temporary"] #urlbar[breakout-extend="true"] {
|
|
||||||
border: 2px solid var(--poiple);
|
|
||||||
}
|
|
||||||
|
|
||||||
#urlbar[breakout-extend="true"] #urlbar-background {
|
|
||||||
border-radius: var(--br) var(--br) 0 0 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.urlbarView {
|
|
||||||
background: var(--toolbar-field-focus-background-color) !important;
|
|
||||||
width: calc(100%) !important;
|
|
||||||
margin-left: 0 !important;
|
|
||||||
margin-top: -.25rem !important;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 0 0 var(--br) var(--br);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ## extras
|
|
||||||
// feel free to comment or uncomment each setting
|
|
||||||
I personally would recommend to keep them to keep
|
|
||||||
stuff cleaner
|
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* ** hide reader mode button when editing url bar */
|
|
||||||
#urlbar[breakout-extend="true"] #reader-mode-button {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* hide pip mode button when editing url bar */
|
|
||||||
#urlbar[breakout-extend="true"] #picture-in-picture-button {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide "Shield" icon */
|
|
||||||
#urlbar:not(:hover) #tracking-protection-icon-container {
|
|
||||||
width: 0;
|
|
||||||
overflow: clip;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide Site information buttons */
|
|
||||||
#urlbar:not(:hover) #identity-box {
|
|
||||||
width: 0;
|
|
||||||
overflow: clip;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide the "Search with" indicator on the urlbar */
|
|
||||||
#urlbar-search-mode-indicator { display: none; }
|
|
||||||
|
|
||||||
/* ** hide the "Always open in container" button */
|
|
||||||
#urlbar #pageAction-urlbar-_testpilot-containers {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide Container name */
|
|
||||||
#userContext-label, #userContext-icons, #userContext-indicator {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide identity box */
|
|
||||||
#identity-box {
|
|
||||||
width: 0px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ** hide 'open in side view' button*/
|
|
||||||
#pageAction-urlbar-side-view_mozilla_org {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
'';
|
'';
|
||||||
};
|
};
|
||||||
/*
|
/*
|
||||||
|
|||||||
Reference in New Issue
Block a user