From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- mobile/android/themes/core/about.css | 50 +++ mobile/android/themes/core/aboutAccounts.css | 91 +++++ mobile/android/themes/core/aboutAddons.css | 332 +++++++++++++++++ mobile/android/themes/core/aboutBase.css | 114 ++++++ mobile/android/themes/core/aboutDownloads.css | 50 +++ mobile/android/themes/core/aboutHealthReport.css | 15 + mobile/android/themes/core/aboutLogins.css | 238 ++++++++++++ mobile/android/themes/core/aboutMemory.css | 149 ++++++++ mobile/android/themes/core/aboutPage.css | 117 ++++++ .../android/themes/core/aboutPrivateBrowsing.css | 84 +++++ mobile/android/themes/core/aboutReader.css | 120 ++++++ mobile/android/themes/core/aboutReaderContent.css | 114 ++++++ mobile/android/themes/core/aboutReaderControls.css | 290 +++++++++++++++ mobile/android/themes/core/aboutSupport.css | 97 +++++ mobile/android/themes/core/config.css | 333 +++++++++++++++++ mobile/android/themes/core/content.css | 414 +++++++++++++++++++++ mobile/android/themes/core/defines.css | 18 + .../themes/core/images/about-btn-darkgrey.png | Bin 0 -> 123 bytes .../core/images/accessiblecaret-normal-hdpi.png | Bin 0 -> 693 bytes .../core/images/accessiblecaret-normal-xhdpi.png | Bin 0 -> 924 bytes .../core/images/accessiblecaret-normal-xxhdpi.png | Bin 0 -> 1394 bytes .../core/images/accessiblecaret-tilt-left-hdpi.png | Bin 0 -> 532 bytes .../images/accessiblecaret-tilt-left-xhdpi.png | Bin 0 -> 706 bytes .../images/accessiblecaret-tilt-left-xxhdpi.png | Bin 0 -> 1140 bytes .../images/accessiblecaret-tilt-right-hdpi.png | Bin 0 -> 538 bytes .../images/accessiblecaret-tilt-right-xhdpi.png | Bin 0 -> 668 bytes .../images/accessiblecaret-tilt-right-xxhdpi.png | Bin 0 -> 1101 bytes mobile/android/themes/core/images/amo-logo.png | Bin 0 -> 635 bytes mobile/android/themes/core/images/arrowdown-16.png | Bin 0 -> 158 bytes mobile/android/themes/core/images/arrowup-16.png | Bin 0 -> 151 bytes .../android/themes/core/images/blocked-warning.png | Bin 0 -> 926 bytes mobile/android/themes/core/images/cast-active.svg | 14 + mobile/android/themes/core/images/cast-ready.svg | 14 + .../themes/core/images/certerror-warning.png | Bin 0 -> 926 bytes .../themes/core/images/checkbox_checked.png | Bin 0 -> 322 bytes .../core/images/checkbox_checked_disabled.png | Bin 0 -> 260 bytes .../core/images/checkbox_checked_pressed.png | Bin 0 -> 444 bytes .../themes/core/images/checkbox_unchecked.png | Bin 0 -> 130 bytes .../core/images/checkbox_unchecked_disabled.png | Bin 0 -> 135 bytes .../core/images/checkbox_unchecked_pressed.png | Bin 0 -> 242 bytes mobile/android/themes/core/images/chevron.png | Bin 0 -> 279 bytes mobile/android/themes/core/images/config-plus.png | Bin 0 -> 255 bytes .../themes/core/images/dropmarker-right.svg | 7 + mobile/android/themes/core/images/dropmarker.svg | 7 + .../themes/core/images/errorpage-warning.png | Bin 0 -> 926 bytes .../android/themes/core/images/exitfullscreen.svg | 10 + mobile/android/themes/core/images/fullscreen.svg | 10 + mobile/android/themes/core/images/grey-caution.svg | 4 + .../themes/core/images/icon_key_emptypage.svg | 11 + mobile/android/themes/core/images/lock.png | Bin 0 -> 350 bytes mobile/android/themes/core/images/logo-hdpi.png | Bin 0 -> 64040 bytes mobile/android/themes/core/images/mute.svg | 10 + mobile/android/themes/core/images/pause.svg | 10 + .../themes/core/images/placeholder_image.svg | 62 +++ mobile/android/themes/core/images/play.svg | 10 + .../images/privatebrowsing-mask-and-shield.svg | 22 ++ .../themes/core/images/privatebrowsing-mask.png | Bin 0 -> 2872 bytes .../themes/core/images/reader-minus-hdpi.png | Bin 0 -> 135 bytes .../themes/core/images/reader-minus-xhdpi.png | Bin 0 -> 135 bytes .../themes/core/images/reader-minus-xxhdpi.png | Bin 0 -> 192 bytes .../themes/core/images/reader-plus-hdpi.png | Bin 0 -> 287 bytes .../themes/core/images/reader-plus-xhdpi.png | Bin 0 -> 322 bytes .../themes/core/images/reader-plus-xxhdpi.png | Bin 0 -> 429 bytes .../themes/core/images/reader-style-icon-hdpi.png | Bin 0 -> 891 bytes .../themes/core/images/reader-style-icon-xhdpi.png | Bin 0 -> 1179 bytes .../core/images/reader-style-icon-xxhdpi.png | Bin 0 -> 1791 bytes mobile/android/themes/core/images/scrubber.svg | 10 + .../android/themes/core/images/search-clear-30.png | Bin 0 -> 270 bytes mobile/android/themes/core/images/search.png | Bin 0 -> 487 bytes mobile/android/themes/core/images/textfield.png | Bin 0 -> 95 bytes mobile/android/themes/core/images/throbber.png | Bin 0 -> 481 bytes mobile/android/themes/core/images/unmute.svg | 10 + .../android/themes/core/images/wordmark-hdpi.png | Bin 0 -> 798 bytes mobile/android/themes/core/jar.mn | 98 +++++ mobile/android/themes/core/moz.build | 7 + mobile/android/themes/core/netError.css | 226 +++++++++++ mobile/android/themes/core/scrollbar-apz.css | 10 + mobile/android/themes/core/spinner.css | 124 ++++++ mobile/android/themes/core/touchcontrols.css | 255 +++++++++++++ 79 files changed, 3557 insertions(+) create mode 100644 mobile/android/themes/core/about.css create mode 100644 mobile/android/themes/core/aboutAccounts.css create mode 100644 mobile/android/themes/core/aboutAddons.css create mode 100644 mobile/android/themes/core/aboutBase.css create mode 100644 mobile/android/themes/core/aboutDownloads.css create mode 100644 mobile/android/themes/core/aboutHealthReport.css create mode 100644 mobile/android/themes/core/aboutLogins.css create mode 100644 mobile/android/themes/core/aboutMemory.css create mode 100644 mobile/android/themes/core/aboutPage.css create mode 100644 mobile/android/themes/core/aboutPrivateBrowsing.css create mode 100644 mobile/android/themes/core/aboutReader.css create mode 100644 mobile/android/themes/core/aboutReaderContent.css create mode 100644 mobile/android/themes/core/aboutReaderControls.css create mode 100644 mobile/android/themes/core/aboutSupport.css create mode 100644 mobile/android/themes/core/config.css create mode 100644 mobile/android/themes/core/content.css create mode 100644 mobile/android/themes/core/defines.css create mode 100644 mobile/android/themes/core/images/about-btn-darkgrey.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png create mode 100644 mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png create mode 100644 mobile/android/themes/core/images/amo-logo.png create mode 100644 mobile/android/themes/core/images/arrowdown-16.png create mode 100644 mobile/android/themes/core/images/arrowup-16.png create mode 100644 mobile/android/themes/core/images/blocked-warning.png create mode 100644 mobile/android/themes/core/images/cast-active.svg create mode 100644 mobile/android/themes/core/images/cast-ready.svg create mode 100644 mobile/android/themes/core/images/certerror-warning.png create mode 100644 mobile/android/themes/core/images/checkbox_checked.png create mode 100644 mobile/android/themes/core/images/checkbox_checked_disabled.png create mode 100644 mobile/android/themes/core/images/checkbox_checked_pressed.png create mode 100644 mobile/android/themes/core/images/checkbox_unchecked.png create mode 100644 mobile/android/themes/core/images/checkbox_unchecked_disabled.png create mode 100644 mobile/android/themes/core/images/checkbox_unchecked_pressed.png create mode 100644 mobile/android/themes/core/images/chevron.png create mode 100644 mobile/android/themes/core/images/config-plus.png create mode 100644 mobile/android/themes/core/images/dropmarker-right.svg create mode 100644 mobile/android/themes/core/images/dropmarker.svg create mode 100644 mobile/android/themes/core/images/errorpage-warning.png create mode 100644 mobile/android/themes/core/images/exitfullscreen.svg create mode 100644 mobile/android/themes/core/images/fullscreen.svg create mode 100644 mobile/android/themes/core/images/grey-caution.svg create mode 100644 mobile/android/themes/core/images/icon_key_emptypage.svg create mode 100644 mobile/android/themes/core/images/lock.png create mode 100644 mobile/android/themes/core/images/logo-hdpi.png create mode 100644 mobile/android/themes/core/images/mute.svg create mode 100644 mobile/android/themes/core/images/pause.svg create mode 100644 mobile/android/themes/core/images/placeholder_image.svg create mode 100644 mobile/android/themes/core/images/play.svg create mode 100644 mobile/android/themes/core/images/privatebrowsing-mask-and-shield.svg create mode 100644 mobile/android/themes/core/images/privatebrowsing-mask.png create mode 100644 mobile/android/themes/core/images/reader-minus-hdpi.png create mode 100644 mobile/android/themes/core/images/reader-minus-xhdpi.png create mode 100644 mobile/android/themes/core/images/reader-minus-xxhdpi.png create mode 100644 mobile/android/themes/core/images/reader-plus-hdpi.png create mode 100644 mobile/android/themes/core/images/reader-plus-xhdpi.png create mode 100644 mobile/android/themes/core/images/reader-plus-xxhdpi.png create mode 100644 mobile/android/themes/core/images/reader-style-icon-hdpi.png create mode 100644 mobile/android/themes/core/images/reader-style-icon-xhdpi.png create mode 100644 mobile/android/themes/core/images/reader-style-icon-xxhdpi.png create mode 100644 mobile/android/themes/core/images/scrubber.svg create mode 100644 mobile/android/themes/core/images/search-clear-30.png create mode 100644 mobile/android/themes/core/images/search.png create mode 100644 mobile/android/themes/core/images/textfield.png create mode 100644 mobile/android/themes/core/images/throbber.png create mode 100644 mobile/android/themes/core/images/unmute.svg create mode 100644 mobile/android/themes/core/images/wordmark-hdpi.png create mode 100644 mobile/android/themes/core/jar.mn create mode 100644 mobile/android/themes/core/moz.build create mode 100644 mobile/android/themes/core/netError.css create mode 100644 mobile/android/themes/core/scrollbar-apz.css create mode 100644 mobile/android/themes/core/spinner.css create mode 100644 mobile/android/themes/core/touchcontrols.css (limited to 'mobile/android/themes') diff --git a/mobile/android/themes/core/about.css b/mobile/android/themes/core/about.css new file mode 100644 index 000000000..a060057b1 --- /dev/null +++ b/mobile/android/themes/core/about.css @@ -0,0 +1,50 @@ +/* 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/. */ + +html { + background: #f0f0f0; + padding: 0 1em; + font-family: "Clear Sans", sans-serif !important; + font-size: 100% !important; +} + +body { + color: black; + position: relative; + min-width: 330px; + max-width: 50em; + margin: 1em auto; + border: 1px solid gray; + border-radius: 10px; + padding: 3em; + padding-inline-start: 30px; + background: white; +} + +.aboutPageWideContainer { + max-width: 80%; +} + +#aboutLogoContainer { + border: 1px solid lightgray; + width: 300px; + margin-bottom: 2em; +} + +img { + border: 0; +} + +#version { + font-weight: bold; + color: #909090; + margin: -24px 0 9px 17px; +} + +ul { + margin: 0; + margin-inline-start: 1.5em; + padding: 0; + list-style: square; +} diff --git a/mobile/android/themes/core/aboutAccounts.css b/mobile/android/themes/core/aboutAccounts.css new file mode 100644 index 000000000..29f0f2e47 --- /dev/null +++ b/mobile/android/themes/core/aboutAccounts.css @@ -0,0 +1,91 @@ +/* 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/. */ + +html, body { + height: 100%; + width: 100%; +} + +div { + transition: opacity 0.4s ease-in; +} + +#spinner { + transition: opacity 0.2s ease-in; +} + +#remote { + border: 0; + opacity: 0; + transition: opacity 0.4s ease-in; +} + +.text { + color: #363B40; + font-size: 25px; + font-weight: lighter; + margin-bottom: 20px; +} + +.hint { + color: #777777; + font-size: 20px; + margin-bottom: 20px; +} + +a { + color: #0096DD; /* link_blue */ + text-decoration: none; + font-size: 20px; + margin-bottom: 20px; +} + +a:active { + color: #0082C6; /* link_blue_pressed */ +} + +.toplevel { + width: 100%; + height: 100%; + position: absolute; +} + +.container { + height: 100%; + padding-left: 30px; + padding-right: 30px; +} + +.text-container { + padding-top: 60px; + padding-left: 30px; + padding-right: 30px; +} + +.flex-column { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; +} + +.button-row { + flex: 0; + width: 100%; + display: flex; + flex-direction: row; + align-items: center; + text-align: center; + justify-content: center; +} + +.button { + flex: 1; + height: 60px; + background-color: #E66000; /*matched to action_orange in java codebase*/ + color: #FFFFFF; + font-size: 20px; + border-radius: 4px; + border-width: 0px; +} diff --git a/mobile/android/themes/core/aboutAddons.css b/mobile/android/themes/core/aboutAddons.css new file mode 100644 index 000000000..c44b330ea --- /dev/null +++ b/mobile/android/themes/core/aboutAddons.css @@ -0,0 +1,332 @@ +/* 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 "defines.css"; + +html[details] { + background-color: var(--color_about_item); +} + +a { + text-decoration: none; + color: #0096DD; +} + +a:active { + color: #0082C6; +} + +.details { + width: 100%; +} + +.details > div { + display: inline; +} + +.version { + /* title is not localized, so keep the margin on the left side */ + margin-left: .67em; +} + +.description { + width: 100%; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.warn-unsigned { + border-top: 1px solid var(--color_about_item_border); + padding: 1em; + padding-inline-start: calc(var(--icon-size) + var(--icon-margin) * 2); + background-image: url("chrome://browser/skin/images/grey-caution.svg"); + background-size: var(--icon-size); + background-position: var(--icon-margin); + background-repeat: no-repeat; + display: none; +} + +.addon-item[isUnsigned="true"] .warn-unsigned { + display: block; +} + +.status { + border-top: 1px solid var(--color_about_item_border); + font-weight: bold; + padding: 0.5em; + width: 100%; +} + +.options-header { + font-weight: bold; + text-transform: uppercase; + margin-top: 1em; +} + +.addon-item[isDisabled="true"] .options-header, +.addon-item[optionsURL=""] .options-header, +.addon-item[isDisabled="true"] .options-box, +.addon-item[optionsURL=""] .options-box { + display: none; +} + +#addons-details > .list-item { + margin-bottom: 42px; + border-bottom: none; +} + +#addons-details > .list-item:active { + background-color: #fff; +} + +/* Buttons */ + +.buttons { + display: flex; + flex-direction: row; + width: 100%; + position: fixed; + bottom: 0px; +} + +.buttons::after { + content: ""; + border-right: 1px solid var(--color_about_item_border); +} + +.buttons > button { + -moz-appearance: none; + font-size: 1em; + border: 1px solid transparent; + border-right: none; + border-top-color: var(--color_about_item_border); + border-inline-start-color: var(--color_about_item_border); + background-color: var(--color_about_item); + flex: 1; + padding: 0.75em 0.5em; + border-radius: 0; +} + +.buttons > button:active { + background-color: #eeeeee; +} + +.buttons > button[disabled="true"] { + color: #b5b5b5; +} + +.buttons > button[hidden="true"] { + display: none; +} + +.buttons:first-child { + border-inline-start-color: transparent; +} + +/* Settings */ + +setting { + padding-bottom: 1em; + -moz-box-align: center; + box-sizing: border-box; + width: 100%; +} + +setting[type="integer"], +setting[type="string"], +setting[type="menulist"], +setting[type="control"] { + -moz-box-orient: vertical; + -moz-box-align: start; +} + +setting > vbox { + -moz-box-flex: 1; +} + +.preferences-description { + margin-top: 4px; + color: #666; +} + +.preferences-description:empty { + display: none; +} + +/* Checkbox */ + +checkbox { + -moz-binding: url("chrome://global/content/bindings/checkbox.xml#checkbox-with-spacing") !important; + margin: 0; +} + +checkbox[label=""] > .checkbox-label-box, +checkbox:not([label]) > .checkbox-label-box { + display: none; +} + +.checkbox-check { + background-color: transparent; + background-image: url("chrome://browser/skin/images/checkbox_unchecked.png"); + border: none; + height: 48px; + width: 48px; +} + +setting:active checkbox > .checkbox-spacer-box > .checkbox-check { + background-image: url("chrome://browser/skin/images/checkbox_unchecked_pressed.png"); +} + +checkbox[disabled="true"] > .checkbox-spacer-box > .checkbox-check { + background-image: url("chrome://browser/skin/images/checkbox_unchecked_disabled.png"); +} + +checkbox[checked="true"] > .checkbox-spacer-box > .checkbox-check { + background-image: url("chrome://browser/skin/images/checkbox_checked.png"); +} + +setting:active checkbox[checked="true"] > .checkbox-spacer-box > .checkbox-check { + background-image: url("chrome://browser/skin/images/checkbox_checked_pressed.png"); +} + +checkbox[checked="true"][disabled="true"] > .checkbox-spacer-box > .checkbox-check { + background-image: url("chrome://browser/skin/images/checkbox_checked_disabled.png"); +} + +/* Textbox */ + +textbox[type="number"] > spinbuttons { + visibility: collapse; +} + +textbox { + min-width: 200px; + margin: 2px 0; + padding: 0.5em !important; + background: #fff; + border: 1px solid #ccc; + border-radius: 4px; + color: #333; +} + +/* Button */ + +setting button { + margin: 2px 0; + background: #fff; + border: 1px solid #ccc; + padding: 0.5em; +} + +/* Menulist */ + +menulist { + -moz-appearance: none !important; + -moz-user-focus: ignore; + min-width: 200px; + margin: 2px 0; + background: #fff; + border: 1px solid #ccc; + border-radius: 4px; + padding: 0.5em; +} + +menulist > dropmarker { + height: 1.8em; + width: 1.8em; + margin-left: var(--margin_snormal); + background-color: transparent; + border: none; + -moz-box-align: center; + -moz-box-pack: center; + list-style-image: url("chrome://browser/skin/images/dropmarker.svg") !important; + -moz-image-region: auto; + display: block; +} + +/* Select */ + +select { + min-width: 200px; + margin: 2px 0; + background: #fff; + border: 1px solid #ccc; + border-radius: 4px; + padding: 1em; +} + +/* XBL bindings */ + +setting { + display: none; +} + +setting[type="bool"] { + display: -moz-box; + -moz-binding: url("chrome://browser/content/bindings/settings.xml#setting-fulltoggle-bool"); +} + +setting[type="bool"][localized="true"] { + display: -moz-box; + -moz-binding: url("chrome://browser/content/bindings/settings.xml#setting-fulltoggle-localized-bool"); +} + +setting[type="boolint"] { + display: -moz-box; + -moz-binding: url("chrome://browser/content/bindings/settings.xml#setting-fulltoggle-boolint"); +} + +setting[type="integer"] { + display: -moz-box; + -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-integer"); +} + +setting[type="control"] { + display: -moz-box; + -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-control"); +} + +setting[type="string"] { + display: -moz-box; + -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-string"); +} + +setting[type="radio"], +setting[type="menulist"] { + display: -moz-box; + -moz-binding: url("chrome://mozapps/content/extensions/setting.xml#setting-multi"); +} + +.hide-on-enable, +.show-on-error, +.show-on-uninstall, +.show-on-install, +.show-on-restart, +div[isDisabled="true"] .hide-on-disable { + display: none; +} + +div[error] .show-on-error, +div[opType="needs-restart"] .show-on-restart, +div[opType="needs-uninstall"] .show-on-uninstall, +div[opType="needs-install"] .show-on-install, +div[opType="needs-enable"] .show-on-enable, +div[opType="needs-disable"] .show-on-disable, +div[isDisabled="true"] .show-on-disable { + display: -moz-box; +} + +div[opType="needs-restart"] .hide-on-restart, +div[opType="needs-uninstall"] .hide-on-uninstall, +div[isDisabled="true"][opType="needs-uninstall"], +div[opType="needs-install"] .hide-on-install, +div[opType="needs-enable"] .hide-on-enable, +div[opType="needs-disable"] .hide-on-disable { + display: none; +} + +#addons-list, #addons-details { + display: none; +} diff --git a/mobile/android/themes/core/aboutBase.css b/mobile/android/themes/core/aboutBase.css new file mode 100644 index 000000000..59379e2ee --- /dev/null +++ b/mobile/android/themes/core/aboutBase.css @@ -0,0 +1,114 @@ +/* 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 "defines.css"; + +html { + font-family: "Clear Sans",sans-serif; + font-size: 14px; + background-color: var(--color_about_background); + -moz-text-size-adjust: none; + -moz-user-select: none; + --icon-size: 1.8em; + --icon-margin: 1.35em; +} + +body { + margin: 0; +} + +input { + -moz-user-select: text; +} + +.header { + color: #363B40; + font-size: 1.1em; + font-weight: bold; + background-color: #f5f5f5; + border-bottom: 2px solid; + -moz-border-bottom-colors: #FF9500; + display: flex; + flex-direction: row; + align-items: center; + height: 48px; +} + +.header > div { + flex: 1; + padding: 10px; + padding-inline-start: 16px; +} + +#header-button { + background-repeat: no-repeat; + background-position: center center; + background-size: 33px 33px; + flex: 0; + height: 100%; +} + +.list { + padding: 0px; + margin: 0px; + width: 100%; +} + +.list-item { + color: #363B40; + background-color: var(--color_about_item); + border-bottom: 1px solid var(--color_about_item_border); + position: relative; + list-style-type: none; + list-style-image: none; + margin: 0px; + padding: 0px; + min-height: calc(var(--icon-size) + var(--icon-margin) * 2); +} + +.list-item:active { + background-color: #eeeeee; +} + +.list-item[isDisabled="true"] { + color: #999999; +} + +.inner { + margin-inline-start: calc(var(--icon-size) + var(--icon-margin) * 2 - 1em); + padding: 1em; +} + +.icon { + border: none; + width: var(--icon-size); + height: var(--icon-size); + top: var(--icon-margin); + margin-inline-start: var(--icon-margin); + position: absolute; + pointer-events: none; +} + +.list-item[isDisabled="true"] .favicon { + opacity: 0.3; +} + +.row { + display: flex; + width: 100%; +} + +.title { + font-weight: bold; + overflow: hidden; + flex: 1; +} + +#browse-title { + margin: 0.5em 0; + background-image: url("chrome://browser/skin/images/chevron.png"); + background-size: 8px 20px; + background-position: right; + background-repeat: no-repeat; +} diff --git a/mobile/android/themes/core/aboutDownloads.css b/mobile/android/themes/core/aboutDownloads.css new file mode 100644 index 000000000..2e3097fd9 --- /dev/null +++ b/mobile/android/themes/core/aboutDownloads.css @@ -0,0 +1,50 @@ +/* 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 "defines.css" + +.list-item > a { + color: inherit; + text-decoration: none; +} + +#private-downloads-list .list-item { + background-color: #393e43; + color: #ddd; +} + +.details { + margin-inline-start: calc(var(--icon-size) + var(--icon-margin) * 2 - 1em); + padding: 1em; +} + +.date { + color: gray; + margin-inline-start: 0.5em; +} + +.domain, +.size { + display: inline; +} + +.state { + color: gray; + margin-bottom: -3px; /* Prevent overflow that hides bottom border */ +} + +.size:after { + content: " - "; + white-space: pre; +} + +#no-downloads-indicator { + display: none; +} + +#private-downloads-list:empty + #public-downloads-list:empty + #no-downloads-indicator { + display: block; + text-align: center; + padding-top: 3.9em; +} diff --git a/mobile/android/themes/core/aboutHealthReport.css b/mobile/android/themes/core/aboutHealthReport.css new file mode 100644 index 000000000..3dd40fc24 --- /dev/null +++ b/mobile/android/themes/core/aboutHealthReport.css @@ -0,0 +1,15 @@ +* { + margin: 0; + padding: 0; +} + +html, body { + height: 100%; +} + +#remote-report { + width: 100%; + height: 100%; + border: 0; + display: flex; +} diff --git a/mobile/android/themes/core/aboutLogins.css b/mobile/android/themes/core/aboutLogins.css new file mode 100644 index 000000000..2d962784e --- /dev/null +++ b/mobile/android/themes/core/aboutLogins.css @@ -0,0 +1,238 @@ +/* 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 "defines.css"; + +html { + height: 100%; +} + +body { + height: 100%; +} + +.hidden { + display: none; +} + +.username { + width: 100%; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.hostname { + font-weight: bold; + overflow: hidden; + flex: 1; +} + +.realm { + /* hostname is not localized, so keep the margin on the left side */ + margin-left: .67em; +} + +.toolbar-buttons { + display: flex; + align-items: center; + justify-content: center; + list-style: none; + margin: 0px; + padding: 0px; + height: 48px; + width: 48px; +} + +.toolbar-buttons > li { + background-position: center; + background-size: 24px 24px; + background-repeat: no-repeat; + height: 20px; + width: 20px; +} + +#filter-input-container { + position: fixed; + bottom: 0; + width: 100%; + padding: 10px 0; + display: flex; + background: var(--color_about_background); + border-top: 2px solid var(--color_about_item_border); +} + +#filter-input-container[hidden] { + display: none; +} + +#filter-input { + flex: 1; + padding: 5px; + margin-inline-start: 10px; + border-radius: 3px; +} + +#filter-button { + background-image: url("resource://android/res/drawable-mdpi-v4/ab_search.png"); +} + +#filter-clear { + background-image: url("resource://android/res/drawable-mdpi-v4/close_edit_mode_light.png"); + background-position: center; + background-size: 12px 12px; + background-repeat: no-repeat; + height: 32px; + width: 32px; + margin: 0 5px; +} + +.edit-login-icon { + background-image: url("resource://android/res/drawable-hdpi-v4/favicon_globe.png"); + background-position: center; + background-size: 32px 32px; + background-repeat: no-repeat; + height: 32px; + width: 32px; + padding: 5px; +} + +#edit-login-page { + background-color: #FFFFFF; + height: 100%; +} + +#edit-login-header { + background-color: #F5F5F5; +} + +.update-button { + flex: 1; + height: 60px; + background-color: #E66000; /*matched to action_orange in java codebase*/ + color: #FFFFFF; + font-size: 20px; + font-weight: bold; + border-radius: 4px; + border-width: 0px; + margin-top: 10px; +} + +.disabled-btn { + background-color: #BFBFBF; /*matched to disabled_grey in the java codebase,in colors.xml*/ +} + +.password-btn-hide { + background-color: #777777; + color: white; +} + +.edit-login-input { + flex: 1; + height: 36px; + font-size: 15px; + color: #222222; + border-radius: 4px; + border: solid 1px #AFB1B3; + padding-left: 10px; +} + +.edit-login-div { + margin: 20px 30px; + display: flex; + flex-flow: row; + align-items: center; +} + +#password-btn { + border-radius: 4px; + border-top-left-radius: 0em 0em; + border-bottom-left-radius: 0em 0em; + font-size: 15px; + height: 40px; +} + +#password { + margin: none; + border-top-right-radius: 0em 0em; + border-bottom-right-radius: 0em 0em; +} + +.icon { + background-image: url("resource://android/res/drawable-mdpi-v4/favicon_globe.png"); + background-position: center; + background-size: 32px 32px; + background-repeat: no-repeat; + height: 32px; + width: 32px; + visibility: hidden; +} + +@media screen and (min-resolution: 1.25dppx) { + #filter-button { + background-image: url("resource://android/res/drawable-hdpi-v4/ab_search.png"); + } + + #filter-clear { + background-image: url("resource://android/res/drawable-hdpi-v4/close_edit_mode_light.png"); + } + + .icon { + background-image: url("resource://android/res/drawable-hdpi-v4/favicon_globe.png"); + } +} + +@media screen and (min-resolution: 2dppx) { + #filter-button { + background-image: url("resource://android/res/drawable-xhdpi-v4/ab_search.png"); + } + + #filter-clear { + background-image: url("resource://android/res/drawable-hdpi-v4/close_edit_mode_light.png"); + } + + .icon { + background-image: url("resource://android/res/drawable-xhdpi-v4/favicon_globe.png"); + } +} + +#loading-img-container{ + display: flex; + align-items: center; + justify-content: center; +} + +#spinner { + margin-top: 60px; +} + +#empty-body { + padding-left: 60px; + padding-right: 60px; +} + +#empty-obj-text-container { + display: flex; + flex-flow: column; + align-items: center; + text-align: center; + justify-content: center; +} + +.empty-text { + color: #363B40; + font-size: 25px; + font-weight: lighter; + margin-bottom: 20px; +} + +.empty-hint { + color: #777777; + font-size: 20px; +} + +#empty-icon { + margin-top: 60px; + margin-bottom: 20px; +} diff --git a/mobile/android/themes/core/aboutMemory.css b/mobile/android/themes/core/aboutMemory.css new file mode 100644 index 000000000..a4f0887da --- /dev/null +++ b/mobile/android/themes/core/aboutMemory.css @@ -0,0 +1,149 @@ +/* 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 version used for desktop is located at + * toolkit/components/aboutmemory/content/aboutMemory.css. + * Mobile-specific stuff is at the bottom of this file. + */ + +html { + background: -moz-Dialog; + font: message-box; +} + +body { + padding: 0 2em; + margin: 0; + min-width: 45em; + margin: auto; +} + +div.ancillary { + margin: 0.5em 0; + -moz-user-select: none; +} + +div.section { + padding: 2em; + margin: 1em 0em; + border: 1px solid ThreeDShadow; + border-radius: 10px; + background: -moz-Field; +} + +div.opsRow { + padding: 0.5em; + margin-right: 0.5em; + margin-top: 0.5em; + border: 1px solid ThreeDShadow; + border-radius: 10px; + background: -moz-Field; + display: inline-block; +} + +div.opsRowLabel { + display: block; + margin-bottom: 0.2em; + font-weight: bold; +} + +.opsRowLabel label { + margin-left: 1em; + font-weight: normal; +} + +div.non-verbose pre.entries { + overflow-x: auto; + text-overflow: ellipsis; +} + +h1 { + padding: 0; + margin: 0; +} + +h2 { + background: #ddd; + padding-left: .1em; +} + +.accuracyWarning { + color: #d22; +} + +.badInputWarning { + color: #f00; +} + +.treeline { + color: #888; +} + +.mrValue { + font-weight: bold; + color: #400; +} + +.mrPerc { +} + +.mrSep { +} + +.mrName { + color: #004; +} + +.mrNote { + color: #604; +} + +.hasKids { + cursor: pointer; +} + +.hasKids:hover { + text-decoration: underline; +} + +.noselect { + -moz-user-select: none; /* no need to include this when cutting+pasting */ +} + +.option { + font-size: 80%; + -moz-user-select: none; /* no need to include this when cutting+pasting */ +} + +.legend { + font-size: 80%; + -moz-user-select: none; /* no need to include this when cutting+pasting */ +} + +.debug { + font-size: 80%; +} + +.hidden { + display: none; +} + +.invalid { + color: #fff; + background-color: #f00; +} + +/* Mobile-specific parts go here. */ + +/* buttons are different sizes and overlapping without this */ +button { + margin: 1%; + padding: 2%; +} + +.hiddenOnMobile { + display: none; +} + diff --git a/mobile/android/themes/core/aboutPage.css b/mobile/android/themes/core/aboutPage.css new file mode 100644 index 000000000..a7fcbb91e --- /dev/null +++ b/mobile/android/themes/core/aboutPage.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/. */ + +body { + -moz-text-size-adjust: none; + font-family: "Clear Sans",sans-serif; + font-size: 23px; + color: #222222; + background-color: #ced7de; +} + +#header { + height: 80px; +} + +#wordmark { + margin: 30px 0 0 15px; + width: 123px; + height: 36px; + background: url("chrome://browser/skin/images/wordmark-hdpi.png") no-repeat; +} + +#version { + margin: 0 0 0 15px; + font-size: 15px; +} + +#banner { + min-height: 150px; + background-color: #bdc7ce; +} + +#logo { + position: absolute; + top: 0; + right: 0; + width: 375px; + height: 300px; + background: url("chrome://browser/skin/images/logo-hdpi.png") no-repeat; +} + +#updateBox { + position: relative; + top: 40px; + margin: 0 auto; + width: 60%; /* looks much larger!? */ + padding: 20px 1em; + text-align: center; + background-image: url("chrome://browser/skin/images/about-btn-darkgrey.png"); + background-size: contain; + border-bottom-width: 4px; + border-bottom-style: solid; + border-bottom-color: #3A3F44; + border-radius: 8px; + box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3); +} + +#update-message-checking, +#update-message-none, +#update-message-found, +#update-message-downloading, +#update-message-downloaded { + display: none; +} + +#messages { + position: relative; + width: 70%; + margin: 40px auto 0 auto; + padding: 10px 0; + font-size: 15px; + text-align: center; +} + +#telemetry a { + text-decoration: underline; +} + +#aboutLinks { + margin: 0 0 15px 0; + padding: 0; +} + +#aboutLinks > li { + line-height: 2.6; + border-top: 1px solid white; + border-bottom: 1px solid #C1C7CC; +} + +#aboutLinks > li > a { + padding-left: 25px; + display: block; +} + +#aboutDetails { + padding-left: 15px; + font-size: 15px; +} + +.top-border { + border-bottom: 1px solid #C1C7CC; +} + +.bottom-border { + border-top: 1px solid white; +} + +a, span { + text-decoration: none; + color: #222222; +} + +#updateBox > a, +#updateBox > span { + color: #e5f2ff; +} diff --git a/mobile/android/themes/core/aboutPrivateBrowsing.css b/mobile/android/themes/core/aboutPrivateBrowsing.css new file mode 100644 index 000000000..fb528497e --- /dev/null +++ b/mobile/android/themes/core/aboutPrivateBrowsing.css @@ -0,0 +1,84 @@ +/* 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/. */ + +body { + font-family: "Clear Sans",sans-serif; + font-size: 16px; + text-align: center; + padding: 0 30px 0; +} + +body.normal .showPrivate, +body.private .showNormal { + display: none; +} + +div.contentSection { + max-width: 400px; + margin:auto; +} + +body.private { + background-color: #363b40; /* text_and_tabs_tray_grey */ + color: #afb1b3; /* tabs_tray_icon_grey */ +} + +body.normal { + background-color: #eeeeee; + color: #777777; /* placeholder gray */ +} + +h1 { + font-size: 20px; + font-weight: 100; + text-align: center; + margin: 0; +} + +body.normal h1 { + color: #363b40; /* text_and_tabs_tray_grey */ +} + +a { + color: #0096DD; /* link_blue */ + text-decoration: none; +} + +.masq { + display: block; + height: auto; + margin: 0 auto 20px auto; +} + +.masq.showNormal { + width: 80px; +} + +.masq.showPrivate { + width: 160px; +} + +@media all and (max-height: 399px) { + body { + margin-top: 30px; + } +} + +@media all and (min-height: 400px) and (max-height: 599px) { + body { + margin-top: 60px; + } +} + +@media all and (min-height: 600px) and (max-height: 799px) { + body { + margin-top: 120px; + } +} + +@media all and (min-height: 800px) { + body { + margin-top: 240px; + } +} diff --git a/mobile/android/themes/core/aboutReader.css b/mobile/android/themes/core/aboutReader.css new file mode 100644 index 000000000..2df2d1ff6 --- /dev/null +++ b/mobile/android/themes/core/aboutReader.css @@ -0,0 +1,120 @@ +/* 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/. */ + +html { + -moz-text-size-adjust: none; +} + +body { + padding: 20px; + transition-property: background-color, color; + transition-duration: 0.4s; + max-width: 35em; + margin-left: auto; + margin-right: auto; +} + +body.light { + background-color: #ffffff; + color: #222222; +} + +body.dark { + background-color: #222222; + color: #eeeeee; +} + +body.sans-serif { + font-family: sans-serif; +} + +body.serif { + font-family: serif; +} + +#container.font-size1 { + font-size: 10px; +} + +#container.font-size2 { + font-size: 12px; +} + +#container.font-size3 { + font-size: 14px; +} + +#container.font-size4 { + font-size: 16px; +} + +#container.font-size5 { + font-size: 18px; +} + +#container.font-size6 { + font-size: 20px; +} + +#container.font-size7 { + font-size: 22px; +} + +#container.font-size8 { + font-size: 24px; +} + +#container.font-size9 { + font-size: 26px; +} + +/* Override some controls and content styles based on color scheme */ + +body.light > .container > .header > .domain { + color: #ee7600; + border-bottom-color: #d0d0d0; +} + +body.light > .container > .header > h1 { + color: #222222; +} + +body.light > .container > .header > .credits { + color: #898989; +} + +body.dark > .container > .header > .domain { + color: #ff9400; + border-bottom-color: #777777; +} + +body.dark > .container > .header > h1 { + color: #eeeeee; +} + +body.dark > .container > .header > .credits { + color: #aaaaaa; +} + +body.light > .container > .content .caption, +body.light > .container > .content .wp-caption-text, +body.light > .container > .content figcaption { + color: #898989; +} + +body.dark > .container > .content .caption, +body.dark > .container > .content .wp-caption-text, +body.dark > .container > .content figcaption { + color: #aaaaaa; +} + +body.light > .container > .content blockquote { + color: #898989 !important; + border-left-color: #d0d0d0 !important; +} + +body.dark > .container > .content blockquote { + color: #aaaaaa !important; + border-left-color: #777777 !important; +} diff --git a/mobile/android/themes/core/aboutReaderContent.css b/mobile/android/themes/core/aboutReaderContent.css new file mode 100644 index 000000000..fe6451df2 --- /dev/null +++ b/mobile/android/themes/core/aboutReaderContent.css @@ -0,0 +1,114 @@ +/* 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/. */ + +#moz-reader-content { + display: none; + font-size: 1em; +} + +a { + text-decoration: underline !important; + font-weight: normal; +} + +a, +a:visited, +a:hover, +a:active { + color: #00acff !important; +} + +* { + max-width: 100% !important; + height: auto !important; +} + +p { + line-height: 1.4em !important; + margin: 0px !important; + margin-bottom: 20px !important; +} + +/* Covers all images showing edge-to-edge using a + an optional caption text */ +.wp-caption, +figure { + display: block !important; + width: 100% !important; + margin: 0px !important; + margin-bottom: 32px !important; +} + +/* Images marked to be shown edge-to-edge with an + optional captio ntext */ +p > img:only-child, +p > a:only-child > img:only-child, +.wp-caption img, +figure img { + display: block; + margin-left: auto; + margin-right: auto; +} + +/* Account for body padding to make image full width */ +img[moz-reader-full-width] { + width: calc(100% + 40px); + margin-left: -20px; + margin-right: -20px; + max-width: none !important; +} + +/* Image caption text */ +.caption, +.wp-caption-text, +figcaption { + font-size: 0.9em; + font-family: sans-serif; + margin: 0px !important; + padding-top: 4px !important; +} + +/* Ensure all pre-formatted code inside the reader content + are properly wrapped inside content width */ +code, +pre { + white-space: pre-wrap !important; + margin-bottom: 20px !important; +} + +blockquote { + margin: 0px !important; + margin-bottom: 20px !important; + padding: 0px !important; + padding-inline-start: 16px !important; + border: 0px !important; + border-left: 2px solid !important; +} + +ul, +ol { + margin: 0px !important; + margin-bottom: 20px !important; + padding: 0px !important; + line-height: 1.5em; +} + +ul { + padding-inline-start: 30px !important; + list-style: disc !important; +} + +ol { + padding-inline-start: 35px !important; + list-style: decimal !important; +} + +/* Hide elements with common "hidden" class names */ +.visually-hidden, +.visuallyhidden, +.hidden, +.invisible, +.sr-only { + display: none; +} diff --git a/mobile/android/themes/core/aboutReaderControls.css b/mobile/android/themes/core/aboutReaderControls.css new file mode 100644 index 000000000..642dbc237 --- /dev/null +++ b/mobile/android/themes/core/aboutReaderControls.css @@ -0,0 +1,290 @@ +/* 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/. */ + +#reader-message { + margin-top: 40px; + display: none; + text-align: center; + width: 100%; + font-size: 0.9em; +} + +.header { + text-align: start; + display: none; +} + +.domain, +.credits { + font-size: 0.9em; + font-family: sans-serif; +} + +.domain { + margin-top: 10px; + padding-bottom: 10px; + color: #00acff !important; + text-decoration: none; +} + +.domain-border { + margin-top: 15px; + border-bottom: 1.5px solid #777777; + width: 50%; +} + +.header > h1 { + font-size: 1.33em; + font-weight: 700; + line-height: 1.1em; + width: 100%; + margin: 0px; + margin-top: 32px; + margin-bottom: 16px; + padding: 0px; +} + +.header > .credits { + padding: 0px; + margin: 0px; + margin-bottom: 32px; +} + +/*======= Controls toolbar =======*/ + +.toolbar { + font-family: sans-serif; + position: fixed; + width: 100%; + left: 0; + margin: 0; + padding: 0; + bottom: 0; + list-style: none; + pointer-events: none; +} + +.toolbar > * { + float: right; +} + +.button { + width: 56px; + height: 56px; + display: block; + background-position: center; + background-size: 26px 16px; + background-repeat: no-repeat; + background-color: #E66000; + border-radius: 10000px; + margin: 20px; + border: 0; + box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.40); +} + +.button:active { + background-color: #DC5600; +} + +/* Remove dotted border when button is focused */ +.button::-moz-focus-inner, +.dropdown-popup > div > button::-moz-focus-inner { + border: 0; +} + +.button[hidden] { + display: none; +} + +.dropdown-toggle, +#reader-popup { + pointer-events: auto; +} + +.dropdown { + left: 0; + text-align: center; + display: inline-block; + list-style: none; + margin: 0px; + padding: 0px; +} + +/*======= Font style popup =======*/ + +.dropdown-popup { + position: absolute; + left: 0; + width: calc(100% - 30px); + margin: 15px; + z-index: 1000; + background: #EBEBF0; + visibility: hidden; + border: 0; + border-radius: 4px; + box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.40); + -moz-user-select: none; +} + +/* Only used on desktop */ +.dropdown-popup > hr, +.dropdown-arrow, +#font-type-buttons > button > .name, +#content-width-buttons, +#line-height-buttons { + display: none; +} + +.open > .dropdown-popup { + visibility: visible; + bottom: 0; +} + +#font-type-buttons, +#font-size-buttons, +#color-scheme-buttons { + display: flex; + flex-direction: row; +} + +#font-type-buttons > button, +#color-scheme-buttons > button { + text-align: center; +} + +#font-type-buttons > button, +#font-size-buttons > button { + width: 50%; + background-color: transparent; + border: 0; +} + +#font-type-buttons > button { + font-size: 24px; + color: #AFB1B3; + padding: 15px 0; +} + +#font-type-buttons > button:active, +#font-type-buttons > button.selected { + color: #222222; +} + +#font-size-sample { + flex: 0; + font-size: 24px; + color: #000000; + margin: 0 30px; + padding: 0 10px; +} + +.serif-button { + font-family: serif; +} + +.minus-button, +.plus-button { + background-color: transparent; + border: 0; + height: 60px; + background-size: 18px 18px; + background-repeat: no-repeat; + background-position: center; +} + +.minus-button { + background-size: 24px 6px; + margin-left: 50px; + padding: 0 5px; +} + +.plus-button { + background-size: 24px 24px; + margin-right: 50px; + padding: 0 5px; +} + +#color-scheme-buttons > button { + width: 33%; + border-radius: 4px; + border: 1px solid #BFBFBF; + padding: 10px; + margin: 15px 10px; + font-size: 14px; +} + +#color-scheme-buttons > button:active, +#color-scheme-buttons > button.selected { + border: 2px solid #FF9500; +} + +.dark-button { + color: #eeeeee; + background-color: #333333; +} + +.auto-button { + color: #000000; + background-color: transparent; +} + +.light-button { + color: #333333; + background-color: #ffffff; +} + +/*======= Toolbar icons =======*/ + +/* desktop-only controls */ +.close-button { + display: none; +} + +.style-button { + background-image: url('chrome://browser/skin/images/reader-style-icon-hdpi.png'); +} + +.minus-button { + background-image: url('chrome://browser/skin/images/reader-minus-hdpi.png'); +} + +.plus-button { + background-image: url('chrome://browser/skin/images/reader-plus-hdpi.png'); +} + +@media screen and (min-resolution: 2dppx) { + .style-button { + background-image: url('chrome://browser/skin/images/reader-style-icon-xhdpi.png'); + } + + .minus-button { + background-image: url('chrome://browser/skin/images/reader-minus-xhdpi.png'); + } + + .plus-button { + background-image: url('chrome://browser/skin/images/reader-plus-xhdpi.png'); + } +} + +@media screen and (min-resolution: 3dppx) { + .style-button { + background-image: url('chrome://browser/skin/images/reader-style-icon-xxhdpi.png'); + } + + .minus-button { + background-image: url('chrome://browser/skin/images/reader-minus-xxhdpi.png'); + } + + .plus-button { + background-image: url('chrome://browser/skin/images/reader-plus-xxhdpi.png'); + } +} + +@media screen and (min-width: 960px) { + .dropdown-popup { + width: 350px; + left: auto; + right: 0; + } +} diff --git a/mobile/android/themes/core/aboutSupport.css b/mobile/android/themes/core/aboutSupport.css new file mode 100644 index 000000000..de21e5b73 --- /dev/null +++ b/mobile/android/themes/core/aboutSupport.css @@ -0,0 +1,97 @@ +/* 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/. */ + +html { + background-color: -moz-Field; + color: -moz-FieldText; + font: message-box; +} + +body { + width: 90%; + margin-left: 5%; + margin-right: 5%; +} + +.page-subtitle { + margin-bottom: 3em; +} + +.major-section { + margin-top: 2em; + margin-bottom: 1em; + font-size: large; + text-align: start; + font-weight: bold; +} + +#copy-raw-data-to-clipboard, +#copy-to-clipboard { + padding-top: 2%; + width: 100%; + padding-bottom: 2%; + margin: 1%; +} + +table { + background-color: -moz-Dialog; + color: -moz-DialogText; + font: message-box; + font-size: xx-large; + text-align: start; + width: 100%; + border: 1px solid ThreeDShadow; + border-spacing: 0px; +} + +th, td { + border: 1px dotted ThreeDShadow; + padding: 3px; +} + +thead th { + text-align: center; +} + +th { + text-align: start; + background-color: Highlight; + color: HighlightText; +} + +th.column { + white-space: nowrap; + width: 0px; +} + +td { + text-align: start; + border-top: 1px dotted ThreeDShadow; +} + +.prefs-table { + width: 100%; + table-layout: fixed; +} + +.pref-name { + width: 70%; + white-space: nowrap; + overflow: hidden; +} + +.pref-value { + width: 30%; + white-space: nowrap; + overflow: hidden; +} + +#profile-row { + display: none; +} + +#reset-box { + display: none; +} + diff --git a/mobile/android/themes/core/config.css b/mobile/android/themes/core/config.css new file mode 100644 index 000000000..38be7b47c --- /dev/null +++ b/mobile/android/themes/core/config.css @@ -0,0 +1,333 @@ +/* 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/. */ + +html, +body { + margin: 0; + padding: 0; + background-color: #ced7de; + -moz-user-select: none; + font-family: "Clear Sans",sans-serif; + -moz-text-size-adjust: none; +} + +.toolbar { + width: 100%; + height: 3em; + position: fixed; + top: 0; + left: 0; + z-index: 10; + box-shadow: 0 0 3px #444; + background-color: #ced7de; + color: #000000; + font-weight: bold; + border-bottom: 2px solid; + -moz-border-bottom-colors: #ff9100 #f27900; +} + +.toolbar-container { + max-width: 40em; + margin-left: auto; + margin-right: auto; +} + +#filter-container { + margin-top: 0.5em; + margin-bottom: 0.5em; + margin-right: 0.5em; + height: 2em; + border: 1px solid transparent; + border-image-source: url("chrome://browser/skin/images/textfield.png"); + border-image-slice: 1 1 3 1; + border-image-width: 1px 1px 3px 1px; + overflow: hidden; + display: flex; + flex-direction: row; +} + +#filter-input { + -moz-appearance: none; + border: none; + background-image: none; + background-color: transparent; + display: inline-block; + width: 12em; + min-width: 0; + color: #000000; + opacity: 1; + flex: 1 1 auto; +} + +#filter-input::placeholder { + color: #777777; +} + +.toolbar input { + display: inline-block; + height: 100%; + min-width: 3em; + box-sizing: border-box; + opacity: 0.75; +} + +#new-pref-toggle-button { + background-position: center center; + background-image: url("chrome://browser/skin/images/config-plus.png"); + background-size: 48px 48px; + height: 48px; + width: 48px; + display: inline-block; + outline-style: none; +} + +#filter-search-button { + background-image: url("chrome://browser/skin/images/search.png"); + background-size: 32px 32px; + height: 32px; + width: 32px; + display: inline-block; + outline-style: none; +} + +#filter-input-clear-button { + background-image: url("chrome://browser/skin/images/search-clear-30.png"); + background-size: 32px 32px; + height: 32px; + width: 32px; + display: inline-block; + outline-style: none; +} + +#filter-input[value=""] + #filter-input-clear-button { + display: none; +} + +.toolbar-item { + display: inline-block; + height: 3em; + min-width: 3em; + float: right; +} + +#content { + position: relative; + margin: 0; + margin-left: auto; + margin-right: auto; + padding-top: 3em; + padding-left: 0; + padding-right: 0; + min-height: 100%; + max-width: 40em; +} + +ul { + list-style-position: inside; + border: 1px solid #808080; + background-color: #ffffff; + min-height: 100%; + width: 100%; + padding-top: 0; + margin: 0; + padding-left: 0; + box-sizing: border-box; + box-shadow: 0 0 5px #000000; + overflow-x: hidden; +} + +#new-pref-container { + width: 100%; + margin: 0; + background-color: #ffffff; + box-sizing: border-box; + box-shadow: 0 0 5px #000000; + overflow-x: hidden; + max-width: 40em; + max-height: 100%; + position: fixed; + top: 3em; + left: auto; + display: none; + z-index: 5; +} + +#new-pref-container input, +#new-pref-container select { + border: none; + background-image: none; +} + +#new-pref-container.show { + display: block; +} + +li { + list-style-type: none; + border-bottom: 1px solid #d3d3d3; + opacity: 1; + background-color: #ffffff; + cursor: pointer; +} + +#new-pref-line-boolean, +#new-pref-value-string, +#new-pref-value-int { + display: none; +} +#new-pref-item[typestyle="boolean"] #new-pref-line-boolean, +#new-pref-item[typestyle="string"] #new-pref-value-string, +#new-pref-item[typestyle="int"] #new-pref-value-int { + display: block; +} + +.pref-name, +.pref-value { + padding: 15px 10px; + text-align: left; + text-overflow: ellipsis; + overflow: hidden; + background-image: none; +} + +.pref-value { + color: rgba(0,0,0,0.5); + flex: 1 1 auto; + border: none; + -moz-appearance: none; + background-image: none; + background-color: transparent; +} + +.pref-name[locked] { + padding-right: 20px; + background-image: url("chrome://browser/skin/images/lock.png"); + background-repeat: no-repeat; + background-position: right 50%; + background-size: auto 60%; +} + +#new-pref-name { + width: 30em; +} + +#new-pref-type { + display: inline-block !important; + border-left: 1px solid #d3d3d3; + width: 10em; + text-align: right; +} + +.pref-item-line { + border-top: 1px solid rgba(0,0,0,0.05); + color: rgba(0,0,0,0.5); + display: flex; + flex-direction: row; +} + +#new-pref-value-boolean { + flex: 1 1 auto; +} + +#new-pref-container .pref-button.toggle { + display: inline-block; + opacity: 1; + flex: 0 1 auto; + float: right; +} + +#new-pref-container .pref-button.cancel, +#new-pref-container .pref-button.create { + display: inline-block; + opacity: 1; + flex: 1 1 auto; +} + +.pref-item-line { + pointer-events: none; +} + +#new-pref-container .pref-item-line, +.pref-item.selected .pref-item-line, +.pref-item:not(.selected) .pref-button.reset { + pointer-events: auto; +} + +#new-pref-container .pref-button.create[disabled] { + color: #d3d3d3; +} + +.pref-item.selected { + background-color: rgba(0,0,255,0.05); +} + +.pref-button { + display: inline-block; + box-sizing: border-box; + text-align: center; + padding: 10px 1em; + border-left: 1px solid rgba(0,0,0,0.1); + opacity: 0; + transition-property: opacity; + transition-duration: 500ms; +} + +.pref-item.selected .pref-item-line .pref-button { + opacity: 1; +} + +.pref-item:not(.selected) .pref-item-line .pref-button:not(.reset) { + display: none; +} + +.pref-item:not(.selected) .pref-button.reset { + opacity: 1; +} + +.pref-button:active { + background-color: rgba(0,0,255,0.2); +} + +.pref-button[disabled] { + display: none; +} + +.pref-button.up { + background-image: url("chrome://browser/skin/images/arrowup-16.png"); + background-position: center center; + background-repeat: no-repeat; +} + +.pref-button.down { + background-image: url("chrome://browser/skin/images/arrowdown-16.png"); + background-position: center center; + background-repeat: no-repeat; +} + +#prefs-shield { + width: 100%; + height: 100%; + background-color: rgba(0,0,0,0.5); + position: fixed; + top: 0; + left: 0; + opacity: 0; + transition-property: opacity; + transition-duration: 500ms; + display: none; +} + +#prefs-shield[shown] { + display: block; + opacity: 1; +} + +#loading-container > li { + background-image: url(chrome://browser/skin/images/throbber.png); + background-position: center center; + background-repeat: no-repeat; + padding-left: 40px; + height: 3em; + width: 100%; +} diff --git a/mobile/android/themes/core/content.css b/mobile/android/themes/core/content.css new file mode 100644 index 000000000..58063db09 --- /dev/null +++ b/mobile/android/themes/core/content.css @@ -0,0 +1,414 @@ +/* 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 "defines.css"; +@import "scrollbar.css"; + +@namespace url("http://www.w3.org/1999/xhtml"); +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +::-moz-selection { + background-color: var(--color_background_highlight); + color: var(--color_text_highlight); +} + +/* Style the scrollbars */ +xul|scrollbar[root="true"] { + position: relative; + z-index: 2147483647; +} + +xul|scrollbar { + -moz-appearance: none !important; + -moz-binding: url("chrome://global/content/bindings/scrollbar.xml#scrollbar"); + background-color: transparent !important; + background-image: none !important; + border: 0px solid transparent !important; + pointer-events: none; +} + +/* Scrollbar code will reset the margin to the correct side depending on + where layout actually puts the scrollbar */ +xul|scrollbar[orient="vertical"] { + margin-left: -6px; + min-width: 6px; + max-width: 6px; +} + +xul|scrollbar[orient="vertical"] xul|thumb { + -moz-appearance: scrollbarthumb-vertical !important; + max-width: 2px !important; + min-width: 2px !important; +} + +xul|scrollbar[orient="horizontal"] { + margin-top: -6px; + min-height: 6px; + max-height: 6px; +} + +xul|scrollbar[orient="horizontal"] xul|thumb { + -moz-appearance: scrollbarthumb-horizontal !important; + max-height: 2px !important; + min-height: 2px !important; +} + +xul|scrollbar:not([active="true"]), +xul|scrollbar[disabled] { + opacity: 0; +} + +xul|scrollbarbutton { + min-height: 6px !important; + min-width: 6px !important; + -moz-appearance: none !important; + visibility: hidden; +} + +xul|scrollbarbutton[sbattr="scrollbar-up-top"], +xul|scrollbarbutton[sbattr="scrollbar-bottom-top"] { + display: none; +} + +xul|scrollbar xul|thumb { + background-color: rgba(119, 119, 119, 0.4) !important; + -moz-border-top-colors: none !important; + -moz-border-bottom-colors: none !important; + -moz-border-right-colors: none !important; + -moz-border-left-colors: none !important; + border: none; + border-radius: 4px; +} + +xul|scrollbarbutton { + background-image: none !important; +} + +select:not([size]):not([multiple]) > xul|scrollbar, +select[size="1"] > xul|scrollbar, +select:not([size]):not([multiple]) xul|scrollbarbutton, +select[size="1"] xul|scrollbarbutton { + display: block; + margin-left: 0; + min-width: 16px; +} + +/* Override inverse OS themes */ +textarea, +button, +xul|button, +* > input:not([type="image"]) { + -moz-appearance: none !important; /* See bug 598421 for fixing the platform */ + border-radius: var(--form_border_radius); +} + +select[size], +select[multiple], +select[size][multiple], +textarea, +* > input:not([type="image"]):not([type="image"]) { + border-style: solid; + border-color: var(--form_border); + color: var(--form_text); + background-color: var(--form_background); +} + +/* Selects are handled by the form helper, see bug 685197 */ +select option, select optgroup { + pointer-events: none; +} + +select:not([size]):not([multiple]), +select[size="0"], +select[size="1"], +* > input[type="button"], +* > input[type="submit"], +* > input[type="reset"], +button { + border-style: solid; + border-color: var(--form_border); + color: var(--form_text); + background-color: var(--form_background); +} + +input[type="checkbox"] { + background: var(--form_background); +} + +input[type="radio"] { + background: var(--form_background) +} + +select { + border-width: 1px; + padding: 1px; + border-radius: var(--form_border_radius); +} + +select:not([size]):not([multiple]), +select[size="0"], +select[size="1"] { + padding: 0 1px 0 1px; +} + +* > input:not([type="image"]) { + border-width: 1px; + padding: 1px; +} + +textarea { + resize: none; + border-width: 1px; + padding-inline-start: 1px; + padding-inline-end: 1px; + padding-block-start: 2px; + padding-block-end: 2px; +} + +input[type="button"], +input[type="submit"], +input[type="reset"], +button { + border-width: 1px; + padding-inline-start: 7px; + padding-inline-end: 7px; + padding-block-start: 0; + padding-block-end: 0; +} + +input[type="radio"], +input[type="checkbox"] { + border: 1px solid var(--form_border) !important; + padding-inline-start: 1px; + padding-inline-end: 1px; + padding-block-start: 2px; + padding-block-end: 2px; +} + +select > button { + border-width: 0px !important; + margin: 0px !important; + padding: 0px !important; + border-radius: 0; + color: #414141; + + background-size: auto auto; + background-color: transparent; + background-image: url("chrome://browser/skin/images/dropmarker.svg") !important; + background-position: calc(50% + 1px) center !important; + background-repeat: no-repeat !important; + + font-size: inherit; +} + +select[size]:focus, +select[multiple]:focus, +select[size][multiple]:focus, +textarea:focus, +input[type="file"]:focus > input[type="text"], +* > input:not([type="image"]):focus { + outline: 0px !important; + border-style: solid; + border-color: var(--form_border); + background-color: var(--form_background); +} + +select:not([size]):not([multiple]):focus, +select[size="0"]:focus, +select[size="1"]:focus, +input[type="button"]:focus, +input[type="submit"]:focus, +input[type="reset"]:focus, +button:focus { + outline: 0px !important; + border-style: solid; + border-color: var(--form_border); + background-color: var(--form_background); +} + +input[type="checkbox"]:focus, +input[type="radio"]:focus { + border-color: var(--form_border) !important; +} + +input[type="checkbox"]:focus { + background: var(--form_background); +} + +input[type="radio"]:focus { + background: var(--form_background); +} + +/* we need to be specific for selects because the above rules are specific too */ +textarea:disabled, +select[size]:disabled, +select[multiple]:disabled, +select[size][multiple]:disabled, +select:not([size]):not([multiple]):disabled, +select[size="0"]:disabled, +select[size="1"]:disabled, +button:disabled, +button:disabled:active, +* > input:not([type="image"]):disabled, +* > input:not([type="image"]):disabled:active { + color: var(--form_text_disabled); + border-color: var(--form_border); + border-style: solid; + border-width: 1px; + background: var(--form_background_disabled); +} + +select:not([size]):not([multiple]):disabled, +select[size="0"]:disabled, +select[size="1"]:disabled { + background: var(--form_background_disabled); +} + +input[type="button"]:disabled, +input[type="button"]:disabled:active, +input[type="submit"]:disabled, +input[type="submit"]:disabled:active, +input[type="reset"]:disabled, +input[type="reset"]:disabled:active, +button:disabled, +button:disabled:active { + padding-inline-start: 7px; + padding-inline-end: 7px; + padding-block-start: 0; + padding-block-end: 0; + background: var(--form_background_disabled); +} + +input[type="radio"]:disabled, +input[type="radio"]:disabled:active, +input[type="radio"]:disabled:hover, +input[type="radio"]:disabled:hover:active, +input[type="checkbox"]:disabled, +input[type="checkbox"]:disabled:active, +input[type="checkbox"]:disabled:hover, +input[type="checkbox"]:disabled:hover:active { + border:1px solid var(--form_border) !important; +} + +select:disabled > button { + opacity: 0.6; + padding-inline-start: 7px; + padding-inline-end: 7px; + padding-block-start: 1px; + padding-block-end: 1px; +} + +/* -moz-touch-enabled? media elements */ +:-moz-any(video, audio) > xul|videocontrols { + -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#touchControls"); +} + +/* display click to play when autoplay is blocked for videos */ +video:not([controls]) > xul|videocontrols { + visibility: visible; + -moz-binding: url("chrome://global/content/bindings/videocontrols.xml#noControls"); +} + +*:any-link:active, +*[role=button]:active, +button:not(:disabled):active, +input:not(:focus):not(:disabled):active, +select:not(:disabled):active, +textarea:not(:focus):not(:disabled):active, +option:active, +label:active, +xul|menulist:active { + background-color: var(--color_background_highlight_overlay); +} + +button:active:hover, +input[type="color"]:-moz-system-metric(color-picker-available):active:hover, +input[type="reset"]:active:hover, +input[type="button"]:active:hover, +input[type="submit"]:active:hover { + padding-inline-end: 7px; + padding-inline-start: 7px; +} + +input[type=number] > div > div, /* work around bug 946184 */ +input[type=number]::-moz-number-spin-box { + display: none; +} + +/* Override accessiblecaret css in layout/style/ua.css */ +div:-moz-native-anonymous.moz-accessiblecaret > #text-overlay, +div:-moz-native-anonymous.moz-accessiblecaret > #image { + /* border: 0.1px solid red; */ /* Uncomment border to see the touch target. */ + padding-left: 59%; /* Enlarge the touch area. ((48-22)/2)px / 22px ~= 59% */ + padding-right: 59%; /* Enlarge the touch area. */ + left: -59%; +} + +div:-moz-native-anonymous.moz-accessiblecaret > #image { + padding-bottom: 59%; /* Enlarge the touch area. */ +} + +div:-moz-native-anonymous.moz-accessiblecaret.normal > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-normal-hdpi.png"); +} + +div:-moz-native-anonymous.moz-accessiblecaret.left > #text-overlay, +div:-moz-native-anonymous.moz-accessiblecaret.left > #image { + margin-left: -50%; +} + +div:-moz-native-anonymous.moz-accessiblecaret.left > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-left-hdpi.png"); +} + +div:-moz-native-anonymous.moz-accessiblecaret.right > #text-overlay, +div:-moz-native-anonymous.moz-accessiblecaret.right > #image { + margin-left: 47%; +} + +div:-moz-native-anonymous.moz-accessiblecaret.right > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-right-hdpi.png"); +} + +@media (min-resolution: 1.5dppx) { + div:-moz-native-anonymous.moz-accessiblecaret.normal > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-normal-hdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.left > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-left-hdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.right > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-right-hdpi.png"); + } +} + +@media (min-resolution: 2dppx) { + div:-moz-native-anonymous.moz-accessiblecaret.normal > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-normal-xhdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.left > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-left-xhdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.right > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-right-xhdpi.png"); + } +} + +@media (min-resolution: 2.25dppx) { + div:-moz-native-anonymous.moz-accessiblecaret.normal > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-normal-xxhdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.left > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-left-xxhdpi.png"); + } + + div:-moz-native-anonymous.moz-accessiblecaret.right > #image { + background-image: url("chrome://browser/skin/images/accessiblecaret-tilt-right-xxhdpi.png"); + } +} diff --git a/mobile/android/themes/core/defines.css b/mobile/android/themes/core/defines.css new file mode 100644 index 000000000..dd1ef3142 --- /dev/null +++ b/mobile/android/themes/core/defines.css @@ -0,0 +1,18 @@ +:root { + --form_border: #bfbfbf; + --form_border_radius: 2px; + --form_text: #363b40; + --form_text_disabled: #bebebe; + --form_background: white; + --form_background_disabled: #f5f5f5; + + --color_about_background: #f5f5f5; + --color_about_item: #ffffff; + --color_about_item_border: #d7d9db; + + --color_background_highlight: rgba(255, 149, 0, 0.6); + --color_background_highlight_overlay: rgba(171, 171, 171, 0.5); + --color_text_highlight: #000; + + --margin_snormal: 0.64mm; +} diff --git a/mobile/android/themes/core/images/about-btn-darkgrey.png b/mobile/android/themes/core/images/about-btn-darkgrey.png new file mode 100644 index 000000000..24e2aae83 Binary files /dev/null and b/mobile/android/themes/core/images/about-btn-darkgrey.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png new file mode 100644 index 000000000..7f11a3c40 Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png new file mode 100644 index 000000000..7c7cc65dd Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png new file mode 100644 index 000000000..411d814ed Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png new file mode 100644 index 000000000..838e9ab4d Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png new file mode 100644 index 000000000..f1c6f1d88 Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png new file mode 100644 index 000000000..6d5ee52ac Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png new file mode 100644 index 000000000..97bb84235 Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png new file mode 100644 index 000000000..4eb81b9b5 Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png differ diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png new file mode 100644 index 000000000..0751b846c Binary files /dev/null and b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/amo-logo.png b/mobile/android/themes/core/images/amo-logo.png new file mode 100644 index 000000000..f18ab8cbc Binary files /dev/null and b/mobile/android/themes/core/images/amo-logo.png differ diff --git a/mobile/android/themes/core/images/arrowdown-16.png b/mobile/android/themes/core/images/arrowdown-16.png new file mode 100644 index 000000000..27e3c50c3 Binary files /dev/null and b/mobile/android/themes/core/images/arrowdown-16.png differ diff --git a/mobile/android/themes/core/images/arrowup-16.png b/mobile/android/themes/core/images/arrowup-16.png new file mode 100644 index 000000000..ad422bfb0 Binary files /dev/null and b/mobile/android/themes/core/images/arrowup-16.png differ diff --git a/mobile/android/themes/core/images/blocked-warning.png b/mobile/android/themes/core/images/blocked-warning.png new file mode 100644 index 000000000..3920aff3c Binary files /dev/null and b/mobile/android/themes/core/images/blocked-warning.png differ diff --git a/mobile/android/themes/core/images/cast-active.svg b/mobile/android/themes/core/images/cast-active.svg new file mode 100644 index 000000000..394b39ad3 --- /dev/null +++ b/mobile/android/themes/core/images/cast-active.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/mobile/android/themes/core/images/cast-ready.svg b/mobile/android/themes/core/images/cast-ready.svg new file mode 100644 index 000000000..5b6252b82 --- /dev/null +++ b/mobile/android/themes/core/images/cast-ready.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/mobile/android/themes/core/images/certerror-warning.png b/mobile/android/themes/core/images/certerror-warning.png new file mode 100644 index 000000000..053cea741 Binary files /dev/null and b/mobile/android/themes/core/images/certerror-warning.png differ diff --git a/mobile/android/themes/core/images/checkbox_checked.png b/mobile/android/themes/core/images/checkbox_checked.png new file mode 100644 index 000000000..8de545e2f Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_checked.png differ diff --git a/mobile/android/themes/core/images/checkbox_checked_disabled.png b/mobile/android/themes/core/images/checkbox_checked_disabled.png new file mode 100644 index 000000000..d93824427 Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_checked_disabled.png differ diff --git a/mobile/android/themes/core/images/checkbox_checked_pressed.png b/mobile/android/themes/core/images/checkbox_checked_pressed.png new file mode 100644 index 000000000..835b3b36b Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_checked_pressed.png differ diff --git a/mobile/android/themes/core/images/checkbox_unchecked.png b/mobile/android/themes/core/images/checkbox_unchecked.png new file mode 100644 index 000000000..5089b7fa9 Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_unchecked.png differ diff --git a/mobile/android/themes/core/images/checkbox_unchecked_disabled.png b/mobile/android/themes/core/images/checkbox_unchecked_disabled.png new file mode 100644 index 000000000..f9c8bdea0 Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_unchecked_disabled.png differ diff --git a/mobile/android/themes/core/images/checkbox_unchecked_pressed.png b/mobile/android/themes/core/images/checkbox_unchecked_pressed.png new file mode 100644 index 000000000..b682b5aaa Binary files /dev/null and b/mobile/android/themes/core/images/checkbox_unchecked_pressed.png differ diff --git a/mobile/android/themes/core/images/chevron.png b/mobile/android/themes/core/images/chevron.png new file mode 100644 index 000000000..7080dac5c Binary files /dev/null and b/mobile/android/themes/core/images/chevron.png differ diff --git a/mobile/android/themes/core/images/config-plus.png b/mobile/android/themes/core/images/config-plus.png new file mode 100644 index 000000000..10da3ed5a Binary files /dev/null and b/mobile/android/themes/core/images/config-plus.png differ diff --git a/mobile/android/themes/core/images/dropmarker-right.svg b/mobile/android/themes/core/images/dropmarker-right.svg new file mode 100644 index 000000000..a80bfc89f --- /dev/null +++ b/mobile/android/themes/core/images/dropmarker-right.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/mobile/android/themes/core/images/dropmarker.svg b/mobile/android/themes/core/images/dropmarker.svg new file mode 100644 index 000000000..8e1051d85 --- /dev/null +++ b/mobile/android/themes/core/images/dropmarker.svg @@ -0,0 +1,7 @@ + + + + + diff --git a/mobile/android/themes/core/images/errorpage-warning.png b/mobile/android/themes/core/images/errorpage-warning.png new file mode 100644 index 000000000..d2acea221 Binary files /dev/null and b/mobile/android/themes/core/images/errorpage-warning.png differ diff --git a/mobile/android/themes/core/images/exitfullscreen.svg b/mobile/android/themes/core/images/exitfullscreen.svg new file mode 100644 index 000000000..af80947fb --- /dev/null +++ b/mobile/android/themes/core/images/exitfullscreen.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/fullscreen.svg b/mobile/android/themes/core/images/fullscreen.svg new file mode 100644 index 000000000..91a77edf5 --- /dev/null +++ b/mobile/android/themes/core/images/fullscreen.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/grey-caution.svg b/mobile/android/themes/core/images/grey-caution.svg new file mode 100644 index 000000000..98d54fc44 --- /dev/null +++ b/mobile/android/themes/core/images/grey-caution.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/mobile/android/themes/core/images/icon_key_emptypage.svg b/mobile/android/themes/core/images/icon_key_emptypage.svg new file mode 100644 index 000000000..68bd0cc46 --- /dev/null +++ b/mobile/android/themes/core/images/icon_key_emptypage.svg @@ -0,0 +1,11 @@ + + + + + Key + + + + \ No newline at end of file diff --git a/mobile/android/themes/core/images/lock.png b/mobile/android/themes/core/images/lock.png new file mode 100644 index 000000000..0d3565c32 Binary files /dev/null and b/mobile/android/themes/core/images/lock.png differ diff --git a/mobile/android/themes/core/images/logo-hdpi.png b/mobile/android/themes/core/images/logo-hdpi.png new file mode 100644 index 000000000..82553891f Binary files /dev/null and b/mobile/android/themes/core/images/logo-hdpi.png differ diff --git a/mobile/android/themes/core/images/mute.svg b/mobile/android/themes/core/images/mute.svg new file mode 100644 index 000000000..0770154b9 --- /dev/null +++ b/mobile/android/themes/core/images/mute.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/pause.svg b/mobile/android/themes/core/images/pause.svg new file mode 100644 index 000000000..0b181a57e --- /dev/null +++ b/mobile/android/themes/core/images/pause.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/placeholder_image.svg b/mobile/android/themes/core/images/placeholder_image.svg new file mode 100644 index 000000000..a4174b1bb --- /dev/null +++ b/mobile/android/themes/core/images/placeholder_image.svg @@ -0,0 +1,62 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/mobile/android/themes/core/images/play.svg b/mobile/android/themes/core/images/play.svg new file mode 100644 index 000000000..5dabbc838 --- /dev/null +++ b/mobile/android/themes/core/images/play.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/privatebrowsing-mask-and-shield.svg b/mobile/android/themes/core/images/privatebrowsing-mask-and-shield.svg new file mode 100644 index 000000000..3cb48e9df --- /dev/null +++ b/mobile/android/themes/core/images/privatebrowsing-mask-and-shield.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/mobile/android/themes/core/images/privatebrowsing-mask.png b/mobile/android/themes/core/images/privatebrowsing-mask.png new file mode 100644 index 000000000..e62cdbe13 Binary files /dev/null and b/mobile/android/themes/core/images/privatebrowsing-mask.png differ diff --git a/mobile/android/themes/core/images/reader-minus-hdpi.png b/mobile/android/themes/core/images/reader-minus-hdpi.png new file mode 100644 index 000000000..d6ea9b3fd Binary files /dev/null and b/mobile/android/themes/core/images/reader-minus-hdpi.png differ diff --git a/mobile/android/themes/core/images/reader-minus-xhdpi.png b/mobile/android/themes/core/images/reader-minus-xhdpi.png new file mode 100644 index 000000000..559720054 Binary files /dev/null and b/mobile/android/themes/core/images/reader-minus-xhdpi.png differ diff --git a/mobile/android/themes/core/images/reader-minus-xxhdpi.png b/mobile/android/themes/core/images/reader-minus-xxhdpi.png new file mode 100644 index 000000000..355d82f9f Binary files /dev/null and b/mobile/android/themes/core/images/reader-minus-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/reader-plus-hdpi.png b/mobile/android/themes/core/images/reader-plus-hdpi.png new file mode 100644 index 000000000..87a326783 Binary files /dev/null and b/mobile/android/themes/core/images/reader-plus-hdpi.png differ diff --git a/mobile/android/themes/core/images/reader-plus-xhdpi.png b/mobile/android/themes/core/images/reader-plus-xhdpi.png new file mode 100644 index 000000000..ff6fc2e33 Binary files /dev/null and b/mobile/android/themes/core/images/reader-plus-xhdpi.png differ diff --git a/mobile/android/themes/core/images/reader-plus-xxhdpi.png b/mobile/android/themes/core/images/reader-plus-xxhdpi.png new file mode 100644 index 000000000..6f475c5d3 Binary files /dev/null and b/mobile/android/themes/core/images/reader-plus-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/reader-style-icon-hdpi.png b/mobile/android/themes/core/images/reader-style-icon-hdpi.png new file mode 100644 index 000000000..ea7578d28 Binary files /dev/null and b/mobile/android/themes/core/images/reader-style-icon-hdpi.png differ diff --git a/mobile/android/themes/core/images/reader-style-icon-xhdpi.png b/mobile/android/themes/core/images/reader-style-icon-xhdpi.png new file mode 100644 index 000000000..fb12ed007 Binary files /dev/null and b/mobile/android/themes/core/images/reader-style-icon-xhdpi.png differ diff --git a/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png b/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png new file mode 100644 index 000000000..57c6a1964 Binary files /dev/null and b/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png differ diff --git a/mobile/android/themes/core/images/scrubber.svg b/mobile/android/themes/core/images/scrubber.svg new file mode 100644 index 000000000..f93a147b7 --- /dev/null +++ b/mobile/android/themes/core/images/scrubber.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/search-clear-30.png b/mobile/android/themes/core/images/search-clear-30.png new file mode 100644 index 000000000..75af18a3e Binary files /dev/null and b/mobile/android/themes/core/images/search-clear-30.png differ diff --git a/mobile/android/themes/core/images/search.png b/mobile/android/themes/core/images/search.png new file mode 100644 index 000000000..18460da05 Binary files /dev/null and b/mobile/android/themes/core/images/search.png differ diff --git a/mobile/android/themes/core/images/textfield.png b/mobile/android/themes/core/images/textfield.png new file mode 100644 index 000000000..c3210cd71 Binary files /dev/null and b/mobile/android/themes/core/images/textfield.png differ diff --git a/mobile/android/themes/core/images/throbber.png b/mobile/android/themes/core/images/throbber.png new file mode 100644 index 000000000..8a7bfb6ab Binary files /dev/null and b/mobile/android/themes/core/images/throbber.png differ diff --git a/mobile/android/themes/core/images/unmute.svg b/mobile/android/themes/core/images/unmute.svg new file mode 100644 index 000000000..47c823fd8 --- /dev/null +++ b/mobile/android/themes/core/images/unmute.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/mobile/android/themes/core/images/wordmark-hdpi.png b/mobile/android/themes/core/images/wordmark-hdpi.png new file mode 100644 index 000000000..3d3b145de Binary files /dev/null and b/mobile/android/themes/core/images/wordmark-hdpi.png differ diff --git a/mobile/android/themes/core/jar.mn b/mobile/android/themes/core/jar.mn new file mode 100644 index 000000000..248c00253 --- /dev/null +++ b/mobile/android/themes/core/jar.mn @@ -0,0 +1,98 @@ +#filter substitution +# 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/. + + +chrome.jar: +% skin browser classic/1.0 %skin/ + skin/aboutPage.css (aboutPage.css) + skin/about.css (about.css) + skin/aboutAccounts.css (aboutAccounts.css) + skin/aboutAddons.css (aboutAddons.css) + skin/aboutBase.css (aboutBase.css) + skin/aboutDownloads.css (aboutDownloads.css) +#ifdef MOZ_SERVICES_HEALTHREPORT + skin/aboutHealthReport.css (aboutHealthReport.css) +#endif + skin/aboutMemory.css (aboutMemory.css) + skin/aboutPrivateBrowsing.css (aboutPrivateBrowsing.css) + skin/aboutReader.css (aboutReader.css) + skin/aboutReaderContent.css (aboutReaderContent.css) + skin/aboutReaderControls.css (aboutReaderControls.css) + skin/aboutSupport.css (aboutSupport.css) + skin/content.css (content.css) + skin/scrollbar.css (scrollbar-apz.css) + skin/config.css (config.css) + skin/defines.css (defines.css) + skin/touchcontrols.css (touchcontrols.css) + skin/netError.css (netError.css) + skin/spinner.css (spinner.css) +% override chrome://global/skin/about.css chrome://browser/skin/about.css +% override chrome://global/skin/aboutMemory.css chrome://browser/skin/aboutMemory.css +% override chrome://global/skin/aboutReader.css chrome://browser/skin/aboutReader.css +% override chrome://global/skin/aboutReaderContent.css chrome://browser/skin/aboutReaderContent.css +% override chrome://global/skin/aboutReaderControls.css chrome://browser/skin/aboutReaderControls.css +% override chrome://global/skin/aboutSupport.css chrome://browser/skin/aboutSupport.css +% override chrome://global/skin/media/videocontrols.css chrome://browser/skin/touchcontrols.css +% override chrome://global/skin/netError.css chrome://browser/skin/netError.css + + skin/aboutLogins.css (aboutLogins.css) + + skin/images/search.png (images/search.png) + skin/images/lock.png (images/lock.png) + skin/images/textfield.png (images/textfield.png) + + skin/images/amo-logo.png (images/amo-logo.png) + skin/images/arrowdown-16.png (images/arrowdown-16.png) + skin/images/arrowup-16.png (images/arrowup-16.png) + skin/images/blocked-warning.png (images/blocked-warning.png) + skin/images/checkbox_checked.png (images/checkbox_checked.png) + skin/images/checkbox_checked_disabled.png (images/checkbox_checked_disabled.png) + skin/images/checkbox_checked_pressed.png (images/checkbox_checked_pressed.png) + skin/images/checkbox_unchecked.png (images/checkbox_unchecked.png) + skin/images/checkbox_unchecked_disabled.png (images/checkbox_unchecked_disabled.png) + skin/images/checkbox_unchecked_pressed.png (images/checkbox_unchecked_pressed.png) + skin/images/chevron.png (images/chevron.png) + skin/images/dropmarker.svg (images/dropmarker.svg) + skin/images/dropmarker-right.svg (images/dropmarker-right.svg) + skin/images/errorpage-warning.png (images/errorpage-warning.png) + skin/images/exitfullscreen.svg (images/exitfullscreen.svg) + skin/images/fullscreen.svg (images/fullscreen.svg) + skin/images/grey-caution.svg (images/grey-caution.svg) + skin/images/certerror-warning.png (images/certerror-warning.png) + skin/images/throbber.png (images/throbber.png) + skin/images/search-clear-30.png (images/search-clear-30.png) + skin/images/placeholder_image.svg (images/placeholder_image.svg) + skin/images/play.svg (images/play.svg) + skin/images/pause.svg (images/pause.svg) + skin/images/cast-ready.svg (images/cast-ready.svg) + skin/images/cast-active.svg (images/cast-active.svg) + skin/images/mute.svg (images/mute.svg) + skin/images/unmute.svg (images/unmute.svg) + skin/images/scrubber.svg (images/scrubber.svg) + skin/images/about-btn-darkgrey.png (images/about-btn-darkgrey.png) + skin/images/logo-hdpi.png (images/logo-hdpi.png) + skin/images/wordmark-hdpi.png (images/wordmark-hdpi.png) + skin/images/config-plus.png (images/config-plus.png) + skin/images/reader-minus-hdpi.png (images/reader-minus-hdpi.png) + skin/images/reader-minus-xhdpi.png (images/reader-minus-xhdpi.png) + skin/images/reader-minus-xxhdpi.png (images/reader-minus-xxhdpi.png) + skin/images/reader-plus-hdpi.png (images/reader-plus-hdpi.png) + skin/images/reader-plus-xhdpi.png (images/reader-plus-xhdpi.png) + skin/images/reader-plus-xxhdpi.png (images/reader-plus-xxhdpi.png) + skin/images/reader-style-icon-hdpi.png (images/reader-style-icon-hdpi.png) + skin/images/reader-style-icon-xhdpi.png (images/reader-style-icon-xhdpi.png) + skin/images/reader-style-icon-xxhdpi.png (images/reader-style-icon-xxhdpi.png) + skin/images/privatebrowsing-mask.png (images/privatebrowsing-mask.png) + skin/images/privatebrowsing-mask-and-shield.svg (images/privatebrowsing-mask-and-shield.svg) + skin/images/icon_key_emptypage.svg (images/icon_key_emptypage.svg) + skin/images/accessiblecaret-normal-hdpi.png (images/accessiblecaret-normal-hdpi.png) + skin/images/accessiblecaret-normal-xhdpi.png (images/accessiblecaret-normal-xhdpi.png) + skin/images/accessiblecaret-normal-xxhdpi.png (images/accessiblecaret-normal-xxhdpi.png) + skin/images/accessiblecaret-tilt-left-hdpi.png (images/accessiblecaret-tilt-left-hdpi.png) + skin/images/accessiblecaret-tilt-left-xhdpi.png (images/accessiblecaret-tilt-left-xhdpi.png) + skin/images/accessiblecaret-tilt-left-xxhdpi.png (images/accessiblecaret-tilt-left-xxhdpi.png) + skin/images/accessiblecaret-tilt-right-hdpi.png (images/accessiblecaret-tilt-right-hdpi.png) + skin/images/accessiblecaret-tilt-right-xhdpi.png (images/accessiblecaret-tilt-right-xhdpi.png) + skin/images/accessiblecaret-tilt-right-xxhdpi.png (images/accessiblecaret-tilt-right-xxhdpi.png) diff --git a/mobile/android/themes/core/moz.build b/mobile/android/themes/core/moz.build new file mode 100644 index 000000000..eb4454d28 --- /dev/null +++ b/mobile/android/themes/core/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'] \ No newline at end of file diff --git a/mobile/android/themes/core/netError.css b/mobile/android/themes/core/netError.css new file mode 100644 index 000000000..ba9e397b2 --- /dev/null +++ b/mobile/android/themes/core/netError.css @@ -0,0 +1,226 @@ +/* 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/. */ + +html, +body { + margin: 0; + padding: 0; + height: 100%; + --moz-vertical-spacing: 10px; + --moz-background-height: 32px; +} + +body { + /* Add a set of stripes at the top of pages */ + background-image: linear-gradient(-45deg, #dfe8ee, #dfe8ee 33%, + #ecf0f3 33%, #ecf0f3 66%, + #dfe8ee 66%, #dfe8ee); + background-size: 64px var(--moz-background-height); + background-repeat: repeat-x; + + background-color: #f1f1f1; + padding: 0 20px; + + font-weight: 300; + font-size: 13px; + -moz-text-size-adjust: none; + font-family: sans-serif; +} + + +ul { + /* Shove the list indicator so that its left aligned, but use outside so that text + * doesn't don't wrap the text around it */ + padding: 0 1em; + margin: 0; + list-style: round outside none; +} + +#errorShortDesc, +li:not(:last-of-type) { + /* Margins between the li and buttons below it won't be collapsed. Remove the bottom margin here. */ + margin: var(--moz-vertical-spacing) 0; +} + +li > button { + /* Removing the normal padding on the li so this stretched edge to edge. */ + margin-left: -1em; + margin-right: -1em; + width: calc(100% + 2em); +} + +/* Push the #ignoreWarningButton to the bottom on the blocked site page */ +.blockedsite > #errorPageContainer > #errorLongContent { + flex: 1; +} + +h1 { + margin: 0; + /* Since this has an underline, use padding for vertical spacing rather than margin */ + padding: var(--moz-vertical-spacing) 0; + font-weight: 300; + border-bottom: 1px solid #e0e2e5; +} + +h2 { + font-size: small; + padding: 0; + margin: var(--moz-vertical-spacing) 0; +} + +p { + margin: var(--moz-vertical-spacing) 0; +} + +button { + /* Force buttons to display: block here to try and enfoce collapsing margins */ + display: block; + width: 100%; + border: none; + padding: 1rem; + font-family: sans-serif; + background-color: #e0e2e5; + font-weight: 300; + border-radius: 2px; + background-image: none; + margin: var(--moz-vertical-spacing) 0 0; +} + +button.inProgress { + background-image: linear-gradient(-45deg, #dfe8ee, #dfe8ee 33%, + #ecf0f3 33%, #ecf0f3 66%, + #dfe8ee 66%, #dfe8ee); + background-size: 37px 5px; + background-repeat: repeat-x; + animation: progress 6s linear infinite; +} + +@keyframes progress { + from { background-position: 0 100%; } + to { background-position: 100% 100%; } +} + +.certerror { + background-image: linear-gradient(-45deg, #f0d000, #f0d000 33%, + #fedc00 33%, #fedc00 66%, + #f0d000 66%, #f0d000); +} + +.blockedsite { + background-image: linear-gradient(-45deg, #9b2e2e, #9b2e2e 33%, + #a83232 33%, #a83232 66%, + #9b2e2e 66%, #9b2e2e); + background-color: #b14646; + color: white; +} + +#errorPageContainer { + /* If the page is greater than 550px center the content. + * This number should be kept in sync with the media query for tablets below */ + max-width: 550px; + margin: 0 auto; + transform: translateY(var(--moz-background-height)); + padding-bottom: var(--moz-vertical-spacing); + + min-height: calc(100% - var(--moz-background-height) - var(--moz-vertical-spacing)); + display: flex; + flex-direction: column; +} + +/* Expanders have a structure of + *
+ *

Title

+ *

Content

+ *
+ * + * This shows an arrow to the right of the h2 element, and hides the content when collapsed="true". */ +.expander { + margin: var(--moz-vertical-spacing) 0; + background-image: url("chrome://browser/skin/images/dropmarker.svg"); + background-repeat: no-repeat; + /* dropmarker.svg is 10x7. Ensure that its centered in the middle of an 18x18 box */ + background-position: 3px 5.5px; + background-size: 10px 7px; + padding-left: 18px; +} + +div[collapsed="true"] > .expander { + background-image: url("chrome://browser/skin/images/dropmarker-right.svg"); + /* dropmarker.svg is 7x10. Ensure that its centered in the middle of an 18x18 box */ + background-size: 7px 10px; + background-position: 5.5px 4px; +} + +div[hidden] > .expander, +div[hidden] > .expander + *, +div[collapsed="true"] > .expander + * { + display: none; +} + +.blockedsite h1 { + border-bottom-color: #9b2e2e; +} + +.blockedsite button { + background-color: #9b2e2e; + color: white; +} + +/* Style warning button to look like a small text link in the + bottom. This is preferable to just using a text link + since there is already a mechanism in browser.js for trapping + oncommand events from unprivileged chrome pages (ErrorPageEventHandler).*/ +#ignoreWarningButton { + width: calc(100% + 40px); + -moz-appearance: none; + background: #b14646; + border: none; + text-decoration: underline; + margin: 0; + margin-inline-start: -20px; + font-size: smaller; + border-radius: 0; +} + +/* On large screen devices (hopefully a 7+ inch tablet, we already center content (see #errorPageContainer above). + Apply tablet specific styles here */ +@media (min-width: 550px) { + button { + min-width: 160px; + width: auto; + } + + /* If the tablet is tall as well, add some padding to make content feel a bit more centered */ + @media (min-height: 550px) { + #errorPageContainer { + padding-top: 64px; + min-height: calc(100% - 64px); + } + } +} + +#searchbox { + padding: 0; + display: flex; + margin: var(--moz-vertical-spacing) -1em; +} + +#searchbox > input { + flex: 3; + padding: 0em 3em 0em 1em; + width: 100%; + border: none; + font-family: sans-serif; + background-image: none; + background-color: white; + border-radius-top-right: none; + border-radius-bottom-right: none; +} + +#searchbox > button { + flex: 1; + margin: 0; + width: auto; +} + diff --git a/mobile/android/themes/core/scrollbar-apz.css b/mobile/android/themes/core/scrollbar-apz.css new file mode 100644 index 000000000..652881af5 --- /dev/null +++ b/mobile/android/themes/core/scrollbar-apz.css @@ -0,0 +1,10 @@ +/* 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.w3.org/1999/xhtml"); +@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); + +html xul|scrollbar { + display: block; +} diff --git a/mobile/android/themes/core/spinner.css b/mobile/android/themes/core/spinner.css new file mode 100644 index 000000000..7f4dd33bb --- /dev/null +++ b/mobile/android/themes/core/spinner.css @@ -0,0 +1,124 @@ +/* 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/. */ + +.mui-refresh-main { + padding: 0; + overflow: hidden; + border-radius: 999px; + position: relative; +} + +.mui-refresh-wrapper { + width: 60px; + height: 60px; +} + +.mui-spinner-main { + width: 60px; + height: 60px; + position: relative; + animation: sporadic-rotate 5.25s cubic-bezier(.35, 0, .25, 1) infinite; +} + +.mui-spinner-wrapper { + animation: outer-rotate 2.91667s linear infinite; +} + +.mui-spinner-left, .mui-spinner-right { + position: absolute; + top: 0; + height: 60px; + width: 30px; + overflow: hidden; +} + +.mui-spinner-left { + left: 0; +} + +.mui-spinner-right { + right: 0; +} + +.mui-half-circle-left, .mui-half-circle-right { + position: absolute; + top: 0; + width: 60px; + height: 60px; + box-sizing: border-box; + border-width: 5px; + border-style: solid; + border-color: #000 #000 transparent; + border-radius: 999px; + animation-iteration-count: infinite; + animation-duration: 1.3125s; + animation-timing-function: cubic-bezier(.35, 0, .25, 1); +} + +.mui-half-circle-left { + left: 0; + border-right-color: transparent; + border-top-color: #FF9500; /*matched to fennec_ui_orange in java codebase*/ + border-left-color: #FF9500; /*matched to fennec_ui_orange in java codebase*/ + animation-name: left-wobble; +} + +.mui-half-circle-right { + right: 0; + border-left-color: transparent; + border-top-color: #FF9500; /*matched to fennec_ui_orange in java codebase*/ + border-right-color: #FF9500; /*matched to fennec_ui_orange in java codebase*/ + animation-name: right-wobble; +} + +@keyframes outer-rotate { + 100% { + transform: rotate(360deg); + } +} + +@keyframes left-wobble { + 0%, 100% { + transform: rotate(130deg); + } + 50% { + transform: rotate(-5deg); + } +} + +@keyframes right-wobble { + 0%, 100% { + transform: rotate(-130deg); + } + 50% { + transform: rotate(5deg); + } +} + +@keyframes sporadic-rotate { + 12.5% { + transform: rotate(135deg); + } + 25% { + transform: rotate(270deg); + } + 37.5% { + transform: rotate(405deg); + } + 50% { + transform: rotate(540deg); + } + 62.5% { + transform: rotate(675deg); + } + 75% { + transform: rotate(810deg); + } + 87.5% { + transform: rotate(945deg); + } + 100% { + transform: rotate(1080deg); + } +} diff --git a/mobile/android/themes/core/touchcontrols.css b/mobile/android/themes/core/touchcontrols.css new file mode 100644 index 000000000..8f43bf718 --- /dev/null +++ b/mobile/android/themes/core/touchcontrols.css @@ -0,0 +1,255 @@ +/* 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); + +/* video controls */ +.controlsOverlay { + -moz-box-pack: center; + -moz-box-align: end; + -moz-box-flex: 1; + -moz-box-orient: horizontal; +} + +.controlsOverlay[scaled] { + /* scaled attribute in videocontrols.css causes conflict + due to different -moz-box-orient values */ + -moz-box-align: end; +} + +.controlsSpacer { + display: none; + -moz-box-flex: 0; +} + +.controlBar { + -moz-box-flex: 1; + width: 100%; + background-color: rgba(50,50,50,0.8); +} + +.buttonsBar { + -moz-box-flex: 1; + -moz-box-align: center; +} + +.playButton, +.castingButton, +.muteButton, +.fullscreenButton { + -moz-appearance: none; + padding: 15px; + border: none !important; + width: 48px; + height: 48px; +} + +.playButton { + background: url("chrome://browser/skin/images/pause.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +.playButton[paused="true"] { + background: url("chrome://browser/skin/images/play.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +.castingButton { + background: url("chrome://browser/skin/images/cast-ready.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +.castingButton[active="true"] { + background: url("chrome://browser/skin/images/cast-active.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +/* If the casting button is showing, there will be two buttons on the right side of the controls. + * This shifts the play button to be centered. + */ +.castingButton:not([hidden="true"]) + .fullscreenButton + spacer + .playButton { + transform: translateX(-21px); +} + +.muteButton { + padding-left: 17.25px; + padding-right: 9.75px; + background: url("chrome://browser/skin/images/mute.svg") no-repeat left; + background-size: contain; + background-origin: content-box; +} + +.muteButton[muted="true"] { + background: url("chrome://browser/skin/images/unmute.svg") no-repeat left; + background-size: contain; + background-origin: content-box; +} + +.fullscreenButton { + background-color: transparent; + background: url("chrome://browser/skin/images/fullscreen.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +.fullscreenButton[fullscreened] { + background: url("chrome://browser/skin/images/exitfullscreen.svg") no-repeat center; + background-size: contain; + background-origin: content-box; +} + +.controlBar[fullscreen-unavailable] .fullscreenButton { + display: none; +} + +/* bars */ +.scrubberStack { + -moz-box-flex: 1; + padding: 0px 18px; +} + +.flexibleBar, +.flexibleBar .progress-bar, +.bufferBar, +.bufferBar .progress-bar, +.progressBar, +.progressBar .progress-bar, +.scrubber, +.scrubber .scale-slider, +.scrubber .scale-thumb { + -moz-appearance: none; + border: none; + padding: 0px; + margin: 0px; + background-color: transparent; +} + +.flexibleBar, +.bufferBar, +.progressBar { + height: 32px; + padding: 15px 0px; +} + +.flexibleBar { + padding: 16px 0px; +} + +.flexibleBar .progress-bar { + border: 1px #777777 solid; + border-radius: 1px; +} + +.bufferBar .progress-bar { + border: 2px #AFB1B3 solid; + border-radius: 2px; +} + +.progressBar .progress-bar { + border: 2px #FF9500 solid; + border-radius: 2px; +} + +.scrubber { + margin-left: -12px; + margin-right: -12px; +} + +.scrubber .scale-thumb { + display: -moz-box; + margin: 0px !important; + padding: 0px !important; + background: url("chrome://browser/skin/images/scrubber.svg") no-repeat center; + background-size: 12px 12px; + height: 32px; + width: 32px; +} + +.positionLabel, .durationLabel { + font-family: 'Roboto', Helvetica, Arial, sans-serif; + font-size: 16px; + color: white; +} + +.statusOverlay { + -moz-box-align: center; + -moz-box-pack: center; + background-color: rgb(50,50,50); +} + +.statusIcon { + margin-bottom: 28px; + width: 36px; + height: 36px; +} + +.statusIcon[type="throbber"] { + background: url(chrome://global/skin/media/throbber.png) no-repeat center; +} + +.statusIcon[type="error"] { + background: url(chrome://global/skin/media/error.png) no-repeat center; +} + +/* CSS Transitions */ +.controlBar:not([immediate]) { + transition-property: opacity; + transition-duration: 200ms; +} + +.controlBar[fadeout] { + opacity: 0; +} + +.statusOverlay:not([immediate]) { + transition-property: opacity; + transition-duration: 300ms; + transition-delay: 750ms; +} + +.statusOverlay[fadeout] { + opacity: 0; +} + +.volumeStack, +.timeLabel { + display: none; +} + +.controlBar[firstshow="true"] .playButton { + -moz-transform: none; +} + +/* Error description formatting */ +.errorLabel { + font-family: Helvetica, Arial, sans-serif; + font-size: 11px; + color: #bbb; + text-shadow: + -1px -1px 0 #000, + 1px -1px 0 #000, + -1px 1px 0 #000, + 1px 1px 0 #000; + padding: 0 10px; + text-align: center; +} + +/* Overlay Play button */ +.clickToPlay { + width: 64px; + height: 64px; + -moz-box-pack: center; + -moz-box-align: center; + opacity: 0.7; + background-image: url(chrome://global/skin/media/clicktoplay-bgtexture.png), + url(chrome://global/skin/media/videoClickToPlayButton.svg); + background-repeat: repeat, no-repeat; + background-position: center, center; + background-size: auto, 64px 64px; + background-color: hsla(0,0%,10%,.5); +} -- cgit v1.2.3