mirror of
https://github.com/zen-browser/theme-store.git
synced 2025-07-14 20:23:53 +02:00
115 lines
4.1 KiB
CSS
115 lines
4.1 KiB
CSS
:root {
|
|
/* Adjust the outline to the outside of the tabs so they don't look smaller than buttons without it */
|
|
--tab-outline-offset: 0 !important;
|
|
|
|
&:not([zen-single-toolbar="true"]) {
|
|
/* Adjust the toolbar height. */
|
|
--zen-toolbar-height: calc(38px + var(--zen-element-separation) * 2) !important;
|
|
|
|
/* Adjust window control size to be inline with the modified sidebar width. */
|
|
.titlebar-button {
|
|
padding: calc(16px + var(--zen-element-separation)) !important;
|
|
}
|
|
}
|
|
|
|
&:not([zen-sidebar-expanded="true"]) {
|
|
/* Adjust the regular sidebar width */
|
|
--tab-min-width: calc(36px + var(--zen-element-separation) * 2) !important;
|
|
|
|
/* Adjust the padding below the tab tray in the collapsed sidebar. */
|
|
#TabsToolbar-customization-target {
|
|
padding-bottom: calc(var(--zen-element-separation) * 1.5) !important;
|
|
}
|
|
|
|
/* Adjust the padding above the footer icons wrapper below the tab tray. */
|
|
#zen-sidebar-icons-wrapper {
|
|
padding-top: calc(var(--zen-element-separation) * 1.5) !important;
|
|
}
|
|
|
|
/* Fixes a bug where the navbar is 1px shorter than it should be. */
|
|
#nav-bar {
|
|
margin-bottom: 0 !important; /* Remove the original fix. */
|
|
margin-top: 1px !important;
|
|
}
|
|
}
|
|
|
|
&[zen-right-side="true"] #zen-sidebar-top-buttons .titlebar-buttonbox-container {
|
|
/* Remove the top margin that prevents the window control icons from being centered. */
|
|
margin-top: 0 !important;
|
|
|
|
/* Keep the window control height inline with the toolbar height. */
|
|
height: var(--zen-toolbar-height) !important;
|
|
}
|
|
|
|
/* Adjust the compact sidebar width */
|
|
&[zen-compact-mode="true"]:not([customizing]):not([inDOMFullscreen="true"]) {
|
|
@media (-moz-bool-pref: "zen.view.compact.hide-tabbar"), (-moz-bool-pref: "zen.view.use-single-toolbar") {
|
|
#navigator-toolbox {
|
|
--zen-toolbox-max-width: calc(64px + var(--zen-element-separation)) !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Adjust tab tray containers top margin to prevent clipping. */
|
|
#tabbrowser-tabs {
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
[zen-sidebar-expanded="true"] #tabbrowser-tabs {
|
|
margin-top: -1px !important;
|
|
}
|
|
|
|
/* Adjust the padding of the standard sidebar containers. */
|
|
#navigator-toolbox, :root:not([zen-compact-mode="true"]) #TabsToolbar {
|
|
padding-bottom: var(--zen-element-separation) !important;
|
|
}
|
|
|
|
/* Adjust the padding of the compact sidebar container. */
|
|
#browser {
|
|
--zen-toolbox-padding: calc(var(--zen-element-separation) * 1.5) !important;
|
|
}
|
|
|
|
/* Adjust the padding below the tab tray in the expanded sidebar. */
|
|
#TabsToolbar-customization-target {
|
|
padding-bottom: var(--zen-element-separation) !important;
|
|
}
|
|
|
|
/* Adjust the margin of the new-tab button to match tab margins. */
|
|
#navigator-toolbox:not([zen-sidebar-expanded="true"]) #tabbrowser-arrowscrollbox-periphery > toolbarbutton {
|
|
margin: auto !important;
|
|
margin-block: var(--tab-block-margin) !important;
|
|
}
|
|
|
|
/* Adjust the gap between sidebar footer icons. */
|
|
#zen-sidebar-icons-wrapper {
|
|
padding-top: calc(var(--zen-element-separation) * 2) !important;
|
|
gap: var(--zen-element-separation) !important;
|
|
}
|
|
|
|
#zen-essentials-container {
|
|
/* Remove the fixed gap inside the essential tabs container to match the sidebar tabs tray
|
|
by relying on tab-block-margin. */
|
|
gap: 0 !important;
|
|
}
|
|
|
|
.tabbrowser-tab {
|
|
/* Remove redundant min-width that breaks the center alignment within the compact sidebar. */
|
|
min-width: auto !important;
|
|
|
|
/* Adjust the outlines of 'essential' tabs inside the 'essentials' container. */
|
|
&[visuallyselected] {
|
|
@media (-moz-bool-pref: "zen.theme.essentials-favicon-bg") {
|
|
.tab-background::before {
|
|
/* Reduce by 1px to be inline with the modified tab-outline-offset. */
|
|
margin: 1px !important;
|
|
border-radius: var(--border-radius-medium) !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Ensure the window control icons are always centered. */
|
|
.titlebar-button {
|
|
align-items: center !important;
|
|
}
|