196 lines
6.6 KiB
SCSS
196 lines
6.6 KiB
SCSS
/*= Hotfix #98 ===============================================================*/
|
|
/* Hidden Tab Panel Padding */
|
|
#allTabsMenu-hiddenTabsView .all-tabs-item {
|
|
margin-inline: 8px;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
/*= Remote Tabs Panel's Bottom Padding =======================================*/
|
|
#PanelUI-remotetabs #PanelUI-remotetabs-main {
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
/*= Identity Popup Icon Crop =================================================*/
|
|
.identity-popup-security-connection.identity-button {
|
|
padding-block: 1px !important;
|
|
}
|
|
|
|
/*= Zoom in button's plus icon horizontal rate ===============================*/
|
|
#customization-palette-container,
|
|
#customization-panel-container,
|
|
#widget-overflow-mainView {
|
|
#zoom-in-button > .toolbarbutton-icon {
|
|
padding-inline-start: 0px !important;
|
|
}
|
|
}
|
|
|
|
/*= Subview button, Menu's right padding #597 ================================*/
|
|
.subviewbutton.toolbaritem-combined-buttons:not([shortcut]),
|
|
.subviewbutton.subviewbutton-nav:not([shortcut]),
|
|
menu.subviewbutton {
|
|
padding-inline-end: 0 !important;
|
|
}
|
|
#allTabsMenu-allTabsView .subviewbutton.subviewbutton-nav:not([shortcut]) {
|
|
padding-inline-end: var(--arrowpanel-menuitem-padding-inline) !important; // #717
|
|
}
|
|
|
|
/*= First visible tab margin at maximized #332 ===============================*/
|
|
:root[tabsintitlebar="true"][sizemode="maximized"] #TabsToolbar {
|
|
margin-left: -1px;
|
|
}
|
|
|
|
/*= Disabled menu background color ===========================================*/
|
|
menuitem,
|
|
menu {
|
|
&[disabled="true"] {
|
|
background-color: transparent !important;
|
|
}
|
|
}
|
|
|
|
/*= Remove Tab Border ========================================================*/
|
|
@mixin noneBorder {
|
|
/* Nightly 96: 1px solid var(--tab-line-color, rgba(128,128,142,0.9)); */
|
|
border: unset !important;
|
|
}
|
|
|
|
@include Option("userChrome.tab.connect_to_window") {
|
|
/* TARGET: original, photon */
|
|
// Light Theme
|
|
#TabsToolbar:not([brighttext])
|
|
#tabbrowser-tabs:not([noshadowfortests])
|
|
.tabbrowser-tab:is([visuallyselected], [multiselected])
|
|
> .tab-stack
|
|
> .tab-background {
|
|
@include noneBorder;
|
|
}
|
|
@include lwtheme {
|
|
// Dark Theme
|
|
#TabsToolbar[brighttext]
|
|
#tabbrowser-tabs:not([noshadowfortests])
|
|
.tabbrowser-tab:is([visuallyselected], [multiselected])
|
|
> .tab-stack
|
|
> .tab-background {
|
|
@include noneBorder;
|
|
}
|
|
|
|
#TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon,
|
|
.tab-background[selected] {
|
|
// Nightly 102: outline: 1px solid var(--lwt-tab-line-color, var(--lwt-tabs-border-color, currentColor));
|
|
outline-color: transparent !important;
|
|
}
|
|
}
|
|
.keyboard-focused-tab > .tab-stack > .tab-background,
|
|
.tabbrowser-tab:focus:not([aria-activedescendant]) > .tab-stack > .tab-background {
|
|
outline: var(--focus-outline) !important;
|
|
}
|
|
}
|
|
|
|
/*= Tab Separator Color ======================================================*/
|
|
#TabsToolbar,
|
|
#nav-bar {
|
|
--toolbarseparator-color: color-mix(in srgb, currentColor 20%, transparent); /* 60% at v105 */
|
|
}
|
|
|
|
|
|
/*= Light Weight Theme =======================================================*/
|
|
/* Header Image */
|
|
:root[lwtheme-image] > body {
|
|
// Linux compatibility:
|
|
// :root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]) {
|
|
// appearance: auto;
|
|
// }
|
|
background-image: var(--lwt-header-image) !important; /* Original: var(--lwt-header-image) */
|
|
background-repeat: no-repeat !important;
|
|
background-position: right top !important;
|
|
background-color: var(--lwt-accent-color, Window) !important;
|
|
&:-moz-window-inactive {
|
|
background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)) !important;
|
|
}
|
|
|
|
// For high-resolution screen's image ratio
|
|
@media (min-width: 2500px) {
|
|
background-size: contain;
|
|
|
|
@include Option("userChrome.compatibility.covered_header_image") {
|
|
background-size: cover;
|
|
}
|
|
}
|
|
|
|
// lwtheme compatibility
|
|
@include lwtheme {
|
|
#navigator-toolbox {
|
|
background-image: var(--lwt-header-image), var(--lwt-additional-images) !important;
|
|
background-repeat: var(--lwt-background-tiling) !important;
|
|
background-position: var(--lwt-background-alignment) !important;
|
|
background-color: unset !important; /* Original: var(--lwt-accent-color) */
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Navbar Border */
|
|
@include lwtheme {
|
|
#navigator-toolbox {
|
|
--tabs-border-color: rgba(0, 0, 0, 0.4); /* Legacy: v96, (0, 0, 0, 0.3) -> (0, 0, 0, 0.4) */
|
|
--lwt-tabs-border-color: rgba(0, 0, 0, 0.4);
|
|
}
|
|
}
|
|
|
|
#customization-container {
|
|
background-color: transparent !important; /* Original: color-mix(in srgb, -moz-dialog 85%, white) */
|
|
}
|
|
|
|
/*= Findbar Border Color =====================================================*/
|
|
html|input.findbar-textbox {
|
|
border: 1px solid var(--input-border-color, var(--toolbar-field-border-color, ThreeDShadow)) !important; /* Original: 1px solid var(--input-border-color, var(--toolbar-field-border-color)) */
|
|
}
|
|
|
|
/*= Drop Indicator Color #473 ================================================*/
|
|
treechildren::-moz-tree-cell-text(primary, dropOn),
|
|
treechildren::-moz-tree-drop-feedback,
|
|
vbox[part="drop-indicator-bar"] > image[part="drop-indicator"] {
|
|
background-color: var(--button-primary-bgcolor, var(--focus-outline-color)) !important; /* Original: SelectedItem or AccentColor*/
|
|
}
|
|
|
|
#bookmarksPanel[lwt-sidebar="true"] {
|
|
--focus-outline-color: var(--in-content-focus-outline-color, AccentColor) !important;
|
|
}
|
|
|
|
/*= Firefox View Border #498 =================================================*/
|
|
@mixin _firefox_view_border_remove() {
|
|
#tabbrowser-tabs {
|
|
border-inline-start: none !important;
|
|
padding-inline-start: var(--tab-overflow-pinned-tabs-width) !important;
|
|
margin-inline-start: 0 !important;
|
|
}
|
|
}
|
|
|
|
:root:not([privatebrowsingmode=temporary])[firefoxviewhidden] #firefox-view-button + {
|
|
@include _firefox_view_border_remove;
|
|
}
|
|
|
|
@include Option("userChrome.tab.static_separator") {
|
|
// #531
|
|
@include _firefox_view_border_remove;
|
|
}
|
|
|
|
/*= Menubar rounding #814 ====================================================*/
|
|
#main-menubar {
|
|
--panel-border-radius: var(--arrowpanel-border-radius);
|
|
}
|
|
|
|
/*= Infobar Align #858 =======================================================*/
|
|
.container.infobar {
|
|
align-items: center !important;
|
|
}
|
|
|
|
/*= Inactive transparent #882 ================================================*/
|
|
:root[tabsintitlebar] #titlebar:-moz-window-inactive {
|
|
opacity: 1 !important;
|
|
color: color-mix(in srgb, currentColor calc(var(--inactive-titlebar-opacity, 0.75) * 100%), transparent) !important;
|
|
--inactive-toolbarbutton-icon-fill-opacity: calc(var(--toolbarbutton-icon-fill-opacity, 1) * var(--inactive-titlebar-opacity, 0.75));
|
|
|
|
.toolbarbutton-icon {
|
|
fill-opacity: var(--inactive-toolbarbutton-icon-fill-opacity, 1);
|
|
}
|
|
}
|