diff options
Diffstat (limited to 'toolkit/themes')
32 files changed, 252 insertions, 209 deletions
diff --git a/toolkit/themes/osx/global/in-content/common.css b/toolkit/themes/osx/global/in-content/common.css index 0c6c6a99bd..3046da5cb0 100644 --- a/toolkit/themes/osx/global/in-content/common.css +++ b/toolkit/themes/osx/global/in-content/common.css @@ -12,6 +12,10 @@ xul|tabs { position: static; } +xul|menulist > xul|menupopup:not([position]) { + margin-inline-start: 0; +} + xul|menupopup > xul|menuitem::after, xul|menupopup > xul|menuitem::before { content: none; diff --git a/toolkit/themes/osx/reftests/482681-ref.xhtml b/toolkit/themes/osx/reftests/482681-ref.xhtml deleted file mode 100644 index 62fb4bb8d5..0000000000 --- a/toolkit/themes/osx/reftests/482681-ref.xhtml +++ /dev/null @@ -1,21 +0,0 @@ -<?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin" type="text/css"?> -<?xml-stylesheet href="data:text/css, -vbox { height: 50px; } -box { - -moz-appearance: button; -} -" type="text/css"?> - -<window title="Reference for mini, small and regular button sizes" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - <vbox> - <hbox><box width="79" height="16"/></hbox> - </vbox> - <vbox> - <hbox><box width="79" height="19"/></hbox> - </vbox> - <vbox> - <hbox><box width="79" height="22"/></hbox> - </vbox> -</window> diff --git a/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml b/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml deleted file mode 100644 index 30ed9dfe90..0000000000 --- a/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml +++ /dev/null @@ -1,33 +0,0 @@ -<?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin" type="text/css"?> - -<window title="Reference for mini, small and regular checkbox sizes" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - <style xmlns="http://www.w3.org/1999/xhtml"> - vbox { height: 50px; } - box { - appearance: auto; - -moz-default-appearance: checkbox; - margin-left: 2px; - margin-top: 1px; - } - </style> - <vbox> - <hbox><box style="width: 11px; height: 11px"/></hbox> - </vbox> - <vbox> - <hbox><box style="width: 13px; height: 13px"/></hbox> - </vbox> - <vbox> - <hbox><box style="width: 16px; height: 16px"/></hbox> - </vbox> - <vbox> - <hbox checked="true"><box style="width: 11px; height: 11px"/></hbox> - </vbox> - <vbox> - <hbox checked="true"><box style="width: 13px; height: 13px"/></hbox> - </vbox> - <vbox> - <hbox checked="true"><box style="width: 16px; height: 16px"/></hbox> - </vbox> -</window> diff --git a/toolkit/themes/osx/reftests/checkboxsize.xhtml b/toolkit/themes/osx/reftests/checkboxsize.xhtml deleted file mode 100644 index 1e5c62535e..0000000000 --- a/toolkit/themes/osx/reftests/checkboxsize.xhtml +++ /dev/null @@ -1,31 +0,0 @@ -<?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin" type="text/css"?> -<?xml-stylesheet href="data:text/css, -vbox { height: 50px; } -checkbox { - color: transparent; - margin: 0; -} -" type="text/css"?> - -<window title="Checkboxes with mini, small and regular control font" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - <vbox style="font-size: 9px"> - <hbox><checkbox native="true" label="Mini"/></hbox> - </vbox> - <vbox style="font: message-box"> - <hbox><checkbox native="true" label="Small"/></hbox> - </vbox> - <vbox style="font: menu"> - <hbox><checkbox native="true" label="Regular"/></hbox> - </vbox> - <vbox style="font-size: 9px"> - <hbox><checkbox native="true" label="Mini" checked="true"/></hbox> - </vbox> - <vbox style="font: message-box"> - <hbox><checkbox native="true" label="Small" checked="true"/></hbox> - </vbox> - <vbox style="font: menu"> - <hbox><checkbox native="true" label="Regular" checked="true"/></hbox> - </vbox> -</window> diff --git a/toolkit/themes/osx/reftests/radiosize-ref.xhtml b/toolkit/themes/osx/reftests/radiosize-ref.xhtml deleted file mode 100644 index 219d898082..0000000000 --- a/toolkit/themes/osx/reftests/radiosize-ref.xhtml +++ /dev/null @@ -1,33 +0,0 @@ -<?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin" type="text/css"?> - -<window title="Reference for mini, small and regular radio button sizes" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - <style xmlns="http://www.w3.org/1999/xhtml"> - vbox { height: 50px; } - box { - appearance: auto; - -moz-default-appearance: radio; - margin-left: 2px; - margin-top: 1px; - } - </style> - <vbox> - <hbox><box style="width: 11px; height: 11px;"/></hbox> - </vbox> - <vbox> - <hbox><box style="width: 13px; height: 13px;"/></hbox> - </vbox> - <vbox> - <hbox><box style="width: 16px; height: 16px;"/></hbox> - </vbox> - <vbox> - <hbox selected="true"><box style="width: 11px; height: 11px"/></hbox> - </vbox> - <vbox> - <hbox selected="true"><box style="width: 13px; height: 13px"/></hbox> - </vbox> - <vbox> - <hbox selected="true"><box style="width: 16px; height: 16px"/></hbox> - </vbox> -</window> diff --git a/toolkit/themes/osx/reftests/radiosize.xhtml b/toolkit/themes/osx/reftests/radiosize.xhtml deleted file mode 100644 index 15b4d5dd92..0000000000 --- a/toolkit/themes/osx/reftests/radiosize.xhtml +++ /dev/null @@ -1,31 +0,0 @@ -<?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin" type="text/css"?> -<?xml-stylesheet href="data:text/css, -vbox { height: 50px; } -radio { - color: transparent; - margin: 0; -} -" type="text/css"?> - -<window title="Radio buttons with mini, small and regular control font" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - <vbox style="font-size: 9px"> - <hbox><radio label="Mini"/></hbox> - </vbox> - <vbox style="font: message-box"> - <hbox><radio label="Small"/></hbox> - </vbox> - <vbox style="font: menu"> - <hbox><radio label="Regular"/></hbox> - </vbox> - <vbox style="font-size: 9px"> - <hbox><radio label="Mini" selected="true"/></hbox> - </vbox> - <vbox style="font: message-box"> - <hbox><radio label="Small" selected="true"/></hbox> - </vbox> - <vbox style="font: menu"> - <hbox><radio label="Regular" selected="true"/></hbox> - </vbox> -</window> diff --git a/toolkit/themes/osx/reftests/reftest.list b/toolkit/themes/osx/reftests/reftest.list deleted file mode 100644 index 35a890d4b3..0000000000 --- a/toolkit/themes/osx/reftests/reftest.list +++ /dev/null @@ -1,5 +0,0 @@ -# This folder is registered in the chrome manifest at layout/tools/reftest/jar.mn. -defaults pref(widget.non-native-theme.enabled,false) # These are tests for the native theme. - -skip-if(!cocoaWidget) == chrome://reftest/content/osx-theme/radiosize.xhtml chrome://reftest/content/osx-theme/radiosize-ref.xhtml -skip-if(!cocoaWidget) == chrome://reftest/content/osx-theme/checkboxsize.xhtml chrome://reftest/content/osx-theme/checkboxsize-ref.xhtml diff --git a/toolkit/themes/shared/aboutReader.css b/toolkit/themes/shared/aboutReader.css index 764dd39702..eeeddbb21a 100644 --- a/toolkit/themes/shared/aboutReader.css +++ b/toolkit/themes/shared/aboutReader.css @@ -17,6 +17,9 @@ --font-size: 12; --content-width: 22em; --line-height: 1.6em; + --text-alignment: start; + --word-spacing: 0; + --letter-spacing: 0; } body { @@ -43,6 +46,7 @@ body { --popup-shadow: rgba(49, 49, 49, 0.3); --popup-button-background: rgba(207, 207, 216, 0.33); --popup-button-foreground: var(--main-foreground); + --popup-button-selected-foreground: var(--color-gray-05); --popup-button-background-hover: var(--toolbar-button-background-hover); --popup-button-foreground-hover: var(--main-foreground); --popup-button-background-active: var(--toolbar-button-background-active); @@ -60,7 +64,7 @@ body { --link-selected-foreground: #333; --visited-link-foreground: #b5007f; --custom-theme-background: var(--color-white); - --custom-theme-foreground: #14151A; + --custom-theme-foreground: var(--color-gray-100); --custom-theme-unvisited-links: var(--color-blue-50); --custom-theme-visited-links: #321C64; --custom-theme-selection-highlight: #FFFFCC; @@ -88,7 +92,7 @@ body.contrast { --toolbar-button-background-hover: rgb(82, 82, 94); --toolbar-button-background-active: rgb(91, 91, 102); --popup-background: rgb(66, 65, 77); - --popup-button-border: rgba(255, 255, 255, 0.12); + --popup-button-border: rgba(255, 255, 255, 0.2); --popup-line: rgba(249, 249, 250, 0.1); --popup-button-background: rgb(43, 42, 51); --font-value-background: rgba(249, 249, 250, 0.15); @@ -97,6 +101,7 @@ body.contrast { --link-selected-foreground: #fff; --visited-link-foreground: #e675fd; --selected-background: rgba(0, 221, 255, 0.3); + --popup-button-selected-foreground: var(--color-gray-100); /* dark colours */ .moz-reader-block-img { @@ -170,6 +175,7 @@ body.hcm { --icon-disabled-fill: GrayText; --text-selected-background: SelectedItem; --text-selected-foreground: SelectedItemText; + --popup-button-selected-foreground: SelectedItemText; --link-foreground: LinkText; --link-selected-background: SelectedItem; --link-selected-foreground: SelectedItemText; @@ -501,14 +507,20 @@ button:disabled { border: 1px solid var(--popup-border); box-shadow: 0 0 10px 0 var(--popup-shadow); top: var(--space-xsmall); -} -.dropdown-popup h2 { - font-size: var(--font-size-root); - font-weight: var(--font-weight-bold); - color: var(--popup-button-foreground); - margin-block: var(--space-large); - margin-inline: var(--space-large) 0; + h2 { + font-size: var(--font-size-large); + font-weight: var(--font-weight-bold); + color: var(--popup-button-foreground); + margin-block: var(--space-large); + } + + hr { + width: 100%; + margin: 0; + border: none; + border-top: 1px solid var(--popup-line); + } } .open > .dropdown-popup { @@ -583,7 +595,6 @@ button:disabled { .radiorow > label { position: relative; box-sizing: border-box; - border-radius: 2px; border: 2px solid var(--popup-button-border); } @@ -592,12 +603,14 @@ button:disabled { } .radiorow > label:hover { - background-color: var(--toolbar-button-background-hover); + background-color: var(--popup-button-background-hover); + color: var(--popup-button-foreground-hover); } .radiorow > input[type=radio]:focus-visible + label { outline: 2px solid var(--primary-color); outline-offset: var(--focus-outline-offset); + z-index: 1; } .font-type-buttons > label { @@ -618,6 +631,7 @@ button:disabled { * baselines between serif and sans-serif, this isn't always enough. */ line-height: 1; padding-top: 2px; + border-radius: 2px; } .font-type-buttons { @@ -664,6 +678,7 @@ body.hcm .color-scheme-buttons { justify-content: center; /* We want 10px between items, but there's no margin collapsing in flexbox. */ margin: 10px 5px; + border-radius: 2px; border-color: var(--popup-border); } @@ -675,6 +690,95 @@ body.hcm .color-scheme-buttons { margin-inline-end: 10px; } +/* Improved text and layout menu popup */ + +#text-layout-controls { + display: flex; + flex-direction: column; + width: 340px; + padding: var(--space-large); + font-size: 15px; +} + +.accordion-header { + list-style: none; + display: flex; + justify-content: space-between; + align-items: center; + cursor: pointer; + + .chevron-icon { + background-image: url("chrome://global/skin/icons/arrow-down.svg"); + background-position: center; + background-repeat: no-repeat; + -moz-context-properties: fill; + fill: currentColor; + height: var(--size-item-large); + width: var(--size-item-large); + + #about-reader-advanced-layout[open] & { + background-image: url("chrome://global/skin/icons/arrow-up.svg"); + } + } +} + +.slider-container { + width: calc(100% - var(--space-xsmall)); + padding-bottom: var(--space-large); +} + +.text-alignment-buttons { + margin-top: var(--space-small); + gap: var(--space-xxsmall); + + > label { + display: flex; + flex: 1; + min-height: var(--button-min-height); + background-repeat: no-repeat; + background-position: center; + background-color: var(--popup-button-background); + color: var(--popup-button-foreground); + -moz-context-properties: fill; + fill: currentColor; + border: none; + + /* border radius does not target class because button order + * can be opposite in RTL */ + &:first-of-type { + border-start-start-radius: var(--border-radius-small); + border-end-start-radius: var(--border-radius-small); + } + + &:last-of-type { + border-start-end-radius: var(--border-radius-small); + border-end-end-radius: var(--border-radius-small); + } + + &.left-align-button { + background-image: url("chrome://global/skin/reader/align-left-20.svg"); + } + + &.center-align-button { + background-image: url("chrome://global/skin/reader/align-center-20.svg"); + } + + &.right-align-button { + background-image: url("chrome://global/skin/reader/align-right-20.svg"); + } + + &[checked] { + background-color: var(--primary-color); + border: none; + color: var(--popup-button-selected-foreground); + } + + body.hcm & { + border: 1px solid var(--popup-button-border); + } + } +} + /* Separate colors menu popup */ #color-controls { @@ -682,6 +786,10 @@ body.hcm .color-scheme-buttons { width: 400px; } +#about-reader-colors-menu-header { + margin-inline: var(--space-large) 0; +} + button-group { display: flex; font-size: var(--font-size-small); @@ -787,6 +895,10 @@ button[is="named-deck-button"] { background-image: url("chrome://global/skin/reader/RM-Type-Controls-24x24.svg"); } +.improved-style-button { + background-image: url("chrome://global/skin/reader/RM-Type-Controls-24x24.svg"); +} + .colors-button { background-image: url("chrome://mozapps/skin/extensions/category-themes.svg"); } @@ -844,6 +956,13 @@ button[is="named-deck-button"] { font-size: var(--font-size); max-width: var(--content-width); line-height: var(--line-height); + text-align: var(--text-alignment); + word-spacing: var(--word-spacing); + letter-spacing: var(--letter-spacing); + + .header { + text-align: var(--text-alignment); + } } pre { diff --git a/toolkit/themes/shared/design-system/design-tokens.json b/toolkit/themes/shared/design-system/design-tokens.json index c807335942..bdccc1feb9 100644 --- a/toolkit/themes/shared/design-system/design-tokens.json +++ b/toolkit/themes/shared/design-system/design-tokens.json @@ -681,7 +681,10 @@ "value": "{focus.outline.width} solid {focus.outline.color}" }, "color": { - "value": "{color.accent.primary.@base}" + "value": { + "default": "{color.accent.primary.@base}", + "forcedColors": "{text.color.@base}" + } }, "inset": { "value": "calc(-1 * {focus.outline.width})" diff --git a/toolkit/themes/shared/design-system/tokens-shared.css b/toolkit/themes/shared/design-system/tokens-shared.css index 42b33f5e0d..c10c1c5295 100644 --- a/toolkit/themes/shared/design-system/tokens-shared.css +++ b/toolkit/themes/shared/design-system/tokens-shared.css @@ -279,6 +279,9 @@ --color-accent-primary: ButtonText; --color-accent-primary-hover: SelectedItem; --color-accent-primary-active: var(--color-accent-primary-hover); + + /** Focus Outline **/ + --focus-outline-color: var(--text-color); } } } diff --git a/toolkit/themes/shared/design-system/tokens-storybook.mjs b/toolkit/themes/shared/design-system/tokens-storybook.mjs index fd2ea174c6..483a090ef9 100644 --- a/toolkit/themes/shared/design-system/tokens-storybook.mjs +++ b/toolkit/themes/shared/design-system/tokens-storybook.mjs @@ -605,7 +605,13 @@ export const storybookTables = { value: "var(--focus-outline-width) solid var(--focus-outline-color)", name: "--focus-outline", }, - { value: "var(--color-accent-primary)", name: "--focus-outline-color" }, + { + value: { + default: "var(--color-accent-primary)", + forcedColors: "var(--text-color)", + }, + name: "--focus-outline-color", + }, { value: "calc(-1 * var(--focus-outline-width))", name: "--focus-outline-inset", @@ -1055,7 +1061,10 @@ export const variableLookupTable = { }, "focus-outline": "var(--focus-outline-width) solid var(--focus-outline-color)", - "focus-outline-color": "var(--color-accent-primary)", + "focus-outline-color": { + default: "var(--color-accent-primary)", + forcedColors: "var(--text-color)", + }, "focus-outline-inset": "calc(-1 * var(--focus-outline-width))", "focus-outline-offset": "2px", "focus-outline-width": "2px", diff --git a/toolkit/themes/shared/desktop-jar.inc.mn b/toolkit/themes/shared/desktop-jar.inc.mn index 226faf26ff..5907a9773f 100644 --- a/toolkit/themes/shared/desktop-jar.inc.mn +++ b/toolkit/themes/shared/desktop-jar.inc.mn @@ -46,7 +46,7 @@ skin/classic/global/popupnotification.css (../../shared/popupnotification.css) skin/classic/global/splitter.css (../../shared/splitter.css) skin/classic/global/toolbarbutton.css (../../shared/toolbarbutton.css) - skin/classic/global/tree.css (../../shared/tree.css) + skin/classic/global/tree/tree.css (../../shared/tree/tree.css) skin/classic/global/dirListing/dirListing.css (../../shared/dirListing/dirListing.css) #ifdef XP_MACOSX skin/classic/global/dirListing/folder.png (../../shared/dirListing/folder-osx.png) @@ -74,6 +74,7 @@ skin/classic/global/icons/close-12.svg (../../shared/icons/close-12.svg) skin/classic/global/icons/close-fill.svg (../../shared/icons/close-fill.svg) skin/classic/global/icons/columnpicker.svg (../../shared/icons/columnpicker.svg) + skin/classic/global/icons/content-analysis.svg (../../shared/icons/content-analysis.svg) skin/classic/global/icons/defaultFavicon.svg (../../shared/icons/defaultFavicon.svg) skin/classic/global/icons/delete.svg (../../shared/icons/delete.svg) skin/classic/global/icons/developer.svg (../../shared/icons/developer.svg) @@ -152,3 +153,12 @@ skin/classic/global/reader/RM-Content-Width-Plus-44x16.svg (../../shared/reader/RM-Content-Width-Plus-44x16.svg) skin/classic/global/reader/RM-Line-Height-Minus-38x14.svg (../../shared/reader/RM-Line-Height-Minus-38x14.svg) skin/classic/global/reader/RM-Line-Height-Plus-38x24.svg (../../shared/reader/RM-Line-Height-Plus-38x24.svg) + skin/classic/global/reader/align-left-20.svg (../../shared/reader/align-left-20.svg) + skin/classic/global/reader/align-center-20.svg (../../shared/reader/align-center-20.svg) + skin/classic/global/reader/align-right-20.svg (../../shared/reader/align-right-20.svg) + skin/classic/global/reader/word-spacing-20.svg (../../shared/reader/word-spacing-20.svg) + skin/classic/global/reader/character-spacing-20.svg (../../shared/reader/character-spacing-20.svg) + skin/classic/global/reader/line-spacing-20.svg (../../shared/reader/line-spacing-20.svg) + skin/classic/global/reader/content-width-20.svg (../../shared/reader/content-width-20.svg) + skin/classic/global/tree/sort-asc.svg (../../shared/tree/sort-asc.svg) + skin/classic/global/tree/sort-dsc.svg (../../shared/tree/sort-dsc.svg) diff --git a/toolkit/themes/shared/desktop-non-mac.jar.inc.mn b/toolkit/themes/shared/desktop-non-mac.jar.inc.mn index c976798df5..afa8123140 100644 --- a/toolkit/themes/shared/desktop-non-mac.jar.inc.mn +++ b/toolkit/themes/shared/desktop-non-mac.jar.inc.mn @@ -20,7 +20,4 @@ skin/classic/mozapps/downloads/unknownContentType.css (../../windows/mozapps/downloads/unknownContentType.css) skin/classic/mozapps/handling/handling.css (../../windows/mozapps/handling/handling.css) - skin/classic/global/tree/sort-asc.svg (../../windows/global/tree/sort-asc.svg) - skin/classic/global/tree/sort-dsc.svg (../../windows/global/tree/sort-dsc.svg) - % override chrome://mozapps/skin/xpinstall/xpinstallItemGeneric.png chrome://mozapps/skin/extensions/extensionGeneric.svg diff --git a/toolkit/themes/shared/icons/blocked.svg b/toolkit/themes/shared/icons/blocked.svg index ccd1308e18..d32de9ac93 100644 --- a/toolkit/themes/shared/icons/blocked.svg +++ b/toolkit/themes/shared/icons/blocked.svg @@ -1,6 +1,6 @@ <!-- 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/. --> -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity"> <path d="M8.6 1.1c-4.1 0-7.5 3.4-7.5 7.5s3.4 7.5 7.5 7.5 7.5-3.4 7.5-7.5-3.3-7.5-7.5-7.5zM12 8c.3 0 .6.3.6.6s-.3.6-.6.6l-6.8 0c-.3 0-.6-.3-.6-.6s.3-.6.6-.6L12 8z"/> </svg> diff --git a/toolkit/themes/shared/icons/content-analysis.svg b/toolkit/themes/shared/icons/content-analysis.svg new file mode 100644 index 0000000000..1ff3ead797 --- /dev/null +++ b/toolkit/themes/shared/icons/content-analysis.svg @@ -0,0 +1,8 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" width="19" height="13" viewBox="0 0 19 13" fill="context-fill" fill-opacity="context-fill-opacity"> + <!--stroke="#5B5B66" --> + <rect x="0.5" y="0.5" width="18" height="12" rx="1.5" fill-opacity="0" stroke="context-stroke" stroke-opacity="context-stroke-opacity"/> + <path d="M2.46875 3.86328H4.64062C6.33203 3.86328 7.32812 4.87109 7.32812 6.66016C7.32812 8.44922 6.33203 9.5 4.64062 9.5H2.46875V3.86328ZM3.64844 4.83594V8.52344H4.5C5.55469 8.52344 6.125 7.88281 6.125 6.66406C6.125 5.48438 5.53906 4.83594 4.5 4.83594H3.64844ZM11.7305 8.52344V9.5H8.08594V3.86328H9.26562V8.52344H11.7305ZM12.4297 3.86328H14.7812C15.9375 3.86328 16.7344 4.63281 16.7344 5.79297C16.7344 6.94922 15.9102 7.72266 14.7227 7.72266H13.6094V9.5H12.4297V3.86328ZM13.6094 4.79688V6.80078H14.4648C15.1406 6.80078 15.5352 6.44141 15.5352 5.79688C15.5352 5.15625 15.1445 4.79688 14.4688 4.79688H13.6094Z" /> +</svg> diff --git a/toolkit/themes/shared/icons/developer.svg b/toolkit/themes/shared/icons/developer.svg index d02257d4d1..fe6d3ac98e 100644 --- a/toolkit/themes/shared/icons/developer.svg +++ b/toolkit/themes/shared/icons/developer.svg @@ -2,5 +2,5 @@ - 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/. --> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"> - <path fill="context-fill" fill-opacity="context-fill-opacity" d="M14.555 3.2l-2.434 2.436a1.243 1.243 0 1 1-1.757-1.757L12.8 1.445A3.956 3.956 0 0 0 11 1a3.976 3.976 0 0 0-3.434 6.02l-6.273 6.273a1 1 0 1 0 1.414 1.414L8.98 8.434A3.96 3.96 0 0 0 11 9a4 4 0 0 0 4-4 3.956 3.956 0 0 0-.445-1.8z"/> + <path fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity" d="M14.555 3.2l-2.434 2.436a1.243 1.243 0 1 1-1.757-1.757L12.8 1.445A3.956 3.956 0 0 0 11 1a3.976 3.976 0 0 0-3.434 6.02l-6.273 6.273a1 1 0 1 0 1.414 1.414L8.98 8.434A3.96 3.96 0 0 0 11 9a4 4 0 0 0 4-4 3.956 3.956 0 0 0-.445-1.8z"/> </svg> diff --git a/toolkit/themes/shared/icons/info-filled.svg b/toolkit/themes/shared/icons/info-filled.svg index 62ed3def93..86c6ba50d0 100644 --- a/toolkit/themes/shared/icons/info-filled.svg +++ b/toolkit/themes/shared/icons/info-filled.svg @@ -1,6 +1,6 @@ <!-- 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/. --> -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity"> <path d="M7.625.5a7.5 7.5 0 1 0 0 15 7.5 7.5 0 0 0 0-15zm.625 10.875a.625.625 0 0 1-1.25 0l0-4.437a.625.625 0 0 1 1.25 0l0 4.437zM8.25 5 8 5.25l-.75 0L7 5l0-.75.25-.25L8 4l.25.25 0 .75z"/> </svg> diff --git a/toolkit/themes/shared/icons/info.svg b/toolkit/themes/shared/icons/info.svg index f85c206417..4d9174d88c 100644 --- a/toolkit/themes/shared/icons/info.svg +++ b/toolkit/themes/shared/icons/info.svg @@ -1,7 +1,7 @@ <!-- 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/. --> -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity"> <path d="M8.25 6.938a.625.625 0 0 0-1.25 0l0 4.438a.625.625 0 0 0 1.25-.001l0-4.437z"/> <path d="m8 4-.75 0-.25.25L7 5l.25.25.75 0L8.25 5l0-.75z"/> <path d="M7.625 1.75c3.446 0 6.25 2.804 6.25 6.25s-2.804 6.25-6.25 6.25-6.25-2.804-6.25-6.25 2.804-6.25 6.25-6.25m0-1.25a7.5 7.5 0 1 0 0 15 7.5 7.5 0 0 0 0-15z"/> diff --git a/toolkit/themes/shared/icons/performance.svg b/toolkit/themes/shared/icons/performance.svg index 00e4cb1d17..b6e9cc4f25 100644 --- a/toolkit/themes/shared/icons/performance.svg +++ b/toolkit/themes/shared/icons/performance.svg @@ -2,6 +2,6 @@ - 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/. --> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"> - <path fill="context-fill" d="M8 1a8 8 0 0 0-8 8 7.89 7.89 0 0 0 .78 3.43 1 1 0 0 0 .9.57.94.94 0 0 0 .43-.1 1 1 0 0 0 .47-1.33A6.07 6.07 0 0 1 2 9a6 6 0 0 1 12 0 5.93 5.93 0 0 1-.59 2.57 1 1 0 0 0 1.81.86A7.89 7.89 0 0 0 16 9a8 8 0 0 0-8-8z"/> - <path fill="context-fill" d="M11.77 7.08a.5.5 0 0 0-.69.15L8.62 11.1A2.12 2.12 0 0 0 8 11a2 2 0 0 0 0 4 2.05 2.05 0 0 0 1.12-.34 2.31 2.31 0 0 0 .54-.54 2 2 0 0 0 0-2.24 2.31 2.31 0 0 0-.2-.24l2.46-3.87a.5.5 0 0 0-.15-.69z"/> + <path fill="context-fill light-dark(black, white)" d="M8 1a8 8 0 0 0-8 8 7.89 7.89 0 0 0 .78 3.43 1 1 0 0 0 .9.57.94.94 0 0 0 .43-.1 1 1 0 0 0 .47-1.33A6.07 6.07 0 0 1 2 9a6 6 0 0 1 12 0 5.93 5.93 0 0 1-.59 2.57 1 1 0 0 0 1.81.86A7.89 7.89 0 0 0 16 9a8 8 0 0 0-8-8z"/> + <path fill="context-fill light-dark(black, white)" d="M11.77 7.08a.5.5 0 0 0-.69.15L8.62 11.1A2.12 2.12 0 0 0 8 11a2 2 0 0 0 0 4 2.05 2.05 0 0 0 1.12-.34 2.31 2.31 0 0 0 .54-.54 2 2 0 0 0 0-2.24 2.31 2.31 0 0 0-.2-.24l2.46-3.87a.5.5 0 0 0-.15-.69z"/> </svg> diff --git a/toolkit/themes/shared/icons/settings.svg b/toolkit/themes/shared/icons/settings.svg index 8d8f791abe..fd0ad4df14 100644 --- a/toolkit/themes/shared/icons/settings.svg +++ b/toolkit/themes/shared/icons/settings.svg @@ -1,7 +1,7 @@ <!-- 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/. --> -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity"> <path d="m8.628 16-1.25 0a1.632 1.632 0 0 1-1.562-1.177l-.406-1.414a5.939 5.939 0 0 1-.78-.466l-1.448.36a1.632 1.632 0 0 1-1.799-.765l-.625-1.082a1.633 1.633 0 0 1 .229-1.931l1.045-1.101A3.279 3.279 0 0 1 2 8c0-.153.014-.302.032-.45L.999 6.479a1.63 1.63 0 0 1-.238-1.94l.625-1.083a1.636 1.636 0 0 1 1.787-.768l1.477.355c.258-.179.51-.329.761-.452l.406-1.414A1.63 1.63 0 0 1 7.378 0l1.25 0c.714 0 1.354.478 1.559 1.163l.425 1.436c.242.121.484.266.739.444l1.478-.355a1.635 1.635 0 0 1 1.786.768l.625 1.083c.36.625.263 1.422-.237 1.941l-1.035 1.07c.018.148.032.297.032.45 0 .145-.014.285-.031.424l1.045 1.101c.492.519.586 1.312.229 1.931l-.625 1.083a1.63 1.63 0 0 1-1.8.764l-1.447-.36c-.259.182-.51.333-.759.458l-.425 1.437A1.638 1.638 0 0 1 8.628 16zm-4.016-4.341.528.109a4.72 4.72 0 0 0 1.032.615l.359.404.485 1.691c.046.16.194.271.36.271l1.25 0a.37.37 0 0 0 .359-.269l.506-1.707.355-.398c.324-.137.645-.33 1.01-.608l.529-.109 1.731.431a.378.378 0 0 0 .416-.176l.625-1.083a.378.378 0 0 0-.053-.446l-1.25-1.317-.167-.505.022-.174c.021-.127.041-.255.041-.388 0-.149-.021-.293-.042-.437l-.021-.15.171-.513 1.244-1.289a.378.378 0 0 0 .055-.448l-.625-1.082a.38.38 0 0 0-.412-.177l-1.758.422-.521-.108a4.7 4.7 0 0 0-.991-.594l-.356-.398-.506-1.707a.373.373 0 0 0-.36-.269l-1.25 0a.377.377 0 0 0-.36.271l-.486 1.691-.36.405a4.71 4.71 0 0 0-1.013.6l-.521.109-1.757-.422a.383.383 0 0 0-.413.177l-.625 1.083a.375.375 0 0 0 .055.447L3.142 6.9l.171.514-.021.15A2.981 2.981 0 0 0 3.25 8c0 .133.02.261.037.389l.022.174-.167.505-1.25 1.317a.38.38 0 0 0-.053.446l.625 1.083a.38.38 0 0 0 .415.176l1.733-.431z"/> <path d="M8 6.25c.965 0 1.75.785 1.75 1.75S8.965 9.75 8 9.75 6.25 8.965 6.25 8 7.035 6.25 8 6.25M8 5a3 3 0 1 0 0 6 3 3 0 0 0 0-6z"/> </svg> diff --git a/toolkit/themes/shared/icons/warning.svg b/toolkit/themes/shared/icons/warning.svg index 8ffcbb20fe..09fd17107b 100644 --- a/toolkit/themes/shared/icons/warning.svg +++ b/toolkit/themes/shared/icons/warning.svg @@ -1,6 +1,6 @@ <!-- 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/. --> -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill" fill-opacity="context-fill-opacity"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16" fill="context-fill light-dark(black, white)" fill-opacity="context-fill-opacity"> <path d="m14.875 12.037-5.497-10C8.997 1.346 8.311 1 7.625 1s-1.372.346-1.752 1.037l-5.497 10C-.358 13.37.607 15 2.128 15l10.995 0c1.52 0 2.485-1.63 1.752-2.963zM8.25 11.75 8 12l-.75 0-.25-.25L7 11l.25-.25.75 0 .25.25 0 .75zm0-2.688a.625.625 0 0 1-1.25 0l0-3.437a.625.625 0 0 1 1.25 0l0 3.437z"/> </svg> diff --git a/toolkit/themes/shared/in-content/common-shared.css b/toolkit/themes/shared/in-content/common-shared.css index 86c6d36210..542e38159d 100644 --- a/toolkit/themes/shared/in-content/common-shared.css +++ b/toolkit/themes/shared/in-content/common-shared.css @@ -77,23 +77,15 @@ --grey-90-a30: rgba(12, 12, 13, 0.3); --grey-90-a50: rgba(12, 12, 13, 0.5); --grey-90-a60: rgba(12, 12, 13, 0.6); - --green-50: #30e60b; --green-60: #12bc00; --green-70: #058b00; - --green-80: #006504; - --green-90: #003706; --orange-50: #ff9400; --red-40: #ff4f5e; --red-50: #ff0039; --red-60: #d70022; - --red-70: #a4000f; - --red-80: #5a0002; - --red-90: #3e0200; --yellow-50: #ffe900; --yellow-60: #d7b600; --yellow-60-a30: rgba(215, 182, 0, 0.3); - --yellow-70: #a47f00; - --yellow-80: #715100; --yellow-90: #3e2800; --shadow-10: 0 1px 4px var(--grey-90-a10); diff --git a/toolkit/themes/shared/reader/align-center-20.svg b/toolkit/themes/shared/reader/align-center-20.svg new file mode 100644 index 0000000000..85d00e63d3 --- /dev/null +++ b/toolkit/themes/shared/reader/align-center-20.svg @@ -0,0 +1,6 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M18 3.125H2v1.75h16v-1.75zM18 11.125H2v1.75h16v-1.75zM6 7.125h8v1.75H6v-1.75zM14 15.125H6v1.75h8v-1.75z"/> +</svg> diff --git a/toolkit/themes/shared/reader/align-left-20.svg b/toolkit/themes/shared/reader/align-left-20.svg new file mode 100644 index 0000000000..d6a5f523ee --- /dev/null +++ b/toolkit/themes/shared/reader/align-left-20.svg @@ -0,0 +1,6 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M18 3.125H1v1.75h17v-1.75zM15 11.125H1v1.75h14v-1.75zM1 7.125h10v1.75H1v-1.75zM11 15.125H1v1.75h10v-1.75z"/> +</svg> diff --git a/toolkit/themes/shared/reader/align-right-20.svg b/toolkit/themes/shared/reader/align-right-20.svg new file mode 100644 index 0000000000..fe60df4830 --- /dev/null +++ b/toolkit/themes/shared/reader/align-right-20.svg @@ -0,0 +1,6 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M2 3.125h17v1.75H2v-1.75zM5 11.125h14v1.75H5v-1.75zM19 7.125H9v1.75h10v-1.75zM9 15.125h10v1.75H9v-1.75z"/> +</svg> diff --git a/toolkit/themes/shared/reader/character-spacing-20.svg b/toolkit/themes/shared/reader/character-spacing-20.svg new file mode 100644 index 0000000000..ecda7fe739 --- /dev/null +++ b/toolkit/themes/shared/reader/character-spacing-20.svg @@ -0,0 +1,7 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M1.75 19V1H0v18h1.75zM20 1v18h-1.75V1H20z"/> + <path fill-rule="evenodd" clip-rule="evenodd" d="M6 15.707 7.342 12.5h5.317L14 15.707h1.897l-4.516-10.8a1 1 0 0 0-.923-.614h-.915c-.403 0-.767.242-.923.614l-4.517 10.8H6zm4-9.564 1.927 4.607H8.074L10 6.143z"/> +</svg> diff --git a/toolkit/themes/shared/reader/content-width-20.svg b/toolkit/themes/shared/reader/content-width-20.svg new file mode 100644 index 0000000000..a3c2c52e92 --- /dev/null +++ b/toolkit/themes/shared/reader/content-width-20.svg @@ -0,0 +1,6 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M1.75 2v16H0V2h1.75zM20 2v16h-1.75V2H20zM14.064 12.996a.75.75 0 0 1-1.28-.53v-1.591H7.21v1.591a.75.75 0 0 1-1.28.53L3.464 10.53a.75.75 0 0 1 0-1.061L5.93 7.004a.75.75 0 0 1 1.28.53v1.591h5.574V7.533a.75.75 0 0 1 1.28-.53l2.466 2.466a.75.75 0 0 1 0 1.061l-2.466 2.466z"/> +</svg> diff --git a/toolkit/themes/shared/reader/line-spacing-20.svg b/toolkit/themes/shared/reader/line-spacing-20.svg new file mode 100644 index 0000000000..f4a0a44c9a --- /dev/null +++ b/toolkit/themes/shared/reader/line-spacing-20.svg @@ -0,0 +1,6 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path d="M2 0h16v1.75H2V0zM2 18.25h16V20H2v-1.75zM12.996 5.936a.75.75 0 0 1-.53 1.28h-1.591v5.574h1.591a.75.75 0 0 1 .53 1.28l-2.466 2.466a.75.75 0 0 1-1.061 0L7.004 14.07a.75.75 0 0 1 .53-1.28h1.591V7.215H7.534a.75.75 0 0 1-.53-1.28L9.469 3.47a.75.75 0 0 1 1.061 0l2.466 2.466z"/> +</svg> diff --git a/toolkit/themes/shared/reader/word-spacing-20.svg b/toolkit/themes/shared/reader/word-spacing-20.svg new file mode 100644 index 0000000000..7a0fd6c2c7 --- /dev/null +++ b/toolkit/themes/shared/reader/word-spacing-20.svg @@ -0,0 +1,7 @@ +<!-- 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/. --> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20" height="20" fill="context-fill"> + <path fill-rule="evenodd" clip-rule="evenodd" d="M4.422 5.75h.996a.75.75 0 0 1 .69.457L9.839 15H7.938l-1.061-2.5H2.963L1.901 15H0l.073-.174 3.659-8.619a.749.749 0 0 1 .69-.457zm.498 2.139L3.705 10.75h2.43L4.92 7.889z"/> + <path d="m17.969 7.609 1.865 1.865a.568.568 0 0 1 0 .802l-1.865 1.865A.568.568 0 0 1 17 11.74v-.99h-5v.99a.567.567 0 0 1-.969.401l-1.865-1.865a.566.566 0 0 1 0-.802l1.865-1.865A.568.568 0 0 1 12 8.01V9h5v-.99c0-.506.611-.759.969-.401z"/> +</svg> diff --git a/toolkit/themes/windows/global/tree/sort-asc.svg b/toolkit/themes/shared/tree/sort-asc.svg index 917fa96cf3..917fa96cf3 100644 --- a/toolkit/themes/windows/global/tree/sort-asc.svg +++ b/toolkit/themes/shared/tree/sort-asc.svg diff --git a/toolkit/themes/windows/global/tree/sort-dsc.svg b/toolkit/themes/shared/tree/sort-dsc.svg index 97cbfc6917..97cbfc6917 100644 --- a/toolkit/themes/windows/global/tree/sort-dsc.svg +++ b/toolkit/themes/shared/tree/sort-dsc.svg diff --git a/toolkit/themes/shared/tree.css b/toolkit/themes/shared/tree/tree.css index 9c56af4db4..aa4ffa899c 100644 --- a/toolkit/themes/shared/tree.css +++ b/toolkit/themes/shared/tree/tree.css @@ -23,6 +23,21 @@ tree { } } +/********** splitter **********/ + +.tree-splitter { + margin-inline: -4px; + width: 8px; + max-width: 8px; + min-width: 8px; + appearance: none !important; + border: none !important; + background: none !important; + order: 2147483646; + z-index: 2147483646; +} + + /* ::::: tree rows ::::: */ treechildren::-moz-tree-row { @@ -123,20 +138,15 @@ treechildren::-moz-tree-drop-feedback { treecol, .tree-columnpicker-button { - appearance: auto; - -moz-default-appearance: treeheadercell; background-color: -moz-ColHeader; color: -moz-ColHeaderText; align-items: center; justify-content: center; padding: 0 4px; margin: 0; - border-inline-start: 1px solid ThreeDLightShadow; - @media (-moz-platform: linux) or ((-moz-platform: windows) and (prefers-color-scheme: dark)) { - appearance: none; - box-shadow: inset 0 -1px ThreeDLightShadow; - } + border-inline-start: 1px solid ThreeDLightShadow; + box-shadow: inset 0 -1px ThreeDLightShadow; &:where(:hover) { background-color: -moz-ColHeaderHover; @@ -250,22 +260,20 @@ html|input.tree-input { z-index: 2147483647; } -@media not (-moz-platform: macos) { - /* ::::: sort direction indicator ::::: */ - .treecol-sortdirection { - list-style-image: url("chrome://global/skin/tree/sort-asc.svg"); - -moz-context-properties: fill; - fill: currentColor; - visibility: hidden; +/* ::::: sort direction indicator ::::: */ +.treecol-sortdirection { + list-style-image: url("chrome://global/skin/tree/sort-asc.svg"); + -moz-context-properties: fill; + fill: currentColor; + visibility: hidden; - treecol[sortDirection="ascending"]:not([hideheader="true"]) > & { - visibility: inherit; - } + treecol[sortDirection="ascending"]:not([hideheader="true"]) > & { + visibility: inherit; + } - treecol[sortDirection="descending"]:not([hideheader="true"]) > & { - visibility: inherit; - list-style-image: url("chrome://global/skin/tree/sort-dsc.svg"); - } + treecol[sortDirection="descending"]:not([hideheader="true"]) > & { + visibility: inherit; + list-style-image: url("chrome://global/skin/tree/sort-dsc.svg"); } } |
