From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001 From: "Matt A. Tobin" Date: Fri, 2 Feb 2018 04:16:08 -0500 Subject: Add m-esr52 at 52.6.0 --- mobile/android/themes/core/aboutReaderControls.css | 290 +++++++++++++++++++++ 1 file changed, 290 insertions(+) create mode 100644 mobile/android/themes/core/aboutReaderControls.css (limited to 'mobile/android/themes/core/aboutReaderControls.css') 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; + } +} -- cgit v1.2.3