diff options
Diffstat (limited to 'toolkit/themes/osx')
61 files changed, 2609 insertions, 0 deletions
diff --git a/toolkit/themes/osx/global/alerts/alert.css b/toolkit/themes/osx/global/alerts/alert.css new file mode 100644 index 0000000000..41356e39e7 --- /dev/null +++ b/toolkit/themes/osx/global/alerts/alert.css @@ -0,0 +1,17 @@ +/* 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/. */ + +%include ../../../shared/alert.inc.css + +#alertNotification { + appearance: none; + background: transparent; +} + +#alertBox { + border: 1px solid ThreeDShadow; + border-radius: 1px; + background-color: -moz-Dialog; + color: -moz-DialogText; +} diff --git a/toolkit/themes/osx/global/arrow/arrow-up.gif b/toolkit/themes/osx/global/arrow/arrow-up.gif Binary files differnew file mode 100644 index 0000000000..b8e09b21b8 --- /dev/null +++ b/toolkit/themes/osx/global/arrow/arrow-up.gif diff --git a/toolkit/themes/osx/global/arrow/panelarrow-horizontal.svg b/toolkit/themes/osx/global/arrow/panelarrow-horizontal.svg new file mode 100644 index 0000000000..114fc2e9a4 --- /dev/null +++ b/toolkit/themes/osx/global/arrow/panelarrow-horizontal.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" width="10" height="18"> + <path d="M 10,0 L 0,9 10,18 z" fill="context-stroke"/> + <path d="M 10,1 L 1,9 10,17 z" fill="context-fill"/> +</svg>
\ No newline at end of file diff --git a/toolkit/themes/osx/global/arrow/panelarrow-vertical.svg b/toolkit/themes/osx/global/arrow/panelarrow-vertical.svg new file mode 100644 index 0000000000..3f9c7a02cf --- /dev/null +++ b/toolkit/themes/osx/global/arrow/panelarrow-vertical.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" width="18" height="10"> + <path d="M 0,10 L 9,0 18,10 z" fill="context-stroke"/> + <path d="M 1,10 L 9,1 17,10 z" fill="context-fill"/> +</svg>
\ No newline at end of file diff --git a/toolkit/themes/osx/global/autocomplete.css b/toolkit/themes/osx/global/autocomplete.css new file mode 100644 index 0000000000..87a3d3923a --- /dev/null +++ b/toolkit/themes/osx/global/autocomplete.css @@ -0,0 +1,79 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +html|input[nomatch="true"][highlightnonmatches="true"] { + color: red; +} + +/* ::::: autocomplete popups ::::: */ + +panel[type="autocomplete-richlistbox"] { + padding: 0px !important; + color: FieldText; + background-color: Field; + font: icon; + appearance: none; +} + +/* ::::: richlistbox autocomplete ::::: */ + +.autocomplete-richlistbox { + appearance: none; + margin: 0; +} + +.ac-type-icon { + display: none; + width: 16px; + height: 16px; + max-width: 16px; + max-height: 16px; + margin-inline-start: 6px; + margin-inline-end: 6px; +} + +.ac-site-icon { + display: none; + width: 16px; + height: 16px; + max-width: 16px; + max-height: 16px; + margin-inline-start: 6px; + margin-inline-end: 8px; + list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.svg"); + -moz-context-properties: fill; + fill: currentColor; +} + +.ac-title { + margin-inline-start: 0; + margin-inline-end: 6px; +} + +.ac-separator { + display: none; + margin-inline-start: 0; + margin-inline-end: 6px; +} + +.ac-url { + display: none; +} + +/* Better align the URL with the title. */ +.ac-separator, +.ac-url { + margin-bottom: -2px; +} + +.ac-title-text, +.ac-separator-text, +.ac-url-text, +.ac-text-overflow-container { + padding: 0 !important; + margin: 0 !important; +} diff --git a/toolkit/themes/osx/global/button.css b/toolkit/themes/osx/global/button.css new file mode 100644 index 0000000000..4b0c231576 --- /dev/null +++ b/toolkit/themes/osx/global/button.css @@ -0,0 +1,68 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +button { + /* The horizontal margin used here come from the Aqua Human Interface + Guidelines, there should be 12 pixels between two buttons. */ + margin: 5px 6px 3px; + min-width: 79px; + color: ButtonText; + text-shadow: none; +} + +button:not([disabled="true"]):hover:active { + color: -moz-mac-buttonactivetext; +} + +/* When the window isn't focused, the default button background isn't drawn, + * so don't change the text color then: */ +button[default="true"]:not([disabled="true"], :-moz-window-inactive) { + color: -moz-mac-defaultbuttontext; +} + +/* Likewise, when active (mousedown) but not hovering, the default button + * background isn't drawn, override the previous selector for that case: */ +button[default="true"]:not(:hover):active { + color: ButtonText; +} + +.button-text { + margin-block: 1px; + margin-inline: 3px 2px; + text-align: center; +} + +button[type="default"] { + font: menu; +} + +/* .......... disabled state .......... */ + +button[disabled="true"] { + color: GrayText; +} + +/* ::::: menu buttons ::::: */ + +.button-menu-dropmarker { + display: none; + appearance: none; +} + +/* ::::: plain buttons ::::: */ + +button.plain { + margin: 0 !important; + padding: 0 !important; +} + +/* ::::: help button ::::: */ + +button[dlgtype="help"] { + appearance: auto; + -moz-default-appearance: -moz-mac-help-button; + width: 20px; +} diff --git a/toolkit/themes/osx/global/checkbox.css b/toolkit/themes/osx/global/checkbox.css new file mode 100644 index 0000000000..d569e6f551 --- /dev/null +++ b/toolkit/themes/osx/global/checkbox.css @@ -0,0 +1,39 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +checkbox { + appearance: auto; + -moz-default-appearance: checkbox-container; + -moz-box-align: center; + margin: 4px 2px; +} + +.checkbox-icon { + margin-inline-end: 2px; +} + +.checkbox-label { + margin: 1px 0; +} + +/* ..... disabled state ..... */ + +checkbox[disabled="true"] { + color: GrayText; +} + +/* ::::: checkmark image ::::: */ + +.checkbox-check { + appearance: auto; + -moz-default-appearance: checkbox; + margin: 1px 1px 0; + /* vertical-align tells native theming where to snap to. However, this doesn't + * always work reliably because of bug 503833. */ + vertical-align: top; + width: 1.3em; + height: 1.3em; +} diff --git a/toolkit/themes/osx/global/commonDialog.css b/toolkit/themes/osx/global/commonDialog.css new file mode 100644 index 0000000000..f2ff866b39 --- /dev/null +++ b/toolkit/themes/osx/global/commonDialog.css @@ -0,0 +1,28 @@ +/* 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/. */ + +#commonDialog { + line-height: 13px; +} + +#infoContainer { + max-width: 33em; +} + +#infoIcon { + margin: 3px 5px 4px; + margin-inline-end: 14px; +} + +#infoTitle, +#infoHeader, +#infoBody { + font: menu; + line-height: 16px; + margin-bottom: 6px; +} + +#infoTitle { + font-weight: bold; +} diff --git a/toolkit/themes/osx/global/dialog.css b/toolkit/themes/osx/global/dialog.css new file mode 100644 index 0000000000..26991e62ae --- /dev/null +++ b/toolkit/themes/osx/global/dialog.css @@ -0,0 +1,17 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +:host { + appearance: auto; + -moz-default-appearance: dialog; + padding: 14px; +} + +/* ::::: dialog buttons ::::: */ + +button { + font: menu; +} diff --git a/toolkit/themes/osx/global/dirListing/dirListing.css b/toolkit/themes/osx/global/dirListing/dirListing.css new file mode 100644 index 0000000000..ffa87f7442 --- /dev/null +++ b/toolkit/themes/osx/global/dirListing/dirListing.css @@ -0,0 +1,99 @@ +/* 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/. */ + +:root { + background-color: -moz-dialog; + color: -moz-dialogtext; + font: message-box; + padding-inline: 2em; +} + +body { + border: 1px solid ThreeDShadow; + border-radius: 10px; + padding: 3em; + min-width: 30em; + max-width: 65em; + margin: 4em auto; + background-color: Field; + color: FieldText; +} + +h1 { + font-size: 160%; + margin: 0 0 .6em; + border-bottom: 1px solid ThreeDLightShadow; + font-weight: normal; +} + +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +/* ensure multiple spaces are shown correctly. */ +td:first-child > a { + white-space: pre; +} + +p { + font-size: 110%; +} + +#UI_goUp { + margin-top: 0; + float: inline-start; +} + +#UI_showHidden { + margin-top: 0; + float: inline-end; +} + +table { + clear: both; + width: 90%; + margin: 0 auto; +} + +thead { + font-size: 130%; +} + +/* last modified */ +th:last-child { + text-align: center; +} + +th:hover > a { + text-decoration: underline; +} + +body > table > tbody > tr:hover { + outline: 1px solid ThreeDLightShadow; + -moz-outline-radius: .3em; +} + +/* let 'Size' and 'Last Modified' take only as much space as they need and 'Name' all the rest */ +td:not(:first-child) { + width: 0; +} + +.up { + padding: 0 .5em; + margin-inline-start: 20px; +} + +.up::before { + margin-inline: -20px 4px; + vertical-align: middle; + content: url(chrome://global/skin/dirListing/up.png); +} + +.dir::before { + content: url(chrome://global/skin/dirListing/folder.png); +} diff --git a/toolkit/themes/osx/global/dirListing/folder.png b/toolkit/themes/osx/global/dirListing/folder.png Binary files differnew file mode 100644 index 0000000000..bc9ffe381e --- /dev/null +++ b/toolkit/themes/osx/global/dirListing/folder.png diff --git a/toolkit/themes/osx/global/dirListing/up.png b/toolkit/themes/osx/global/dirListing/up.png Binary files differnew file mode 100644 index 0000000000..dc92992a92 --- /dev/null +++ b/toolkit/themes/osx/global/dirListing/up.png diff --git a/toolkit/themes/osx/global/dropmarker.css b/toolkit/themes/osx/global/dropmarker.css new file mode 100644 index 0000000000..c506c61276 --- /dev/null +++ b/toolkit/themes/osx/global/dropmarker.css @@ -0,0 +1,12 @@ +/* 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/. */ + +:host { + appearance: auto; + -moz-default-appearance: -moz-menulist-arrow-button; + width: 16px; + /* Cut off inheritance for dropmarkers within other widgets where + -moz-image-region might be set for the primary icon. */ + -moz-image-region: auto; +} diff --git a/toolkit/themes/osx/global/findBar.css b/toolkit/themes/osx/global/findBar.css new file mode 100644 index 0000000000..e53c3510b2 --- /dev/null +++ b/toolkit/themes/osx/global/findBar.css @@ -0,0 +1,86 @@ +/* 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/. */ + +%filter substitution +%define findUiDefaultBorderColor rgba(0,0,0,.35) + +%include ../../shared/findBar.inc.css + +findbar { + background-image: linear-gradient(#e8e8e8, #d0d0d0); + border-top-color: #888; +} + +.findbar-container { + padding-inline-start: 2px; +} + +label.findbar-find-fast { + color: #6d6d6d; + margin: 0; + margin-inline-start: 12px; +} + +label.findbar-find-fast:-moz-lwtheme { + color: inherit; +} + +.findbar-closebutton { + margin-inline: 4px 0; + padding-inline: 0 8px; + border: none; + /* make sure the closebutton is displayed as the first element in the bar: */ + -moz-box-ordinal-group: 0; +} + +.findbar-find-next:not(:-moz-lwtheme), +.findbar-find-previous:not(:-moz-lwtheme), +.findbar-button { + border-style: solid; + border-color: @findUiDefaultBorderColor@; + color: black; + background-image: linear-gradient(#f6f6f6, #e9e9e9); +} + +.findbar-button { + appearance: none; + border-width: 1px; + margin-inline-end: 5px; + padding: 2px 9px; + border-radius: 10000px; +} + +.findbar-find-next:-moz-lwtheme, +.findbar-find-previous:-moz-lwtheme { + border-color: var(--lwt-toolbar-field-border-color, @findUiDefaultBorderColor@); +} + +.findbar-find-next:not(:-moz-lwtheme, [disabled]):hover:active, +.findbar-find-previous:not(:-moz-lwtheme, [disabled]):hover:active, +.findbar-button:not([disabled]):hover:active, +.findbar-button:not([disabled])[checked="true"] { + background-image: linear-gradient(#dadada, #dadada); + box-shadow: 0 1px rgba(255,255,255,.4), inset 0 1px 3px rgba(0,0,0,.2); +} + +html|input.findbar-textbox { + border: 1px solid var(--lwt-toolbar-field-border-color, @findUiDefaultBorderColor@); + -moz-context-properties: fill, fill-opacity; + fill: currentColor; + fill-opacity: 0.8; + background-image: url("chrome://global/skin/icons/search-textbox.svg"); + background-repeat: no-repeat; + background-position: 5px center; + margin: 0; + padding-inline-start: 19px; +} + +html|input.findbar-textbox:focus { + box-shadow: 0 0 0 1px var(--toolbar-field-focus-border-color) inset, + 0 0 0 1px var(--toolbar-field-focus-border-color); +} + +html|input.findbar-textbox:-moz-locale-dir(rtl) { + background-position-x: right 5px; +} diff --git a/toolkit/themes/osx/global/global.css b/toolkit/themes/osx/global/global.css new file mode 100644 index 0000000000..c9c70189b9 --- /dev/null +++ b/toolkit/themes/osx/global/global.css @@ -0,0 +1,167 @@ +% 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/. + +%include ../../shared/global.inc.css + +:root { + /* ::::: Variables ::::: */ + --arrowpanel-padding: 16px; + --default-arrowpanel-background: #fff; + --default-arrowpanel-color: hsl(0,0%,10%); + --default-arrowpanel-border-color: hsla(210,4%,10%,.05); + --arrowpanel-background: var(--default-arrowpanel-background); + --arrowpanel-color: var(--default-arrowpanel-color); + --arrowpanel-border-color: var(--default-arrowpanel-border-color); + --arrowpanel-border-radius: 3.5px; + --panel-disabled-color: GrayText; + --panel-description-color: hsl(0,0%,50%); + + --focus-ring-box-shadow: 0 0 0 1px -moz-mac-focusring inset, 0 0 0 1px -moz-mac-focusring; + /* ::::: Styles ::::: */ + appearance: auto; + -moz-default-appearance: dialog; + background-color: #FFFFFF; + color: -moz-DialogText; + font: message-box; +} + +/* ::::: Alert icons :::::*/ + +.message-icon, +.alert-icon, +.error-icon, +.question-icon { + width: 32px; + height: 32px; + margin: 6px; + margin-inline-end: 20px; +} + +.message-icon { + list-style-image: url("chrome://global/skin/icons/info.svg"); +} + +.alert-dialog #infoIcon, +.alert-icon { + list-style-image: url("chrome://global/skin/icons/warning-64.png"); +} + +.error-icon { + list-style-image: url("chrome://global/skin/icons/error-64.png"); +} + +.question-icon { + list-style-image: url("chrome://global/skin/icons/question-64.png"); +} + +/* ::::: iframe ::::: */ + +xul|iframe { + border: none; + width: 100px; + height: 100px; + min-width: 10px; + min-height: 10px; +} + +@supports -moz-bool-pref("layout.css.emulate-moz-box-with-flex") { + /* In emulation, <iframe> is block instead of inline, so reset the width/height */ + xul|iframe { + width: auto; + height: auto; + } +} + +/* ::::: Miscellaneous formatting ::::: */ + +:root:-moz-lwtheme { + appearance: none; +} + +:root[lwtheme-image]:-moz-lwtheme-darktext { + text-shadow: 0 -0.5px 1.5px white; +} + +:root[lwtheme-image]:-moz-lwtheme-brighttext { + text-shadow: 1px 1px 1.5px black; +} + +xul|separator:not([orient="vertical"]) { + height: 1.5em; +} +xul|separator[orient="vertical"] { + width: 1.5em; +} + +xul|separator.thin:not([orient="vertical"]) { + height: 0.5em; +} +xul|separator.thin[orient="vertical"] { + width: 0.5em; +} + +xul|separator.groove:not([orient="vertical"]) { + border-top: 1px solid #A3A3A3; + height: 0; + margin-block: 0.4em; +} +xul|separator.groove[orient="vertical"] { + border-left: 1px solid #A3A3A3; + width: 0; + margin-inline: 0.4em; +} + +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; +} + +.header { + font-weight: bold; +} + +.indent { + margin-inline-start: 23px; +} + +.box-padded { + padding: 5px; +} + +.text-link { + color: -moz-nativehyperlinktext; + cursor: pointer; +} + +.text-link:hover { + text-decoration: underline; +} + +.text-link:-moz-focusring { + box-shadow: var(--focus-ring-box-shadow); +} + +html|input { + margin: 4px; +} + +xul|popupnotificationcontent { + margin-top: .5em; +} + +%include ../../shared/notification-popup.inc.css diff --git a/toolkit/themes/osx/global/icons/blocklist_favicon.png b/toolkit/themes/osx/global/icons/blocklist_favicon.png Binary files differnew file mode 100644 index 0000000000..3849ef8704 --- /dev/null +++ b/toolkit/themes/osx/global/icons/blocklist_favicon.png diff --git a/toolkit/themes/osx/global/icons/error-64.png b/toolkit/themes/osx/global/icons/error-64.png Binary files differnew file mode 100644 index 0000000000..a845928ede --- /dev/null +++ b/toolkit/themes/osx/global/icons/error-64.png diff --git a/toolkit/themes/osx/global/icons/question-64.png b/toolkit/themes/osx/global/icons/question-64.png Binary files differnew file mode 100644 index 0000000000..d2d1bf9477 --- /dev/null +++ b/toolkit/themes/osx/global/icons/question-64.png diff --git a/toolkit/themes/osx/global/icons/search-textbox.svg b/toolkit/themes/osx/global/icons/search-textbox.svg new file mode 100644 index 0000000000..25c30b8c04 --- /dev/null +++ b/toolkit/themes/osx/global/icons/search-textbox.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" width="12" height="12" viewBox="0 0 12 12"> + <path fill="context-fill" fill-opacity="context-fill-opacity" d="M11.354,10.646l-0.707.707L7.295,8A4.483,4.483,0,1,1,9,4.5,4.458,4.458,0,0,1,8,7.295ZM4.5,1A3.5,3.5,0,1,0,8,4.5,3.5,3.5,0,0,0,4.5,1Z"/> +</svg> diff --git a/toolkit/themes/osx/global/icons/sslWarning.png b/toolkit/themes/osx/global/icons/sslWarning.png Binary files differnew file mode 100644 index 0000000000..6ddd429d6e --- /dev/null +++ b/toolkit/themes/osx/global/icons/sslWarning.png diff --git a/toolkit/themes/osx/global/icons/warning-64.png b/toolkit/themes/osx/global/icons/warning-64.png Binary files differnew file mode 100644 index 0000000000..f2a38a6eec --- /dev/null +++ b/toolkit/themes/osx/global/icons/warning-64.png diff --git a/toolkit/themes/osx/global/icons/warning-large.png b/toolkit/themes/osx/global/icons/warning-large.png Binary files differnew file mode 100644 index 0000000000..60b2f65ff5 --- /dev/null +++ b/toolkit/themes/osx/global/icons/warning-large.png diff --git a/toolkit/themes/osx/global/in-content/common.css b/toolkit/themes/osx/global/in-content/common.css new file mode 100644 index 0000000000..4dc76d235c --- /dev/null +++ b/toolkit/themes/osx/global/in-content/common.css @@ -0,0 +1,90 @@ +/* - 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/. */ + +%include ../../../shared/in-content/common.inc.css + +xul|tabs { + padding-inline: 0; + position: static; +} + +xul|tab[visuallyselected] { + color: inherit !important; + text-shadow: none; +} + +xul|button[dlgtype="help"] { + appearance: none; + width: auto; +} + +xul|menulist > xul|menupopup > xul|menuitem[checked="true"]::before, +xul|menulist > xul|menupopup > xul|menuitem[selected="true"]::before { + display: none; +} + +xul|menulist::part(dropmarker) { + display: -moz-box; + margin-block: 1px; +} + +xul|menulist > xul|menupopup xul|menu, +xul|menulist > xul|menupopup xul|menuitem { + padding-inline-end: 34px; +} + +xul|*.help-button > xul|*.button-box > xul|*.button-icon { + margin-inline-start: 0; +} + +xul|*.checkbox-icon, +xul|*.radio-icon { + margin-inline-end: 0; +} + +xul|*.text-link:-moz-focusring { + color: var(--in-content-link-highlight); + text-decoration: underline; + box-shadow: none; +} + +xul|checkbox:-moz-focusring > .checkbox-check, +html|input[type="checkbox"]:-moz-focusring + html|label:before, +xul|radio[focused="true"] > .radio-check, +xul|tab:-moz-focusring > .tab-middle > .tab-text { + outline: 2px solid rgba(0,149,221,0.5); + outline-offset: 1px; + -moz-outline-radius: 2px; +} + +xul|radio[focused="true"] > .radio-check { + -moz-outline-radius: 100%; +} + +xul|search-textbox { + appearance: none; + padding-inline: 8px; +} + +xul|search-textbox::part(search-sign) { + -moz-context-properties: fill, fill-opacity; + fill: currentColor; + fill-opacity: 0.8; + list-style-image: url(chrome://global/skin/icons/search-textbox.svg); + margin-inline-end: 5px; +} + +html|button { + /* XUL button min-width */ + min-width: 79px; +} + +html|input[type="email"], +html|input[type="tel"], +html|input[type="text"], +html|input[type="password"], +html|input[type="number"], +html|textarea { + margin: 4px; +} diff --git a/toolkit/themes/osx/global/in-content/info-pages.css b/toolkit/themes/osx/global/in-content/info-pages.css new file mode 100644 index 0000000000..bdfec2d284 --- /dev/null +++ b/toolkit/themes/osx/global/in-content/info-pages.css @@ -0,0 +1,5 @@ +/* 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/. */ + +%include ../../../shared/in-content/info-pages.inc.css diff --git a/toolkit/themes/osx/global/jar.mn b/toolkit/themes/osx/global/jar.mn new file mode 100644 index 0000000000..bcc52685c1 --- /dev/null +++ b/toolkit/themes/osx/global/jar.mn @@ -0,0 +1,47 @@ +# 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/. + +#include ../../shared/jar.inc.mn + +toolkit.jar: + skin/classic/global/autocomplete.css + skin/classic/global/button.css + skin/classic/global/checkbox.css + skin/classic/global/commonDialog.css + skin/classic/global/dialog.css + skin/classic/global/dropmarker.css +* skin/classic/global/findBar.css +* skin/classic/global/global.css +* skin/classic/global/menu.css + skin/classic/global/menulist.css + skin/classic/global/netError.css + skin/classic/global/popup.css +* skin/classic/global/popupnotification.css + skin/classic/global/radio.css + skin/classic/global/richlistbox.css + skin/classic/global/scrollbars.css (nativescrollbars.css) + skin/classic/global/search-textbox.css + skin/classic/global/splitter.css + skin/classic/global/tabprompts.css + skin/classic/global/tabbox.css + skin/classic/global/toolbar.css + skin/classic/global/toolbarbutton.css + skin/classic/global/tooltip.css +* skin/classic/global/tree.css + skin/classic/global/wizard.css +* skin/classic/global/alerts/alert.css (alerts/alert.css) + skin/classic/global/arrow/panelarrow-horizontal.svg (arrow/panelarrow-horizontal.svg) + skin/classic/global/arrow/panelarrow-vertical.svg (arrow/panelarrow-vertical.svg) + skin/classic/global/dirListing/dirListing.css (dirListing/dirListing.css) + skin/classic/global/dirListing/folder.png (dirListing/folder.png) + skin/classic/global/dirListing/up.png (dirListing/up.png) + skin/classic/global/icons/blocklist_favicon.png (icons/blocklist_favicon.png) + skin/classic/global/icons/search-textbox.svg (icons/search-textbox.svg) + skin/classic/global/icons/warning-64.png (icons/warning-64.png) + skin/classic/global/icons/warning-large.png (icons/warning-large.png) + skin/classic/global/icons/error-64.png (icons/error-64.png) + skin/classic/global/icons/question-64.png (icons/question-64.png) + skin/classic/global/icons/sslWarning.png (icons/sslWarning.png) +* skin/classic/global/in-content/common.css (in-content/common.css) +* skin/classic/global/in-content/info-pages.css (in-content/info-pages.css) diff --git a/toolkit/themes/osx/global/menu.css b/toolkit/themes/osx/global/menu.css new file mode 100644 index 0000000000..efd610f9d9 --- /dev/null +++ b/toolkit/themes/osx/global/menu.css @@ -0,0 +1,172 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +menu, +menuitem, +menucaption { + appearance: auto; + -moz-default-appearance: menuitem; + -moz-font-smoothing-background-color: -moz-mac-menuitem; + -moz-box-align: center; + list-style-image: none; + -moz-image-region: auto; + padding: 0 21px 2px; +} + +menu[disabled="true"], menuitem[disabled="true"], +menu[_moz-menuactive="true"][disabled="true"], +menuitem[_moz-menuactive="true"][disabled="true"] { + color: -moz-mac-menutextdisable; + -moz-font-smoothing-background-color: -moz-mac-menuitem; +} + +menuitem[default="true"], +menuitem.spell-suggestion, +menucaption { + font-weight: bold; +} + +/* Internal content */ + +.menu-text, +.menu-iconic-text, +.menu-accel, +.menu-iconic-accel { + margin: 0 !important; +} + +.menu-iconic-icon { + height: 16px; + margin-block: -2px; + margin-inline-end: 5px; + /* Empty icons shouldn't take up room, so we need to compensate + * the 5px margin-end with a negative margin-start. + */ + margin-inline-start: -5px; +} + +/* menuitems with icons */ +.menuitem-iconic, +.menu-iconic, +menuitem[image] { + /* 2px higher than those without icons */ + padding-block: 1px 3px; +} + +.menuitem-iconic > .menu-iconic-left > .menu-iconic-icon, +.menu-iconic > .menu-iconic-left > .menu-iconic-icon, +menuitem[image] > .menu-iconic-left > .menu-iconic-icon { + margin-inline-start: 0; + width: 16px; +} + +/* menu arrow box */ + +.menu-right, +.menu-accel-container { + margin-inline: 21px -9px; + -moz-box-pack: end; +} + +.menu-right { + list-style-image: none; + appearance: auto; + -moz-default-appearance: menuarrow; +} + +/* menu/menuitems in menubar */ + +menubar > menu { + appearance: none; + padding-block: 2px; + padding-inline: 7px 5px; + margin: 1px 0; +} + +menubar > menu[_moz-menuactive="true"] { + color: inherit; + background-color: transparent; +} + +menubar > menu[_moz-menuactive="true"][open="true"] { + appearance: auto; + -moz-default-appearance: menuitem; + -moz-font-smoothing-background-color: -moz-mac-active-menuitem; + color: -moz-mac-menutextselect; +} + +/* Internal content */ + +.menubar-left { + margin: 0 2px; +} + +.menubar-text { + margin: 0 1px !important; +} + +/* menu/menuitems in popups */ + +menupopup { + font: -moz-pull-down-menu; +} + +menupopup > menu, +menupopup > menuitem, +menupopup > menucaption { + max-width: 42em; +} + +menu[_moz-menuactive="true"], +menuitem[_moz-menuactive="true"] { + -moz-font-smoothing-background-color: -moz-mac-active-menuitem; + color: -moz-mac-menutextselect; + background-color: Highlight; +} + +menuitem[customoptionstyling="true"] { + appearance: none; +} + +/* menu/menuitems in menulist popups */ + +menulist > menupopup { + font: inherit; +} + +menulist > menupopup > menuitem, +menulist > menupopup > menucaption, +menulist > menupopup > menu { + max-width: none; + color: FieldText; +} + +/* checked menuitems */ + +:not(menulist) > menupopup > menuitem[checked="true"], +:not(menulist) > menupopup > menuitem[selected="true"] { + appearance: auto; + -moz-default-appearance: checkmenuitem; +} + +menulist > menupopup > menuitem[checked="true"]::before, +menulist > menupopup > menuitem[selected="true"]::before { + content: '\2713'; /* a checkmark */ + display: block; + width: 15px; + margin-inline-start: -15px; +} + +/* menuseparator */ + +menuseparator { + appearance: auto; + -moz-default-appearance: menuseparator; + margin: 5px 0; + padding: 1px 0; +} + +%include ../../shared/menu-scrolling.inc.css diff --git a/toolkit/themes/osx/global/menulist.css b/toolkit/themes/osx/global/menulist.css new file mode 100644 index 0000000000..98133a8a0b --- /dev/null +++ b/toolkit/themes/osx/global/menulist.css @@ -0,0 +1,49 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +:host { + appearance: auto; + -moz-default-appearance: menulist; + margin: 5px 2px 3px; + min-height: 20px; + color: -moz-DialogText; + text-shadow: none; +} + +:host([disabled="true"]) { + color: GrayText; +} + +:host([disabled="true"]) > dropmarker { + padding-inline-start: 7px !important; +} + +/* Label box */ + +#label-box { + appearance: auto; + -moz-default-appearance: menulist-text; + -moz-box-align: center; + -moz-box-pack: center; + margin-bottom: 1px; +} + +/* Labels */ + +label { + margin: 1px 3px !important; +} + +#highlightable-label:not([highlightable="true"]), +#label[highlightable="true"] { + display: none; +} + +/* Dropmarker */ + +dropmarker { + display: none; +} diff --git a/toolkit/themes/osx/global/moz.build b/toolkit/themes/osx/global/moz.build new file mode 100644 index 0000000000..d988c0ff9b --- /dev/null +++ b/toolkit/themes/osx/global/moz.build @@ -0,0 +1,7 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# vim: set filetype=python: +# 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/. + +JAR_MANIFESTS += ["jar.mn"] diff --git a/toolkit/themes/osx/global/nativescrollbars.css b/toolkit/themes/osx/global/nativescrollbars.css new file mode 100644 index 0000000000..d8f5a78e1d --- /dev/null +++ b/toolkit/themes/osx/global/nativescrollbars.css @@ -0,0 +1,93 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +scrollbar { + appearance: auto; + -moz-default-appearance: scrollbar-horizontal; + cursor: default; + background-color: white; +} + +scrollbar[root="true"] { + position: relative; + z-index: 2147483647; /* largest positive value of a signed 32-bit integer */ +} + +html|select[size]:not([size="0"], [size="1"]), +html|select[multiple] { + scrollbar-width: thin; +} + +@media all and (-moz-overlay-scrollbars) { + scrollbar:not([active="true"]), + scrollbar[disabled="true"] { + visibility: hidden; + } +} + +scrollbar[orient="vertical"] { + appearance: auto; + -moz-default-appearance: scrollbar-vertical; +} + +/* ..... track ..... */ + +slider { + appearance: auto; + -moz-default-appearance: scrollbartrack-horizontal; +} + +slider[orient="vertical"] { + appearance: auto; + -moz-default-appearance: scrollbartrack-vertical; +} + +/* ..... thumb ..... */ + +thumb[orient="vertical"] { + appearance: auto; + -moz-default-appearance: scrollbarthumb-vertical; +} + +thumb[orient="horizontal"] { + appearance: auto; + -moz-default-appearance: scrollbarthumb-horizontal; +} + +/* ..... increment ..... */ + +scrollbarbutton[type="increment"] { + appearance: auto; + -moz-default-appearance: scrollbarbutton-right; +} + +scrollbar[orient="vertical"] > scrollbarbutton[type="increment"] { + appearance: auto; + -moz-default-appearance: scrollbarbutton-down; +} + +/* ..... decrement ..... */ + +scrollbarbutton[type="decrement"] { + appearance: auto; + -moz-default-appearance: scrollbarbutton-left; +} + +scrollbar[orient="vertical"] > scrollbarbutton[type="decrement"] { + appearance: auto; + -moz-default-appearance: scrollbarbutton-up; +} + +/* ::::: square at the corner of two scrollbars ::::: */ + +scrollcorner { + appearance: auto; + -moz-default-appearance: scrollcorner; + width: 16px; + cursor: default; + background-color: white; +} diff --git a/toolkit/themes/osx/global/netError.css b/toolkit/themes/osx/global/netError.css new file mode 100644 index 0000000000..f5fa76a3bb --- /dev/null +++ b/toolkit/themes/osx/global/netError.css @@ -0,0 +1,103 @@ +/* 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/. */ + +/* + * This defines the look-and-feel styling of the error pages. + * (see: netError.xhtml) + * + * Original styling by William Price <bugzilla@mob.rice.edu> + * Updated by: Steven Garrity <steven@silverorange.com> + * Henrik Skupin <mozilla@hskupin.info> + */ + +html { + background: -moz-Dialog; +} + +body { + margin: 0; + padding: 0 1em; + color: FieldText; + font: message-box; +} + +h1 { + margin: 0 0 .6em 0; + border-bottom: 1px solid ThreeDLightShadow; + font-size: 160%; +} + +ul, ol { + margin: 0; + margin-inline-start: 1.5em; + padding: 0; +} + +ul > li, +ol > li { + margin-bottom: .5em; +} + +ul { + list-style: square; +} + +#errorPageContainer { + position: relative; + min-width: 13em; + max-width: 52em; + margin: 4em auto; + border: 1px solid ThreeDShadow; + border-radius: 10px; + padding: 3em; + padding-inline-start: 30px; + background: url("chrome://global/skin/icons/warning-large.png") left 0 no-repeat Field; + background-origin: content-box; +} + +#errorPageContainer.certerror { + background-image: url("chrome://global/skin/icons/sslWarning.png"); +} + +#errorPageContainer:dir(rtl) { + background-position: right 0; +} + +#errorLongContent, +#errorTitle { + margin-inline-start: 80px; +} + +#errorShortDesc > p { + overflow: auto; + border-bottom: 1px solid ThreeDLightShadow; + padding-bottom: 1em; + font-size: 130%; + white-space: pre-wrap; +} + +#errorLongDesc { + padding-inline-end: 3em; + font-size: 110%; +} + +#errorTryAgain { + margin-top: 2em; + margin-inline-start: 80px; +} + +#errorContainer { + display: none; +} + +#securityOverrideDiv { + padding-top: 10px; +} + +#securityOverrideContent { + background-color: #FFF090; /* Pale yellow */ + padding: 10px; + border-radius: 10px; + display: none; +} diff --git a/toolkit/themes/osx/global/popup.css b/toolkit/themes/osx/global/popup.css new file mode 100644 index 0000000000..0888d8647b --- /dev/null +++ b/toolkit/themes/osx/global/popup.css @@ -0,0 +1,117 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +menupopup, +panel { + appearance: auto; + -moz-default-appearance: menupopup; + -moz-font-smoothing-background-color: -moz-mac-menupopup; + background-color: Menu; + color: MenuText; +} + +menupopup > menu > menupopup { + margin-top: -4px; +} + +.menupopup-arrowscrollbox { + padding: 4px 0; +} + +panel[titlebar] { + appearance: none; /* to disable rounded corners */ +} + +panel[type="arrow"] { + appearance: none; + background: transparent; +} + +panel[type="arrow"][side="top"], +panel[type="arrow"][side="bottom"] { + margin-inline: -25px; +} + +panel[type="arrow"][side="left"], +panel[type="arrow"][side="right"] { + margin-block: -25px; +} + +.panel-arrowcontent { + appearance: none; + -moz-font-smoothing-background-color: var(--arrowpanel-background); + background: var(--arrowpanel-background); + border-radius: var(--arrowpanel-border-radius); + box-shadow: 0 0 0 1px var(--arrowpanel-border-color); + color: var(--arrowpanel-color); + border: none; + padding: var(--arrowpanel-padding); + margin: 1px; +} + +.panel-arrowcontent > html|slot { + /* propagate border-radius from arrowcontent to slotted children */ + border-radius: inherit; +} + +:host([orient=vertical]) .panel-arrowcontent { + -moz-box-orient: vertical; +} + +panel[type="arrow"].panel-no-padding::part(arrowcontent) { + padding: 0; + overflow: hidden; /* Don't let panel content overflow the border-radius */ +} + +:is(panel, menupopup)::part(arrow) { + -moz-context-properties: fill, stroke; + fill: var(--arrowpanel-background); + stroke: var(--arrowpanel-border-color); +} + +:is(panel, menupopup)[side="top"]::part(arrow) { + list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg"); + margin-inline: 16px; + margin-bottom: -1px; +} + +:is(panel, menupopup)[side="bottom"]::part(arrow) { + list-style-image: url("chrome://global/skin/arrow/panelarrow-vertical.svg"); + -moz-transform: scaleY(-1); + margin-inline: 16px; + margin-top: -1px; +} + +:is(panel, menupopup)[side="left"]::part(arrow) { + list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg"); + margin-block: 16px; + margin-right: -1px; +} + +:is(panel, menupopup)[side="right"]::part(arrow) { + list-style-image: url("chrome://global/skin/arrow/panelarrow-horizontal.svg"); + transform: scaleX(-1); + margin-block: 16px; + margin-left: -1px; +} + +/* rules for popups associated with menulists */ + +menulist > menupopup { + min-width: 0; + padding: 4px 0; +} + +menulist > menupopup:not([position]) { + margin-inline-start: -13px; + margin-top: -2px; +} + +menupopup[customoptionstyling="true"] { + appearance: none; + padding-block: 0; +} diff --git a/toolkit/themes/osx/global/popupnotification.css b/toolkit/themes/osx/global/popupnotification.css new file mode 100644 index 0000000000..06908b1033 --- /dev/null +++ b/toolkit/themes/osx/global/popupnotification.css @@ -0,0 +1,10 @@ +%if 0 +/* 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/. */ +%endif +%include ../../shared/popupnotification.inc.css + +.popup-notification-secondary-button:not([hidden="true"]) ~ .popup-notification-primary-button:not([default]) { + border-inline-start: 1px solid var(--panel-separator-color); +} diff --git a/toolkit/themes/osx/global/radio.css b/toolkit/themes/osx/global/radio.css new file mode 100644 index 0000000000..2b291773ac --- /dev/null +++ b/toolkit/themes/osx/global/radio.css @@ -0,0 +1,37 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +.radio-label, +radiogroup { + margin: 1px 0; +} + +radio { + appearance: auto; + -moz-default-appearance: radio-container; + -moz-box-align: center; + margin: 4px 2px; + -moz-user-focus: ignore; +} + +.radio-icon { + margin-inline-end: 2px; +} + +radio[disabled="true"] { + color: GrayText; +} + +.radio-check { + appearance: auto; + -moz-default-appearance: radio; + margin: 0 1px 1px; + /* vertical-align tells native theming where to snap to. However, this doesn't + * always work reliably because of bug 503833. */ + vertical-align: bottom; + width: 1.3em; + height: 1.3em; +} diff --git a/toolkit/themes/osx/global/richlistbox.css b/toolkit/themes/osx/global/richlistbox.css new file mode 100644 index 0000000000..50b37c1821 --- /dev/null +++ b/toolkit/themes/osx/global/richlistbox.css @@ -0,0 +1,47 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +richlistbox { + appearance: auto; + -moz-default-appearance: listbox; + margin: 2px 4px; + background-color: Field; + color: FieldText; + overflow: auto; +} + +richlistbox[disabled="true"] { + color: GrayText; +} + +richlistitem[selected="true"] { + background-color: -moz-Dialog; + color: -moz-DialogText; +} + +richlistbox:focus > richlistitem[selected="true"] { + background-color: Highlight; + color: HighlightText; +} + +richlistbox.theme-listbox > richlistitem { + border: 1px solid transparent; +} + +richlistbox.theme-listbox:not(:focus) > richlistitem[selected="true"] { + background-color: -moz-mac-secondaryhighlight; +} + +richlistbox.theme-listbox > richlistitem > label { + margin: 0px; + padding-bottom: 1px; + padding-inline-start: 4px; + white-space: nowrap; +} + +listheader { + color: -moz-DialogText; +} diff --git a/toolkit/themes/osx/global/search-textbox.css b/toolkit/themes/osx/global/search-textbox.css new file mode 100644 index 0000000000..634a05b46c --- /dev/null +++ b/toolkit/themes/osx/global/search-textbox.css @@ -0,0 +1,57 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); +@namespace html url("http://www.w3.org/1999/xhtml"); + +:host { + appearance: auto; + -moz-default-appearance: searchfield; + font-size: 12px; + cursor: text; + margin: 4px; /* matches <input> global.css margin */ + padding: 1px; + background-color: Field; + color: FieldText; +} + +html|input { + border: none; + padding: 0 1px; + background-color: transparent; + outline: none; + color: inherit; + font: inherit; + text-shadow: inherit; + box-sizing: border-box; + -moz-box-flex: 1; + text-align: inherit; +} + +:host([readonly="true"]) { + background-color: -moz-Dialog; + color: -moz-DialogText; +} + +:host([disabled="true"]) { + cursor: default; + background-color: -moz-Dialog; + color: GrayText; +} + +/* ::::: icons ::::: */ + +.textbox-search-clear { + list-style-image: url(chrome://global/skin/icons/searchfield-cancel.svg); + margin-bottom: 1px; +} + +.textbox-search-clear:not([disabled]) { + cursor: default; +} + +/* Don't leave extra blank space with long placeholders (see bug 1385902) */ +.textbox-search-icons:not([selectedIndex="1"]) { + display: none; +} diff --git a/toolkit/themes/osx/global/splitter.css b/toolkit/themes/osx/global/splitter.css new file mode 100644 index 0000000000..8a9680851c --- /dev/null +++ b/toolkit/themes/osx/global/splitter.css @@ -0,0 +1,52 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +/* ::::: splitter (vertical) ::::: */ + +splitter { + -moz-box-align: center; + -moz-box-pack: center; + cursor: ew-resize; + min-width: 9px; + min-height: 9px; +} + +splitter[state="collapsed"][collapse="before"], +splitter[state="collapsed"][substate="before"], +splitter[state="collapsed"][collapse="after"]:-moz-locale-dir(rtl), +splitter[state="collapsed"][substate="after"]:-moz-locale-dir(rtl) { + cursor: e-resize; +} + +splitter[state="collapsed"][collapse="after"], +splitter[state="collapsed"][substate="after"], +splitter[state="collapsed"][collapse="before"]:-moz-locale-dir(rtl), +splitter[state="collapsed"][substate="before"]:-moz-locale-dir(rtl) { + cursor: w-resize; +} + +/* ::::: splitter (horizontal) ::::: */ + +splitter[orient="vertical"] { + cursor: ns-resize; + min-width: 0px; + min-height: 9px; + min-width: 9px; +} + +splitter[orient="vertical"][state="collapsed"][collapse="before"], +splitter[orient="vertical"][state="collapsed"][substate="before"] { + cursor: s-resize; +} + +splitter[orient="vertical"][state="collapsed"][collapse="after"], +splitter[orient="vertical"][state="collapsed"][substate="after"] { + cursor: n-resize; +} + +splitter[disabled="true"] { + cursor: default !important; +} diff --git a/toolkit/themes/osx/global/tabbox.css b/toolkit/themes/osx/global/tabbox.css new file mode 100644 index 0000000000..5bcd641d64 --- /dev/null +++ b/toolkit/themes/osx/global/tabbox.css @@ -0,0 +1,61 @@ +/* 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/. */ + +/* + The default style of these tabs is that of an NSTabView with tabs at + the top in the "regular" size. These tabs can be used with or without + a tabbox element. +*/ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +tabbox { + margin: 0 5px; +} + +tabpanels { + appearance: auto; + -moz-default-appearance: tabpanels; + padding: 33px 15px 15px; +} + +tabs { + -moz-box-align: center; + font: menu; + padding: 0 10px; + margin-bottom: -12px; + position: relative; +} + +tab { + appearance: auto; + -moz-default-appearance: tab; + padding-top: 1px; +} + +tab:-moz-focusring { + /* Tab focus rings need to overlay adjacent tabs. */ + position: relative; +} + +tab:first-of-type { + padding-inline-start: 2px; +} + +tab:last-of-type { + padding-inline-end: 2px; +} + +tab[visuallyselected="true"]:not(:-moz-window-inactive) { + color: #FFF; +} + +.tab-middle { + padding: 1px 6px 2px; +} + +.tabs-left, +.tabs-right { + -moz-box-flex: 1; +} diff --git a/toolkit/themes/osx/global/tabprompts.css b/toolkit/themes/osx/global/tabprompts.css new file mode 100644 index 0000000000..8e6164c389 --- /dev/null +++ b/toolkit/themes/osx/global/tabprompts.css @@ -0,0 +1,63 @@ +/* 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/. */ + +/* Tab Modal Prompt boxes */ +.tabModalBackground, +tabmodalprompt { + background-color: hsla(0,0%,10%,.5); +} + +tabmodalprompt { + font-family: sans-serif; /* use content font not system UI font */ + font-size: 110%; +} + +.paymentDialogContainerFrame, +.tabmodalprompt-mainContainer { + color: black; + background-color: hsla(0,0%,100%,.95); + background-clip: padding-box; + border-radius: 2px; + border: 1px solid hsla(0,0%,0%,.5); +} + +.tabmodalprompt-buttonContainer { + background-color: hsla(0,0%,0%,.05); + border-top: 1px solid hsla(0,0%,0%,.05); +} + +.tabmodalprompt-buttonContainer > button { + appearance: none; + padding: 2px 0; + margin: 0; + margin-inline-start: 8px; + border-radius: 2px; + color: black !important; + background-color: hsl(0,0%,90%); + background-image: linear-gradient(hsla(0,0%,100%,.7), transparent); + background-clip: padding-box; + border: 1px solid; + border-color: hsl(0,0%,65%) hsl(0,0%,60%) hsl(0,0%,50%); + box-shadow: 0 1px 0 hsla(0,0%,100%,.9) inset, + 0 1px 2px hsla(0,0%,0%,.1); +} + +.tabmodalprompt-buttonContainer > button[default=true] { + background-color: hsl(0,0%,79%); +} + +.tabmodalprompt-buttonContainer > button:hover { + background-color: hsl(0,0%,96%); +} + +.tabmodalprompt-buttonContainer > button:hover:active { + background-image: linear-gradient(hsla(0,0%,100%,.2), transparent); + background-color: hsl(0,0%,70%); + box-shadow: 0 1px 0 hsla(0,0%,100%,.2) inset, + 0 1px 3px hsla(0,0%,0%,.2); +} + +.tabmodalprompt-buttonContainer > button:focus { + box-shadow: var(--focus-ring-box-shadow) +} diff --git a/toolkit/themes/osx/global/toolbar.css b/toolkit/themes/osx/global/toolbar.css new file mode 100644 index 0000000000..0a60ae57d9 --- /dev/null +++ b/toolkit/themes/osx/global/toolbar.css @@ -0,0 +1,52 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +toolbox { + /* Setting -moz-default-appearance:toolbox causes sheets to attach under the + * toolbox and has no other effects. It doesn't render anything. */ + appearance: auto; + -moz-default-appearance: toolbox; +} + +toolbar { + min-width: 1px; + min-height: 20px; + appearance: auto; + -moz-default-appearance: toolbar; +} + +toolbar:-moz-lwtheme { + appearance: none; +} + +toolbarseparator { + appearance: auto; + -moz-default-appearance: separator; + margin: 3px 4px; +} + +toolbarpaletteitem { + cursor: grab; +} + +toolbarspacer { + min-width: 24px !important; +} + +/* Drag and drop feedback */ + +toolbarpaletteitem[place="toolbar"] { + margin-inline: -2px; + border-inline: 2px solid transparent; +} + +toolbarpaletteitem[dragover="left"] { + border-left-color: #000000; +} + +toolbarpaletteitem[dragover="right"] { + border-right-color: #000000; +} diff --git a/toolkit/themes/osx/global/toolbarbutton.css b/toolkit/themes/osx/global/toolbarbutton.css new file mode 100644 index 0000000000..90c346456e --- /dev/null +++ b/toolkit/themes/osx/global/toolbarbutton.css @@ -0,0 +1,66 @@ +/* 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/. */ + +toolbarbutton { + -moz-box-align: center; + -moz-box-pack: center; + margin: 0 2px; + padding: 3px 2px; + background-color: transparent; +} + +.toolbarbutton-text { + margin: 0; + padding: 0; + text-align: center; + vertical-align: middle; +} + +toolbarbutton[disabled="true"] { + color: -moz-mac-disabledtoolbartext; +} + +/* ::::: toolbarbutton menu ::::: */ + +.toolbarbutton-menu-dropmarker, +.toolbarbutton-combined-buttons-dropmarker { + appearance: none; + list-style-image: url("chrome://global/skin/icons/arrow-dropdown-12.svg"); + -moz-context-properties: fill; + fill: currentColor; + width: auto; +} + +/* ::::: toolbarbutton badged ::::: */ + +.toolbarbutton-badge { + box-sizing: border-box; + overflow: hidden; + white-space: nowrap; + background-color: #d90000; + font-size: 9px; + padding: 1px 2px; + color: #fff; + text-shadow: none; + border-radius: 2px; + box-shadow: 0 1px 0 hsla(0, 100%, 100%, .2) inset, + 0 -1px 0 hsla(0, 0%, 0%, .1) inset, + 0 1px 0 hsla(206, 50%, 10%, .2); + margin: -6px 0 0 !important; + margin-inline-end: -6px !important; + min-width: 14px; + max-width: 24px; + line-height: 10px; + text-align: center; + align-self: start; + justify-self: end; +} + +toolbar[mode="icons"] > *|* > .toolbarbutton-badge { + margin-inline-end: -10px !important; +} + +toolbarbutton.tabbable { + -moz-user-focus: normal !important; +} diff --git a/toolkit/themes/osx/global/tooltip.css b/toolkit/themes/osx/global/tooltip.css new file mode 100644 index 0000000000..49d9de9de4 --- /dev/null +++ b/toolkit/themes/osx/global/tooltip.css @@ -0,0 +1,22 @@ +/* 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/. */ + +/* + * This file is imported as a UA stylesheet because the default tooltip is + * built as native anonymous content. + */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +tooltip { + appearance: auto; + -moz-default-appearance: tooltip; + -moz-font-smoothing-background-color: -moz-mac-tooltip; + margin-top: 18px; + padding: 2px 3px; + max-width: 40em; + color: InfoText; + font: message-box; + cursor: default; +} diff --git a/toolkit/themes/osx/global/tree.css b/toolkit/themes/osx/global/tree.css new file mode 100644 index 0000000000..4c63dfbd26 --- /dev/null +++ b/toolkit/themes/osx/global/tree.css @@ -0,0 +1,14 @@ +/* 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/. */ + +%include ../../shared/tree.inc.css + + +/* ::::: editable tree ::::: */ + +html|input.tree-input { + appearance: none; + border-width: 0; + box-shadow: var(--focus-ring-box-shadow); +} diff --git a/toolkit/themes/osx/global/wizard.css b/toolkit/themes/osx/global/wizard.css new file mode 100644 index 0000000000..77ed1f6f4e --- /dev/null +++ b/toolkit/themes/osx/global/wizard.css @@ -0,0 +1,59 @@ +/* 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/. */ + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +:host { + padding: 14px; +} + +.wizard-header { + appearance: auto; + -moz-default-appearance: dialog; +} + +.wizard-header-box-1 { + color: #000; +} + +.wizard-header-box-text { + padding: 6px 10px; + font: menu; + font-weight: bold; +} + +.wizard-header-label { + margin-inline-start: 23px; + font-weight: bold; +} + +.wizard-header-box-icon { + margin-block: 3px 0; + margin-inline: 3px 20px; +} + +:host([data-branded="true"]) .wizard-header-icon { + list-style-image: url("chrome://branding/content/icon128.png"); + width: 48px; + height: 48px; +} + +.wizard-page-box { + padding: 15px 23px; + appearance: auto; + -moz-default-appearance: dialog; +} + +.wizard-buttons-separator { + margin: 0 !important; + border-bottom: 1px solid #fff !important; +} + +.wizard-buttons-btm { + padding: 3px 6px 6px; +} + +.wizard-button { + font: menu !important; +} diff --git a/toolkit/themes/osx/moz.build b/toolkit/themes/osx/moz.build new file mode 100644 index 0000000000..096017b685 --- /dev/null +++ b/toolkit/themes/osx/moz.build @@ -0,0 +1,7 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# vim: set filetype=python: +# 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/. + +DIRS += ["global", "mozapps"] diff --git a/toolkit/themes/osx/mozapps/downloads/unknownContentType.css b/toolkit/themes/osx/mozapps/downloads/unknownContentType.css new file mode 100644 index 0000000000..767d5934df --- /dev/null +++ b/toolkit/themes/osx/mozapps/downloads/unknownContentType.css @@ -0,0 +1,27 @@ +/* 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/. */ + +#unknownContentType { + font: menu; +} + +description { + font-weight: bold; +} + +#contentTypeImage { + margin-inline-end: 3px; + width: 16px; +} + +#type { + -moz-box-flex: 1; + background-color: transparent; + color: inherit; +} + +#container > .small-indent, +.small-indent label { + margin-inline-start: 0; +} diff --git a/toolkit/themes/osx/mozapps/extensions/blocklist.css b/toolkit/themes/osx/mozapps/extensions/blocklist.css new file mode 100644 index 0000000000..02f6e1d494 --- /dev/null +++ b/toolkit/themes/osx/mozapps/extensions/blocklist.css @@ -0,0 +1,20 @@ +/* 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/. */ + +richlistitem { + padding-top: 6px; + padding-bottom: 6px; + padding-inline-start: 7px; + padding-inline-end: 7px; + border-bottom: 1px solid #C0C0C0; +} + +.addon-name-version { + font-size: 110%; +} + +.blockedLabel { + font-weight: bold; + font-style: italic; +} diff --git a/toolkit/themes/osx/mozapps/handling/handling.css b/toolkit/themes/osx/mozapps/handling/handling.css new file mode 100644 index 0000000000..8aa9db58b8 --- /dev/null +++ b/toolkit/themes/osx/mozapps/handling/handling.css @@ -0,0 +1,25 @@ +/* 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/. */ + +richlistitem[type] { + min-height: 36px; /* Don't forget to update the richlistbox height! */ + padding-inline-start: 2px; + } + +richlistitem { + -moz-box-align: center; +} + +richlistbox { + /* 3 items high, plus 4px for top and bottom margins, less 2px for border */ + min-height: 110px; +} + +.name { + font-weight: bold; +} + +.description { + color: GrayText; +} diff --git a/toolkit/themes/osx/mozapps/jar.mn b/toolkit/themes/osx/mozapps/jar.mn new file mode 100644 index 0000000000..0818a08355 --- /dev/null +++ b/toolkit/themes/osx/mozapps/jar.mn @@ -0,0 +1,11 @@ +# 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/. + +toolkit.jar: +#include ../../shared/mozapps.inc.mn + skin/classic/mozapps/downloads/unknownContentType.css (downloads/unknownContentType.css) + skin/classic/mozapps/extensions/blocklist.css (extensions/blocklist.css) + skin/classic/mozapps/profile/profileSelection.css (profile/profileSelection.css) + skin/classic/mozapps/update/updates.css (update/updates.css) + skin/classic/mozapps/handling/handling.css (handling/handling.css) diff --git a/toolkit/themes/osx/mozapps/moz.build b/toolkit/themes/osx/mozapps/moz.build new file mode 100644 index 0000000000..d988c0ff9b --- /dev/null +++ b/toolkit/themes/osx/mozapps/moz.build @@ -0,0 +1,7 @@ +# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*- +# vim: set filetype=python: +# 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/. + +JAR_MANIFESTS += ["jar.mn"] diff --git a/toolkit/themes/osx/mozapps/profile/profileSelection.css b/toolkit/themes/osx/mozapps/profile/profileSelection.css new file mode 100644 index 0000000000..f18c245174 --- /dev/null +++ b/toolkit/themes/osx/mozapps/profile/profileSelection.css @@ -0,0 +1,20 @@ +/* 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/. */ + + +@import url("chrome://global/skin/global.css"); + +@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +box#managebuttons > button { + min-width: 8em; +} + +#managebuttons { + padding-top: 1em; +} + +#profiles { + height: 12em; +} diff --git a/toolkit/themes/osx/mozapps/update/updates.css b/toolkit/themes/osx/mozapps/update/updates.css new file mode 100644 index 0000000000..eee3db4450 --- /dev/null +++ b/toolkit/themes/osx/mozapps/update/updates.css @@ -0,0 +1,104 @@ +/* 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/. */ + +/* Elevation Dialog */ +/* Specify the size for the UI so it has a fixed size. 3rd + party themes should typically specify the same values. */ +#elevationBox, .update-content { + height: 360px; + width: 700px; +} + +/* Remove margin and padding so the inner UI will extend to the edge of the + window. 3rd party themes should typically specify the same values. */ +#updates { + margin: 0; + padding: 0; +} + +.update-header { + appearance: auto; + -moz-default-appearance: dialog; + margin: 12px 12px 0 12px; +} + +.update-header-box-1 { + color: #000; +} + +.update-header-box-text { + margin: 0; + padding: 0; + font: menu; + font-weight: bold; +} + +.update-header-label { + font-weight: bold; +} + +.update-content { + padding: 6px 12px 12px 12px; +} + +.update-buttons-separator { + display: none; +} + +#update-button-box { + padding: 10px 12px 12px 12px; + appearance: auto; + -moz-default-appearance: statusbar; + -moz-window-dragging: drag; +} + +#update-button-box button { + appearance: auto; + -moz-default-appearance: toolbarbutton; + color: ButtonText; + min-height: 22px; +} + +#updateFinishedName { + font-weight: bold; + font-size: larger; +} + +/* Update History Window */ +update { + border-bottom: 1px dotted #C0C0C0; +} + +.update-name { + font-weight: bold; +} + +.update-label-column { + -moz-box-align: end; +} + +.update-type { + font-weight: bold; + color: #990000; +} + +.update-status-value, +.update-installedOn-value { + margin-inline-start: 1ch; +} + +#historyItems { + height: 200px; + margin: 1px 5px 5px 5px; +} + +#historyItems .update { + padding: 5px; + display: -moz-box; + -moz-box-orient: vertical; +} + +.update-name { + -moz-box-flex: 1; +} diff --git a/toolkit/themes/osx/mozapps/viewsource/viewsource.css b/toolkit/themes/osx/mozapps/viewsource/viewsource.css new file mode 100644 index 0000000000..76c7d00b9d --- /dev/null +++ b/toolkit/themes/osx/mozapps/viewsource/viewsource.css @@ -0,0 +1,5 @@ +/* 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/. */ + +/* This is for styling the menus of the viewsource window */ diff --git a/toolkit/themes/osx/reftests/482681-ref.xhtml b/toolkit/themes/osx/reftests/482681-ref.xhtml new file mode 100644 index 0000000000..62fb4bb8d5 --- /dev/null +++ b/toolkit/themes/osx/reftests/482681-ref.xhtml @@ -0,0 +1,21 @@ +<?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/baseline.xhtml b/toolkit/themes/osx/reftests/baseline.xhtml new file mode 100644 index 0000000000..4f65ffed41 --- /dev/null +++ b/toolkit/themes/osx/reftests/baseline.xhtml @@ -0,0 +1,161 @@ +<?xml version="1.0"?> +<?xml-stylesheet href="chrome://global/skin" type="text/css"?> + +<!-- + * This is a complicated test. + * XUL authors like to place several different widgets on the same line by + * putting them in a <hbox align="center">. In order for this to look good, + * the baselines of the text contained in the widgets should line up. + * This is what this test is testing. + * The test passes if it's completely white. + * + * It works like this: + * For every combination of two different widgets (where widget is one of + * label, radio, checkbox, button, menulist) + * there's a stack with two layers. The back layer in the stack is + * just a vertically centered label with a bunch of underscores. This is the + * baseline that the text on the widgets should hit. + * On the foreground layer in the stack we've placed the pair of widgets we're + * testing. They also have underscores in their labels. + * + * Now we want to test whether the underscores in the foreground layer are directly + * on top of those in the back layer. For that we use color-keying and a tricky + * SVG color transformation. + * The back layer of the stack has a red background; the underscores of the + * back label are in white (and have a white text-shadow in order to fill up the + * gaps between the individual letters). + * Now we want the foreground layer to be solid white, except for those pixels + * that make up the labels: These should be transparent. + * So if the baselines line up, everything is white, since at those pixels where + * the foreground is transparent, only the white pixels from the back layer shine + * through. If the baselines don't line up, red pixels from the background will + * shine through, and the comparison with about:blank (completely white) will fail. + * + * So how do we get the foreground white and transparent? That's the job of the + * SVG color transformation filter. It's a simple matrix that makes turns opaque + * yellow into transparent and all other colors into white. + * --> + +<window title="Baseline test" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" + xmlns:html="http://www.w3.org/1999/xhtml" + xmlns:svg="http://www.w3.org/2000/svg" + orient="vertical" + class="reftest-wait" + onload="loaded()"> + +<html:style><![CDATA[ +:root { + -moz-appearance: none; + background-color: white; +} +.regular { + font: -moz-dialog; +} +.small { + font: message-box; +} +.spacer { + height: 40px; +} +stack > hbox:first-child { + background: red; + color: white; + text-shadow: 5px 0 white, -5px 0 white; +} +stack > .foreground { + filter: url(#yellow2transparent); +} +stack > hbox:last-child > * { + color: yellow; +} +]]> +</html:style> + + <svg:svg style="visibility: collapse;"> + <svg:filter id="yellow2transparent" color-interpolation-filters="sRGB"> + <svg:feColorMatrix type="matrix" + values="0 0 0 0 1 + 0 0 0 0 1 + 0 0 0 0 1 + -100 -100 100 -100 300"/> + </svg:filter> + </svg:svg> + +<script type="application/javascript"><![CDATA[ + +function cE(elem) { + return document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", elem); +} +function elWithValue(elem, val) { + let e = cE(elem); + e.setAttribute(elem == "label" ? "value" : "label", val); + return e; +} + +function allPairs(set) { + let ps = []; + for(let i = 0; i < set.length; ++i) { + for (let j = i + 1; j < set.length; ++j) { + ps.push([set[i], set[j]]); + } + } + return ps; +} + +function createLabel(v) { + return elWithValue("label", v); +} +function createRadio(v) { + return elWithValue("radio", v); +} +function createCheckbox(v) { + return elWithValue("checkbox", v); +} +function createButton(v) { + return elWithValue("button", v); +} +function createMenulist(v) { + let [list, popup, item] = [cE("menulist"), cE("menupopup"), elWithValue("menuitem", v)]; + item.setAttribute("selected", "true"); + popup.appendChild(item); + list.appendChild(popup); + return list; +} +function loaded() { + let template = document.getElementById("template"); + ["regular", "small"].forEach(function(size) { + let wrapper = document.querySelectorAll("#wrapper > ." + size)[0]; + allPairs([ + createLabel, createRadio, createCheckbox, createButton, createMenulist, + ]).forEach(function(elemList) { + let newBox = template.cloneNode(true); + newBox.className = "spacer"; + let foregroundRow = newBox.firstChild.lastChild; + elemList.forEach(function(creator) { + foregroundRow.appendChild(creator("______")); + }); + wrapper.appendChild(newBox); + }); + }); + document.documentElement.className = ""; +} + +]]></script> + <vbox id="template"> + <stack> + <hbox align="center"> + <label value="______________________________________________"/> + </hbox> + <hbox align="center" class="foreground"> + </hbox> + </stack> + </vbox> + <hbox id="wrapper"> + <vbox class="regular" flex="1"/> + <vbox class="small" flex="1"/> + </hbox> + + <spacer flex="1"/> + +</window> diff --git a/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml b/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml new file mode 100644 index 0000000000..a4b8675d2f --- /dev/null +++ b/toolkit/themes/osx/reftests/checkboxsize-ref.xhtml @@ -0,0 +1,33 @@ +<?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 width="11" height="11"/></hbox> + </vbox> + <vbox> + <hbox><box width="13" height="13"/></hbox> + </vbox> + <vbox> + <hbox><box width="16" height="16"/></hbox> + </vbox> + <vbox> + <hbox checked="true"><box width="11" height="11"/></hbox> + </vbox> + <vbox> + <hbox checked="true"><box width="13" height="13"/></hbox> + </vbox> + <vbox> + <hbox checked="true"><box width="16" height="16"/></hbox> + </vbox> +</window> diff --git a/toolkit/themes/osx/reftests/checkboxsize.xhtml b/toolkit/themes/osx/reftests/checkboxsize.xhtml new file mode 100644 index 0000000000..55429ef8f8 --- /dev/null +++ b/toolkit/themes/osx/reftests/checkboxsize.xhtml @@ -0,0 +1,31 @@ +<?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 label="Mini"/></hbox> + </vbox> + <vbox style="font: message-box"> + <hbox><checkbox label="Small"/></hbox> + </vbox> + <vbox style="font: -moz-dialog"> + <hbox><checkbox label="Regular"/></hbox> + </vbox> + <vbox style="font-size: 9px"> + <hbox><checkbox label="Mini" checked="true"/></hbox> + </vbox> + <vbox style="font: message-box"> + <hbox><checkbox label="Small" checked="true"/></hbox> + </vbox> + <vbox style="font: -moz-dialog"> + <hbox><checkbox label="Regular" checked="true"/></hbox> + </vbox> +</window> diff --git a/toolkit/themes/osx/reftests/nostretch-ref.xhtml b/toolkit/themes/osx/reftests/nostretch-ref.xhtml new file mode 100644 index 0000000000..e06a6ddc1c --- /dev/null +++ b/toolkit/themes/osx/reftests/nostretch-ref.xhtml @@ -0,0 +1,99 @@ +<?xml version="1.0"?> +<?xml-stylesheet href="chrome://global/skin" type="text/css"?> + +<window title="Stretched controls test reference" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" + xmlns:html="http://www.w3.org/1999/xhtml" + xmlns:svg="http://www.w3.org/2000/svg" + orient="vertical" + class="reftest-wait" + onload="loaded()"> + +<html:style><![CDATA[ +.regular { + font: -moz-dialog; +} +.small { + font: message-box; +} +.spacer { + height: 40px; +} +.foreground > :nth-child(2) { + display: none; /* <----- This is the only difference from nostretch.xhtml */ +} +]]> +</html:style> + +<script type="application/javascript"><![CDATA[ + +function cE(elem) { + return document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", elem); +} +function elWithValue(elem, val) { + let e = cE(elem); + e.setAttribute(elem == "label" ? "value" : "label", val); + return e; +} + +function allPairs(set) { + let ps = []; + for(let i = 0; i < set.length; ++i) { + for (let j = 0; j < set.length; ++j) { + if (i != j) + ps.push([set[i], set[j]]); + } + } + return ps; +} + +function createLabel(v) { + return elWithValue("label", v); +} +function createRadio(v) { + return elWithValue("radio", v); +} +function createCheckbox(v) { + return elWithValue("checkbox", v); +} +function createButton(v) { + return elWithValue("button", v); +} +function createMenulist(v) { + let [list, popup, item] = [cE("menulist"), cE("menupopup"), elWithValue("menuitem", v)]; + item.setAttribute("selected", "true"); + popup.appendChild(item); + list.appendChild(popup); + return list; +} +function loaded() { + let template = document.getElementById("template"); + ["regular", "small"].forEach(function(size) { + let wrapper = document.querySelectorAll("#wrapper > ." + size)[0]; + allPairs([ + createButton, createMenulist, + ]).forEach(function(elemList) { + let newBox = template.cloneNode(true); + newBox.className = "spacer"; + let foregroundRow = newBox.firstChild; + elemList.forEach(function(creator) { + foregroundRow.appendChild(creator("Label")); + }); + wrapper.appendChild(newBox); + }); + }); + document.documentElement.className = ""; +} + +]]></script> + <vbox id="template"> + <hbox class="foreground"/> + </vbox> + <hbox id="wrapper"> + <vbox class="regular" width="500"/> + <vbox class="small" flex="1"/> + </hbox> + + <spacer flex="1"/> + +</window> diff --git a/toolkit/themes/osx/reftests/nostretch.xhtml b/toolkit/themes/osx/reftests/nostretch.xhtml new file mode 100644 index 0000000000..325c2e593b --- /dev/null +++ b/toolkit/themes/osx/reftests/nostretch.xhtml @@ -0,0 +1,112 @@ +<?xml version="1.0"?> +<?xml-stylesheet href="chrome://global/skin" type="text/css"?> + +<!-- + * This test tests whether you can put different widgets in the same + * hbox without stretching them, even if you don't set align="center". + * I.e. prior to the fix that added this patch, having a button and a + * menulist in the same hbox next to each other would stretch the menulist + * vertically because the button had such a big vertical margin. + * + * The test works like this: Two widgets are placed in a hbox, and the second + * widget is visibility: hidden. In the reference (nostretch-ref.xhtml), the + * second widget is display: none. If test and reference look the same, + * adding the second widget hasn't affected the appearance of the first widget, + * and everything's fine. + * --> +<window title="Stretched controls test" + xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" + xmlns:html="http://www.w3.org/1999/xhtml" + xmlns:svg="http://www.w3.org/2000/svg" + orient="vertical" + class="reftest-wait" + onload="loaded()"> + +<html:style><![CDATA[ +.regular { + font: -moz-dialog; +} +.small { + font: message-box; +} +.spacer { + height: 40px; +} +.foreground > :nth-child(2) { + visibility: hidden; +} +]]> +</html:style> + +<script type="application/javascript"><![CDATA[ + +function cE(elem) { + return document.createElementNS("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul", elem); +} +function elWithValue(elem, val) { + let e = cE(elem); + e.setAttribute(elem == "label" ? "value" : "label", val); + return e; +} + +function allPairs(set) { + let ps = []; + for(let i = 0; i < set.length; ++i) { + for (let j = 0; j < set.length; ++j) { + if (i != j) + ps.push([set[i], set[j]]); + } + } + return ps; +} + +function createLabel(v) { + return elWithValue("label", v); +} +function createRadio(v) { + return elWithValue("radio", v); +} +function createCheckbox(v) { + return elWithValue("checkbox", v); +} +function createButton(v) { + return elWithValue("button", v); +} +function createMenulist(v) { + let [list, popup, item] = [cE("menulist"), cE("menupopup"), elWithValue("menuitem", v)]; + item.setAttribute("selected", "true"); + popup.appendChild(item); + list.appendChild(popup); + return list; +} +function loaded() { + let template = document.getElementById("template"); + ["regular", "small"].forEach(function(size) { + let wrapper = document.querySelectorAll("#wrapper > ." + size)[0]; + allPairs([ + createButton, createMenulist, + ]).forEach(function(elemList) { + let newBox = template.cloneNode(true); + newBox.className = "spacer"; + let foregroundRow = newBox.firstChild; + elemList.forEach(function(creator) { + foregroundRow.appendChild(creator("Label")); + }); + wrapper.appendChild(newBox); + }); + }); + document.documentElement.className = ""; +} + +]]></script> + <vbox id="template"> + <hbox class="foreground"/> + </vbox> + <hbox id="wrapper"> + <vbox class="regular" width="500"/> + <vbox class="small" flex="1"/> + </hbox> + + <spacer flex="1"/> + +</window> diff --git a/toolkit/themes/osx/reftests/radiosize-ref.xhtml b/toolkit/themes/osx/reftests/radiosize-ref.xhtml new file mode 100644 index 0000000000..49b5f426d5 --- /dev/null +++ b/toolkit/themes/osx/reftests/radiosize-ref.xhtml @@ -0,0 +1,33 @@ +<?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 width="11" height="11"/></hbox> + </vbox> + <vbox> + <hbox><box width="13" height="13"/></hbox> + </vbox> + <vbox> + <hbox><box width="16" height="16"/></hbox> + </vbox> + <vbox> + <hbox selected="true"><box width="11" height="11"/></hbox> + </vbox> + <vbox> + <hbox selected="true"><box width="13" height="13"/></hbox> + </vbox> + <vbox> + <hbox selected="true"><box width="16" height="16"/></hbox> + </vbox> +</window> diff --git a/toolkit/themes/osx/reftests/radiosize.xhtml b/toolkit/themes/osx/reftests/radiosize.xhtml new file mode 100644 index 0000000000..44f735db07 --- /dev/null +++ b/toolkit/themes/osx/reftests/radiosize.xhtml @@ -0,0 +1,31 @@ +<?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: -moz-dialog"> + <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: -moz-dialog"> + <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 new file mode 100644 index 0000000000..72b87fae6d --- /dev/null +++ b/toolkit/themes/osx/reftests/reftest.list @@ -0,0 +1,7 @@ +# This folder is registered in the chrome manifest at layout/tools/reftest/jar.mn. + +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 +# This failure is caused by bug 1586055 in WebRender +skip-if(!cocoaWidget) fails-if(webrender) == chrome://reftest/content/osx-theme/baseline.xhtml about:blank +skip-if(!cocoaWidget) == chrome://reftest/content/osx-theme/nostretch.xhtml chrome://reftest/content/osx-theme/nostretch-ref.xhtml |
