From a1be17c1cea81ebb1e8b131a662c698d78f3f7f2 Mon Sep 17 00:00:00 2001 From: wolfbeast Date: Mon, 4 Jun 2018 13:17:38 +0200 Subject: Issue #303 Part 1: Move basilisk files from /browser to /application/basilisk --- .../privatebrowsing/aboutPrivateBrowsing.css | 227 +++++++++++++++++++++ .../themes/shared/privatebrowsing/attention.png | Bin 0 -> 602 bytes .../themes/shared/privatebrowsing/attention@2x.png | Bin 0 -> 902 bytes .../themes/shared/privatebrowsing/check.png | Bin 0 -> 338 bytes .../themes/shared/privatebrowsing/check.svg | 8 + .../themes/shared/privatebrowsing/check@2x.png | Bin 0 -> 370 bytes .../themes/shared/privatebrowsing/favicon.svg | 11 + .../shared/privatebrowsing/private-browsing.svg | 12 ++ .../themes/shared/privatebrowsing/shield-page.png | Bin 0 -> 4257 bytes .../shared/privatebrowsing/shield-page@2x.png | Bin 0 -> 9367 bytes .../privatebrowsing/tracking-protection-off.svg | 15 ++ .../shared/privatebrowsing/tracking-protection.svg | 12 ++ 12 files changed, 285 insertions(+) create mode 100644 application/basilisk/themes/shared/privatebrowsing/aboutPrivateBrowsing.css create mode 100644 application/basilisk/themes/shared/privatebrowsing/attention.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/attention@2x.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/check.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/check.svg create mode 100644 application/basilisk/themes/shared/privatebrowsing/check@2x.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/favicon.svg create mode 100644 application/basilisk/themes/shared/privatebrowsing/private-browsing.svg create mode 100644 application/basilisk/themes/shared/privatebrowsing/shield-page.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/shield-page@2x.png create mode 100644 application/basilisk/themes/shared/privatebrowsing/tracking-protection-off.svg create mode 100644 application/basilisk/themes/shared/privatebrowsing/tracking-protection.svg (limited to 'application/basilisk/themes/shared/privatebrowsing') diff --git a/application/basilisk/themes/shared/privatebrowsing/aboutPrivateBrowsing.css b/application/basilisk/themes/shared/privatebrowsing/aboutPrivateBrowsing.css new file mode 100644 index 000000000..923aa929b --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/aboutPrivateBrowsing.css @@ -0,0 +1,227 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +@import url("chrome://global/skin/in-content/info-pages.css"); + +:root { + --color-grey-lightest: #fbfbfb; + --color-grey: #b1b1b1; + + --color-blue: #0996f8; + --color-blue-dark: #0670cc; + --color-blue-darker: #005bab; + + --icon-margin: 64px; +} + +html.private { + --in-content-page-color: #beb8cc; + --in-content-text-color: #beb8cc; + --in-content-page-background: #1c023c; +} + +body { + padding: 40px; +} + +a:link { + color: var(--color-blue); + text-decoration: none; +} + +a:hover { + color: var(--color-blue-dark); + text-decoration: underline; +} + +a:hover:active { + color: var(--color-blue-darker); +} + +a:visited { + color: var(--color-blue-darker); +} + +.about-content-container { + max-width: 780px; +} + +.section-main { + margin-bottom: 48px; + margin-inline-start: var(--icon-margin); + padding-inline-start: 24px; +} + +.section-main:last-child { + margin-bottom: 0; +} + +p { + line-height: 1.5em; +} + +.list-row { + overflow: auto; +} + +.list-row > ul > li { + float: left; + width: 220px; + line-height: 1.5em; + margin-inline-start: 1em; + margin-bottom: 0; +} + +.list-row > ul > li:dir(rtl) { + float: right; +} + +.title { + background-image: url("chrome://browser/skin/privatebrowsing/private-browsing.svg"); + background-size: 64px; + background-position: left, center; + font-weight: lighter; + line-height: 1.5em; + min-height: 64px; + margin-inline-start: 0; + padding-inline-start: calc(var(--icon-margin) + 24px); +} + +.title:dir(rtl) { + background-position: right, center; +} + +.about-subheader { + display: flex; + align-items: center; + font-size: 1.5em; + font-weight: lighter; + min-height: 32px; + background-image: url("chrome://browser/skin/privatebrowsing/tracking-protection.svg"); + background-repeat: no-repeat; + background-size: 32px; + margin-inline-start: calc(var(--icon-margin) - 32px); + padding-inline-start: 56px; +} + +.about-subheader:dir(rtl) { + background-position: right; +} + +.about-subheader.tp-off { + background-image: url("chrome://browser/skin/privatebrowsing/tracking-protection-off.svg"); +} + +.about-info { + font-size: .875em; +} + +.tpTitle { + margin-inline-end: 12px; +} + +.private strong { + color: var(--color-grey-lightest); + font-weight: normal; +} + +a.button { + padding: 5px 40px; + background-color: #381e59; + border: 1px solid #43256a; + border-radius: 4px; + text-decoration: none; + display: inline-block; +} + +/** + * We want to hide the checkbox in lieu of the toggle-btn + * "slider toggle". We need to make the toggle keyboard + * focusable, however, which is not possible if it's + * display:none. We work around this by making the toggle + * invisible but still present in the display list, allowing + * it to receive keyboard events. When it is focused by keyboard, + * we use the -moz-focusring selector on the invisible checkbox + * to show a focus ring around the slider toggle. + */ +.toggle-input { + opacity: 0; + width: 0; + pointer-events: none; + position: absolute; +} + +.toggle + .toggle-btn { + box-sizing: border-box; + cursor: pointer; + min-width: 60px; + height: 24px; + border-radius: 12px; + background-color: var(--color-grey); + border: 1px var(--color-grey) solid; + padding: 2px; +} + +.toggle + .toggle-btn::after, +.toggle + .toggle-btn::before { + position: relative; + display: block; + content: ""; + width: 19px; + height: 100%; +} + +.toggle + .toggle-btn::after { + left: 0; + box-shadow: 0 0 1px 1px hsla(0, 0%, 0%, .1), + 0 1px 0 hsla(0, 0%, 0%, .2); + border-radius: 50%; + background: white; + transition: left .2s ease; +} + +.toggle + .toggle-btn::before { + float: left; + left: 9px; + visibility: hidden; + background-size: 16px; + background-repeat: no-repeat; + background-color: transparent; + background-image: url("chrome://browser/skin/privatebrowsing/check.svg"); +} + +.toggle + .toggle-btn:dir(rtl)::after { + left: auto; + right: 0; + transition-property: right; +} + +.toggle + .toggle-btn:dir(rtl)::before { + float: right; + left: auto; + right: 9px; +} + +.toggle:checked + .toggle-btn { + background: #3fc455; + border: 1px solid #269939; +} + +.toggle:checked + .toggle-btn::after { + left: 35px; +} + +.toggle:checked + .toggle-btn:dir(rtl)::after { + right: 35px; +} + +.toggle:checked + .toggle-btn::before { + visibility: visible; +} + +.toggle:-moz-focusring + .toggle-btn { + outline: 2px solid rgba(0, 149, 221, 0.5); + outline-offset: 1px; + -moz-outline-radius: 2px; +} diff --git a/application/basilisk/themes/shared/privatebrowsing/attention.png b/application/basilisk/themes/shared/privatebrowsing/attention.png new file mode 100644 index 000000000..8706928ff Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/attention.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/attention@2x.png b/application/basilisk/themes/shared/privatebrowsing/attention@2x.png new file mode 100644 index 000000000..5b32888c8 Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/attention@2x.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/check.png b/application/basilisk/themes/shared/privatebrowsing/check.png new file mode 100644 index 000000000..59ca51b7b Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/check.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/check.svg b/application/basilisk/themes/shared/privatebrowsing/check.svg new file mode 100644 index 000000000..a8e4bcc2b --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/check.svg @@ -0,0 +1,8 @@ + + + + + + diff --git a/application/basilisk/themes/shared/privatebrowsing/check@2x.png b/application/basilisk/themes/shared/privatebrowsing/check@2x.png new file mode 100644 index 000000000..031685cbf Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/check@2x.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/favicon.svg b/application/basilisk/themes/shared/privatebrowsing/favicon.svg new file mode 100644 index 000000000..6de9c6450 --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/favicon.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/application/basilisk/themes/shared/privatebrowsing/private-browsing.svg b/application/basilisk/themes/shared/privatebrowsing/private-browsing.svg new file mode 100644 index 000000000..cc37bc4f3 --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/private-browsing.svg @@ -0,0 +1,12 @@ + + + + + + + + + + diff --git a/application/basilisk/themes/shared/privatebrowsing/shield-page.png b/application/basilisk/themes/shared/privatebrowsing/shield-page.png new file mode 100644 index 000000000..2ddcf34e9 Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/shield-page.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/shield-page@2x.png b/application/basilisk/themes/shared/privatebrowsing/shield-page@2x.png new file mode 100644 index 000000000..72a0b8273 Binary files /dev/null and b/application/basilisk/themes/shared/privatebrowsing/shield-page@2x.png differ diff --git a/application/basilisk/themes/shared/privatebrowsing/tracking-protection-off.svg b/application/basilisk/themes/shared/privatebrowsing/tracking-protection-off.svg new file mode 100644 index 000000000..7da0ca78a --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/tracking-protection-off.svg @@ -0,0 +1,15 @@ + + + + + + + + + + diff --git a/application/basilisk/themes/shared/privatebrowsing/tracking-protection.svg b/application/basilisk/themes/shared/privatebrowsing/tracking-protection.svg new file mode 100644 index 000000000..d22fe7df3 --- /dev/null +++ b/application/basilisk/themes/shared/privatebrowsing/tracking-protection.svg @@ -0,0 +1,12 @@ + + + + + + -- cgit v1.2.3