diff options
Diffstat (limited to 'application/basilisk/themes/osx/compacttheme.css')
-rw-r--r-- | application/basilisk/themes/osx/compacttheme.css | 126 |
1 files changed, 126 insertions, 0 deletions
diff --git a/application/basilisk/themes/osx/compacttheme.css b/application/basilisk/themes/osx/compacttheme.css new file mode 100644 index 000000000..4cc5e1139 --- /dev/null +++ b/application/basilisk/themes/osx/compacttheme.css @@ -0,0 +1,126 @@ +% This Source Code Form is subject to the terms of the Mozilla Public +% License, v. 2.0. If a copy of the MPL was not distributed with this +% file, You can obtain one at http://mozilla.org/MPL/2.0/. + +%include ../shared/compacttheme.inc.css + +:root { + --forwardbutton-width: 32px; +} + +/* Use only 1px separator between nav toolbox and page content */ +#navigator-toolbox::after { + border-top-style: none; + margin-top: -1px; +} + +/* Include extra space on left/right for dragging since there is no space above + the tabs */ +#main-window[tabsintitlebar] #TabsToolbar { + padding-left: 50px; + padding-right: 50px; + margin-bottom: 0; /* Don't overlap the inner highlight at the top of the nav-bar */ +} + +/* Don't use the default background for tabs toolbar */ +#TabsToolbar { + -moz-appearance: none !important; +} + +/* Get rid of 1px bright strip at the top of window */ +#main-window[tabsintitlebar] #titlebar-content { + background: var(--chrome-background-color); +} + +/* Resize things so that the native titlebar is in line with the tabs */ +#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-buttonbox-container, +#main-window[tabsintitlebar] > #titlebar > #titlebar-content > #titlebar-secondary-buttonbox > #titlebar-fullscreen-button { + margin-top: 6px; +} + +/* Square back and forward buttons. Need !important on these because there + are a lot of more specific selectors sprinkled around elsewhere for changing + background / shadows for different states */ +#back-button, +#forward-button { + height: 24px !important; + box-shadow: none !important; + border: 1px solid var(--chrome-nav-bar-controls-border-color) !important; + background: var(--chrome-nav-buttons-background) !important; +} + +#forward-button { + border-inline-start: none !important; + /* browser.css and friends set up the width of the button to be 32px. + * They then set margin-left to -2px to ensure the button is not too wide + * compared to the back button, and set padding-left to center the icon + * correctly. + * In our theme, the back and forward buttons are the same width, with the + * back button being 32px with 1px border on both sides. To ensure the + * forward button's content box looks like it is the same size with width + * set to 32px and a 1px border on only 1 side, we overlap by 1px, so both + * buttons end up with a content box that looks like it's 30px. + */ + margin-left: -1px; + padding-left: 1px; +} + +#forward-button > .toolbarbutton-icon { + margin-left: 0; + margin-right: 0; +} + +#back-button:hover:not([disabled="true"]), +#forward-button:hover:not([disabled="true"]) { + background: var(--chrome-nav-buttons-hover-background) !important; +} + +#back-button { + border-radius: 3px 0 0 3px !important; + padding: 0 !important; + margin: 0 !important; +} + +#back-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(18px, 54px, 36px, 36px); +} + +/* Use smaller back button icon */ +@media (min-resolution: 2dppx) { + #back-button:hover:active:not([disabled="true"]) { + -moz-image-region: rect(36px, 108px, 72px, 72px); + } +} + +/* Prevent the hover styling from on the identity icon from overlapping the + urlbar border. */ +#identity-box { + margin-top: -1px !important; + margin-bottom: -1px !important; + padding-top: 3px !important; + padding-bottom: 3px !important; +} + +#PanelUI-button { + margin-top: 0; + margin-bottom: 0; +} + +.findbar-closebutton:-moz-lwtheme-brighttext:not(:hover), +/* Tab styling - make sure to use an inverted icon for the selected tab + (brighttext only covers the unselected tabs) */ +.tab-close-button[selected=true]:not(:hover) { + -moz-image-region: rect(0, 64px, 16px, 48px); +} +@media (min-resolution: 2dppx) { + .findbar-closebutton:-moz-lwtheme-brighttext :not(:hover), + .tab-close-button[selected=true]:not(:hover) { + -moz-image-region: rect(0, 128px, 32px, 96px); + } +} + +.ac-type-icon { + /* Left-align the type icon in awesomebar popup results with the icon in the + urlbar. */ + margin-inline-start: 14px; +} |