diff options
Diffstat (limited to 'mobile/android/themes')
79 files changed, 3557 insertions, 0 deletions
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 Binary files differnew file mode 100644 index 000000000..24e2aae83 --- /dev/null +++ b/mobile/android/themes/core/images/about-btn-darkgrey.png diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png Binary files differnew file mode 100644 index 000000000..7f11a3c40 --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-normal-hdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png Binary files differnew file mode 100644 index 000000000..7c7cc65dd --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-normal-xhdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png Binary files differnew file mode 100644 index 000000000..411d814ed --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-normal-xxhdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png Binary files differnew file mode 100644 index 000000000..838e9ab4d --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-left-hdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png Binary files differnew file mode 100644 index 000000000..f1c6f1d88 --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xhdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png Binary files differnew file mode 100644 index 000000000..6d5ee52ac --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-left-xxhdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png Binary files differnew file mode 100644 index 000000000..97bb84235 --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-right-hdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png Binary files differnew file mode 100644 index 000000000..4eb81b9b5 --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xhdpi.png diff --git a/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png Binary files differnew file mode 100644 index 000000000..0751b846c --- /dev/null +++ b/mobile/android/themes/core/images/accessiblecaret-tilt-right-xxhdpi.png diff --git a/mobile/android/themes/core/images/amo-logo.png b/mobile/android/themes/core/images/amo-logo.png Binary files differnew file mode 100644 index 000000000..f18ab8cbc --- /dev/null +++ b/mobile/android/themes/core/images/amo-logo.png diff --git a/mobile/android/themes/core/images/arrowdown-16.png b/mobile/android/themes/core/images/arrowdown-16.png Binary files differnew file mode 100644 index 000000000..27e3c50c3 --- /dev/null +++ b/mobile/android/themes/core/images/arrowdown-16.png diff --git a/mobile/android/themes/core/images/arrowup-16.png b/mobile/android/themes/core/images/arrowup-16.png Binary files differnew file mode 100644 index 000000000..ad422bfb0 --- /dev/null +++ b/mobile/android/themes/core/images/arrowup-16.png diff --git a/mobile/android/themes/core/images/blocked-warning.png b/mobile/android/themes/core/images/blocked-warning.png Binary files differnew file mode 100644 index 000000000..3920aff3c --- /dev/null +++ b/mobile/android/themes/core/images/blocked-warning.png 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 @@ +<?xml version="1.0"?> +<svg width="66px" height="54px" viewBox="0 0 66 54" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-279.000000, -1435.000000)"> + <g transform="translate(240.000000, 1390.000000)"> + <g transform="translate(36.000000, 36.000000)"> + <path d="M0,0 L72,0 L72,72 L0,72 L0,0 Z" opacity="0.1"></path> + <path d="M0,0 L72,0 L72,72 L0,72 L0,0 Z"></path> + <path d="M3,54 L3,63 L12,63 C12,58.02 7.98,54 3,54 L3,54 Z M3,42 L3,48 C11.28,48 18,54.72 18,63 L24,63 C24,51.39 14.61,42 3,42 L3,42 Z M57,21 L15,21 L15,25.89 C26.88,29.73 36.27,39.12 40.11,51 L57,51 L57,21 L57,21 Z M3,30 L3,36 C17.91,36 30,48.09 30,63 L36,63 C36,44.76 21.21,30 3,30 L3,30 Z M63,9 L9,9 C5.7,9 3,11.7 3,15 L3,24 L9,24 L9,15 L63,15 L63,57 L42,57 L42,63 L63,63 C66.3,63 69,60.3 69,57 L69,15 C69,11.7 66.3,9 63,9 L63,9 Z" fill="#FFFFFF"></path> + </g> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0"?> +<svg width="66px" height="54px" viewBox="0 0 66 54" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-87.000000, -1435.000000)"> + <g transform="translate(48.000000, 1390.000000)"> + <g transform="translate(36.000000, 36.000000)"> + <path d="M0,0 L72,0 L72,72 L0,72 L0,0 Z" opacity="0.1"></path> + <path d="M0,0 L72,0 L72,72 L0,72 L0,0 Z"></path> + <path d="M63,9 L9,9 C5.7,9 3,11.7 3,15 L3,24 L9,24 L9,15 L63,15 L63,57 L42,57 L42,63 L63,63 C66.3,63 69,60.3 69,57 L69,15 C69,11.7 66.3,9 63,9 L63,9 Z M3,54 L3,63 L12,63 C12,58.02 7.98,54 3,54 L3,54 Z M3,42 L3,48 C11.28,48 18,54.72 18,63 L24,63 C24,51.39 14.61,42 3,42 L3,42 Z M3,30 L3,36 C17.91,36 30,48.09 30,63 L36,63 C36,44.76 21.21,30 3,30 L3,30 Z" fill="#FFFFFF"></path> + </g> + </g> + </g> + </g> +</svg> diff --git a/mobile/android/themes/core/images/certerror-warning.png b/mobile/android/themes/core/images/certerror-warning.png Binary files differnew file mode 100644 index 000000000..053cea741 --- /dev/null +++ b/mobile/android/themes/core/images/certerror-warning.png diff --git a/mobile/android/themes/core/images/checkbox_checked.png b/mobile/android/themes/core/images/checkbox_checked.png Binary files differnew file mode 100644 index 000000000..8de545e2f --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_checked.png diff --git a/mobile/android/themes/core/images/checkbox_checked_disabled.png b/mobile/android/themes/core/images/checkbox_checked_disabled.png Binary files differnew file mode 100644 index 000000000..d93824427 --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_checked_disabled.png diff --git a/mobile/android/themes/core/images/checkbox_checked_pressed.png b/mobile/android/themes/core/images/checkbox_checked_pressed.png Binary files differnew file mode 100644 index 000000000..835b3b36b --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_checked_pressed.png diff --git a/mobile/android/themes/core/images/checkbox_unchecked.png b/mobile/android/themes/core/images/checkbox_unchecked.png Binary files differnew file mode 100644 index 000000000..5089b7fa9 --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_unchecked.png diff --git a/mobile/android/themes/core/images/checkbox_unchecked_disabled.png b/mobile/android/themes/core/images/checkbox_unchecked_disabled.png Binary files differnew file mode 100644 index 000000000..f9c8bdea0 --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_unchecked_disabled.png diff --git a/mobile/android/themes/core/images/checkbox_unchecked_pressed.png b/mobile/android/themes/core/images/checkbox_unchecked_pressed.png Binary files differnew file mode 100644 index 000000000..b682b5aaa --- /dev/null +++ b/mobile/android/themes/core/images/checkbox_unchecked_pressed.png diff --git a/mobile/android/themes/core/images/chevron.png b/mobile/android/themes/core/images/chevron.png Binary files differnew file mode 100644 index 000000000..7080dac5c --- /dev/null +++ b/mobile/android/themes/core/images/chevron.png diff --git a/mobile/android/themes/core/images/config-plus.png b/mobile/android/themes/core/images/config-plus.png Binary files differnew file mode 100644 index 000000000..10da3ed5a --- /dev/null +++ b/mobile/android/themes/core/images/config-plus.png 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 @@ +<?xml version="1.0"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> +<svg width="7px" height="10px" xmlns="http://www.w3.org/2000/svg"> + <polyline points="1 1 6 5 1 9" stroke="#414141" stroke-width="2" stroke-linecap="round" fill="none" stroke-linejoin="round"/> +</svg> 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 @@ +<?xml version="1.0"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> +<svg width="10px" height="7px" xmlns="http://www.w3.org/2000/svg"> + <polyline points="1 1 5 6 9 1" stroke="#414141" stroke-width="2" stroke-linecap="round" fill="none" stroke-linejoin="round"/> +</svg> diff --git a/mobile/android/themes/core/images/errorpage-warning.png b/mobile/android/themes/core/images/errorpage-warning.png Binary files differnew file mode 100644 index 000000000..d2acea221 --- /dev/null +++ b/mobile/android/themes/core/images/errorpage-warning.png 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 @@ +<?xml version="1.0"?> +<svg width="72px" height="72px" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-276.000000, -1042.000000)" fill="#FFFFFF"> + <g transform="translate(240.000000, 1006.000000)"> + <path d="M36.96,80.16 C35.2060427,78.316034 35.8370453,76.8 38.4,76.8 L62.4,76.8 C65.0584079,76.8 67.2,78.9469741 67.2,81.6 L67.2,105.6 C67.2,108.165446 65.6848806,108.791856 63.84,107.04 L55.2,98.4 L49.92,104.16 C47.9768607,105.92543 44.9530217,105.908123 43.2,104.16 L39.84,100.8 C38.0648585,98.9095525 38.080377,95.8763717 39.84,94.08 L45.6,88.8 L36.96,80.16 Z M107.04,63.84 C108.79397,65.6843439 108.162544,67.2 105.6,67.2 L81.6,67.2 C78.941564,67.2 76.8,65.0529486 76.8,62.4 L76.8,38.4 C76.8,35.8334252 78.3157239,35.2076163 80.16,36.96 L88.8,45.6 L94.08,39.84 C95.909525,38.1209584 98.9004381,38.0799163 100.8,39.84 L104.16,43.2 C105.923072,45.1022004 105.884206,48.0879079 104.16,49.92 L98.4,55.2 L107.04,63.84 Z"></path> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0"?> +<svg width="72px" height="72px" viewBox="0 0 72 72" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-84.000000, -1042.000000)" fill="#FFFFFF"> + <g transform="translate(48.000000, 1006.000000)"> + <path d="M77.1428571,36 L102.857143,36 C105.705437,36 108,38.3003294 108,41.1428571 L108,66.8571429 C108,69.6058346 106.376658,70.276989 104.4,68.4 L95.1428571,59.1428571 L89.4857143,65.3142857 C87.4037793,67.2058174 84.1639518,67.1872741 82.2857143,65.3142857 L78.6857143,61.7142857 C76.783777,59.6888062 76.8004039,56.4389697 78.6857143,54.5142857 L84.8571429,48.8571429 L75.6,39.6 C73.7207601,37.6243221 74.3968342,36 77.1428571,36 Z M66.8571429,108 L41.1428571,108 C38.2945329,108 36,105.699588 36,102.857143 L36,77.1428571 C36,74.3929556 37.6239899,73.7224461 39.6,75.6 L48.8571429,84.8571429 L54.5142857,78.6857143 C56.474491,76.843884 59.6790408,76.7999103 61.7142857,78.6857143 L65.3142857,82.2857143 C67.2032916,84.3237862 67.1616492,87.5227585 65.3142857,89.4857143 L59.1428571,95.1428571 L68.4,104.4 C70.279254,106.376083 69.6027253,108 66.8571429,108 Z"></path> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<svg width="60px" height="60px" viewBox="0 0 60 60" xmlns="http://www.w3.org/2000/svg"> + <path d="M34.6570853,3.89861537 L61.6191658,57.8227763 C62.6631009,60.0994422 61.4905756,62 58.9609325,62 L5.03677158,62 C2.50636943,62 1.33487292,60.0971201 2.37853829,57.8227763 L29.3406187,3.89861537 C30.6694576,1.36596731 33.3285163,1.36828938 34.6570853,3.89861537 Z M28.2013759,23.6360478 C28.2013759,21.5439751 29.9058314,19.8480151 31.998852,19.8480151 C34.0961402,19.8480151 35.7963281,21.5419679 35.7963281,23.6360478 L35.7963281,38.844839 C35.7963281,40.9369118 34.0918726,42.6328718 31.998852,42.6328718 C29.9015639,42.6328718 28.2013759,40.938919 28.2013759,38.844839 L28.2013759,23.6360478 Z M31.998852,54.7847954 C34.0961402,54.7847954 35.7963281,53.0846074 35.7963281,50.9873193 C35.7963281,48.8900311 34.0961402,47.1898431 31.998852,47.1898431 C29.9015639,47.1898431 28.2013759,48.8900311 28.2013759,50.9873193 C28.2013759,53.0846074 29.9015639,54.7847954 31.998852,54.7847954 Z" fill="#AFB1B3" fill-rule="evenodd" transform="translate(-2,-2)"/> +</svg>
\ 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 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg width="60px" height="60px" viewBox="0 0 180 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"> + <title>Key</title> + <g sketch:type="MSArtboardGroup" fill="#bfbfbf"> + <path d="M72,60.75 C72,60.75 59.625,72 59.625,72 C57.375,74.25 58.5,76.5 59.625,77.625 L65.25,82.125 C66.375,83.25 67.5,84.375 65.25,86.625 L0,157.5 L0,176.625 C0,178.875 1.125,180 3.375,180 L33.75,180 C34.875,180 36,178.875 36,177.75 L36,168.75 L48.375,167.625 L47.25,156.375 L55.125,156.375 C55.125,156.375 56.25,156.375 56.25,155.25 L56.25,148.5 L65.25,148.5 L65.25,132.75 L78.75,132.75 L94.5,115.875 C96.75,113.625 99,113.625 101.25,115.875 L106.875,121.5 C109.125,123.75 111.375,123.75 113.625,121.5 L122.625,109.125 C157.125,108.963211 180,82.6329431 180,55.125 C179.4,24.0802676 155.4,0 124.875,0 C95.4,0 68.025,26.3302676 72,60.75 Z M139,54 C131.85,54 126,48.15 126,41 C126,33.85 131.85,28 139,28 C146.15,28 152,33.85 152,41 C152,48.15 146.15,54 139,54 L139,54 Z" sketch:type="MSShapeGroup"></path> + </g> +</svg>
\ No newline at end of file diff --git a/mobile/android/themes/core/images/lock.png b/mobile/android/themes/core/images/lock.png Binary files differnew file mode 100644 index 000000000..0d3565c32 --- /dev/null +++ b/mobile/android/themes/core/images/lock.png diff --git a/mobile/android/themes/core/images/logo-hdpi.png b/mobile/android/themes/core/images/logo-hdpi.png Binary files differnew file mode 100644 index 000000000..82553891f --- /dev/null +++ b/mobile/android/themes/core/images/logo-hdpi.png 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 @@ +<?xml version="1.0"?> +<svg width="70px" height="60px" viewBox="0 0 70 60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-469.000000, -1048.000000)" fill="#FFFFFF"> + <g transform="translate(432.000000, 1006.000000)"> + <path d="M98.3836922,53.1162172 C103.662239,57.6998888 107,64.4601112 107,71.9999094 C107,79.5397077 103.662239,86.2999301 98.3836922,90.8836016 L94.8371224,87.3370318 C99.2157236,83.6682614 102,78.1592367 102,71.9999094 C102,65.8405821 99.2157236,60.3315575 94.8371224,56.6627871 L98.3836922,53.1162172 Z M91.2831302,60.2167792 C94.7649686,62.9636534 97,67.2207716 97,71.9999094 C97,76.7790472 94.7649686,81.0361655 91.2831302,83.7830397 L87.7103386,80.210248 C90.3032555,78.4034792 92,75.3998422 92,71.9999094 C92,68.5999775 90.3032563,65.5963412 87.7103384,63.789571 L91.2831302,60.2167792 Z M37,61.9999094 C37,59.2105478 39.2364417,56.9712087 42,56.9999094 L58,56.9999094 L75.5,42.9999094 C79.1323004,40.818613 82,42.3919545 82,46.4999094 L82,97.4999094 C82,101.618951 79.1389004,103.178674 75.5,100.999909 L58,86.9999094 L42,86.9999094 C39.2362844,87.0258469 37,84.7863502 37,81.9999094 L37,61.9999094 Z"></path> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0"?> +<svg width="54px" height="72px" viewBox="0 0 54 72" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-285.000000, -1234.000000)" fill="#FFFFFF"> + <g transform="translate(240.000000, 1198.000000)"> + <path d="M63,103.5 C63,105.9849 60.9849,108 58.5,108 L49.5,108 C47.0151,108 45,105.9849 45,103.5 L45,40.5 C45,38.0151 47.0151,36 49.5,36 L58.5,36 C60.9849,36 63,38.0151 63,40.5 L63,103.5 Z M94.5,108 L85.5,108 C83.0151,108 81,105.9849 81,103.5 L81,40.5 C81,38.0151 83.0151,36 85.5,36 L94.5,36 C96.9849,36 99,38.0151 99,40.5 L99,103.5 C99,105.9849 96.9849,108 94.5,108 Z"></path> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0" encoding="UTF-8"?> +<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 42 42" style="enable-background:new 0 0 42 42;" xml:space="preserve"> +<style type="text/css"> + .st0{fill:#FFFFFF;filter:url(#Adobe_OpacityMaskFilter);} + .st1{fill:#010101;} + .st2{mask:url(#mask-cutout-blocked-sign_1_);} + .st3{fill:#F1F1F2;} + .st4{fill:#7F8081;} + .st5{fill:#4D4D4E;} + .st6{fill:#979899;} + .st7{fill:#010101;filter:url(#Adobe_OpacityMaskFilter_1_);} + .st8{fill:#FFFFFF;} + .st9{mask:url(#mask-cutout-frame_1_);fill:#656667;} + .st10{fill:#FFFFFF;filter:url(#Adobe_OpacityMaskFilter_2_);} + .st11{mask:url(#mask-cutout-blocked-sign-inner_1_);fill:#656667;} + .st12{fill:none;stroke:#656667;stroke-width:2;} +</style> +<g id="Layer_1"> + <defs> + <filter id="Adobe_OpacityMaskFilter" filterUnits="userSpaceOnUse" x="5" y="5" width="32" height="32"> + <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/> + </filter> + </defs> + <mask maskUnits="userSpaceOnUse" x="5" y="5" width="32" height="32" id="mask-cutout-blocked-sign_1_"> + <rect x="5" y="5" class="st0" width="32" height="32"/> + <circle class="st1" cx="30" cy="30" r="8"/> + </mask> + <g id="icon-frame" class="st2"> + <path id="shape-background" class="st3" d="M10,9h22c1.7,0,3,1.3,3,3v18c0,1.7-1.3,3-3,3H10c-1.7,0-3-1.3-3-3V12 C7,10.3,8.3,9,10,9z"/> + <polygon class="st4" points="8,31 16,21 23,31 "/> + <polygon class="st5" points="16,31 28,15 36,25 36,31 "/> + <circle class="st6" cx="14" cy="16" r="3"/> + <defs> + <filter id="Adobe_OpacityMaskFilter_1_" filterUnits="userSpaceOnUse" x="5" y="5" width="32" height="32"> + <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/> + </filter> + </defs> + <mask maskUnits="userSpaceOnUse" x="5" y="5" width="32" height="32" id="mask-cutout-frame_1_"> + <rect x="5" y="5" class="st7" width="32" height="32"/> + <path class="st8" d="M10,9h22c1.7,0,3,1.3,3,3v18c0,1.7-1.3,3-3,3H10c-1.7,0-3-1.3-3-3V12C7,10.3,8.3,9,10,9z"/> + <path class="st1" d="M11,11h20c1.1,0,2,0.9,2,2v16c0,1.1-0.9,2-2,2H11c-1.1,0-2-0.9-2-2V13C9,11.9,9.9,11,11,11z"/> + </mask> + <rect x="5" y="5" class="st9" width="32" height="32"/> + </g> + <g id="icon-blocked-sign"> + <defs> + <filter id="Adobe_OpacityMaskFilter_2_" filterUnits="userSpaceOnUse" x="24" y="24" width="12" height="12"> + <feColorMatrix type="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0"/> + </filter> + </defs> + <mask maskUnits="userSpaceOnUse" x="24" y="24" width="12" height="12" id="mask-cutout-blocked-sign-inner_1_"> + <rect x="5" y="5" class="st10" width="32" height="32"/> + <circle class="st1" cx="30" cy="30" r="4"/> + </mask> + <circle class="st11" cx="30" cy="30" r="6"/> + <line class="st12" x1="26" y1="34" x2="34" y2="26"/> + </g> +</g> +<g id="Layer_2"> +</g> +</svg>
\ 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 @@ +<?xml version="1.0"?> +<svg width="58px" height="72px" viewBox="0 0 58 72" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-91.000000, -1234.000000)" fill="#FFFFFF"> + <g transform="translate(48.000000, 1198.000000)"> + <path d="M43,40 L43,104 C43,107.688656 45.5537886,109.093408 49,107 L99,75 C101.697423,73.3130096 101.692268,70.3534356 99,69 L49,37 C45.5596797,34.9042037 43,36.3212206 43,40 Z"></path> + </g> + </g> + </g> +</svg> 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 @@ +<?xml version="1.0" encoding="UTF-8" standalone="no"?> +<!-- This Source Code Form is subject to the terms of the Mozilla Public + - License, v. 2.0. If a copy of the MPL was not distributed with this + - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> + +<svg width="400" height="138" viewBox="0 0 400 138" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <defs> + <path d="M72.29 136.64C28.48 137.22 0.29 72.46 0.29 41.98L0.29 4.65C7.14 11.12 24.29 17.93 44.86 11.31 65.43 0.89 99.71-5.92 120.29 7.31 140.86-5.92 175.14 0.89 195.71 11.31 216.29 17.93 233.43 11.12 240.29 4.65L240.29 41.98C240.29 72.46 212.1 137.22 168.29 136.64 140.85 136.28 130.57 130.36 120.29 129.98 110 130.36 99.73 136.28 72.29 136.64ZM100.28 85.11C100.12 75.55 100.11 58.19 76.48 54.7 52.63 51.25 42.46 61.67 32.28 61.46 32.28 79.03 66.2 92.91 100.28 85.11ZM140.28 85.11C140.45 75.55 140.46 58.19 164.08 54.7 187.93 51.25 198.11 61.67 208.28 61.46 208.28 79.03 174.36 92.91 140.28 85.11Z" id="path-1"/> + </defs> + <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g id="XXHDPI" transform="translate(-178.000000, -1050.000000)"> + <g id="graphic-2" transform="translate(178.000000, 1050.901172)"> + <path d="M399.38 24.32C399.36 19.92 396.45 16.4 392.71 15.32L349.86 8.32 307 15.32C303.26 16.4 300.35 19.92 300.33 24.32 300.31 34.22 300.37 52.28 301.29 60.32 303.17 83.36 307.43 94.81 317.48 108.32 330.16 126.08 349.86 128.32 349.86 128.32 349.86 128.32 369.56 126.08 382.24 108.32 392.28 94.81 396.54 83.36 398.43 60.32 399.34 52.28 399.4 34.22 399.38 24.32L399.38 24.32 399.38 24.32ZM390.81 59.32C388.95 82.65 384.72 92.07 376.52 103.32 367.16 116.27 353.36 119.66 349.86 120.32 346.31 119.65 332.54 116.26 323.19 103.32 314.99 92.07 310.76 82.65 308.9 59.32 308.17 53.88 307.91 40.97 307.95 24.32 307.96 23.78 308.17 23.56 308.9 23.32L349.86 16.32 390.81 23.32C391.54 23.56 391.75 23.78 391.76 24.32 391.8 40.96 391.54 53.87 390.81 59.32ZM326.05 98.32C318.68 87.15 315.78 78.92 314.62 59.32 313.99 54.06 313.66 45.26 313.67 30.32L348.9 23.32 348.9 113.32C344.72 112.4 334.23 108.99 326.05 98.32Z" id="XXHDPI" fill="#FFFFFF"/> + <g id="Path-Copy"> + <use fill="none" xlink:href="#path-1"/> + <use fill="none" xlink:href="#path-1"/> + <use fill="#5F6368" fill-rule="evenodd" xlink:href="#path-1"/> + </g> + </g> + </g> + </g> +</svg>
\ 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 Binary files differnew file mode 100644 index 000000000..e62cdbe13 --- /dev/null +++ b/mobile/android/themes/core/images/privatebrowsing-mask.png diff --git a/mobile/android/themes/core/images/reader-minus-hdpi.png b/mobile/android/themes/core/images/reader-minus-hdpi.png Binary files differnew file mode 100644 index 000000000..d6ea9b3fd --- /dev/null +++ b/mobile/android/themes/core/images/reader-minus-hdpi.png diff --git a/mobile/android/themes/core/images/reader-minus-xhdpi.png b/mobile/android/themes/core/images/reader-minus-xhdpi.png Binary files differnew file mode 100644 index 000000000..559720054 --- /dev/null +++ b/mobile/android/themes/core/images/reader-minus-xhdpi.png diff --git a/mobile/android/themes/core/images/reader-minus-xxhdpi.png b/mobile/android/themes/core/images/reader-minus-xxhdpi.png Binary files differnew file mode 100644 index 000000000..355d82f9f --- /dev/null +++ b/mobile/android/themes/core/images/reader-minus-xxhdpi.png diff --git a/mobile/android/themes/core/images/reader-plus-hdpi.png b/mobile/android/themes/core/images/reader-plus-hdpi.png Binary files differnew file mode 100644 index 000000000..87a326783 --- /dev/null +++ b/mobile/android/themes/core/images/reader-plus-hdpi.png diff --git a/mobile/android/themes/core/images/reader-plus-xhdpi.png b/mobile/android/themes/core/images/reader-plus-xhdpi.png Binary files differnew file mode 100644 index 000000000..ff6fc2e33 --- /dev/null +++ b/mobile/android/themes/core/images/reader-plus-xhdpi.png diff --git a/mobile/android/themes/core/images/reader-plus-xxhdpi.png b/mobile/android/themes/core/images/reader-plus-xxhdpi.png Binary files differnew file mode 100644 index 000000000..6f475c5d3 --- /dev/null +++ b/mobile/android/themes/core/images/reader-plus-xxhdpi.png diff --git a/mobile/android/themes/core/images/reader-style-icon-hdpi.png b/mobile/android/themes/core/images/reader-style-icon-hdpi.png Binary files differnew file mode 100644 index 000000000..ea7578d28 --- /dev/null +++ b/mobile/android/themes/core/images/reader-style-icon-hdpi.png diff --git a/mobile/android/themes/core/images/reader-style-icon-xhdpi.png b/mobile/android/themes/core/images/reader-style-icon-xhdpi.png Binary files differnew file mode 100644 index 000000000..fb12ed007 --- /dev/null +++ b/mobile/android/themes/core/images/reader-style-icon-xhdpi.png diff --git a/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png b/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png Binary files differnew file mode 100644 index 000000000..57c6a1964 --- /dev/null +++ b/mobile/android/themes/core/images/reader-style-icon-xxhdpi.png 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 @@ +<?xml version="1.0"?> +<svg width="36px" height="36px" viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-486.000000, -1444.000000)" fill="#FFFFFF"> + <g transform="translate(432.000000, 1390.000000)"> + <circle id="Oval-17" cx="72" cy="72" r="18"></circle> + </g> + </g> + </g> +</svg> diff --git a/mobile/android/themes/core/images/search-clear-30.png b/mobile/android/themes/core/images/search-clear-30.png Binary files differnew file mode 100644 index 000000000..75af18a3e --- /dev/null +++ b/mobile/android/themes/core/images/search-clear-30.png diff --git a/mobile/android/themes/core/images/search.png b/mobile/android/themes/core/images/search.png Binary files differnew file mode 100644 index 000000000..18460da05 --- /dev/null +++ b/mobile/android/themes/core/images/search.png diff --git a/mobile/android/themes/core/images/textfield.png b/mobile/android/themes/core/images/textfield.png Binary files differnew file mode 100644 index 000000000..c3210cd71 --- /dev/null +++ b/mobile/android/themes/core/images/textfield.png diff --git a/mobile/android/themes/core/images/throbber.png b/mobile/android/themes/core/images/throbber.png Binary files differnew file mode 100644 index 000000000..8a7bfb6ab --- /dev/null +++ b/mobile/android/themes/core/images/throbber.png 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 @@ +<?xml version="1.0"?> +<svg width="45px" height="60px" viewBox="0 0 45 60" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> + <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> + <g transform="translate(-661.000000, -1048.000000)" fill="#FFFFFF"> + <g transform="translate(624.000000, 1006.000000)"> + <path d="M37,61.9999094 C37,59.2105478 39.2364417,56.9712087 42,56.9999094 L58,56.9999094 L75.5,42.9999094 C79.1323004,40.818613 82,42.3919545 82,46.4999094 L82,97.4999094 C82,101.618951 79.1389004,103.178674 75.5,100.999909 L58,86.9999094 L42,86.9999094 C39.2362844,87.0258469 37,84.7863502 37,81.9999094 L37,61.9999094 Z"></path> + </g> + </g> + </g> +</svg> diff --git a/mobile/android/themes/core/images/wordmark-hdpi.png b/mobile/android/themes/core/images/wordmark-hdpi.png Binary files differnew file mode 100644 index 000000000..3d3b145de --- /dev/null +++ b/mobile/android/themes/core/images/wordmark-hdpi.png 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 + * <div collapsed="true/false"> + * <h2 class="expander">Title</h2> + * <p>Content</p> + * </div> + * + * 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); +} |
