mirror of
https://codeberg.org/claui/mobile-config-firefox.git
synced 2024-11-10 03:40:14 +00:00
Apply browser margin to browser-bottombox
This commit is contained in:
parent
3accc46a24
commit
3ab84536d0
1 changed files with 20 additions and 8 deletions
|
@ -2,23 +2,31 @@
|
|||
See the above repository for updates as well as full license text. */
|
||||
|
||||
/* Creates a statusbar at the bottom of the window by using bookmarks toolbar */
|
||||
|
||||
/* Since it's really the bookmarks toolbar you should move bookmarks away from bookmarks toolbar - for example to menubar. You can do that with Customize Firefox mode */
|
||||
|
||||
/* If you want to show the page-loading status in the statusbar then put a single flexible space as the leftmost item in the bookmarks toolbar */
|
||||
/* By default this flex-space will take 50% window width to show the loading status bar */
|
||||
|
||||
/* Toolbar buttons/items will be aligned to the right edge of the loading bar. If you wish to align them to the right edge, then add another flex-space after the first one */
|
||||
|
||||
:root:not([inFullscreen]) > body{ --uc-browser-base-padding: calc(2 * var(--toolbarbutton-inner-padding) + 16px) }
|
||||
|
||||
#PersonalToolbar{
|
||||
position: fixed;
|
||||
display: flex;
|
||||
bottom: 0;
|
||||
width: 100vw;
|
||||
}
|
||||
#customization-container,
|
||||
:root:not([inDOMFullscreen]) > body > #browser{
|
||||
margin-bottom: calc(5px + 2 * var(--toolbarbutton-inner-padding) + 16px) !important;
|
||||
|
||||
:root:not([inFullscreen]) #browser-bottombox{
|
||||
margin-bottom: calc(5px + var(--uc-browser-base-padding)) !important;
|
||||
}
|
||||
#PersonalToolbar > toolbarbutton{ padding: 0 var(--toolbarbutton-outer-padding) !important; }
|
||||
#PersonalToolbar > toolbarbutton > .toolbarbutton-icon,
|
||||
#PersonalToolbar > toolbarbutton > .toolbarbutton-badge-stack{
|
||||
width: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
|
||||
height: calc(2 * var(--toolbarbutton-inner-padding) + 16px) !important;
|
||||
width: var(--uc-browser-base-padding,0px) !important;
|
||||
height: var(--uc-browser-base-padding,0px) !important;
|
||||
padding: var(--toolbarbutton-inner-padding) !important;
|
||||
}
|
||||
|
||||
|
@ -26,9 +34,13 @@ See the above repository for updates as well as full license text. */
|
|||
background-position: left 4px;
|
||||
background-repeat: no-repeat;
|
||||
background-image: -moz-element(#statuspanel);
|
||||
max-width: none !important;
|
||||
width: 60ch;
|
||||
max-width: 50vw !important; /* Modify this to let the status bar grow larger than 50% of window width */
|
||||
min-width: 60ch;
|
||||
flex-grow: 10;
|
||||
}
|
||||
|
||||
#PersonalToolbar > toolbarspring{ flex-grow: 1; max-width: none !important; }
|
||||
|
||||
/* Using -moz-element() causes some problems after Firefox has been running several hours such as long tab switch times. For this reason the background image is removed on hover and focused states which appears to clear the state. */
|
||||
#PersonalToolbar > toolbarspring:first-of-type:hover{ background-image: none }
|
||||
|
||||
|
@ -50,4 +62,4 @@ See the above repository for updates as well as full license text. */
|
|||
#statuspanel[inactive] > #statuspanel-inner::before{ content: "Done"; color: var(--lwt-toolbar-field-color, black) !important }
|
||||
#statuspanel[type="status"] { color: skyblue }
|
||||
|
||||
#statuspanel-inner > #statuspanel-label[value^="https"]{ color: var(--lwt-toolbar-field-color, black) !important;}
|
||||
#statuspanel-inner > #statuspanel-label[value^="https"]{ color: var(--lwt-toolbar-field-color, black) !important; }
|
Loading…
Reference in a new issue