summaryrefslogtreecommitdiffstats
path: root/toolkit/themes/shared/global-shared.css
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /toolkit/themes/shared/global-shared.css
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
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.css306
1 files changed, 306 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..255a92e1d3
--- /dev/null
+++ b/toolkit/themes/shared/global-shared.css
@@ -0,0 +1,306 @@
+/* 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/skin/design-tokens-system.css");
+
+@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;
+
+ --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-disabled-color: color-mix(in srgb, currentColor 40%, transparent);
+
+ --popup-notification-body-width: calc(31em - calc(2 * var(--arrowpanel-padding)));
+
+ --toolbarbutton-icon-fill: currentColor;
+ --toolbarbutton-disabled-opacity: 0.4;
+
+ --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;
+}
+
+@media (prefers-contrast) {
+ :root:not(:-moz-lwtheme) {
+ --toolbarbutton-disabled-opacity: 0.3;
+
+ --panel-disabled-color: GrayText;
+ }
+}
+
+: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,
+a {
+ color: -moz-nativehyperlinktext;
+ cursor: pointer;
+ text-decoration: underline;
+}
+
+:is(a, .text-link):-moz-lwtheme {
+ color: inherit;
+}
+
+:is(a, .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:not(moz-button-group) > 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);
+ --panel-shadow-margin: 4px;
+ /* 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 var(--panel-shadow-margin) rgba(0,0,0,.2);
+ width: 100%;
+ height: 100%;
+}
+
+.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;
+}
+
+.deemphasized {
+ color: var(--text-color-deemphasized);
+}