diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /toolkit/themes/shared/global-shared.css | |
parent | Initial commit. (diff) | |
download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'toolkit/themes/shared/global-shared.css')
-rw-r--r-- | toolkit/themes/shared/global-shared.css | 298 |
1 files changed, 298 insertions, 0 deletions
diff --git a/toolkit/themes/shared/global-shared.css b/toolkit/themes/shared/global-shared.css new file mode 100644 index 0000000000..031f447eb4 --- /dev/null +++ b/toolkit/themes/shared/global-shared.css @@ -0,0 +1,298 @@ +/* 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/. */ + +/* all localizable skin settings shall live here */ +@import url("chrome://global/locale/intl.css"); +@import url("chrome://global/content/widgets.css"); + +@import url("close-icon.css"); + +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +:root { + --default-focusring-width: 2px; + --default-focusring: var(--default-focusring-width) dotted; + + --focus-outline-width: 2px; + --focus-outline-color: AccentColor; + --focus-outline: var(--focus-outline-width) solid var(--focus-outline-color); + --focus-outline-inset: calc(-1 * var(--focus-outline-width)); + --focus-outline-offset: 2px; + + --arrowpanel-background: Field; + --arrowpanel-color: FieldText; + --arrowpanel-border-color: ThreeDShadow; + --arrowpanel-border-radius: 8px; + --arrowpanel-padding: 16px; + + --arrowpanel-dimmed: color-mix(in srgb, currentColor 17%, transparent); + --arrowpanel-dimmed-further: color-mix(in srgb, currentColor 30%, transparent); + + --panel-description-color: GrayText; + --panel-disabled-color: GrayText; + + --popup-notification-body-width: calc(31em - calc(2 * var(--arrowpanel-padding))); + --toolbarbutton-icon-fill: currentColor; + + --toolbar-field-background-color: Field; + --toolbar-field-color: FieldText; + --toolbar-field-border-color: ThreeDShadow; + --toolbar-field-focus-background-color: Field; + --toolbar-field-focus-color: FieldText; +} + +:root:-moz-lwtheme { + --toolbar-field-background-color: rgba(255, 255, 255, 0.8); + --toolbar-field-focus-background-color: white; + --toolbar-field-color: black; + --toolbar-field-focus-color: black; + --toolbar-field-border-color: transparent; +} + +:is(menupopup, panel)[type=arrow] { + --panel-background: var(--arrowpanel-background); + --panel-color: var(--arrowpanel-color); + --panel-border-color: var(--arrowpanel-border-color); + --panel-border-radius: var(--arrowpanel-border-radius); + --panel-padding: var(--arrowpanel-padding); +} + +/* Lightweight theme roots */ + +:root[lwtheme-image] { + text-shadow: 0 -0.5px 1.5px white; +} + +:root[lwtheme-image][lwtheme-brighttext] { + text-shadow: 1px 1px 1.5px black; +} + +/* General styles */ + +.plain { + appearance: none; + margin: 0 !important; + border: none; + padding: 0; +} + +moz-input-box, +html|input { + min-width: 0; +} + +html|button, +html|input, +html|textarea { + font: inherit; +} + +.header { + font-weight: bold; +} + +.indent { + margin-inline-start: 23px; +} + +.box-padded { + padding: 5px; +} + +/* XUL iframe */ + +xul|iframe { + border: none; + min-width: 10px; + min-height: 10px; +} + +/* Label/description formatting */ + +xul|description, +xul|label { + cursor: default; + margin-block: 1px 2px; + margin-inline: 6px 5px; +} + +xul|description { + margin-bottom: 4px; +} + +xul|label[disabled="true"] { + color: GrayText; +} + +.tooltip-label { + margin: 0; + word-wrap: break-word; + /* We must specify a min-width, otherwise word-wrap:break-word doesn't work. + See Bug 630864. */ + min-width: 1px; +} + +/* Links */ + +.text-link { + color: -moz-nativehyperlinktext; + cursor: pointer; +} + +.text-link:hover { + text-decoration: underline; +} + +.text-link:-moz-lwtheme { + color: inherit; + text-decoration: underline; +} + +.text-link:focus-visible { + outline: var(--focus-outline); + /* Not using --focus-outline-offset here because that's intended for elements + with a background, and we only want a slight offset here while not + overlapping adjacent text. */ + outline-offset: 1px; + border-radius: 1px; +} + +/* Override properties set on buttons, to display the links without unwanted styling */ +button.text-link { + appearance: none; + background-color: transparent; + border: none; + min-width: 0; + margin: 0; + padding: 0; + font: inherit; +} + +button.text-link .button-text { + /* Cancel out the default internal margin */ + margin: 0; +} + +/* Textbox context menu */ + +.textbox-contextmenu:-moz-locale-dir(rtl) { + direction: rtl; +} + +/* Panel footer buttons */ + +.panel-footer { + display: flex; + justify-content: flex-end; + margin: 8px 16px 16px; +} + +.panel-footer > button { + appearance: none; + border: 0; + border-radius: 4px; + color: var(--button-color, inherit); + background-color: var(--button-bgcolor, color-mix(in srgb, currentColor 13%, transparent)); + padding: 8px 16px; + font-weight: 600; + min-width: 0; + margin-inline: 8px 0; + margin-bottom: 0; +} + +.panel-footer > button[disabled] { + opacity: 0.4; +} + +.panel-footer > button:focus-visible { + outline: var(--focus-outline); + outline-offset: var(--focus-outline-offset); +} + +.panel-footer > button:not([disabled]):hover { + background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 17%, transparent)); +} + +.panel-footer > button:not([disabled]):hover:active { + background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 30%, transparent)); +} + +.panel-footer > button:not([disabled])[default] { + color: var(--button-primary-color); + background-color: var(--button-primary-bgcolor); +} + +.panel-footer > button:not([disabled])[default]:hover { + background-color: var(--button-primary-hover-bgcolor); +} + +.panel-footer > button:not([disabled])[default]:hover:active { + background-color: var(--button-primary-active-bgcolor); +} + +@media (-moz-platform: windows) { + /* Swap the primary and secondary action, because Windows + * platform conventions put the primary action on the left. */ + .panel-footer > button[default] { + order: -1; + } +} + +/* Autoscroll popup */ + +.autoscroller { + appearance: none; + + /* Resets the native styles in windows and macOS */ + border: none; + background-color: transparent; + -moz-window-shadow: none; + + --autoscroll-background-image: url("chrome://global/skin/icons/autoscroll.svg"); + --panel-border-color: rgba(0,0,0,.4); + --panel-padding: 0; + --panel-background: rgba(249,249,250,.8) no-repeat center var(--autoscroll-background-image); + /* Set pointer-events: none; so that mousemove events can be handled by AutoScrollChild.jsm. */ + pointer-events: none; +} + +.autoscroller::part(content) { + border-radius: 100%; + background-clip: padding-box; + box-shadow: 0 0 4px rgba(0,0,0,.2); + margin: 4px; +} + +.autoscroller[scrolldir="NS"] { + --autoscroll-background-image: url("chrome://global/skin/icons/autoscroll-vertical.svg"); +} + +.autoscroller[scrolldir="EW"] { + --autoscroll-background-image: url("chrome://global/skin/icons/autoscroll-horizontal.svg"); +} + +/* Combobox dropdown renderer */ +#ContentSelectDropdown > menupopup { + /* The menupopup itself should always be rendered LTR to ensure the scrollbar aligns with + * the dropdown arrow on the dropdown widget. If a menuitem is RTL, its style will be set accordingly */ + direction: ltr; +} + +#ContentSelectDropdown > menupopup::part(arrowscrollbox-scrollbox) { + scrollbar-width: var(--content-select-scrollbar-width, auto); +} + +#ContentSelectDropdown > menupopup[customoptionstyling="true"]::part(arrowscrollbox) { + /* When authors specify a custom background, we use background-image to specify the author-supplied color. + * In that case, we don't want stuff like custom appearance or custom + * backgrounds, so we make sure to apply it on top of the default background. */ + background-image: var(--content-select-background-image, none); + background-color: -moz-Combobox; +} + +/* Indent options in optgroups */ +.contentSelectDropdown-ingroup .menu-iconic-text { + padding-inline-start: 2em; +} |