Revert "Bug 1606785 - Enable Prettier for CSS files r=desktop-theme-reviewers,Standard8,frontend-codestyle-reviewers,emilio" for causing multiple failures.
This reverts commitec5fa1d4c0. Revert "Bug 1606785 - Format Firefox CSS files with Prettier r=desktop-theme-reviewers,perftest-reviewers,places-reviewers,translations-reviewers,omc-reviewers,backup-reviewers,browser-installer-reviewers,sparky,dao,pdahiya,nrishel,kpatenio" This reverts commitbaa5d72bbd. Revert "Bug 1606785 - Format browser/themes and toolkit/themes CSS files with Prettier r=desktop-theme-reviewers,pip-reviewers,tabbrowser-reviewers,places-reviewers,dao,mconley" This reverts commit9604b0a8ae. Revert "Bug 1606785 - Format browser/themes/preferences CSS files with Prettier r=settings-reviewers,desktop-theme-reviewers,dao,mconley" This reverts commit686c1cf85f. Revert "Bug 1606785 - Format urlbar CSS files with Prettier r=urlbar-reviewers,desktop-theme-reviewers,dao" This reverts commita7a4f31251. Revert "Bug 1606785 - Format webcompat CSS files with Prettier r=webcompat-reviewers,denschub" This reverts commit41bc4d5237. Revert "Bug 1606785 - Format search CSS files with Prettier r=search-reviewers,jteow" This reverts commit7bb7f82374. Revert "Bug 1606785 - Format dom CSS files with Prettier r=emilio" This reverts commitc22e910235. Revert "Bug 1606785 - Format android CSS files with Prettier r=geckoview-reviewers,hiro" This reverts commitc08e43fc3d. Revert "Bug 1606785 - Format layout CSS files with Prettier r=layout-reviewers,dholbert" This reverts commit4f2a32d1a4. Revert "Bug 1606785 - Format devtools CSS files with Prettier r=devtools-reviewers,nchevobbe,frontend-codestyle-reviewers" This reverts commitc05f675ddf. Revert "Bug 1606785 - Format recomp CSS files with Prettier r=reusable-components-reviewers,desktop-theme-reviewers,dao,mkennedy" This reverts commitb10c7de8d0. Revert "Bug 1606785 - Format sidebar CSS files with Prettier r=sidebar-reviewers,desktop-theme-reviewers,dao,nsharpley" This reverts commitd32c555e37. Revert "Bug 1606785 - Format shopping CSS files with Prettier r=shopping-reviewers,desktop-theme-reviewers,dao,rking" This reverts commit965887a708. Revert "Bug 1606785 - Format profiles CSS files with Prettier r=profiles-reviewers,desktop-theme-reviewers,dao,mossop" This reverts commit8338860f74. Revert "Bug 1606785 - Format genai and ml CSS files with Prettier r=firefox-ai-ml-reviewers,Mardak" This reverts commitd66681f553. Revert "Bug 1606785 - Format firefoxview CSS files with Prettier r=fxview-reviewers,desktop-theme-reviewers,dao,jsudiaman" This reverts commit530b815cad. Revert "Bug 1606785 - Format aboutlogins, megalist, and form autofill CSS files with Prettier r=credential-management-reviewers,mtigley,desktop-theme-reviewers,dao" This reverts commit813c864381.
This commit is contained in:
agoloman
committed by
agoloman@mozilla.com
agoloman@mozilla.com
parent
502863a556
commit
63c83deb26
@@ -8,7 +8,6 @@
|
||||
!*.xhtml
|
||||
!*.html
|
||||
!*.ts
|
||||
!*.css
|
||||
|
||||
# Prettier currently fails to parse this.
|
||||
toolkit/components/extensions/types/ext-tabs-base.d.ts
|
||||
@@ -1253,95 +1252,6 @@ browser/extensions/translations/extension/
|
||||
toolkit/components/uniffi-bindgen-gecko-js/src/templates/js/
|
||||
toolkit/components/uniffi-bindgen-gecko-js/components/generated/*
|
||||
|
||||
# This is intended to simulate a css file generated from a scss file in order to
|
||||
# test sourcemaps.
|
||||
devtools/client/inspector/rules/test/doc_sourcemaps2.css
|
||||
|
||||
##############################################################################
|
||||
# The list below is copied from .stylelintignore. Prettier doesn't currently
|
||||
# support multiple ignore files or dynamic ignore configurations.
|
||||
# When this is implemented, we'll update the configuration below (bug 1825508)
|
||||
##############################################################################
|
||||
|
||||
# These files are generated in some way.
|
||||
browser/components/pocket/content/panels/css/main.compiled.css
|
||||
browser/components/aboutwelcome/**/*.css
|
||||
browser/components/asrouter/**/*.css
|
||||
browser/extensions/newtab/**/*.css
|
||||
|
||||
# Note that the debugger has its own stylelint setup, but that currently
|
||||
# produces errors. Bug 1831302 tracks making this better
|
||||
devtools/client/debugger/src/components/PrimaryPanes/Outline.css
|
||||
devtools/client/debugger/src/components/PrimaryPanes/Sources.css
|
||||
devtools/client/debugger/src/components/shared/AccessibleImage.css
|
||||
devtools/client/debugger/src/utils/editor/source-editor.css
|
||||
devtools/client/debugger/test/mochitest/examples/
|
||||
|
||||
# These get their sourcemap annotations autofixed, though they produce
|
||||
# no errors at all.
|
||||
devtools/client/inspector/rules/test/doc_sourcemaps.css
|
||||
|
||||
# This is intended to simulate a css file generated from a scss file in order to
|
||||
# test sourcemaps.
|
||||
devtools/client/inspector/rules/test/doc_sourcemaps2.css
|
||||
|
||||
# Some of these produce parse errors, some have sourcemaps modified.
|
||||
# They're tests, so let's just ignore all of them:
|
||||
devtools/client/inspector/computed/test/doc_sourcemaps.css
|
||||
devtools/client/inspector/rules/test/doc_invalid_sourcemap.css
|
||||
devtools/client/shared/sourceeditor/test/css_statemachine_testcases.css
|
||||
devtools/client/webconsole/test/browser/*.css
|
||||
|
||||
# Style editor tests check how it copes with invalid or "special" CSS,
|
||||
# so don't try to "fix" those.
|
||||
devtools/client/styleeditor/test/
|
||||
|
||||
# These are empty or have funky charsets
|
||||
dom/base/test/bug466409-empty.css
|
||||
dom/encoding/test/file_utf16_be_bom.css
|
||||
dom/encoding/test/file_utf16_le_bom.css
|
||||
dom/security/test/cors/file_cors_logging_test.html.css
|
||||
dom/tests/mochitest/general/cssA.css
|
||||
dom/tests/mochitest/general/cssC.css
|
||||
|
||||
# These are test-only and cause us to complain about font families or
|
||||
# similar, but we don't want to touch these tests at this point.
|
||||
dom/security/test/csp/file_CSP.css
|
||||
dom/security/test/sri/style2.css
|
||||
dom/xml/test/old/docbook.css
|
||||
dom/xml/test/old/toc/book.css
|
||||
dom/xml/test/old/toc/toc.css
|
||||
|
||||
# Tests we don't want to modify at this point:
|
||||
layout/base/tests/stylesheet_change_events.css
|
||||
layout/inspector/tests/bug856317.css
|
||||
layout/inspector/tests/chrome/test_bug467669.css
|
||||
layout/inspector/tests/chrome/test_bug708874.css
|
||||
layout/style/test/gtest/example.css
|
||||
layout/style/test/mapped2.css
|
||||
layout/style/test/unstyled-frame.css
|
||||
|
||||
# Bug 1893763
|
||||
mobile/android/android-components/components/feature/readerview/src/main/assets/extensions/readerview/readerview.css
|
||||
# Three dashes at top of file (for Jekyll?) cause syntax error:
|
||||
mobile/android/android-components/docs/assets/main.scss
|
||||
|
||||
# Empty test files:
|
||||
netwerk/test/mochitests/test1.css
|
||||
netwerk/test/mochitests/test2.css
|
||||
|
||||
# Has substitution gunk in it:
|
||||
python/mozbuild/mozbuild/test/backend/data/build/foo.css
|
||||
|
||||
# This is third-party in a way:
|
||||
toolkit/components/pdfjs/content/web/debugger.css
|
||||
toolkit/components/pdfjs/content/web/viewer.css
|
||||
toolkit/components/pdfjs/content/web/viewer-geckoview.css
|
||||
build/pgo/blueprint/**/*.css
|
||||
|
||||
# Ignore web-platform tests as they are not necessarily under our control.
|
||||
testing/web-platform/tests/
|
||||
|
||||
##############################################################################
|
||||
# The list below is copied from ThirdPartyPaths.txt. Prettier doesn't currently
|
||||
# support multiple ignore files or dynamic ignore configurations.
|
||||
@@ -1560,6 +1470,7 @@ xpcom/build/mach_override.h
|
||||
xpcom/io/crc32c.c
|
||||
rlbox/rlbox_sandbox.hpp
|
||||
|
||||
|
||||
##############################################################################
|
||||
# The list below is copied from Generated.txt. Prettier doesn't currently
|
||||
# support multiple ignore files or dynamic ignore configurations.
|
||||
|
||||
@@ -1,2 +0,0 @@
|
||||
# When running Prettier via ESlint ignore these filetypes.
|
||||
*.css
|
||||
@@ -1,9 +0,0 @@
|
||||
# When running Prettier via Stylelint ignore these filetypes.
|
||||
*.js
|
||||
*.json
|
||||
*.jsx
|
||||
*.mjs
|
||||
*.sjs
|
||||
*.xhtml
|
||||
*.html
|
||||
*.ts
|
||||
@@ -10,14 +10,4 @@ module.exports = {
|
||||
printWidth: 80,
|
||||
tabWidth: 2,
|
||||
trailingComma: "es5",
|
||||
overrides: [
|
||||
{
|
||||
files: "*.css",
|
||||
options: {
|
||||
parser: "css",
|
||||
// Using a larger printWidth to avoid wrapping selectors.
|
||||
printWidth: 160,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
@@ -41,10 +41,6 @@ devtools/client/debugger/test/mochitest/examples/
|
||||
# no errors at all.
|
||||
devtools/client/inspector/rules/test/doc_sourcemaps.css
|
||||
|
||||
# This is intended to simulate a css file generated from a scss file in order to
|
||||
# test sourcemaps.
|
||||
devtools/client/inspector/rules/test/doc_sourcemaps2.css
|
||||
|
||||
# Some of these produce parse errors, some have sourcemaps modified.
|
||||
# They're tests, so let's just ignore all of them:
|
||||
devtools/client/inspector/computed/test/doc_sourcemaps.css
|
||||
@@ -97,7 +93,7 @@ python/mozbuild/mozbuild/test/backend/data/build/foo.css
|
||||
toolkit/components/pdfjs/content/web/debugger.css
|
||||
toolkit/components/pdfjs/content/web/viewer.css
|
||||
toolkit/components/pdfjs/content/web/viewer-geckoview.css
|
||||
build/pgo/blueprint/**/*.css
|
||||
|
||||
# Ignore web-platform tests as they are not necessarily under our control.
|
||||
testing/web-platform/tests/
|
||||
|
||||
|
||||
@@ -121,7 +121,7 @@
|
||||
}
|
||||
|
||||
#submit-feedback {
|
||||
margin-inline-start: 0.9em;
|
||||
margin-inline-start: .9em;
|
||||
}
|
||||
|
||||
.bottom-link {
|
||||
|
||||
@@ -44,15 +44,14 @@ table {
|
||||
height: 6px;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
th, td {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
th {
|
||||
font: inherit;
|
||||
text-align: start;
|
||||
padding-inline-end: 0.5em;
|
||||
padding-inline-end: .5em;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
@@ -1,3 +1 @@
|
||||
.unused {
|
||||
/* This sheet is here for testing purposes. */
|
||||
}
|
||||
.unused { /* This sheet is here for testing purposes. */ }
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
#testDiv {
|
||||
background: url(http://example.com/tests/image/test/mochitest/blue.png);
|
||||
background: url(http://example.com/tests/image/test/mochitest/blue.png)
|
||||
}
|
||||
|
||||
@@ -35,7 +35,7 @@ body.high-contrast #progress_background {
|
||||
width: 0%;
|
||||
max-width: 100%;
|
||||
height: 100%;
|
||||
background-color: #00aaff;
|
||||
background-color: #00AAFF;
|
||||
}
|
||||
|
||||
/* In high contrast mode, fill the entire progress bar with its border. */
|
||||
@@ -46,8 +46,7 @@ body.high-contrast #progress_bar {
|
||||
}
|
||||
|
||||
/* This layout doesn't want the header or content text. */
|
||||
#header,
|
||||
#content {
|
||||
#header, #content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -14,6 +14,6 @@
|
||||
}
|
||||
|
||||
#bottomBox {
|
||||
background-color: hsla(235, 43%, 10%, 0.5);
|
||||
background-color: hsla(235, 43%, 10%, .5);
|
||||
padding: 15px 10px 15px;
|
||||
}
|
||||
|
||||
@@ -34,7 +34,7 @@ body.high-contrast #progress_background {
|
||||
margin: 0;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #00aaff;
|
||||
background-color: #00AAFF;
|
||||
}
|
||||
|
||||
/* In high contrast mode, fill the entire progress bar with its border. */
|
||||
@@ -45,8 +45,7 @@ body.high-contrast #progress_bar {
|
||||
}
|
||||
|
||||
/* This layout doesn't want the header or content text. */
|
||||
#header,
|
||||
#content {
|
||||
#header, #content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
}
|
||||
|
||||
#bottomBox {
|
||||
background-color: hsla(235, 43%, 10%, 0.5);
|
||||
background-color: hsla(235, 43%, 10%, .5);
|
||||
padding: 15px 10px 15px;
|
||||
}
|
||||
|
||||
|
||||
@@ -70,7 +70,7 @@ body.high-contrast #progress_background {
|
||||
margin: 0;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #00aaff;
|
||||
background-color: #00AAFF;
|
||||
}
|
||||
|
||||
/* In high contrast mode, fill the entire progress bar with its border. */
|
||||
|
||||
@@ -15,6 +15,6 @@
|
||||
}
|
||||
|
||||
#bottomBox {
|
||||
background-color: hsla(235, 43%, 10%, 0.5);
|
||||
background-color: hsla(235, 43%, 10%, .5);
|
||||
padding: 15px 10px 15px;
|
||||
}
|
||||
|
||||
@@ -34,7 +34,7 @@ body.high-contrast #progress_background {
|
||||
margin: 0;
|
||||
width: 0%;
|
||||
height: 100%;
|
||||
background-color: #00aaff;
|
||||
background-color: #00AAFF;
|
||||
}
|
||||
|
||||
/* In high contrast mode, fill the entire progress bar with its border. */
|
||||
@@ -45,8 +45,7 @@ body.high-contrast #progress_bar {
|
||||
}
|
||||
|
||||
/* This layout doesn't want the header or content text. */
|
||||
#header,
|
||||
#content {
|
||||
#header, #content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
}
|
||||
|
||||
html {
|
||||
position: fixed;
|
||||
position: fixed;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
@@ -82,7 +82,7 @@ login-item[data-editing="true"] + login-intro,
|
||||
.primary-password-auth-required > body > header,
|
||||
.primary-password-auth-required > body > login-list,
|
||||
.primary-password-auth-required > body > section {
|
||||
filter: blur(2px);
|
||||
filter: blur(2px)
|
||||
}
|
||||
|
||||
#primary-password-required-overlay {
|
||||
@@ -90,7 +90,7 @@ login-item[data-editing="true"] + login-intro,
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
}
|
||||
|
||||
body > section {
|
||||
|
||||
@@ -33,6 +33,7 @@
|
||||
margin-block: 32px 8px;
|
||||
}
|
||||
|
||||
|
||||
.summary > a {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
* 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/. */
|
||||
|
||||
.overlay {
|
||||
.overlay {
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
inset: 0;
|
||||
/* TODO: this color is used in the about:preferences overlay, but
|
||||
why isn't it declared as a variable? */
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
@@ -53,7 +53,8 @@
|
||||
.fxaccount-avatar {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
background-image: var(--avatar-url), url(chrome://browser/skin/fxa/avatar-color.svg);
|
||||
background-image: var(--avatar-url),
|
||||
url(chrome://browser/skin/fxa/avatar-color.svg);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
inset: 0;
|
||||
/* TODO: this color is used in the about:preferences overlay, but
|
||||
why isn't it declared as a variable? */
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
@@ -24,5 +24,5 @@
|
||||
|
||||
.warning-icon {
|
||||
-moz-context-properties: fill;
|
||||
fill: #ffbf00;
|
||||
fill: #FFBF00;
|
||||
}
|
||||
|
||||
@@ -12,8 +12,8 @@
|
||||
background-color: var(--background-color-box);
|
||||
border-radius: 4px;
|
||||
border: 1px solid var(--in-content-border-color);
|
||||
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
|
||||
font-size: 0.9em;
|
||||
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, .1);
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
:host([variant="info"]) {
|
||||
|
||||
@@ -19,5 +19,5 @@ section {
|
||||
}
|
||||
|
||||
.illustration.logged-in {
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
@@ -2,11 +2,11 @@
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
:host {
|
||||
:host {
|
||||
overflow: hidden;
|
||||
|
||||
--reveal-checkbox-opacity: 0.8;
|
||||
--reveal-checkbox-opacity-hover: 0.6;
|
||||
--reveal-checkbox-opacity: .8;
|
||||
--reveal-checkbox-opacity-hover: .6;
|
||||
--reveal-checkbox-opacity-active: 1;
|
||||
}
|
||||
|
||||
@@ -19,9 +19,9 @@
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:host {
|
||||
--reveal-checkbox-opacity: 0.8;
|
||||
--reveal-checkbox-opacity: .8;
|
||||
--reveal-checkbox-opacity-hover: 1;
|
||||
--reveal-checkbox-opacity-active: 0.6;
|
||||
--reveal-checkbox-opacity-active: .6;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,6 +64,7 @@ form {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
:host(:not([data-editing])) input[type="password"]:read-only,
|
||||
input[type="text"]:read-only,
|
||||
input[type="url"]:read-only {
|
||||
@@ -114,17 +115,16 @@ input[name="password"] {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
origin-warning,
|
||||
password-warning {
|
||||
origin-warning, password-warning {
|
||||
display: none;
|
||||
}
|
||||
|
||||
input[type="url"]:focus:not(:user-invalid):invalid ~ origin-warning,
|
||||
input[type="url"]:focus:user-invalid:not(:placeholder-shown) ~ origin-warning {
|
||||
input[type = "url"]:focus:not(:user-invalid):invalid ~ origin-warning,
|
||||
input[type = "url"]:focus:user-invalid:not(:placeholder-shown) ~ origin-warning {
|
||||
display: block;
|
||||
}
|
||||
|
||||
input[name="password"]:focus ~ password-warning {
|
||||
input[name = "password"]:focus ~ password-warning {
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
@@ -106,7 +106,7 @@ ol {
|
||||
display: block;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
font-size: 0.85em;
|
||||
font-size: .85em;
|
||||
font-weight: var(--font-weight-bold);
|
||||
padding: 4px 16px;
|
||||
border-bottom: 1px solid var(--in-content-border-color);
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
position: absolute;
|
||||
inset-inline-start: 315px;
|
||||
width: 232px;
|
||||
box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.18);
|
||||
box-shadow: 2px 2px 10px 1px rgba(0,0,0,0.18);
|
||||
top: 0;
|
||||
}
|
||||
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
* 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/. */
|
||||
|
||||
.overlay {
|
||||
.overlay {
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
inset: 0;
|
||||
/* TODO: this color is used in the about:preferences overlay, but
|
||||
why isn't it declared as a variable? */
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
display: flex;
|
||||
}
|
||||
|
||||
|
||||
@@ -31,7 +31,7 @@ h1 {
|
||||
}
|
||||
|
||||
a {
|
||||
color: #0060df;
|
||||
color: #0060DF;
|
||||
}
|
||||
|
||||
ul {
|
||||
@@ -44,7 +44,7 @@ ul > li {
|
||||
}
|
||||
|
||||
hr {
|
||||
border-color: #f0f0f4;
|
||||
border-color: #F0F0F4;
|
||||
border-style: solid;
|
||||
border-width: 1px 0 0 0;
|
||||
margin: 0;
|
||||
|
||||
@@ -106,12 +106,12 @@
|
||||
}
|
||||
|
||||
#userContext-label {
|
||||
color: var(--identity-tab-color);
|
||||
margin: 0;
|
||||
color: var(--identity-tab-color);
|
||||
margin: 0;
|
||||
max-width: 8em;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#userContext-icons {
|
||||
|
||||
@@ -5,8 +5,7 @@
|
||||
@import url("chrome://global/skin/in-content/common.css");
|
||||
|
||||
@media not print {
|
||||
html,
|
||||
body {
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
@@ -37,7 +36,7 @@ body {
|
||||
}
|
||||
|
||||
tbody tr {
|
||||
transition: background cubic-bezier(0.07, 0.95, 0, 1) 250ms;
|
||||
transition: background cubic-bezier(.07, .95, 0, 1) 250ms;
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
@@ -45,9 +44,7 @@ tbody tr:hover {
|
||||
color: var(--in-content-item-hover-text);
|
||||
}
|
||||
|
||||
th,
|
||||
td,
|
||||
table {
|
||||
th, td, table {
|
||||
border-collapse: collapse;
|
||||
border: none;
|
||||
text-align: start;
|
||||
@@ -97,8 +94,8 @@ tbody:nth-child(4n + 1) {
|
||||
height: 14px;
|
||||
vertical-align: middle;
|
||||
width: 14px;
|
||||
margin-top: -0.125rem;
|
||||
margin-left: 0.5rem;
|
||||
margin-top: -.125rem;
|
||||
margin-left: .5rem;
|
||||
}
|
||||
|
||||
.collapsible {
|
||||
|
||||
@@ -15,6 +15,7 @@
|
||||
* browser_style: false or by switching to MV3.
|
||||
*/
|
||||
@layer {
|
||||
|
||||
/* Global */
|
||||
html,
|
||||
body {
|
||||
@@ -113,7 +114,7 @@
|
||||
button.browser-style:disabled,
|
||||
select.browser-style:disabled {
|
||||
color: #999;
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
button.browser-style.focused,
|
||||
@@ -148,7 +149,7 @@
|
||||
|
||||
.browser-style.disabled > label {
|
||||
color: #999;
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
/* Radio Buttons */
|
||||
@@ -275,8 +276,8 @@
|
||||
border: 1px solid #b1b1b1;
|
||||
}
|
||||
|
||||
button.browser-style:enabled:hover:active:not(.hover, .focused),
|
||||
select.browser-style:enabled:hover:active:not(.hover, .focused) {
|
||||
button.browser-style:enabled:hover:active:not(.hover, .focused),
|
||||
select.browser-style:enabled:hover:active:not(.hover, .focused) {
|
||||
background-color: #d4d4d4;
|
||||
border: 1px solid #858585;
|
||||
}
|
||||
@@ -320,7 +321,7 @@
|
||||
.browser-style > input[type="text"]:disabled,
|
||||
textarea.browser-style:disabled {
|
||||
color: #999;
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.browser-style > input[type="text"].focused,
|
||||
@@ -346,8 +347,7 @@
|
||||
.browser-style > input[type="text"]:invalid:not(:focus),
|
||||
textarea.browser-style:invalid:not(:focus) {
|
||||
border-color: var(--red-60);
|
||||
box-shadow:
|
||||
0 0 0 1px var(--red-60),
|
||||
box-shadow: 0 0 0 1px var(--red-60),
|
||||
0 0 0 4px rgba(251, 0, 34, 0.3);
|
||||
}
|
||||
|
||||
@@ -421,7 +421,7 @@
|
||||
.panel-list-item > .text-shortcut {
|
||||
color: #808080;
|
||||
font-family: "Lucida Grande", caption;
|
||||
font-size: 0.847em;
|
||||
font-size: .847em;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
@@ -481,7 +481,7 @@
|
||||
.panel-section-footer-button > .text-shortcut {
|
||||
color: #808080;
|
||||
font-family: "Lucida Grande", caption;
|
||||
font-size: 0.847em;
|
||||
font-size: .847em;
|
||||
}
|
||||
|
||||
.panel-section-footer-button:hover {
|
||||
@@ -541,9 +541,7 @@
|
||||
}
|
||||
|
||||
.panel-section-tabs-button.selected {
|
||||
box-shadow:
|
||||
0 -1px 0 #0670cc inset,
|
||||
0 -4px 0 #0996f8 inset;
|
||||
box-shadow: 0 -1px 0 #0670cc inset, 0 -4px 0 #0996f8 inset;
|
||||
color: #0996f8;
|
||||
}
|
||||
|
||||
@@ -570,4 +568,5 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
} /* end of @layer */
|
||||
|
||||
@@ -113,8 +113,8 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
::slotted([slot="header"]),
|
||||
::slotted([slot="secondary-header"]) {
|
||||
::slotted([slot=header]),
|
||||
::slotted([slot=secondary-header]) {
|
||||
align-self: center;
|
||||
margin: 0;
|
||||
font-size: 1.13em;
|
||||
@@ -125,12 +125,12 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
::slotted([slot="header"]) {
|
||||
::slotted([slot=header]) {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
::slotted([slot="secondary-header"]) {
|
||||
::slotted([slot=secondary-header]) {
|
||||
padding-inline-end: 1em;
|
||||
}
|
||||
|
||||
@@ -141,7 +141,7 @@
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
::slotted([slot="footer"]:not([hidden])) {
|
||||
::slotted([slot=footer]:not([hidden])) {
|
||||
text-decoration: underline;
|
||||
display: inline-block;
|
||||
outline-offset: 2px;
|
||||
|
||||
@@ -2,13 +2,13 @@
|
||||
* 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/common.css");
|
||||
@import url("chrome://global/skin/in-content/common.css");
|
||||
|
||||
:root {
|
||||
/* override --in-content-page-background from common-shared.css */
|
||||
background-color: transparent;
|
||||
--fxview-background-color: var(--newtab-background-color, var(--in-content-page-background));
|
||||
--fxview-background-color-secondary: var(--newtab-background-color-secondary, #ffffff);
|
||||
--fxview-background-color-secondary: var(--newtab-background-color-secondary, #FFFFFF);
|
||||
--fxview-element-background-hover: color-mix(in srgb, var(--fxview-background-color) 90%, currentColor);
|
||||
--fxview-element-background-active: color-mix(in srgb, var(--fxview-background-color) 80%, currentColor);
|
||||
--fxview-text-primary-color: var(--newtab-text-primary-color, var(--in-content-page-color));
|
||||
@@ -17,7 +17,7 @@
|
||||
--fxview-primary-action-background: var(--newtab-primary-action-background, #0061e0);
|
||||
--fxview-border: var(--border-color-transparent);
|
||||
--fxview-border-interactive: var(--border-color-interactive);
|
||||
--fxview-indicator-stroke-color-hover: #deddde;
|
||||
--fxview-indicator-stroke-color-hover: #DEDDDE;
|
||||
|
||||
/* ensure utility button hover states match those of the rest of the page */
|
||||
--in-content-button-background-hover: var(--fxview-element-background-hover);
|
||||
@@ -29,7 +29,7 @@
|
||||
--fxview-card-padding-inline: 4px;
|
||||
|
||||
/* copy over newtab background color from activity-stream-[os].css files */
|
||||
--newtab-background-color: #f9f9fb;
|
||||
--newtab-background-color: #F9F9FB;
|
||||
|
||||
--fxview-card-header-font-weight: 500;
|
||||
}
|
||||
@@ -38,10 +38,10 @@
|
||||
:root {
|
||||
--fxview-element-background-hover: color-mix(in srgb, var(--fxview-background-color) 80%, white);
|
||||
--fxview-element-background-active: color-mix(in srgb, var(--fxview-background-color) 60%, white);
|
||||
--fxview-indicator-stroke-color-hover: #5d5c66;
|
||||
--fxview-indicator-stroke-color-hover:#5D5C66;
|
||||
|
||||
/* copy over newtab colors from activity-stream-[os].css files */
|
||||
--newtab-background-color: #2b2a33;
|
||||
--newtab-background-color: #2B2A33;
|
||||
--newtab-background-color-secondary: #42414d;
|
||||
--newtab-primary-action-background: #00ddff;
|
||||
}
|
||||
@@ -111,7 +111,13 @@ body {
|
||||
padding-inline: calc(var(--fxview-card-padding-inline) * 2);
|
||||
margin: 0 calc(var(--fxview-card-padding-inline) * -1);
|
||||
|
||||
background: linear-gradient(to bottom, var(--fxview-background-color) 0%, var(--fxview-background-color) 95%, transparent 100%);
|
||||
background:
|
||||
linear-gradient(
|
||||
to bottom,
|
||||
var(--fxview-background-color) 0%,
|
||||
var(--fxview-background-color) 95%,
|
||||
transparent 100%
|
||||
);
|
||||
/* When you use HCM or set custom colors, you can't use a gradient. */
|
||||
@media (forced-colors) {
|
||||
background: var(--fxview-background-color);
|
||||
|
||||
@@ -108,7 +108,7 @@
|
||||
}
|
||||
|
||||
.fxview-tab-row-button::part(button) {
|
||||
color: var(--fxview-text-primary-color);
|
||||
color: var(--fxview-text-primary-color)
|
||||
}
|
||||
|
||||
.fxview-tab-row-button[muted="true"]::part(button) {
|
||||
|
||||
@@ -59,7 +59,7 @@ moz-button.close::part(button) {
|
||||
dialog {
|
||||
border: 1px solid transparent;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 0 2px 6px 0 rgba(0,0,0,0.3);
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
|
||||
@@ -59,11 +59,11 @@
|
||||
position: absolute;
|
||||
|
||||
&[muted="true"] {
|
||||
background-image: url("chrome://global/skin/media/audio-muted.svg");
|
||||
background-image: url("chrome://global/skin/media/audio-muted.svg");
|
||||
}
|
||||
|
||||
&[soundplaying="true"] {
|
||||
background-image: url("chrome://global/skin/media/audio.svg");
|
||||
background-image: url("chrome://global/skin/media/audio.svg");
|
||||
}
|
||||
|
||||
&:active,
|
||||
|
||||
@@ -24,8 +24,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.open-tabs-options,
|
||||
.open-tabs-sort-wrapper {
|
||||
.open-tabs-options, .open-tabs-sort-wrapper {
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
@@ -16,15 +16,15 @@
|
||||
|
||||
.phone,
|
||||
.mobile {
|
||||
background-image: url("chrome://browser/skin/device-phone.svg");
|
||||
background-image: url('chrome://browser/skin/device-phone.svg');
|
||||
}
|
||||
|
||||
.desktop {
|
||||
background-image: url("chrome://browser/skin/device-desktop.svg");
|
||||
background-image: url('chrome://browser/skin/device-desktop.svg');
|
||||
}
|
||||
|
||||
.tablet {
|
||||
background-image: url("chrome://browser/skin/device-tablet.svg");
|
||||
background-image: url('chrome://browser/skin/device-tablet.svg');
|
||||
}
|
||||
|
||||
h2 {
|
||||
|
||||
@@ -76,7 +76,7 @@ browser {
|
||||
}
|
||||
|
||||
#multi-stage-message-root {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
inset: 0;
|
||||
@@ -235,16 +235,16 @@ browser {
|
||||
margin-block: var(--space-small);
|
||||
padding-inline-start: 24px;
|
||||
|
||||
&[data-l10n-id*="generate"] {
|
||||
&[data-l10n-id*=generate] {
|
||||
background-image: url(chrome://global/skin/icons/edit-outline.svg);
|
||||
}
|
||||
&[data-l10n-id*="analyze"] {
|
||||
&[data-l10n-id*=analyze] {
|
||||
background-image: url(chrome://global/skin/icons/eye.svg);
|
||||
}
|
||||
&[data-l10n-id*="switch"] {
|
||||
&[data-l10n-id*=switch] {
|
||||
background-image: url(chrome://global/skin/icons/arrows-updown.svg);
|
||||
}
|
||||
&[data-l10n-id*="price"] {
|
||||
&[data-l10n-id*=price] {
|
||||
background-image: url(chrome://browser/skin/price.svg);
|
||||
}
|
||||
}
|
||||
@@ -252,7 +252,7 @@ browser {
|
||||
|
||||
.link-paragraph {
|
||||
color: var(--text-color-deemphasized);
|
||||
font-size: 0.8em;
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
.inline-image {
|
||||
|
||||
@@ -5,42 +5,42 @@
|
||||
*/
|
||||
|
||||
.og-card {
|
||||
--og-main-font-size: 1.4rem;
|
||||
background-color: light-dark(rgba(0, 0, 0, 0.05), rgba(255, 255, 255, 0.05));
|
||||
font-size: 1.2em;
|
||||
--og-main-font-size: 1.4rem;
|
||||
background-color: light-dark(rgba(0,0,0,0.05), rgba(255,255,255,0.05));
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.og-card-img {
|
||||
border-radius: var(--border-radius-small);
|
||||
height: 100px;
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
border-radius: var(--border-radius-small);
|
||||
height: 100px;
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.og-card-content {
|
||||
background-color: var(--panel-background);
|
||||
border-bottom: 1px solid var(--panel-border-color);
|
||||
border-radius: var(--panel-border-radius);
|
||||
color: var(--text-color-deemphasized);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--space-large);
|
||||
padding: var(--og-padding);
|
||||
background-color: var(--panel-background);
|
||||
border-bottom: 1px solid var(--panel-border-color);
|
||||
border-radius: var(--panel-border-radius);
|
||||
color: var(--text-color-deemphasized);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--space-large);
|
||||
padding: var(--og-padding);
|
||||
}
|
||||
|
||||
.og-card-title {
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 3;
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 3;
|
||||
}
|
||||
|
||||
.og-card-description {
|
||||
font-size: var(--og-main-font-size);
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 3;
|
||||
font-size: var(--og-main-font-size);
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
-webkit-line-clamp: 3;
|
||||
}
|
||||
|
||||
.og-error-message {
|
||||
@@ -49,53 +49,53 @@
|
||||
}
|
||||
|
||||
.ai-content {
|
||||
position: relative;
|
||||
padding: var(--og-padding);
|
||||
.og-error-message-container {
|
||||
margin: 0;
|
||||
font-size: var(--og-main-font-size);
|
||||
position: relative;
|
||||
padding: var(--og-padding);
|
||||
.og-error-message-container {
|
||||
margin:0;
|
||||
font-size: var(--og-main-font-size);
|
||||
|
||||
.og-error-message {
|
||||
color: var(--text-color-deemphasized);
|
||||
.og-error-message {
|
||||
color: var(--text-color-deemphasized);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--text-color-deemphasized);
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--text-color-deemphasized);
|
||||
h3 {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
gap: var(--space-xs);
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
gap: var(--space-xs);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
img.icon {
|
||||
-moz-context-properties: fill;
|
||||
fill: currentColor;
|
||||
height: var(--icon-size-default);
|
||||
margin-inline-start: var(--space-xlarge);
|
||||
pointer-events: none;
|
||||
width: var(--icon-size-default);
|
||||
}
|
||||
|
||||
> ul {
|
||||
font-size: var(--og-main-font-size);
|
||||
line-height: 1.15; /* Design requires 18px line-height */
|
||||
list-style-type: square;
|
||||
padding-inline-start: var(--space-large);
|
||||
}
|
||||
|
||||
li {
|
||||
margin-block: var(--space-medium);
|
||||
padding-inline-start: 5px;
|
||||
&::marker {
|
||||
color: var(--border-color-deemphasized);
|
||||
img.icon {
|
||||
-moz-context-properties: fill;
|
||||
fill: currentColor;
|
||||
height: var(--icon-size-default);
|
||||
margin-inline-start: var(--space-xlarge);
|
||||
pointer-events: none;
|
||||
width: var(--icon-size-default);
|
||||
}
|
||||
|
||||
> ul {
|
||||
font-size: var(--og-main-font-size);
|
||||
line-height: 1.15; /* Design requires 18px line-height */
|
||||
list-style-type: square;
|
||||
padding-inline-start: var(--space-large);
|
||||
}
|
||||
|
||||
li {
|
||||
margin-block: var(--space-medium);
|
||||
padding-inline-start: 5px;
|
||||
&::marker {
|
||||
color: var(--border-color-deemphasized);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.visit-link-container {
|
||||
align-items: center;
|
||||
@@ -103,24 +103,24 @@
|
||||
justify-content: flex-end;
|
||||
margin-top: var(--space-xlarge);
|
||||
|
||||
.visit-link {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: var(--space-xs);
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
.visit-link {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
gap: var(--space-xs);
|
||||
font-size: var(--og-main-font-size);
|
||||
font-weight: var(--font-weight-bold);
|
||||
}
|
||||
}
|
||||
|
||||
> hr {
|
||||
border-color: var(--border-color-card);
|
||||
margin-top: var(--space-xlarge);
|
||||
margin-bottom: var(--space-xlarge);
|
||||
border-color: var(--border-color-card);
|
||||
margin-top: var(--space-xlarge);
|
||||
margin-bottom: var(--space-xlarge);
|
||||
}
|
||||
|
||||
> p {
|
||||
margin-block: var(--space-medium) 0;
|
||||
}
|
||||
> p {
|
||||
margin-block: var(--space-medium) 0;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -158,7 +158,7 @@
|
||||
height: var(--og-main-font-size);
|
||||
margin-bottom: 4px;
|
||||
width: 100%;
|
||||
/* Add non-impactful references to the CSS variables to satisfy the test browser_parsable_css */
|
||||
/* Add non-impactful references to the CSS variables to satisfy the test browser_parsable_css */
|
||||
outline-color: var(--skeleton-loader-background-color);
|
||||
border-color: var(--skeleton-loader-motion-element-color);
|
||||
}
|
||||
|
||||
@@ -60,17 +60,26 @@
|
||||
}
|
||||
|
||||
&:indeterminate {
|
||||
--optin-animation-base-color-1: light-dark(var(--color-blue-50), var(--color-blue-30));
|
||||
--optin-animation-base-color-2: color-mix(in srgb, var(--optin-animation-base-color-1) 25%, transparent);
|
||||
--optin-animation-base-color-1: light-dark(
|
||||
var(--color-blue-50),
|
||||
var(--color-blue-30)
|
||||
);
|
||||
--optin-animation-base-color-2: color-mix(
|
||||
in srgb,
|
||||
var(--optin-animation-base-color-1) 25%,
|
||||
transparent
|
||||
);
|
||||
|
||||
animation: optin-loading-bar-animation 3s infinite;
|
||||
outline-color: var(--optin-animation-base-color-1);
|
||||
border-color: var(--optin-animation-base-color-2);
|
||||
background: linear-gradient(
|
||||
100deg,
|
||||
color-mix(in srgb, var(--optin-animation-base-color-1), transparent 25%) 30%,
|
||||
color-mix(in srgb, var(--optin-animation-base-color-1), transparent 25%)
|
||||
30%,
|
||||
var(--optin-animation-base-color-2) 50%,
|
||||
color-mix(in srgb, var(--optin-animation-base-color-1), transparent 25%) 70%
|
||||
color-mix(in srgb, var(--optin-animation-base-color-1), transparent 25%)
|
||||
70%
|
||||
);
|
||||
|
||||
background-size: 200% 100%;
|
||||
|
||||
@@ -13,7 +13,8 @@ body {
|
||||
}
|
||||
|
||||
body {
|
||||
background: url(chrome://browser/content/messagepreview/limelight.svg) center/contain no-repeat;
|
||||
background: url(chrome://browser/content/messagepreview/limelight.svg)
|
||||
center/contain no-repeat;
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
fill: var(--icon-color);
|
||||
fill-opacity: 0.2;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
body {
|
||||
padding: 0.5em 2em;
|
||||
padding: .5em 2em;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
@@ -19,7 +19,7 @@ body {
|
||||
.message-bar-icon {
|
||||
vertical-align: middle;
|
||||
-moz-context-properties: fill;
|
||||
fill: #ffbf00;
|
||||
fill: #FFBF00;
|
||||
}
|
||||
|
||||
#categories {
|
||||
@@ -60,8 +60,8 @@ body {
|
||||
}
|
||||
|
||||
#tableViewer > div {
|
||||
padding: 0.3em 1em;
|
||||
padding: .3em 1em;
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@@ -33,6 +33,8 @@
|
||||
background-color: var(--button-background-color-hover);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@media (forced-colors) {
|
||||
&:hover {
|
||||
border-color: SelectedItem;
|
||||
|
||||
@@ -7,7 +7,9 @@
|
||||
:host {
|
||||
--avatar-size: 80px;
|
||||
--profile-card-radius: 12px;
|
||||
--profile-card-radius-inner: calc(var(--profile-card-radius) - var(--border-width));
|
||||
--profile-card-radius-inner: calc(
|
||||
var(--profile-card-radius) - var(--border-width)
|
||||
);
|
||||
}
|
||||
|
||||
.profile-card {
|
||||
@@ -74,7 +76,8 @@
|
||||
background-position: center;
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: var(--icon-color);
|
||||
border-radius: var(--profile-card-radius-inner) var(--profile-card-radius-inner) 0 0;
|
||||
border-radius: var(--profile-card-radius-inner)
|
||||
var(--profile-card-radius-inner) 0 0;
|
||||
}
|
||||
|
||||
.profile-avatar {
|
||||
|
||||
@@ -17,7 +17,10 @@ body {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
background-color: var(--newtab-background-color, var(--background-color-canvas));
|
||||
background-color: var(
|
||||
--newtab-background-color,
|
||||
var(--background-color-canvas)
|
||||
);
|
||||
}
|
||||
|
||||
edit-profile-card,
|
||||
|
||||
@@ -6,29 +6,29 @@
|
||||
--card-padding: 24px;
|
||||
--exit-icon-size: 12px;
|
||||
--exit-icon-position: calc((var(--card-padding) - var(--exit-icon-size)) / 2);
|
||||
--social-color: #9059ff;
|
||||
--cookie-color: #0090f4;
|
||||
--tracker-color: #2ac3a2;
|
||||
--fingerprinter-color: #ffa436;
|
||||
--cryptominer-color: #adadbc;
|
||||
--social-color: #9059FF;
|
||||
--cookie-color: #0090F4;
|
||||
--tracker-color: #2AC3A2;
|
||||
--fingerprinter-color: #FFA436;
|
||||
--cryptominer-color: #ADADBC;
|
||||
|
||||
/* Highlight colors for trackers */
|
||||
--social-highlight-color: #7b4cdb;
|
||||
--cookie-highlight-color: #0081db;
|
||||
--tracker-highlight-color: #23a488;
|
||||
--fingerprinter-highlight-color: #d37f17;
|
||||
--cryptominer-highlight-color: #9292a0;
|
||||
--social-highlight-color: #7B4CDB;
|
||||
--cookie-highlight-color: #0081DB;
|
||||
--tracker-highlight-color: #23A488;
|
||||
--fingerprinter-highlight-color: #D37F17;
|
||||
--cryptominer-highlight-color: #9292A0;
|
||||
|
||||
--tab-highlight: var(--social-color); /* start with social selected */
|
||||
--column-width: 16px;
|
||||
--graph-empty: #cececf;
|
||||
--graph-curve: cubic-bezier(0.66, 0.75, 0.59, 0.91);
|
||||
--graph-empty: #CECECF;
|
||||
--graph-curve: cubic-bezier(.66,.75,.59,.91);
|
||||
|
||||
/* Colors for the loading indicator */
|
||||
--protection-report-loader-color-stop: #aeaeae3d;
|
||||
--protection-report-loader-color-stop: #AEAEAE3D;
|
||||
--protection-report-loader-gradient-opacity: 0.95;
|
||||
|
||||
--grey-70: #38383d;
|
||||
--grey-70: #38383D;
|
||||
--grey-90-a60: rgba(12, 12, 13, 0.6);
|
||||
|
||||
--gear-icon-fill: var(--grey-90-a60);
|
||||
@@ -40,29 +40,27 @@ body {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
*, *:before, *:after {
|
||||
box-sizing: inherit;
|
||||
}
|
||||
|
||||
body[focuseddatatype="social"] {
|
||||
body[focuseddatatype=social] {
|
||||
--tab-highlight: var(--social-color);
|
||||
}
|
||||
|
||||
body[focuseddatatype="cookie"] {
|
||||
body[focuseddatatype=cookie] {
|
||||
--tab-highlight: var(--cookie-color);
|
||||
}
|
||||
|
||||
body[focuseddatatype="tracker"] {
|
||||
body[focuseddatatype=tracker] {
|
||||
--tab-highlight: var(--tracker-color);
|
||||
}
|
||||
|
||||
body[focuseddatatype="fingerprinter"] {
|
||||
body[focuseddatatype=fingerprinter] {
|
||||
--tab-highlight: var(--fingerprinter-color);
|
||||
}
|
||||
|
||||
body[focuseddatatype="cryptominer"] {
|
||||
body[focuseddatatype=cryptominer] {
|
||||
--tab-highlight: var(--cryptominer-color);
|
||||
}
|
||||
|
||||
@@ -200,13 +198,13 @@ a.hidden,
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--social-highlight-color: #9661ff;
|
||||
--cookie-highlight-color: #2ba8ff;
|
||||
--tracker-highlight-color: #39e1bc;
|
||||
--fingerprinter-highlight-color: #ffb65e;
|
||||
--cryptominer-highlight-color: #bebeca;
|
||||
--social-highlight-color: #9661FF;
|
||||
--cookie-highlight-color: #2BA8FF;
|
||||
--tracker-highlight-color: #39E1BC;
|
||||
--fingerprinter-highlight-color: #FFB65E;
|
||||
--cryptominer-highlight-color: #BEBECA;
|
||||
|
||||
--gear-icon-fill: rgba(249, 249, 250, 0.6);
|
||||
--gear-icon-fill: rgba(249, 249, 250, 0.60);
|
||||
--hover-grey-link: var(--grey-30);
|
||||
--feature-banner-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
@@ -248,7 +246,7 @@ a.hidden,
|
||||
|
||||
.card .content {
|
||||
margin-block: 5px 0;
|
||||
font-size: 0.93em;
|
||||
font-size: .93em;
|
||||
cursor: default;
|
||||
color: var(--text-color-deemphasized);
|
||||
}
|
||||
@@ -591,21 +589,21 @@ label[for="tab-social"]:hover ~ #highlight-hover {
|
||||
grid-area: social;
|
||||
}
|
||||
|
||||
input[data-type="cookie"]:checked ~ #highlight,
|
||||
input[data-type="cookie"]:checked ~ #highlight,
|
||||
.hover-cookie label[for="tab-cookie"] ~ #highlight-hover,
|
||||
label[for="tab-cookie"]:hover ~ #highlight-hover {
|
||||
background-color: var(--cookie-color);
|
||||
grid-area: cookie;
|
||||
}
|
||||
|
||||
input[data-type="tracker"]:checked ~ #highlight,
|
||||
input[data-type="tracker"]:checked ~ #highlight,
|
||||
.hover-tracker label[for="tab-tracker"] ~ #highlight-hover,
|
||||
label[for="tab-tracker"]:hover ~ #highlight-hover {
|
||||
background-color: var(--tracker-color);
|
||||
grid-area: tracker;
|
||||
}
|
||||
|
||||
input[data-type="fingerprinter"]:checked ~ #highlight,
|
||||
input[data-type="fingerprinter"]:checked ~ #highlight,
|
||||
.hover-fingerprinter label[for="tab-fingerprinter"] ~ #highlight-hover,
|
||||
label[for="tab-fingerprinter"]:hover ~ #highlight-hover {
|
||||
background-color: var(--fingerprinter-color);
|
||||
@@ -744,7 +742,7 @@ label[for="tab-cryptominer"]:hover ~ #highlight-hover {
|
||||
}
|
||||
|
||||
#monitor-partial-breaches-percentage {
|
||||
font-size: 0.93em;
|
||||
font-size: .93em;
|
||||
cursor: default;
|
||||
color: var(--text-color-deemphasized);
|
||||
float: inline-end;
|
||||
@@ -757,17 +755,17 @@ label[for="tab-cryptominer"]:hover ~ #highlight-hover {
|
||||
height: 25px;
|
||||
box-shadow: 0 0 0 1px rgba(202, 201, 213, 0.5);
|
||||
border: none;
|
||||
background: linear-gradient(-45deg, #0250bb 0%, #9059ff 100%);
|
||||
background: linear-gradient(-45deg, #0250BB 0%, #9059FF 100%);
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
.progress-bar:dir(rtl) {
|
||||
direction: ltr;
|
||||
background: linear-gradient(-45deg, #0250bb 0%, #9059ff 100%);
|
||||
background: linear-gradient(-45deg, #0250BB 0%, #9059FF 100%);
|
||||
}
|
||||
|
||||
.progress-bar::-moz-progress-bar {
|
||||
background: #ffffff;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
@@ -875,64 +873,64 @@ label[for="tab-cryptominer"]:hover ~ #highlight-hover {
|
||||
|
||||
.monitor-block a {
|
||||
outline: none;
|
||||
color: #ffffff;
|
||||
color: #FFFFFF;
|
||||
padding: 19px 0;
|
||||
}
|
||||
|
||||
.monitor-block a:hover {
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.email {
|
||||
background: linear-gradient(162.33deg, #ab71ff 0%, #9059ff 100%);
|
||||
background: linear-gradient(162.33deg, #AB71FF 0%, #9059FF 100%);
|
||||
grid-column: 1;
|
||||
}
|
||||
|
||||
.email:hover {
|
||||
background: linear-gradient(162.33deg, #7d43d1 0%, #7740e6 100%);
|
||||
background: linear-gradient(162.33deg, #7D43D1 0%, #7740E6 100%);
|
||||
}
|
||||
|
||||
.email:dir(rtl) {
|
||||
background: linear-gradient(197.67deg, #ab71ff 0%, #9059ff 100%);
|
||||
background: linear-gradient(197.67deg, #AB71FF 0%, #9059FF 100%);
|
||||
}
|
||||
|
||||
.email:dir(rtl):hover {
|
||||
background: linear-gradient(197.67deg, #7d43d1 0%, #7740e6 100%);
|
||||
background: linear-gradient(197.67deg, #7D43D1 0%, #7740E6 100%);
|
||||
}
|
||||
|
||||
.breaches {
|
||||
background: linear-gradient(162.33deg, #9059ff 0%, #7542e5 100%);
|
||||
background: linear-gradient(162.33deg, #9059FF 0%, #7542E5 100%);
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
.breaches:hover {
|
||||
background: linear-gradient(162.33deg, #7740e6 0%, #4714b7 100%);
|
||||
background: linear-gradient(162.33deg, #7740E6 0%, #4714B7 100%);
|
||||
}
|
||||
|
||||
.breaches:dir(rtl) {
|
||||
background: linear-gradient(197.67deg, #9059ff 0%, #7542e5 100%);
|
||||
background: linear-gradient(197.67deg, #9059FF 0%, #7542E5 100%)
|
||||
}
|
||||
|
||||
.breaches:dir(rtl):hover {
|
||||
background: linear-gradient(197.67deg, #7740e6 0%, #4714b7 100%);
|
||||
background: linear-gradient(197.67deg, #7740E6 0%, #4714B7 100%)
|
||||
}
|
||||
|
||||
.passwords {
|
||||
background: linear-gradient(162.33deg, #7542e5 0%, #592acb 100%);
|
||||
background: linear-gradient(162.33deg, #7542E5 0%, #592ACB 100%);
|
||||
grid-column: 3;
|
||||
}
|
||||
|
||||
.passwords:hover {
|
||||
background: linear-gradient(162.33deg, #4714b7 0%, #2b009d 100%);
|
||||
background: linear-gradient(162.33deg, #4714B7 0%, #2B009D 100%);
|
||||
}
|
||||
|
||||
.passwords:dir(rtl) {
|
||||
background: linear-gradient(197.67deg, #7542e5 0%, #592acb 100%);
|
||||
background: linear-gradient(197.67deg, #7542E5 0%, #592ACB 100%)
|
||||
}
|
||||
|
||||
.passwords:dir(rtl):hover {
|
||||
background: linear-gradient(197.67deg, #4714b7 0%, #2b009d 100%);
|
||||
background: linear-gradient(197.67deg, #4714B7 0%, #2B009D 100%)
|
||||
}
|
||||
|
||||
.monitor-stat {
|
||||
@@ -952,7 +950,7 @@ label[for="tab-cryptominer"]:hover ~ #highlight-hover {
|
||||
.icon-med {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
-moz-context-properties: fill,fill-opacity;
|
||||
fill: white;
|
||||
fill-opacity: 0.65;
|
||||
padding: 5px;
|
||||
@@ -1033,31 +1031,19 @@ label[for="tab-cryptominer"]:hover ~ #highlight-hover {
|
||||
height: 110px;
|
||||
width: 765px;
|
||||
content: "";
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
var(--background-color-box) 0%,
|
||||
var(--protection-report-loader-color-stop) 30%,
|
||||
var(--background-color-box) 40%,
|
||||
var(--background-color-box) 100%
|
||||
);
|
||||
background-image: linear-gradient(to right, var(--background-color-box) 0%, var(--protection-report-loader-color-stop) 30%, var(--background-color-box) 40%, var(--background-color-box) 100%);
|
||||
background-repeat: no-repeat;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-name: loading;
|
||||
animation-timing-function: cubic-bezier(0.07, 0.95, 1, 1);
|
||||
animation-timing-function: cubic-bezier(.07,.95,1,1);
|
||||
background-size: 700px 100%;
|
||||
opacity: var(--protection-report-loader-gradient-opacity);
|
||||
}
|
||||
|
||||
.monitor-card.loading:dir(rtl)::after,
|
||||
.lockwise-card.loading:dir(rtl)::after {
|
||||
background-image: linear-gradient(
|
||||
to left,
|
||||
var(--background-color-box) 0%,
|
||||
var(--protection-report-loader-color-stop) 30%,
|
||||
var(--background-color-box) 40%,
|
||||
var(--background-color-box) 100%
|
||||
);
|
||||
background-image: linear-gradient(to left, var(--background-color-box) 0%, var(--protection-report-loader-color-stop) 30%, var(--background-color-box) 40%, var(--background-color-box) 100%);
|
||||
animation-name: loading-rtl;
|
||||
}
|
||||
|
||||
|
||||
@@ -24,8 +24,7 @@
|
||||
background-image: url("chrome://browser/content/screenshots/menu-visible.svg");
|
||||
}
|
||||
|
||||
#full-page,
|
||||
#visible-page {
|
||||
#full-page, #visible-page {
|
||||
-moz-context-properties: fill, stroke;
|
||||
fill: currentColor;
|
||||
/* stroke is the secondary fill color used to define the viewport shape in the SVGs */
|
||||
|
||||
@@ -12,7 +12,7 @@ hbox {
|
||||
|
||||
#titleContainer {
|
||||
padding-bottom: var(--space-xlarge);
|
||||
--icon-url: url("chrome://browser/skin/preferences/category-search.svg");
|
||||
--icon-url: url("chrome://browser/skin/preferences/category-search.svg")
|
||||
}
|
||||
|
||||
.dialogRow {
|
||||
@@ -34,6 +34,8 @@ input[type="url"] {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.error-label {
|
||||
display: flex;
|
||||
font-size: var(--font-size-small);
|
||||
|
||||
@@ -3,11 +3,11 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
.contentSearchSuggestionTable {
|
||||
background-color: hsla(0, 0%, 100%, 0.99);
|
||||
background-color: hsla(0,0%,100%,.99);
|
||||
color: black;
|
||||
border: 1px solid hsla(0, 0%, 0%, 0.2);
|
||||
border: 1px solid hsla(0, 0%, 0%, .2);
|
||||
border-top: none;
|
||||
box-shadow: 0 5px 10px hsla(0, 0%, 0%, 0.1);
|
||||
box-shadow: 0 5px 10px hsla(0, 0%, 0%, .1);
|
||||
position: absolute;
|
||||
inset-inline-start: 0;
|
||||
z-index: 1001;
|
||||
@@ -108,7 +108,7 @@
|
||||
padding: 0;
|
||||
border: none;
|
||||
background: none;
|
||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAWCAYAAAABxvaqAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gofECQNNVW2/AAAABBJREFUGFdjOHPmzH8GehEA/KpKg9YTf4AAAAAASUVORK5CYII=");
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAWCAYAAAABxvaqAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gofECQNNVW2/AAAABBJREFUGFdjOHPmzH8GehEA/KpKg9YTf4AAAAAASUVORK5CYII=');
|
||||
background-repeat: no-repeat;
|
||||
background-position: right center;
|
||||
}
|
||||
@@ -146,7 +146,7 @@
|
||||
padding: 0;
|
||||
height: 32px;
|
||||
border: none;
|
||||
border-top: 1px solid hsla(0, 0%, 0%, 0.08);
|
||||
border-top: 1px solid hsla(0, 0%, 0%, .08);
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -33,7 +33,7 @@ nav {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
nav > div,
|
||||
nav>div,
|
||||
#searchform,
|
||||
.moz-carousel,
|
||||
.factrow {
|
||||
@@ -41,12 +41,12 @@ nav > div,
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
nav > div,
|
||||
nav>div,
|
||||
#searchform {
|
||||
gap: 40px;
|
||||
}
|
||||
|
||||
nav > div,
|
||||
nav>div,
|
||||
#searchform,
|
||||
#searchresults,
|
||||
#top {
|
||||
@@ -68,7 +68,7 @@ nav > div,
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.card-container > .card {
|
||||
.card-container>.card {
|
||||
height: 160px;
|
||||
border-radius: 3px;
|
||||
border: 1px solid var(--subtle);
|
||||
@@ -77,11 +77,11 @@ nav > div,
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.card-container > .card:not(:last-child) {
|
||||
.card-container>.card:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.card-container > .card > a {
|
||||
.card-container>.card>a {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
@@ -111,13 +111,13 @@ nav > div,
|
||||
width: calc(var(--carousel-card-width) * 4 + (3 * 10px));
|
||||
}
|
||||
|
||||
.moz-carousel > .moz-inner {
|
||||
.moz-carousel>.moz-inner {
|
||||
border: 1px solid var(--subtle);
|
||||
border-radius: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.moz-carousel > .moz-carousel-card {
|
||||
.moz-carousel>.moz-carousel-card {
|
||||
flex: 1 0 var(--carousel-card-width);
|
||||
border: 1px solid var(--subtle);
|
||||
font-size: 14px;
|
||||
|
||||
@@ -5,11 +5,11 @@
|
||||
@import url("chrome://global/skin/in-content/common.css");
|
||||
|
||||
:host {
|
||||
--background-term-a: #b3ffe3;
|
||||
--background-term-b: #80ebff;
|
||||
--background-term-c: #ffea80;
|
||||
--background-term-d: #ffb587;
|
||||
--background-term-f: #ff848b;
|
||||
--background-term-a: #B3FFE3;
|
||||
--background-term-b: #80EBFF;
|
||||
--background-term-c: #FFEA80;
|
||||
--background-term-d: #FFB587;
|
||||
--background-term-f: #FF848B;
|
||||
--in-content-box-border-color: rgba(0, 0, 0, 0.15);
|
||||
--inner-border: 1px solid var(--in-content-box-border-color);
|
||||
--letter-grade-width: 1.5rem;
|
||||
@@ -40,7 +40,7 @@
|
||||
width: var(--letter-grade-width);
|
||||
}
|
||||
|
||||
:host([showdescription]) #letter-grade-term {
|
||||
:host([showdescription]) #letter-grade-term {
|
||||
/* For border "shadow" inside the container */
|
||||
border-block: var(--inner-border);
|
||||
border-inline-start: var(--inner-border);
|
||||
|
||||
@@ -46,7 +46,7 @@ moz-card {
|
||||
inset-inline: 0;
|
||||
}
|
||||
|
||||
.show-more[expanded="false"] {
|
||||
.show-more[expanded="false"] {
|
||||
overflow: clip;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
}
|
||||
|
||||
.header-wrapper-shadow {
|
||||
box-shadow: 0 1px 2px 0 rgba(58, 57, 68, 0.2);
|
||||
box-shadow: 0 1px 2px 0 rgba(58, 57, 68, 0.20);
|
||||
}
|
||||
|
||||
#beta-marker {
|
||||
@@ -147,11 +147,11 @@
|
||||
}
|
||||
|
||||
@keyframes fade-in {
|
||||
from {
|
||||
opacity: 0.25;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
from {
|
||||
opacity: .25;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -58,8 +58,8 @@ button {
|
||||
}
|
||||
}
|
||||
|
||||
:host([type="analysis-in-progress"]) .icon,
|
||||
:host([type="reanalysis-in-progress"]) .icon {
|
||||
:host([type=analysis-in-progress]) .icon,
|
||||
:host([type=reanalysis-in-progress]) .icon {
|
||||
--message-bar-icon-url: conic-gradient(var(--icon-color-information) var(--analysis-progress-pcent, 0%), transparent var(--analysis-progress-pcent, 0%));
|
||||
border: 1px solid var(--icon-color);
|
||||
border-radius: 50%;
|
||||
|
||||
@@ -55,7 +55,7 @@
|
||||
padding-block: var(--space-medium);
|
||||
box-sizing: border-box;
|
||||
|
||||
&:not(:last-of-type) {
|
||||
&:not(:last-of-type){
|
||||
border-bottom: 0.5px solid var(--panel-separator-color);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,7 +64,7 @@
|
||||
}
|
||||
|
||||
moz-button:not([type~="ghost"]):not(:hover) {
|
||||
&::part(button) {
|
||||
&::part(button){
|
||||
background-color: var(--toolbarbutton-active-background);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
* 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/. */
|
||||
|
||||
#fxview-tab-row-secondary-button {
|
||||
#fxview-tab-row-secondary-button {
|
||||
display: none;
|
||||
|
||||
:host(:hover) & {
|
||||
@@ -25,8 +25,7 @@
|
||||
gap: 8px;
|
||||
flex: 1;
|
||||
|
||||
&:hover,
|
||||
&:hover:active {
|
||||
&:hover, &:hover:active {
|
||||
background-color: unset;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
--sidebar-box-border-color: light-dark(color-mix(in srgb, currentColor 10%, transparent), var(--border-color-deemphasized));
|
||||
--sidebar-box-border-width: 0.5px;
|
||||
--sidebar-box-border: var(--sidebar-box-border-width) solid var(--sidebar-box-border-color);
|
||||
--sidebar-box-background: light-dark(rgba(0, 0, 0, 0.03), rgba(255, 255, 255, 0.05));
|
||||
--sidebar-box-background: light-dark(rgba(0, 0, 0, .03), rgba(255, 255, 255, .05));
|
||||
--sidebar-box-color: currentColor;
|
||||
background-color: transparent;
|
||||
color: var(--sidebar-text-color);
|
||||
@@ -75,7 +75,7 @@ fxview-search-textbox {
|
||||
|
||||
&::part(container) {
|
||||
width: 100%;
|
||||
height: var(--size-item-large);
|
||||
height: var(--size-item-large)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -7,11 +7,11 @@
|
||||
}
|
||||
|
||||
.addon-panel-message {
|
||||
background: #fff5cf;
|
||||
background: #FFF5CF;
|
||||
color: #333333;
|
||||
padding: 10px 15px;
|
||||
line-height: 20px;
|
||||
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
||||
box-shadow: rgba(0,0,0,.1) 0 -1px 0 0 inset;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
@@ -29,7 +29,7 @@ table.addon-panel-table thead.addon-panel-table-head th {
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
table.addon-panel-table thead.addon-panel-table-head th {
|
||||
color: rgba(201, 205, 207, 0.55);
|
||||
color: rgba(201, 205, 207, 0.55)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -84,8 +84,8 @@
|
||||
|
||||
.textRecognitionSuccessIcon {
|
||||
display: inline-block;
|
||||
background-color: #2ac3a2;
|
||||
border: 3px solid #2ac3a2;
|
||||
background-color: #2AC3A2;
|
||||
border: 3px solid #2AC3A2;
|
||||
fill: var(--in-content-page-background);
|
||||
-moz-context-properties: fill;
|
||||
border-radius: 10px;
|
||||
@@ -96,13 +96,13 @@
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
.textRecognitionSuccessIcon {
|
||||
animation: success-animation 0.3s cubic-bezier(0.3, 2, 0.48, 0.94);
|
||||
animation: success-animation 0.3s cubic-bezier(.3,2,.48,.94);
|
||||
}
|
||||
}
|
||||
|
||||
.textRecognitionNoResultIcon {
|
||||
display: inline-block;
|
||||
fill: #ffbf00;
|
||||
fill: #FFBF00;
|
||||
-moz-context-properties: fill;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
@@ -122,21 +122,13 @@
|
||||
}
|
||||
|
||||
@keyframes throbber-animation-ltr {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(-100%);
|
||||
}
|
||||
0% { transform: translateX(0); }
|
||||
100% { transform: translateX(-100%); }
|
||||
}
|
||||
|
||||
@keyframes throbber-animation-rtl {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(100%);
|
||||
}
|
||||
0% { transform: translateX(0); }
|
||||
100% { transform: translateX(100%); }
|
||||
}
|
||||
|
||||
@keyframes success-animation {
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
--testDynamicResult0: ok0;
|
||||
}
|
||||
|
||||
.urlbarView-row[dynamicType="test"] > .urlbarView-row-inner {
|
||||
.urlbarView-row[dynamicType=test] > .urlbarView-row-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 32px;
|
||||
@@ -46,8 +46,5 @@
|
||||
.urlbarView-dynamic-test-button2[selected] {
|
||||
color: white;
|
||||
background-color: var(--urlbarView-primary-button-background);
|
||||
box-shadow:
|
||||
0 0 0 1px #0a84ff inset,
|
||||
0 0 0 1px #0a84ff,
|
||||
0 0 0 4px rgba(10, 132, 255, 0.3);
|
||||
box-shadow: 0 0 0 1px #0a84ff inset, 0 0 0 1px #0a84ff, 0 0 0 4px rgba(10, 132, 255, 0.3);
|
||||
}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
--testDynamicResult1: ok1;
|
||||
}
|
||||
|
||||
.urlbarView-row[dynamicType="test"] > .urlbarView-row-inner {
|
||||
.urlbarView-row[dynamicType=test] > .urlbarView-row-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 32px;
|
||||
@@ -46,8 +46,5 @@
|
||||
.urlbarView-dynamic-test-button2[selected] {
|
||||
color: white;
|
||||
background-color: var(--urlbarView-primary-button-background);
|
||||
box-shadow:
|
||||
0 0 0 1px #0a84ff inset,
|
||||
0 0 0 1px #0a84ff,
|
||||
0 0 0 4px rgba(10, 132, 255, 0.3);
|
||||
box-shadow: 0 0 0 1px #0a84ff inset, 0 0 0 1px #0a84ff, 0 0 0 4px rgba(10, 132, 255, 0.3);
|
||||
}
|
||||
|
||||
@@ -19,9 +19,7 @@
|
||||
flex: 0 1 100%;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
select {
|
||||
input, textarea, select {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
@@ -46,7 +44,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: start;
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
padding-inline-start: 1em;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
@@ -3,10 +3,10 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
:root {
|
||||
--in-field-label-size: 0.8em;
|
||||
--in-field-label-size: .8em;
|
||||
--grid-column-row-gap: 8px;
|
||||
/* Use the animation-easing-function that is defined in global-shared.css. */
|
||||
--animation-easing-function: cubic-bezier(0.07, 0.95, 0, 1);
|
||||
--animation-easing-function: cubic-bezier(.07,.95,0,1);
|
||||
}
|
||||
|
||||
/* The overly specific input attributes are required to override
|
||||
@@ -17,7 +17,7 @@ form input[type="text"],
|
||||
form textarea,
|
||||
form select {
|
||||
flex-grow: 1;
|
||||
padding-top: calc(var(--in-field-label-size) + 0.4em);
|
||||
padding-top: calc(var(--in-field-label-size) + .4em);
|
||||
}
|
||||
|
||||
form input[type="tel"] {
|
||||
@@ -50,13 +50,12 @@ form div {
|
||||
|
||||
form :is(label, div) .label-text {
|
||||
position: absolute;
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
pointer-events: none;
|
||||
inset-inline-start: 10px;
|
||||
top: 0.2em;
|
||||
transition:
|
||||
top 0.2s var(--animation-easing-function),
|
||||
font-size 0.2s var(--animation-easing-function);
|
||||
top: .2em;
|
||||
transition: top .2s var(--animation-easing-function),
|
||||
font-size .2s var(--animation-easing-function);
|
||||
}
|
||||
|
||||
form :is(label, div):focus-within .label-text,
|
||||
|
||||
@@ -8,6 +8,11 @@
|
||||
* WebCompat issue #102872 - https://webcompat.com/issues/102872
|
||||
*/
|
||||
|
||||
.property-snapshot-psr-panel .prop-pix .photo-carousel.owl .owl-stage-outer .owl-item img {
|
||||
.property-snapshot-psr-panel
|
||||
.prop-pix
|
||||
.photo-carousel.owl
|
||||
.owl-stage-outer
|
||||
.owl-item
|
||||
img {
|
||||
height: -moz-available;
|
||||
}
|
||||
|
||||
@@ -29,5 +29,6 @@
|
||||
|
||||
.trending__list {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: var(--trending-scrollbar-color) var(--trending-scrollbar-background-color);
|
||||
scrollbar-color: var(--trending-scrollbar-color)
|
||||
var(--trending-scrollbar-background-color);
|
||||
}
|
||||
|
||||
@@ -9,6 +9,8 @@
|
||||
*
|
||||
* The site is using a faulty -moz-transform rule, which we can unset.
|
||||
*/
|
||||
[class*="Modal_overlay"][class*="Modal_positionContentCenter"]:has([class*="after-open"]) {
|
||||
[class*="Modal_overlay"][class*="Modal_positionContentCenter"]:has(
|
||||
[class*="after-open"]
|
||||
) {
|
||||
justify-content: unset;
|
||||
}
|
||||
|
||||
@@ -2,16 +2,16 @@
|
||||
* 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/. */
|
||||
|
||||
* {
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
user-select: none;
|
||||
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
}
|
||||
|
||||
.modal_mask:not([hidden]) {
|
||||
background-color: #00cc00;
|
||||
background-color: #00CC00;
|
||||
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
@@ -32,7 +32,7 @@
|
||||
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
left :0;
|
||||
}
|
||||
|
||||
.modal_hide {
|
||||
|
||||
@@ -4,11 +4,11 @@
|
||||
|
||||
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
||||
|
||||
html,
|
||||
body {
|
||||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -55,7 +55,7 @@ body {
|
||||
}
|
||||
|
||||
.icon_disabled_hide:disabled {
|
||||
display: none;
|
||||
display:none;
|
||||
}
|
||||
.icon_backward {
|
||||
background-image: url("assets/icon-backward.svg");
|
||||
@@ -113,7 +113,7 @@ body {
|
||||
border: none;
|
||||
|
||||
font-size: 18px;
|
||||
font-family: "Open Sans", sans-serif;
|
||||
font-family: 'Open Sans', sans-serif;
|
||||
|
||||
mask-image: linear-gradient(to left, transparent, black 8ch);
|
||||
}
|
||||
@@ -132,7 +132,7 @@ body {
|
||||
* fill the entire viewport
|
||||
*/
|
||||
:root[inFullScreen] .navbar_container {
|
||||
display: none;
|
||||
display:none;
|
||||
}
|
||||
|
||||
.browser_settings {
|
||||
|
||||
@@ -2,25 +2,25 @@
|
||||
* 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/. */
|
||||
|
||||
/* These not-very-descriptive variable names for colors come
|
||||
/* These not-very-descriptive variable names for colors come
|
||||
* from the design documents and are maintained to make it
|
||||
* easier to map between the stylesheet and the design doc.
|
||||
*/
|
||||
:root {
|
||||
--num01: #1d2e3b;
|
||||
--num02: #4c495c;
|
||||
--num03: #7d8896;
|
||||
--num04: #b3becc;
|
||||
--num06: #ffffff;
|
||||
--num07: #00b3e3;
|
||||
--num08: #56d9f6;
|
||||
--num09: #0968b6;
|
||||
--num13: #2c3a50;
|
||||
--num13_alpha: #2c3a5080;
|
||||
--num01: #1D2E3B;
|
||||
--num02: #4C495C;
|
||||
--num03: #7D8896;
|
||||
--num04: #B3BECC;
|
||||
--num06: #FFFFFF;
|
||||
--num07: #00B3E3;
|
||||
--num08: #56D9F6;
|
||||
--num09: #0968B6;
|
||||
--num13: #2C3A50;
|
||||
--num13_alpha: #2C3A5080;
|
||||
--num14: #596677;
|
||||
--num14_alpha: #59667780;
|
||||
--num16: #e7eaf0;
|
||||
--num19: #ffffff;
|
||||
--num16: #E7EAF0;
|
||||
--num19: #FFFFFF;
|
||||
|
||||
--secure: #f7ce4d;
|
||||
}
|
||||
@@ -53,10 +53,10 @@ body {
|
||||
background-color: var(--num02);
|
||||
}
|
||||
.urlbar_container:hover {
|
||||
border-color: var(--num04);
|
||||
border-color:var(--num04);
|
||||
}
|
||||
.urlbar_container:focus-within {
|
||||
border-color: var(--num08);
|
||||
border-color:var(--num08);
|
||||
background-color: var(--num01);
|
||||
}
|
||||
|
||||
|
||||
@@ -13,7 +13,7 @@ body {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.settings_header {
|
||||
.settings_header{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
@@ -77,7 +77,7 @@ body {
|
||||
}
|
||||
|
||||
.button_report_issue_icon {
|
||||
float: left;
|
||||
float:left;
|
||||
height: 30px;
|
||||
margin: 5px;
|
||||
}
|
||||
@@ -102,7 +102,7 @@ body {
|
||||
.divider {
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color: var(--num04);
|
||||
border-color: var(--num04);
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
|
||||
@@ -3,13 +3,13 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
body {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
|
||||
font-family: "Segoe UI", sans-serif;
|
||||
font-family: "Segoe UI", sans-serif;
|
||||
}
|
||||
|
||||
/* This is an <img> rather than using background-image because IE8
|
||||
|
||||
@@ -133,8 +133,8 @@
|
||||
/* Opacity rounds to 0 or 1 on Linux without an X compositor, making the
|
||||
background color not visible. Anti-aliasing is not available either. Make a
|
||||
thicker outline and cancel border-radius for that case. */
|
||||
outline: 4px solid rgb(0, 200, 215);
|
||||
border-radius: 0 !important;
|
||||
outline: 4px solid rgb(0,200,215);
|
||||
border-radius: 0 !important;
|
||||
}
|
||||
|
||||
#UITourTooltipDescription {
|
||||
@@ -185,7 +185,7 @@
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
/* Matches the libadwaita transition */
|
||||
transition: background-color 0.2s ease;
|
||||
transition: background-color .2s ease;
|
||||
}
|
||||
|
||||
&:hover > .toolbarbutton-icon {
|
||||
|
||||
@@ -11,7 +11,6 @@
|
||||
margin-inline-start: 3px;
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
#sanitizeEverythingWarningIcon {
|
||||
list-style-image: image-set(
|
||||
"moz-icon://stock/dialog-warning?size=48" 1x,
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
@import url("chrome://browser/skin/browser-shared.css");
|
||||
|
||||
:root {
|
||||
--arrowpanel-field-background: light-dark(rgba(249, 249, 250, 0.3), rgba(12, 12, 13, 0.3));
|
||||
--arrowpanel-field-background: light-dark(rgba(249, 249, 250, .3), rgba(12, 12, 13, .3));
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line media-query-no-invalid */
|
||||
@@ -57,7 +57,7 @@
|
||||
/** End titlebar **/
|
||||
|
||||
:root[chromehidden~="toolbar"][chromehidden~="location"][chromehidden~="directories"] {
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.65);
|
||||
border-top: 1px solid rgba(0,0,0,0.65);
|
||||
}
|
||||
|
||||
/* ----- BOOKMARK TOOLBAR ----- */
|
||||
@@ -96,7 +96,7 @@
|
||||
resembles the system outline, bringing the Urlbar in line with panels and
|
||||
other Mac apps. */
|
||||
#urlbar[open] > #urlbar-background {
|
||||
outline: 1px solid var(--focus-outline-color);
|
||||
outline: 1px solid var(--focus-outline-color)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -115,7 +115,7 @@
|
||||
/* ----- AUTOCOMPLETE ----- */
|
||||
|
||||
#PopupAutoComplete > richlistbox > richlistitem[originaltype~="datalist-first"] {
|
||||
border-top: 1px solid #c7c7c7;
|
||||
border-top: 1px solid #C7C7C7;
|
||||
}
|
||||
|
||||
/* Bookmarking panel */
|
||||
@@ -137,14 +137,14 @@
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-row(blur, selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-row(blur,selected),
|
||||
#editBMPanel_tagsSelector:not(:focus) > richlistitem[selected] {
|
||||
background-color: var(--arrowpanel-dimmed);
|
||||
}
|
||||
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-twisty(blur, selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-image(blur, selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-cell-text(blur, selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-twisty(blur,selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-image(blur,selected),
|
||||
#editBMPanel_folderTree > treechildren::-moz-tree-cell-text(blur,selected),
|
||||
#editBMPanel_tagsSelector:not(:focus) > richlistitem[selected] {
|
||||
color: inherit;
|
||||
}
|
||||
@@ -174,7 +174,7 @@
|
||||
}
|
||||
|
||||
.tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-icon-image:not([selected], [multiselected]) {
|
||||
opacity: 0.9;
|
||||
opacity: .9;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -186,7 +186,7 @@
|
||||
}
|
||||
|
||||
.tab-label-container:not([selected], [multiselected]) {
|
||||
opacity: 0.7;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.tabbrowser-tab {
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
scrollbar-color: color-mix(in srgb, currentColor 26%, transparent) transparent;
|
||||
}
|
||||
|
||||
.subviewbutton:not([image], [targetURI], .bookmark-item) > .menu-icon {
|
||||
.subviewbutton:not([image],[targetURI],.bookmark-item) > .menu-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
|
||||
:root {
|
||||
--downloads-item-height: 6em;
|
||||
--downloads-item-font-size-factor: 0.8;
|
||||
--downloads-item-font-size-factor: 0.80;
|
||||
--downloads-item-details-opacity: 0.7;
|
||||
--downloads-item-disabled-opacity: 0.7;
|
||||
}
|
||||
|
||||
@@ -45,12 +45,12 @@
|
||||
&:not(:hover):-moz-window-inactive > .toolbarbutton-icon,
|
||||
&[type="menu"][disabled] > .toolbarbutton-menu-dropmarker,
|
||||
&:not(:hover):-moz-window-inactive[type="menu"] > .toolbarbutton-menu-dropmarker {
|
||||
opacity: 0.5;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
&:-moz-window-inactive[disabled] > .toolbarbutton-icon,
|
||||
&:-moz-window-inactive[type="menu"][disabled] > .toolbarbutton-menu-dropmarker {
|
||||
opacity: 0.25;
|
||||
opacity: .25;
|
||||
}
|
||||
|
||||
> menupopup {
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
transform: scale(0.8);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1);
|
||||
transform: scale(1.0);
|
||||
}
|
||||
to {
|
||||
transform: scale(0.8);
|
||||
@@ -32,13 +32,13 @@
|
||||
|
||||
@keyframes uitour-color {
|
||||
from {
|
||||
border-color: #5b9cd9;
|
||||
border-color: #5B9CD9;
|
||||
}
|
||||
50% {
|
||||
border-color: #ff0000;
|
||||
border-color: #FF0000;
|
||||
}
|
||||
to {
|
||||
border-color: #5b9cd9;
|
||||
border-color: #5B9CD9;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -177,20 +177,20 @@
|
||||
|
||||
#UITourTooltipButtons > button:not(.button-link) {
|
||||
appearance: none;
|
||||
background-color: rgb(251, 251, 251);
|
||||
background-color: rgb(251,251,251);
|
||||
border-radius: 3px;
|
||||
border: 1px solid;
|
||||
border-color: rgb(192, 192, 192);
|
||||
color: rgb(71, 71, 71);
|
||||
border-color: rgb(192,192,192);
|
||||
color: rgb(71,71,71);
|
||||
padding: 4px 30px;
|
||||
transition-property: background-color, border-color;
|
||||
transition-duration: 150ms;
|
||||
}
|
||||
|
||||
#UITourTooltipButtons > button:not(.button-link, :active):hover {
|
||||
background-color: hsla(210, 4%, 10%, 0.15);
|
||||
border-color: hsla(210, 4%, 10%, 0.15);
|
||||
box-shadow: 0 1px 0 0 hsla(210, 4%, 10%, 0.05) inset;
|
||||
background-color: hsla(210,4%,10%,.15);
|
||||
border-color: hsla(210,4%,10%,.15);
|
||||
box-shadow: 0 1px 0 0 hsla(210,4%,10%,.05) inset;
|
||||
}
|
||||
|
||||
#UITourTooltipButtons > label,
|
||||
@@ -205,11 +205,11 @@
|
||||
|
||||
/* The primary button gets the same color as the customize button. */
|
||||
#UITourTooltipButtons > button.button-primary {
|
||||
background-color: rgb(116, 191, 67);
|
||||
background-color: rgb(116,191,67);
|
||||
color: white;
|
||||
padding-inline: 30px;
|
||||
}
|
||||
|
||||
#UITourTooltipButtons > button.button-primary:not(:active):hover {
|
||||
background-color: rgb(105, 173, 61);
|
||||
background-color: rgb(105,173,61);
|
||||
}
|
||||
|
||||
@@ -115,5 +115,5 @@ html|ul.webext-perm-domains-list {
|
||||
|
||||
.addon-warning-icon {
|
||||
-moz-context-properties: fill;
|
||||
fill: #ffbf00;
|
||||
fill: #FFBF00;
|
||||
}
|
||||
|
||||
@@ -30,7 +30,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
.extension-controlled-notification > .popup-notification-body-container > .popup-notification-body > .popup-notification-bottom-content > .popup-notification-warning,
|
||||
.extension-controlled-notification > .popup-notification-body-container > .popup-notification-icon {
|
||||
display: none;
|
||||
|
||||
@@ -137,7 +137,7 @@ unified-extensions-item {
|
||||
.unified-extensions-item-name,
|
||||
.unified-extensions-item-message {
|
||||
margin: 0;
|
||||
padding-inline-start: 0.5em;
|
||||
padding-inline-start: .5em;
|
||||
word-break: break-word;
|
||||
}
|
||||
|
||||
@@ -148,7 +148,8 @@ unified-extensions-item {
|
||||
.unified-extensions-item-menu-button.subviewbutton {
|
||||
list-style-image: url("chrome://global/skin/icons/settings.svg");
|
||||
/* subtract the child's ~1px border from the block padding */
|
||||
padding: calc(var(--arrowpanel-menuitem-margin-inline) - 1px) var(--arrowpanel-menuitem-margin-inline);
|
||||
padding: calc(var(--arrowpanel-menuitem-margin-inline) - 1px)
|
||||
var(--arrowpanel-menuitem-margin-inline);
|
||||
padding-inline-end: 0;
|
||||
border-radius: 0;
|
||||
/* override panelUI-shared.css */
|
||||
@@ -175,7 +176,7 @@ unified-extensions-item {
|
||||
&:hover:active > .toolbarbutton-icon {
|
||||
color: var(--uei-button-active-color);
|
||||
background-color: var(--uei-button-active-bgcolor);
|
||||
box-shadow: 0 1px 0 hsla(210, 4%, 10%, 0.03) inset;
|
||||
box-shadow: 0 1px 0 hsla(210,4%,10%,.03) inset;
|
||||
}
|
||||
|
||||
&:focus-visible > .toolbarbutton-icon {
|
||||
|
||||
@@ -27,7 +27,7 @@
|
||||
padding: 0 1px;
|
||||
|
||||
--status-text-color: currentColor;
|
||||
--status-background-color: rgba(248, 232, 28, 0.2);
|
||||
--status-background-color: rgba(248, 232, 28, .2);
|
||||
|
||||
> .ac-site-icon {
|
||||
margin-inline: 4px 0;
|
||||
@@ -75,7 +75,7 @@
|
||||
|
||||
&:hover,
|
||||
&[selected] {
|
||||
background-color: hsla(0, 0%, 80%, 0.5); /* match arrowpanel-dimmed-further */
|
||||
background-color: hsla(0,0%,80%,.5); /* match arrowpanel-dimmed-further */
|
||||
}
|
||||
}
|
||||
|
||||
@@ -182,11 +182,11 @@
|
||||
fill: SelectedItemText;
|
||||
}
|
||||
|
||||
/* Login form autocompletion */
|
||||
> .two-line-wrapper {
|
||||
padding: 4px;
|
||||
padding-inline-start: 6px;
|
||||
}
|
||||
/* Login form autocompletion */
|
||||
> .two-line-wrapper {
|
||||
padding: 4px;
|
||||
padding-inline-start: 6px;
|
||||
}
|
||||
|
||||
&[originaltype="action"] > .two-line-wrapper {
|
||||
flex: 1;
|
||||
@@ -219,7 +219,7 @@
|
||||
&[originaltype="loginWithOrigin"] + richlistitem[originaltype="generatedPassword"] {
|
||||
/* Separator between logins and generated passwords. This uses --panel-separator-color from default
|
||||
* themes since autocomplete doesn't yet switch to dark. */
|
||||
border-top: 1px solid hsla(210, 4%, 10%, 0.14);
|
||||
border-top: 1px solid hsla(210,4%,10%,.14);
|
||||
}
|
||||
|
||||
&[originaltype="action"] {
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
|
||||
@media not (prefers-contrast) {
|
||||
:root {
|
||||
--in-content-page-background: #a4000f;
|
||||
--in-content-page-background: #A4000F;
|
||||
--in-content-page-color: white;
|
||||
--in-content-text-color: white;
|
||||
--in-content-primary-button-text-color: black;
|
||||
|
||||
@@ -22,9 +22,9 @@
|
||||
--tabs-navbar-separator-color: ThreeDShadow;
|
||||
--tabs-navbar-separator-style: solid;
|
||||
|
||||
--short-notification-background: #0250bb;
|
||||
--short-notification-gradient: #9059ff;
|
||||
--warning-icon-bgcolor: light-dark(#ffa436, #ffbd4f);
|
||||
--short-notification-background: #0250BB;
|
||||
--short-notification-gradient: #9059FF;
|
||||
--warning-icon-bgcolor: light-dark(#FFA436, #FFBD4F);
|
||||
|
||||
--urlbar-box-bgcolor: var(--button-background-color-hover);
|
||||
--urlbar-box-focus-bgcolor: var(--button-background-color);
|
||||
@@ -52,7 +52,7 @@
|
||||
--link-color: light-dark(var(--color-blue-50), var(--color-cyan-50));
|
||||
--link-color-hover: light-dark(var(--color-blue-60), var(--color-cyan-30));
|
||||
--link-color-active: light-dark(var(--color-blue-70), var(--color-cyan-20));
|
||||
--tabs-navbar-separator-color: light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3));
|
||||
--tabs-navbar-separator-color: light-dark(rgba(0,0,0,.1), rgba(0,0,0,.3));
|
||||
--attention-dot-color: light-dark(#2ac3a2, #54ffbd);
|
||||
|
||||
--toolbox-bgcolor: var(--lwt-accent-color);
|
||||
@@ -61,7 +61,7 @@
|
||||
--toolbox-textcolor-inactive: var(--lwt-text-color, currentColor);
|
||||
|
||||
@media not (prefers-contrast) {
|
||||
--focus-outline-color: light-dark(#0061e0, #00ddff);
|
||||
--focus-outline-color: light-dark(#0061E0, #00DDFF);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -84,17 +84,23 @@
|
||||
:root:not([lwtheme]) {
|
||||
--color-accent-primary: light-dark(rgb(0, 97, 224), rgb(0, 221, 255));
|
||||
--button-text-color-primary: light-dark(rgb(251, 251, 254), rgb(43, 42, 51));
|
||||
--button-background-color: light-dark(rgba(207, 207, 216, 0.33), rgba(0, 0, 0, 0.33));
|
||||
--button-background-color-hover: light-dark(rgba(207, 207, 216, 0.66), rgba(207, 207, 216, 0.2));
|
||||
--button-background-color-active: light-dark(rgb(207, 207, 216), rgba(207, 207, 216, 0.4));
|
||||
--button-background-color: light-dark(rgba(207, 207, 216, .33), rgba(0, 0, 0, .33));
|
||||
--button-background-color-hover: light-dark(rgba(207, 207, 216, .66), rgba(207, 207, 216, .20));
|
||||
--button-background-color-active: light-dark(rgb(207, 207, 216), rgba(207, 207, 216, .40));
|
||||
--button-text-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
|
||||
|
||||
--arrowpanel-background: light-dark(white, rgb(66, 65, 77));
|
||||
--arrowpanel-color: light-dark(black, rgb(251, 251, 254));
|
||||
--arrowpanel-border-color: light-dark(rgb(240, 240, 244), rgb(82, 82, 94));
|
||||
--arrowpanel-border-color: light-dark(rgb(240, 240, 244), rgb(82,82,94));
|
||||
|
||||
--arrowpanel-dimmed: light-dark(color-mix(in srgb, currentColor 12%, transparent), color-mix(in srgb, currentColor 17%, transparent));
|
||||
--arrowpanel-dimmed-further: light-dark(color-mix(in srgb, currentColor 20%, transparent), color-mix(in srgb, currentColor 14%, transparent));
|
||||
--arrowpanel-dimmed: light-dark(
|
||||
color-mix(in srgb, currentColor 12%, transparent),
|
||||
color-mix(in srgb, currentColor 17%, transparent)
|
||||
);
|
||||
--arrowpanel-dimmed-further: light-dark(
|
||||
color-mix(in srgb, currentColor 20%, transparent),
|
||||
color-mix(in srgb, currentColor 14%, transparent)
|
||||
);
|
||||
|
||||
--input-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
|
||||
--input-bgcolor: light-dark(rgb(255, 255, 255), #42414d);
|
||||
@@ -122,14 +128,14 @@
|
||||
--toolbarbutton-icon-fill-attention-text: light-dark(rgb(240, 240, 244), rgb(28, 27, 34));
|
||||
|
||||
--toolbar-field-border-color: transparent;
|
||||
--toolbar-field-background-color: light-dark(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.3));
|
||||
--toolbar-field-background-color: light-dark(rgba(0, 0, 0, .05), rgba(0, 0, 0, .3));
|
||||
--toolbar-field-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
|
||||
--toolbar-field-focus-background-color: light-dark(white, rgb(66, 65, 77));
|
||||
--toolbar-field-focus-color: light-dark(black, rgb(251, 251, 254));
|
||||
|
||||
--urlbarView-action-color: light-dark(rgb(91, 91, 102), rgb(191, 191, 201));
|
||||
--urlbarView-separator-color: light-dark(rgb(240, 240, 244), rgb(82, 82, 94));
|
||||
--urlbarView-highlight-background: light-dark(#e0e0e6, rgb(43, 42, 51));
|
||||
--urlbarView-highlight-background: light-dark(#e0e0e6, rgb(43,42,51));
|
||||
--urlbarView-highlight-color: light-dark(rgb(21, 20, 26), rgb(251, 251, 254));
|
||||
--urlbarView-hover-background: light-dark(rgb(240, 240, 244), var(--arrowpanel-dimmed));
|
||||
|
||||
|
||||
@@ -101,7 +101,7 @@ body {
|
||||
the gap around them more uniform when they are close to the field edges */
|
||||
--urlbar-icon-border-radius: calc(var(--toolbarbutton-border-radius) - 1px);
|
||||
--urlbar-searchmodeswitcher-inline-padding: 6px;
|
||||
--urlbar-searchmodeswitcher-margin-inline-end: 0.45em;
|
||||
--urlbar-searchmodeswitcher-margin-inline-end: .45em;
|
||||
|
||||
--pocket-icon-fill: #ef4056;
|
||||
|
||||
@@ -109,10 +109,10 @@ body {
|
||||
--lwt-background-alignment: right top;
|
||||
--lwt-background-tiling: no-repeat;
|
||||
|
||||
--ext-theme-background-transition: background-color 0.1s cubic-bezier(0.17, 0.67, 0.83, 0.67);
|
||||
--ext-theme-background-transition: background-color 0.1s cubic-bezier(.17,.67,.83,.67);
|
||||
|
||||
--inactive-window-transition: 0.2s ease;
|
||||
--inactive-titlebar-opacity: 0.6;
|
||||
--inactive-titlebar-opacity: .6;
|
||||
/**
|
||||
* On macOS and Linux, fading the whole titlebar is the native behavior.
|
||||
*
|
||||
@@ -122,7 +122,7 @@ body {
|
||||
* to account for this platform difference.
|
||||
*/
|
||||
@media (-moz-platform: windows) {
|
||||
--inactive-titlebar-opacity: 0.75;
|
||||
--inactive-titlebar-opacity: .75;
|
||||
}
|
||||
@media (prefers-reduced-motion) {
|
||||
--inactive-window-transition: 0s;
|
||||
@@ -132,11 +132,11 @@ body {
|
||||
color: var(--lwt-text-color);
|
||||
}
|
||||
|
||||
&[uidensity="compact"] {
|
||||
&[uidensity=compact] {
|
||||
--urlbar-min-height: max(26px, 1.4em);
|
||||
}
|
||||
|
||||
&[uidensity="touch"] {
|
||||
&[uidensity=touch] {
|
||||
--urlbar-min-height: max(34px, 1.4em);
|
||||
}
|
||||
}
|
||||
@@ -186,9 +186,7 @@ body {
|
||||
:root[lwtheme-image] & {
|
||||
background-image: var(--lwt-header-image), var(--lwt-additional-images);
|
||||
background-repeat: no-repeat, var(--lwt-background-tiling);
|
||||
background-position:
|
||||
right top,
|
||||
var(--lwt-background-alignment);
|
||||
background-position: right top, var(--lwt-background-alignment);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -304,21 +302,21 @@ body {
|
||||
}
|
||||
|
||||
@media (-moz-platform: windows) {
|
||||
:root:not([sizemode="normal"]) &[type="pre-tabs"] {
|
||||
:root:not([sizemode=normal]) &[type="pre-tabs"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (-moz-platform: linux) and (-moz-gtk-csd-reversed-placement: 0) {
|
||||
:root:not([sizemode="normal"]) &[type="pre-tabs"],
|
||||
:root[gtktiledwindow="true"] &[type="pre-tabs"] {
|
||||
:root:not([sizemode=normal]) &[type="pre-tabs"],
|
||||
:root[gtktiledwindow=true] &[type="pre-tabs"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (-moz-gtk-csd-reversed-placement) {
|
||||
:root:not([sizemode="normal"]) &[type="post-tabs"],
|
||||
:root[gtktiledwindow="true"] &[type="post-tabs"] {
|
||||
:root:not([sizemode=normal]) &[type="post-tabs"],
|
||||
:root[gtktiledwindow=true] &[type="post-tabs"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -331,8 +329,7 @@ body {
|
||||
|
||||
/* stylelint-disable-next-line media-query-no-invalid */
|
||||
@media -moz-pref("sidebar.verticalTabs") {
|
||||
&[type="pre-tabs"],
|
||||
&[type="post-tabs"] {
|
||||
&[type="pre-tabs"], &[type="post-tabs"] {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -341,10 +338,7 @@ body {
|
||||
/* Hide the TabsToolbar/nav-bar titlebar controls if the menubar is permanently shown.
|
||||
* (That is, if the menu bar doesn't autohide, and we're not in a fullscreen or
|
||||
* popup window.) */
|
||||
:root:not([chromehidden~="menubar"], [inFullscreen])
|
||||
#toolbar-menubar[autohide="false"]
|
||||
~ :is(#TabsToolbar, #nav-bar)
|
||||
> :is(.titlebar-buttonbox-container, .titlebar-spacer) {
|
||||
:root:not([chromehidden~="menubar"], [inFullscreen]) #toolbar-menubar[autohide="false"] ~ :is(#TabsToolbar, #nav-bar) > :is(.titlebar-buttonbox-container, .titlebar-spacer) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -353,8 +347,8 @@ body {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:root:not([sizemode="maximized"], [sizemode="fullscreen"]) .titlebar-restore,
|
||||
:root:is([sizemode="maximized"], [sizemode="fullscreen"]) .titlebar-max {
|
||||
:root:not([sizemode=maximized], [sizemode=fullscreen]) .titlebar-restore,
|
||||
:root:is([sizemode=maximized], [sizemode=fullscreen]) .titlebar-max {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -363,7 +357,7 @@ body {
|
||||
-moz-default-appearance: -moz-window-button-box;
|
||||
position: relative;
|
||||
|
||||
:root:not([customtitlebar], [sizemode="fullscreen"]) & {
|
||||
:root:not([customtitlebar], [sizemode=fullscreen]) & {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -401,7 +395,7 @@ body {
|
||||
}
|
||||
|
||||
/* Hide menu elements intended for keyboard access support */
|
||||
#main-menubar[openedwithkey="false"] .show-only-for-keyboard {
|
||||
#main-menubar[openedwithkey=false] .show-only-for-keyboard {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -461,7 +455,7 @@ body {
|
||||
min-height: 0;
|
||||
padding-inline: 6px;
|
||||
|
||||
:root[uidensity="compact"] & {
|
||||
:root[uidensity=compact] & {
|
||||
padding-inline: 2px;
|
||||
}
|
||||
|
||||
@@ -471,20 +465,14 @@ body {
|
||||
max-height: 4em;
|
||||
|
||||
:root[sessionrestored] &:not(.instant) {
|
||||
transition:
|
||||
min-height 170ms ease-out,
|
||||
max-height 170ms ease-out,
|
||||
var(--ext-theme-background-transition);
|
||||
transition: min-height 170ms ease-out, max-height 170ms ease-out, var(--ext-theme-background-transition);
|
||||
|
||||
&[collapsed="true"] {
|
||||
transition:
|
||||
min-height 170ms ease-out,
|
||||
max-height 170ms ease-out,
|
||||
visibility 170ms linear;
|
||||
&[collapsed=true] {
|
||||
transition: min-height 170ms ease-out, max-height 170ms ease-out, visibility 170ms linear;
|
||||
}
|
||||
}
|
||||
|
||||
&[collapsed="true"] {
|
||||
&[collapsed=true] {
|
||||
max-height: 0;
|
||||
|
||||
&.instant {
|
||||
@@ -495,7 +483,7 @@ body {
|
||||
/* Bookmarks toolbar empty message */
|
||||
|
||||
/* If the toolbar is not initialized set a zero width, but retain height. */
|
||||
&[collapsed="false"]:not([initialized]) > #personal-toolbar-empty {
|
||||
&[collapsed=false]:not([initialized]) > #personal-toolbar-empty {
|
||||
visibility: hidden;
|
||||
width: 0;
|
||||
overflow-x: hidden;
|
||||
@@ -522,7 +510,7 @@ body {
|
||||
|
||||
#fxms-bmb-button-wrapper,
|
||||
toolbarpaletteitem > #personal-bookmarks > #PlacesToolbar,
|
||||
#personal-bookmarks:is([overflowedItem="true"], [cui-areatype="panel"]) > #PlacesToolbar {
|
||||
#personal-bookmarks:is([overflowedItem=true], [cui-areatype="panel"]) > #PlacesToolbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -616,9 +604,7 @@ menupopup::part(drop-indicator) {
|
||||
background-color: var(--lwt-accent-color);
|
||||
background-image: linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-additional-images);
|
||||
background-repeat: no-repeat, var(--lwt-background-tiling);
|
||||
background-position:
|
||||
right bottom,
|
||||
var(--lwt-background-alignment);
|
||||
background-position: right bottom, var(--lwt-background-alignment);
|
||||
background-position-y: bottom !important;
|
||||
}
|
||||
|
||||
@@ -629,10 +615,7 @@ menupopup::part(drop-indicator) {
|
||||
:root[lwtheme-image] & {
|
||||
background-image: linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image), var(--lwt-additional-images);
|
||||
background-repeat: no-repeat, no-repeat, var(--lwt-background-tiling);
|
||||
background-position:
|
||||
center,
|
||||
right bottom,
|
||||
var(--lwt-background-alignment);
|
||||
background-position: center, right bottom, var(--lwt-background-alignment);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -642,7 +625,7 @@ menupopup::part(drop-indicator) {
|
||||
align-items: center;
|
||||
margin-inline: 7px;
|
||||
|
||||
:root:not([privatebrowsingmode="temporary"]) &,
|
||||
:root:not([privatebrowsingmode=temporary]) &,
|
||||
#navigator-toolbox:not([tabs-hidden]) #nav-bar > & {
|
||||
display: none;
|
||||
}
|
||||
@@ -650,7 +633,7 @@ menupopup::part(drop-indicator) {
|
||||
#navigator-toolbox[tabs-hidden] #nav-bar > & {
|
||||
margin-inline-end: 12px;
|
||||
|
||||
/* Hide the private browsing indicator
|
||||
/* Hide the private browsing indicator
|
||||
label when vertical tabs are enabled */
|
||||
> .private-browsing-indicator-label {
|
||||
display: none;
|
||||
@@ -714,7 +697,7 @@ menupopup::part(drop-indicator) {
|
||||
box-shadow: 0 0 1.5px 1px red;
|
||||
|
||||
&[focused] {
|
||||
box-shadow: 0 0 2px 2px rgba(255, 0, 0, 0.4);
|
||||
box-shadow: 0 0 2px 2px rgba(255,0,0,0.4);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -757,7 +740,7 @@ menupopup::part(drop-indicator) {
|
||||
list-style-image: url(chrome://global/skin/icons/help.svg);
|
||||
|
||||
&:hover {
|
||||
background-color: hsla(0, 0%, 70%, 0.2);
|
||||
background-color: hsla(0,0%,70%,.2);
|
||||
border-radius: 2px;
|
||||
}
|
||||
}
|
||||
@@ -1026,15 +1009,15 @@ menupopup::part(drop-indicator) {
|
||||
appearance: none;
|
||||
border-style: none;
|
||||
margin: 0;
|
||||
background-color: rgb(0, 96, 223);
|
||||
color: rgb(255, 255, 255);
|
||||
background-color: rgb(0,96,223);
|
||||
color: rgb(255,255,255);
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
margin-top: 15px;
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:hover {
|
||||
background-color: rgb(0, 62, 170);
|
||||
background-color: rgb(0,62,170);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1257,8 +1240,8 @@ popupnotificationcontent {
|
||||
|
||||
@media not (prefers-contrast) {
|
||||
/* TODO: Should this be in browser-colors to respect system theming on Linux? */
|
||||
--swipe-nav-icon-primary-color: light-dark(#0060df, #00ddff);
|
||||
--swipe-nav-icon-accent-color: light-dark(#ffffff, #000000);
|
||||
--swipe-nav-icon-primary-color: light-dark(#0060DF, #00DDFF);
|
||||
--swipe-nav-icon-accent-color: light-dark(#FFFFFF, #000000);
|
||||
}
|
||||
|
||||
> svg {
|
||||
|
||||
@@ -47,7 +47,7 @@
|
||||
list-style-image: url("chrome://browser/skin/bookmark-hollow.svg");
|
||||
}
|
||||
|
||||
#context-bookmarkpage[starred="true"] {
|
||||
#context-bookmarkpage[starred=true] {
|
||||
list-style-image: url("chrome://browser/skin/bookmark.svg");
|
||||
}
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
/* Hide all conditional elements by default. */
|
||||
:is([when-connection], [when-customroot], [when-mixedcontent], [when-ciphers], [when-httpsonlystatus]) {
|
||||
:is([when-connection],[when-customroot],[when-mixedcontent],[when-ciphers],[when-httpsonlystatus]) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -143,7 +143,6 @@
|
||||
/* The protections popup panel header text needs a different calculation because it contains an info button.
|
||||
* icon-full-width is included twice to compensate for the margin-inline-start of the text,
|
||||
* used to center it even if the header includes a info button. See .panel-header-with-info-button */
|
||||
/* prettier-ignore */
|
||||
max-width: calc(var(--popup-width)
|
||||
- var(--arrowpanel-menuitem-margin-inline) * 2
|
||||
- var(--arrowpanel-header-info-icon-full-width) * 2);
|
||||
@@ -151,7 +150,6 @@
|
||||
|
||||
#identity-popup .panel-header > .subviewbutton-back + h1 > span {
|
||||
/* Same idea as above, but in the identity popup when there's a back button. */
|
||||
/* prettier-ignore */
|
||||
max-width: calc(var(--popup-width)
|
||||
- var(--arrowpanel-menuitem-margin-inline) * 2
|
||||
- var(--arrowpanel-header-back-icon-full-width) * 2);
|
||||
@@ -178,7 +176,7 @@
|
||||
|
||||
/* SECURITY */
|
||||
|
||||
#identity-popup[mixedcontent~="active-loaded"] .identity-popup-connection-not-secure,
|
||||
#identity-popup[mixedcontent~=active-loaded] .identity-popup-connection-not-secure,
|
||||
#identity-popup:not([mixedcontent]) .identity-popup-connection-not-secure {
|
||||
font-weight: bold;
|
||||
}
|
||||
@@ -210,45 +208,45 @@
|
||||
min-height: 24px;
|
||||
}
|
||||
|
||||
#identity-popup[connection="chrome"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=chrome] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://branding/content/icon48.png);
|
||||
}
|
||||
|
||||
#identity-popup[connection="file"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=file] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/page-portrait.svg);
|
||||
}
|
||||
|
||||
#identity-popup[connection="associated"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=associated] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/info.svg);
|
||||
}
|
||||
|
||||
#identity-popup[connection^="secure"] .identity-popup-security-connection {
|
||||
#identity-popup[connection^=secure] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/security.svg);
|
||||
}
|
||||
|
||||
/* Use [isbroken] to make sure we don't show a warning lock on an http page. See Bug 1192162. */
|
||||
#identity-popup[ciphers="weak"] .identity-popup-security-connection,
|
||||
#identity-popup[mixedcontent~="passive-loaded"][isbroken] .identity-popup-security-connection {
|
||||
#identity-popup[ciphers=weak] .identity-popup-security-connection,
|
||||
#identity-popup[mixedcontent~=passive-loaded][isbroken] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/security-warning.svg);
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
}
|
||||
|
||||
#identity-popup[connection="secure-cert-user-overridden"] .identity-popup-security-connection,
|
||||
#identity-popup[connection="cert-error-page"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=secure-cert-user-overridden] .identity-popup-security-connection,
|
||||
#identity-popup[connection=cert-error-page] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/security-warning.svg);
|
||||
fill: unset;
|
||||
}
|
||||
|
||||
#identity-popup[connection="net-error-page"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=net-error-page] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://global/skin/icons/info.svg);
|
||||
fill: unset;
|
||||
}
|
||||
|
||||
#identity-popup[mixedcontent~="active-loaded"][isbroken] .identity-popup-security-connection {
|
||||
#identity-popup[mixedcontent~=active-loaded][isbroken] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://browser/skin/controlcenter/mcb-disabled.svg);
|
||||
}
|
||||
|
||||
#identity-popup[connection="extension"] .identity-popup-security-connection {
|
||||
#identity-popup[connection=extension] .identity-popup-security-connection {
|
||||
list-style-image: url(chrome://mozapps/skin/extensions/extension.svg);
|
||||
}
|
||||
|
||||
@@ -522,7 +520,7 @@
|
||||
|
||||
&:hover:active {
|
||||
color: var(--button-text-color-active);
|
||||
background-color: var(--button-background-color-active);
|
||||
background-color: var(--button-background-color-active)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -699,7 +697,7 @@
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
|
||||
fill: light-dark(#0090ed, #80ebff);
|
||||
fill: light-dark(#0090ED, #80EBFF);
|
||||
}
|
||||
|
||||
.protections-popup-shim-allow-hint-icon {
|
||||
@@ -732,6 +730,7 @@
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
|
||||
/* Cookie banner state toggles for the popup menu item */
|
||||
|
||||
#protections-popup-cookie-banner-section:not([data-state="detected"]) description#protections-popup-cookie-banner-detected,
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
/* Customization mode */
|
||||
|
||||
:root {
|
||||
--drag-drop-transition-duration: 0.3s;
|
||||
--drag-drop-transition-duration: .3s;
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
--drag-drop-transition-duration: 0s;
|
||||
@@ -78,7 +78,7 @@ toolbar[overflowable][customizing] > .customization-target {
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
flex-wrap: wrap;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.15);
|
||||
border-top: 1px solid rgba(0,0,0,.15);
|
||||
padding: 10px;
|
||||
|
||||
> .footer-button,
|
||||
@@ -96,7 +96,7 @@ toolbar[overflowable][customizing] > .customization-target {
|
||||
|
||||
#customization-palette {
|
||||
padding: 5px 20px 20px;
|
||||
transition: opacity 0.3s ease-in-out;
|
||||
transition: opacity .3s ease-in-out;
|
||||
opacity: 0;
|
||||
|
||||
&:not([hidden]) {
|
||||
@@ -144,7 +144,7 @@ toolbarpaletteitem {
|
||||
|
||||
> toolbarspring {
|
||||
outline: 1px solid;
|
||||
opacity: 0.6;
|
||||
opacity: .6;
|
||||
|
||||
&[removable="false"] {
|
||||
outline: 1px dashed;
|
||||
@@ -238,7 +238,7 @@ toolbarpaletteitem {
|
||||
|
||||
&:not([mousedown]):focus-visible {
|
||||
/* Delay adding the focusring back until after the transform transition completes. */
|
||||
transition: outline-width 0.01s linear var(--drag-drop-transition-duration);
|
||||
transition: outline-width .01s linear var(--drag-drop-transition-duration);
|
||||
outline: var(--default-focusring);
|
||||
|
||||
&[place="toolbar"] {
|
||||
@@ -263,7 +263,8 @@ toolbarpaletteitem {
|
||||
}
|
||||
|
||||
#PersonalToolbar & toolbarbutton[checked="true"],
|
||||
toolbar & toolbarbutton[checked="true"] > :where(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
||||
toolbar & toolbarbutton[checked="true"]
|
||||
> :where(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
||||
background-color: revert !important;
|
||||
}
|
||||
|
||||
@@ -271,7 +272,7 @@ toolbarpaletteitem {
|
||||
> toolbarbutton > .toolbarbutton-badge-stack > .toolbarbutton-icon,
|
||||
> #search-container,
|
||||
> toolbaritem.toolbaritem-combined-buttons {
|
||||
transition: transform var(--drag-drop-transition-duration) cubic-bezier(0.6, 2, 0.75, 1.5) !important;
|
||||
transition: transform var(--drag-drop-transition-duration) cubic-bezier(.6, 2, .75, 1.5) !important;
|
||||
}
|
||||
|
||||
&[mousedown] {
|
||||
@@ -413,9 +414,7 @@ toolbarpaletteitem {
|
||||
@media (-moz-platform: macos) {
|
||||
/* Native styling adds more 'oompf' to the popup box-shadow, so simulate that
|
||||
* as best as we can here: */
|
||||
box-shadow:
|
||||
0 0 1px hsla(0, 0%, 0%, 0.3),
|
||||
0 4px 10px hsla(0, 0%, 0%, 0.3);
|
||||
box-shadow: 0 0 1px hsla(0,0%,0%,.3), 0 4px 10px hsla(0,0%,0%,.3);
|
||||
appearance: none;
|
||||
border-radius: var(--arrowpanel-border-radius);
|
||||
}
|
||||
@@ -423,7 +422,7 @@ toolbarpaletteitem {
|
||||
@media not (-moz-platform: macos) {
|
||||
border: 1px solid var(--arrowpanel-border-color);
|
||||
margin: 0;
|
||||
box-shadow: 0 0 4px hsla(0, 0%, 0%, 0.2);
|
||||
box-shadow: 0 0 4px hsla(0,0%,0%,.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -658,28 +657,10 @@ toolbarpaletteitem {
|
||||
}
|
||||
|
||||
@keyframes kcode {
|
||||
0% {
|
||||
border-color: rgb(195, 17, 206);
|
||||
color: rgb(195, 17, 206);
|
||||
}
|
||||
20% {
|
||||
border-color: rgb(252, 82, 27);
|
||||
color: rgb(252, 82, 27);
|
||||
}
|
||||
40% {
|
||||
border-color: rgb(251, 179, 0);
|
||||
color: rgb(251, 179, 0);
|
||||
}
|
||||
60% {
|
||||
border-color: rgb(105, 211, 0);
|
||||
color: rgb(105, 211, 0);
|
||||
}
|
||||
80% {
|
||||
border-color: rgb(20, 155, 249);
|
||||
color: rgb(20, 155, 249);
|
||||
}
|
||||
100% {
|
||||
border-color: rgb(195, 17, 206);
|
||||
color: rgb(195, 17, 206);
|
||||
}
|
||||
0% { border-color: rgb(195,17,206); color: rgb(195,17,206); }
|
||||
20% { border-color: rgb(252,82,27); color: rgb(252,82,27); }
|
||||
40% { border-color: rgb(251,179,0); color: rgb(251,179,0); }
|
||||
60% { border-color: rgb(105,211,0); color: rgb(105,211,0); }
|
||||
80% { border-color: rgb(20,155,249); color: rgb(20,155,249); }
|
||||
100% { border-color: rgb(195,17,206); color: rgb(195,17,206); }
|
||||
}
|
||||
|
||||
@@ -27,10 +27,10 @@
|
||||
--panel-and-palette-icon-size: 16px;
|
||||
|
||||
&:not([lwtheme]) {
|
||||
--panel-separator-zap-gradient: linear-gradient(90deg, #9059ff 0%, #ff4aa2 52.08%, #ffbd4f 100%);
|
||||
--panel-separator-zap-gradient: linear-gradient(90deg, #9059FF 0%, #FF4AA2 52.08%, #FFBD4F 100%);
|
||||
}
|
||||
|
||||
&[uidensity="compact"] {
|
||||
&[uidensity=compact] {
|
||||
--arrowpanel-menuitem-margin-inline: 4px;
|
||||
--arrowpanel-menuitem-padding-block: 4px;
|
||||
--panel-separator-margin-horizontal: 4px;
|
||||
@@ -55,7 +55,8 @@ menupopup {
|
||||
/* The min-height is calculated with the separator's horizontal margin rather
|
||||
* than the vertical, to let the back icon have even spacing all around
|
||||
* while being aligned with the separator. */
|
||||
--arrowpanel-header-min-height: calc(var(--arrowpanel-header-back-icon-full-width) + (var(--panel-separator-margin-horizontal) * 2));
|
||||
--arrowpanel-header-min-height: calc(var(--arrowpanel-header-back-icon-full-width)
|
||||
+ (var(--panel-separator-margin-horizontal) * 2));
|
||||
}
|
||||
|
||||
#PanelUI-menu-button {
|
||||
@@ -253,7 +254,7 @@ panelview {
|
||||
border-radius: var(--toolbarbutton-border-radius);
|
||||
flex-shrink: 0;
|
||||
|
||||
&[disabled="true"] {
|
||||
&[disabled=true] {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
@@ -285,8 +286,8 @@ panelview {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#wrapper-edit-controls:is([place="palette"], [place="panel"]) > #edit-controls,
|
||||
#wrapper-zoom-controls:is([place="palette"], [place="panel"]) > #zoom-controls,
|
||||
#wrapper-edit-controls:is([place="palette"],[place="panel"]) > #edit-controls,
|
||||
#wrapper-zoom-controls:is([place="palette"],[place="panel"]) > #zoom-controls,
|
||||
:is(panelview, #widget-overflow-fixed-list) .toolbaritem-combined-buttons {
|
||||
margin: var(--arrowpanel-menuitem-margin);
|
||||
}
|
||||
@@ -405,7 +406,7 @@ menupopup[emptyplacesresult] > .hide-if-empty-places-result {
|
||||
background-image: url("chrome://global/skin/icons/delete.svg");
|
||||
background-size: contain;
|
||||
-moz-context-properties: fill;
|
||||
fill: #fff;
|
||||
fill: #FFF;
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
@@ -473,11 +474,10 @@ menupopup[emptyplacesresult] > .hide-if-empty-places-result {
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
#confirmation-hint-message-container {
|
||||
transform: scale(0.8);
|
||||
transform: scale(.8);
|
||||
opacity: 0;
|
||||
transition:
|
||||
transform 120ms cubic-bezier(0.25, 1.27, 0.35, 1.18),
|
||||
opacity 60ms linear;
|
||||
transition: transform 120ms cubic-bezier(.25,1.27,.35,1.18),
|
||||
opacity 60ms linear;
|
||||
|
||||
#confirmation-hint-checkmark-animation-container[animate] + & {
|
||||
transform: scale(1);
|
||||
@@ -517,7 +517,10 @@ menupopup[emptyplacesresult] > .hide-if-empty-places-result {
|
||||
min-width: calc(var(--menu-panel-width) + 32px);
|
||||
}
|
||||
|
||||
.toolbaritem-combined-buttons:is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > toolbarbutton > .toolbarbutton-icon {
|
||||
.toolbaritem-combined-buttons:is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
) > toolbarbutton > .toolbarbutton-icon {
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
margin: 0;
|
||||
@@ -536,8 +539,8 @@ menupopup[emptyplacesresult] > .hide-if-empty-places-result {
|
||||
transform: scale(1);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale(0.5);
|
||||
opacity: 0 ;
|
||||
transform: scale(.5);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -621,12 +624,8 @@ toolbarbutton[constrain-size="true"][cui-areatype="panel"] > .toolbarbutton-badg
|
||||
/* FxAccount indicator bits. */
|
||||
|
||||
@keyframes syncRotate {
|
||||
from {
|
||||
transform: rotate(0);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
from { transform: rotate(0); }
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
@@ -672,7 +671,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="panel"] > .toolbarbutton-badg
|
||||
}
|
||||
|
||||
#PanelUI-fxa[showing-fxa-menu-message] #fxa-manage-account-button {
|
||||
display: none;
|
||||
display: none
|
||||
}
|
||||
|
||||
:root:not([fxastatus="signedin"]) #PanelUI-fxa-menu-syncnow-button {
|
||||
@@ -723,8 +722,8 @@ toolbarbutton[constrain-size="true"][cui-areatype="panel"] > .toolbarbutton-badg
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
:root[fxadisabled="true"] #appMenu-fxa-status2,
|
||||
:root[fxadisabled="true"] #appMenu-fxa-separator {
|
||||
:root[fxadisabled=true] #appMenu-fxa-status2,
|
||||
:root[fxadisabled=true] #appMenu-fxa-separator {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -821,6 +820,7 @@ toolbarbutton[constrain-size="true"][cui-areatype="panel"] > .toolbarbutton-badg
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Firefox Account Toolbar Panel */
|
||||
|
||||
#fxa-avatar-image {
|
||||
@@ -944,9 +944,9 @@ toolbarbutton[constrain-size="true"][cui-areatype="panel"] > .toolbarbutton-badg
|
||||
font-weight: lighter;
|
||||
|
||||
@media (-moz-platform: linux) {
|
||||
/* Use 300 on Linux because 100 is too light (lacks contrast with
|
||||
/* Use 300 on Linux because 100 is too light (lacks contrast with
|
||||
* the background) for some fonts in combination with anti-aliasing. */
|
||||
font-weight: 300;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1041,23 +1041,23 @@ panelmultiview[mainViewId="PanelUI-fxa"] #PanelUI-remotetabs-syncnow {
|
||||
}
|
||||
|
||||
.sendToDevice-device {
|
||||
&[clientType="phone"] {
|
||||
&[clientType=phone] {
|
||||
list-style-image: url("chrome://browser/skin/device-phone.svg");
|
||||
}
|
||||
|
||||
&[clientType="tablet"] {
|
||||
&[clientType=tablet] {
|
||||
list-style-image: url("chrome://browser/skin/device-tablet.svg");
|
||||
}
|
||||
|
||||
&[clientType="desktop"] {
|
||||
&[clientType=desktop] {
|
||||
list-style-image: url("chrome://browser/skin/device-desktop.svg");
|
||||
}
|
||||
|
||||
&[clientType="tv"] {
|
||||
&[clientType=tv] {
|
||||
list-style-image: url("chrome://browser/skin/device-tv.svg");
|
||||
}
|
||||
|
||||
&[clientType="vr"] {
|
||||
&[clientType=vr] {
|
||||
list-style-image: url("chrome://browser/skin/device-vr.svg");
|
||||
}
|
||||
|
||||
@@ -1138,8 +1138,7 @@ panelmultiview[mainViewId="PanelUI-fxa"] #PanelUI-remotetabs-syncnow {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#PanelUI-remotetabs[mainview] {
|
||||
/* panel anchored to toolbar button might be too skinny */
|
||||
#PanelUI-remotetabs[mainview] { /* panel anchored to toolbar button might be too skinny */
|
||||
min-width: 19em;
|
||||
|
||||
.PanelUI-remotetabs-notabsforclient-label {
|
||||
@@ -1149,7 +1148,6 @@ panelmultiview[mainViewId="PanelUI-fxa"] #PanelUI-remotetabs-syncnow {
|
||||
/* Work around bug 1224412 - these boxes will cause scrollbars to appear when
|
||||
the panel is anchored to a toolbar button.
|
||||
*/
|
||||
/* prettier-ignore */
|
||||
#PanelUI-remotetabs-setupsync,
|
||||
#PanelUI-remotetabs-syncdisabled,
|
||||
#PanelUI-remotetabs-reauthsync,
|
||||
@@ -1343,7 +1341,7 @@ panelview .toolbarbutton-1,
|
||||
}
|
||||
|
||||
#appMenu-zoomReset-button2 > .toolbarbutton-text,
|
||||
#appMenu-fullscreen-button2 > .toolbarbutton-icon {
|
||||
#appMenu-fullscreen-button2 > .toolbarbutton-icon {
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@@ -1475,7 +1473,10 @@ panelview .toolbarbutton-1 {
|
||||
panelview .toolbarbutton-1,
|
||||
toolbarbutton.subviewbutton,
|
||||
.widget-overflow-list .toolbarbutton-1,
|
||||
.toolbaritem-combined-buttons:is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > toolbarbutton
|
||||
.toolbaritem-combined-buttons:is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
) > toolbarbutton
|
||||
) {
|
||||
color: var(--button-text-color-ghost);
|
||||
background-color: var(--button-background-color-ghost);
|
||||
@@ -1498,7 +1499,7 @@ panelview .toolbarbutton-1 {
|
||||
&:active {
|
||||
color: var(--button-text-color-ghost-active);
|
||||
background-color: var(--button-background-color-ghost-active);
|
||||
box-shadow: 0 1px 0 hsla(210, 4%, 10%, 0.03) inset;
|
||||
box-shadow: 0 1px 0 hsla(210,4%,10%,.03) inset;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1533,9 +1534,7 @@ panelview .toolbarbutton-1 {
|
||||
}
|
||||
|
||||
.PanelUI-tabitem-container {
|
||||
transition:
|
||||
opacity 0.2s ease,
|
||||
transform 0.2s ease;
|
||||
transition: opacity 0.2s ease, transform 0.2s ease;
|
||||
|
||||
&.tabitem-removed {
|
||||
opacity: 0;
|
||||
@@ -1554,22 +1553,23 @@ panelview .toolbarbutton-1 {
|
||||
}
|
||||
|
||||
toolbarbutton[itemtype="showmorebutton"],
|
||||
toolbarbutton[itemtype="showinactivebutton"] {
|
||||
padding-inline-start: 0;
|
||||
toolbarbutton[itemtype="showinactivebutton"] {
|
||||
padding-inline-start: 0;
|
||||
|
||||
> label {
|
||||
/* Needed to properly left-align with the rest of list */
|
||||
margin-inline-start: -8px;
|
||||
> label {
|
||||
/* Needed to properly left-align with the rest of list */
|
||||
margin-inline-start: -8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.remote-tabs-close-button {
|
||||
.toolbarbutton-icon {
|
||||
/* To match the nav elements in the panel */
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
fill: currentColor;
|
||||
fill-opacity: 0.6;
|
||||
display: flex;
|
||||
/* To match the nav elements in the panel */
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
fill: currentColor;
|
||||
fill-opacity: 0.6;
|
||||
display: flex;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1579,7 +1579,10 @@ toolbarbutton[itemtype="showinactivebutton"] {
|
||||
}
|
||||
|
||||
.toolbaritem-combined-buttons {
|
||||
&:where(:not(.unified-extensions-item)):is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > toolbarbutton {
|
||||
&:where(:not(.unified-extensions-item)):is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
) > toolbarbutton {
|
||||
border: 0;
|
||||
margin: 0;
|
||||
flex: 1;
|
||||
@@ -1592,16 +1595,22 @@ toolbarbutton[itemtype="showinactivebutton"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > toolbarbutton:not(.toolbarbutton-1)[disabled] {
|
||||
&:is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
) > toolbarbutton:not(.toolbarbutton-1)[disabled] {
|
||||
opacity: 0.4;
|
||||
/* Override toolbarbutton.css which sets the color to GrayText */
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
&:is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > separator {
|
||||
&:is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
) > separator {
|
||||
appearance: none;
|
||||
align-items: stretch;
|
||||
margin: 0.5em 0;
|
||||
margin: .5em 0;
|
||||
width: 1px;
|
||||
height: auto;
|
||||
background: var(--panel-separator-color);
|
||||
@@ -1610,7 +1619,10 @@ toolbarbutton[itemtype="showinactivebutton"] {
|
||||
transition-timing-function: ease;
|
||||
}
|
||||
|
||||
&:is(:not([cui-areatype="toolbar"]), [overflowedItem="true"]):hover > separator {
|
||||
&:is(
|
||||
:not([cui-areatype="toolbar"]),
|
||||
[overflowedItem=true]
|
||||
):hover > separator {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
@@ -1629,7 +1641,7 @@ toolbarbutton[itemtype="showinactivebutton"] {
|
||||
|
||||
.toolbarbutton-1:not(.toolbarbutton-combined) > .toolbarbutton-text {
|
||||
text-align: start;
|
||||
padding-inline-start: 0.5em;
|
||||
padding-inline-start: .5em;
|
||||
}
|
||||
|
||||
> #stop-reload-button > .toolbarbutton-1 {
|
||||
@@ -1700,7 +1712,7 @@ toolbarbutton[itemtype="showinactivebutton"] {
|
||||
border: 1px solid rgba(110, 110, 110, 0.4);
|
||||
border-radius: 50%;
|
||||
margin: 1px 5px;
|
||||
background-color: rgba(150, 150, 150, 0.2);
|
||||
background-color: rgba(150,150,150,0.2);
|
||||
}
|
||||
|
||||
> .radio-check[selected] {
|
||||
@@ -1841,7 +1853,8 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
|
||||
&.panel-header-with-info-button > .subviewbutton-back + h1 {
|
||||
margin-inline-start: 0;
|
||||
margin-inline-end: calc(var(--arrowpanel-header-back-icon-full-width) - var(--arrowpanel-header-info-icon-full-width));
|
||||
margin-inline-end: calc(var(--arrowpanel-header-back-icon-full-width)
|
||||
- var(--arrowpanel-header-info-icon-full-width));
|
||||
}
|
||||
|
||||
&:not(.panel-header-with-additional-element) > .subviewbutton-back + h1 {
|
||||
@@ -1887,16 +1900,16 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
#info-message-container {
|
||||
height: 260px;
|
||||
overflow: hidden;
|
||||
transition: margin-bottom 0.25s;
|
||||
transition: margin-bottom .25s;
|
||||
}
|
||||
|
||||
#info-message-container[disabled] {
|
||||
/* Offset the height when hidden. This makes the panel content
|
||||
* cover the info message and reveal it as it slides down, rather
|
||||
* than the info message growing in height. */
|
||||
margin-bottom: -260px;
|
||||
pointer-events: none;
|
||||
}
|
||||
margin-bottom: -260px;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#info-message-container[disabled] #protections-popup-message {
|
||||
opacity: 0;
|
||||
@@ -1908,7 +1921,7 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
align-items: flex-end;
|
||||
height: calc(100% - 20px);
|
||||
margin: 10px;
|
||||
transition: opacity 0.25s;
|
||||
transition: opacity .25s;
|
||||
opacity: 1;
|
||||
background-image: url(chrome://browser/skin/controlcenter/hero-message-background.svg);
|
||||
background-repeat: no-repeat;
|
||||
@@ -1956,11 +1969,11 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
|
||||
&[viewId="PanelUI-profiler"] {
|
||||
--panel-width: 319px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Override themes for the Pocket panel, because the Pocket
|
||||
/* Override themes for the Pocket panel, because the Pocket
|
||||
panel currently only supports dark and light themes. */
|
||||
@media not (prefers-color-scheme: dark) {
|
||||
@media not (prefers-color-scheme: dark){
|
||||
&[viewId="PanelUI-savetopocket"] {
|
||||
--arrowpanel-background: #fbfbfb;
|
||||
}
|
||||
@@ -1976,7 +1989,7 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
background: radial-gradient(circle farthest-side at top right, #03b1f4, #0556cd);
|
||||
color: #fff;
|
||||
|
||||
&:-moz-locale-dir(rtl) {
|
||||
&:-moz-locale-dir(rtl) {
|
||||
background: radial-gradient(circle farthest-side at top left, #03b1f4, #0556cd);
|
||||
}
|
||||
|
||||
@@ -1998,16 +2011,15 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
"false". When the DOM is being initialized it is set to "false" so that animations
|
||||
do not run. */
|
||||
&[animationready="true"] #PanelUI-profiler-info {
|
||||
transition:
|
||||
margin-block-end 250ms,
|
||||
opacity 250ms;
|
||||
transition: margin-block-end 250ms, opacity 250ms;
|
||||
}
|
||||
}
|
||||
|
||||
#PanelUI-profiler-info {
|
||||
min-height: 180px;
|
||||
padding: 0 15px 15px;
|
||||
background: top 10px right no-repeat url("chrome://browser/skin/profiler-popup-backdrop.png");
|
||||
background: top 10px right no-repeat
|
||||
url("chrome://browser/skin/profiler-popup-backdrop.png");
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@@ -2045,7 +2057,7 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
}
|
||||
|
||||
#PanelUI-profiler-content-edit-settings {
|
||||
font-size: 0.9em;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.PanelUI-profiler-content-label {
|
||||
@@ -2054,7 +2066,7 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
|
||||
#PanelUI-profiler-content-description {
|
||||
margin-block: 4px;
|
||||
font-size: 0.9em;
|
||||
font-size: .9em;
|
||||
color: var(--text-color-deemphasized);
|
||||
}
|
||||
|
||||
@@ -2129,7 +2141,7 @@ radiogroup:focus-visible > .subviewradio[focused="true"] {
|
||||
|
||||
/* Web-extension pop-ups */
|
||||
|
||||
.cui-widget-panelview[id^="PanelUI-webext-"] {
|
||||
.cui-widget-panelview[id^=PanelUI-webext-] {
|
||||
border-radius: var(--arrowpanel-border-radius);
|
||||
}
|
||||
|
||||
|
||||
@@ -16,14 +16,14 @@
|
||||
#downloadsListBox > richlistitem[verdict="Malware"] .downloadBlockedBadge {
|
||||
background-image: url("chrome://global/skin/icons/error.svg");
|
||||
-moz-context-properties: fill;
|
||||
fill: light-dark(#e22850, #ff9aa2);
|
||||
fill: light-dark(#e22850, #FF9AA2);
|
||||
}
|
||||
|
||||
#downloadsPanel-blockedSubview[verdict="Uncommon"] .downloadsPanel-blockedSubview-image,
|
||||
#downloadsListBox > richlistitem[verdict="Uncommon"] .downloadBlockedBadge {
|
||||
background-image: url("chrome://global/skin/icons/info-filled.svg");
|
||||
-moz-context-properties: fill;
|
||||
fill: light-dark(#0090ed, #80ebff);
|
||||
fill: light-dark(#0090ED, #80EBFF);
|
||||
}
|
||||
|
||||
.downloadsPanel-blockedSubview-image {
|
||||
@@ -43,7 +43,7 @@
|
||||
#downloadsPanel-blockedSubview[verdict="PotentiallyUnwanted"] .downloadsPanel-blockedSubview-image,
|
||||
#downloadsPanel-blockedSubview[verdict="DownloadSpam"] .downloadsPanel-blockedSubview-image,
|
||||
#downloadsListBox > richlistitem[verdict="PotentiallyUnwanted"] .downloadBlockedBadge,
|
||||
#downloadsListBox > richlistitem[verdict="DownloadSpam"] .downloadBlockedBadge {
|
||||
#downloadsListBox > richlistitem[verdict="DownloadSpam"] .downloadBlockedBadge {
|
||||
-moz-context-properties: fill;
|
||||
fill: #ffbf00;
|
||||
background-image: url("chrome://global/skin/icons/warning.svg");
|
||||
|
||||
@@ -105,7 +105,7 @@ toolbarpaletteitem > #downloads-button > .toolbarbutton-badge-stack > #downloads
|
||||
}
|
||||
|
||||
#downloads-button[attention="info"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
|
||||
background: url(chrome://browser/skin/notification-fill-12.svg) no-repeat center;
|
||||
background: url(chrome://browser/skin/notification-fill-12.svg) no-repeat center;
|
||||
fill: var(--panel-banner-item-info-icon-bgcolor);
|
||||
}
|
||||
|
||||
@@ -116,7 +116,7 @@ toolbarpaletteitem > #downloads-button > .toolbarbutton-badge-stack > #downloads
|
||||
|
||||
#downloads-button[attention="severe"] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
|
||||
background: url(chrome://browser/skin/notification-fill-12.svg) no-repeat center;
|
||||
fill: light-dark(rgb(226, 40, 80), rgb(255, 132, 138));
|
||||
fill: light-dark(rgb(226,40,80), rgb(255,132,138));
|
||||
}
|
||||
|
||||
#downloads-button[animate] > .toolbarbutton-badge-stack > .toolbarbutton-badge {
|
||||
@@ -179,7 +179,7 @@ toolbarpaletteitem > #downloads-button > .toolbarbutton-badge-stack > #downloads
|
||||
transform: translateX(0);
|
||||
}
|
||||
#downloads-button[open] > .toolbarbutton-badge-stack > #downloads-indicator-finish-box > #downloads-indicator-finish-image {
|
||||
stroke: currentColor;
|
||||
stroke: currentColor;
|
||||
}
|
||||
|
||||
#downloads-button[animate][notification="finish"] > .toolbarbutton-badge-stack > #downloads-indicator-finish-box > #downloads-indicator-finish-image {
|
||||
@@ -202,12 +202,10 @@ toolbarpaletteitem > #downloads-button > .toolbarbutton-badge-stack > #downloads
|
||||
animation-timing-function: steps(18);
|
||||
transform: translateX(0);
|
||||
}
|
||||
14.28% {
|
||||
/* 18th frame (18/126) */
|
||||
14.28% { /* 18th frame (18/126) */
|
||||
transform: translateX(calc(18 * -20px));
|
||||
}
|
||||
93.65% {
|
||||
/* Wait 100 frames of time, but resume from 18th frame (118/126) */
|
||||
93.65% { /* Wait 100 frames of time, but resume from 18th frame (118/126) */
|
||||
animation-timing-function: steps(8);
|
||||
transform: translateX(calc(18 * -20px));
|
||||
}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
:root {
|
||||
--download-progress-fill-color: var(--toolbarbutton-icon-fill-attention);
|
||||
--download-progress-paused-color: GrayText;
|
||||
--download-progress-flare-color: rgba(255, 255, 255, 0.75);
|
||||
--download-progress-flare-color: rgba(255,255,255,0.75);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@@ -61,14 +61,11 @@
|
||||
Create a gradient with 2 identical patterns, and enlarge the size to 200%.
|
||||
This allows us to animate background-position with percentage. */
|
||||
background-color: var(--download-progress-fill-color);
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
transparent 0%,
|
||||
var(--download-progress-flare-color) 25%,
|
||||
transparent 50%,
|
||||
var(--download-progress-flare-color) 75%,
|
||||
transparent 100%
|
||||
);
|
||||
background-image: linear-gradient(90deg, transparent 0%,
|
||||
var(--download-progress-flare-color) 25%,
|
||||
transparent 50%,
|
||||
var(--download-progress-flare-color) 75%,
|
||||
transparent 100%);
|
||||
background-blend-mode: normal;
|
||||
background-size: 200% 100%;
|
||||
animation: downloadProgressSlideX 1.5s linear infinite;
|
||||
|
||||
@@ -174,6 +174,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Default size for input fields in address edit doorhanger */
|
||||
.address-edit-notification-content {
|
||||
:is(input, textarea) {
|
||||
|
||||
@@ -46,14 +46,14 @@
|
||||
outline: var(--toolbarbutton-outline);
|
||||
outline-offset: var(--toolbarbutton-outline-offset);
|
||||
|
||||
&:hover:not([open="true"]) {
|
||||
&:hover:not([open=true]) {
|
||||
background-color: var(--urlbar-box-hover-bgcolor);
|
||||
color: var(--urlbar-box-hover-text-color);
|
||||
outline-color: var(--toolbarbutton-hover-outline-color);
|
||||
}
|
||||
|
||||
&:hover:active,
|
||||
&[open="true"] {
|
||||
&[open=true] {
|
||||
background-color: var(--urlbar-box-active-bgcolor);
|
||||
color: var(--urlbar-box-hover-text-color);
|
||||
outline-color: var(--toolbarbutton-active-outline-color);
|
||||
@@ -201,6 +201,7 @@
|
||||
fill: unset;
|
||||
}
|
||||
|
||||
|
||||
#identity-box[pageproxystate="valid"].notSecure #identity-icon,
|
||||
#identity-box[pageproxystate="valid"].mixedActiveContent #identity-icon,
|
||||
#identity-box[pageproxystate="valid"].httpsOnlyErrorPage #identity-icon {
|
||||
@@ -215,7 +216,7 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
#identity-permission-box[open="true"],
|
||||
#identity-permission-box[open=true],
|
||||
#identity-permission-box[hasPermissions],
|
||||
#identity-permission-box[hasSharingIcon] {
|
||||
display: flex;
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: var(--embedded-wizard-header-font-size, 1.3em);
|
||||
font-size: var(--embedded-wizard-header-font-size, 1.30em);
|
||||
font-weight: var(--embedded-wizard-header-font-weight, normal);
|
||||
margin-block: var(--embedded-wizard-header-margin-block, 0 16px);
|
||||
min-height: 1em;
|
||||
@@ -156,15 +156,15 @@ div[name="page-selection"]:not([show-import-all]) summary {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div[name="page-selection"][show-import-all]:not([single-item]) label:not(#select-all) {
|
||||
div[name="page-selection"][show-import-all]:not([single-item]) label:not(#select-all) {
|
||||
margin-inline: var(--resource-type-label-margin-inline, 24px 0);
|
||||
}
|
||||
|
||||
div[name="page-selection"][show-import-all] #select-all {
|
||||
div[name="page-selection"][show-import-all] #select-all {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
div[name="page-selection"][show-import-all][hide-select-all] #select-all {
|
||||
div[name="page-selection"][show-import-all][hide-select-all] #select-all {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -239,10 +239,9 @@ summary {
|
||||
.resource-progress-group {
|
||||
display: grid;
|
||||
grid-template-columns: min-content auto;
|
||||
grid-template-areas:
|
||||
"icon type"
|
||||
"icon status"
|
||||
"icon support";
|
||||
grid-template-areas: "icon type"
|
||||
"icon status"
|
||||
"icon support";
|
||||
align-items: center;
|
||||
justify-items: start;
|
||||
}
|
||||
@@ -361,8 +360,8 @@ summary {
|
||||
* Stroke and fill colours were sampled from built-in dark and light theme
|
||||
* from Chrome on Windows
|
||||
*/
|
||||
fill: light-dark(#474747, #c7c7c7);
|
||||
stroke: light-dark(#474747, #c7c7c7);
|
||||
fill: light-dark(#474747, #C7C7C7);
|
||||
stroke: light-dark(#474747, #C7C7C7);
|
||||
}
|
||||
|
||||
.no-browsers-found-message {
|
||||
@@ -386,7 +385,7 @@ summary {
|
||||
|
||||
div[name="page-selection"]:not([no-resources]) .no-resources-found,
|
||||
div[name="page-selection"]:not([no-permissions]) .no-permissions-message,
|
||||
div[name="page-selection"]:is([no-resources], [no-permissions]) .hide-on-error,
|
||||
div[name="page-selection"]:is([no-resources],[no-permissions]) .hide-on-error,
|
||||
div[name="page-selection"]:not([file-import-error]) .file-import-error {
|
||||
display: none;
|
||||
}
|
||||
@@ -398,9 +397,8 @@ div[name="page-selection"][show-import-all] .resource-selection-details {
|
||||
.resource-selection-details > summary {
|
||||
list-style: none;
|
||||
display: grid;
|
||||
grid-template-areas:
|
||||
"a b"
|
||||
"c b";
|
||||
grid-template-areas: "a b"
|
||||
"c b";
|
||||
margin-block: 16px 0;
|
||||
}
|
||||
|
||||
@@ -409,7 +407,7 @@ div[name="page-selection"][show-import-all] .resource-selection-details {
|
||||
}
|
||||
|
||||
p.migration-wizard-subheader {
|
||||
font-size: var(--embedded-wizard-subheader-font-size, 0.85em);
|
||||
font-size: var(--embedded-wizard-subheader-font-size, .85em);
|
||||
font-weight: var(--embedded-wizard-subheader-font-weight, 400);
|
||||
margin-block: var(--embedded-wizard-subheader-margin-block, 0 28px);
|
||||
line-height: 1.2em;
|
||||
|
||||
@@ -13,12 +13,12 @@
|
||||
border-radius: var(--urlbar-icon-border-radius);
|
||||
|
||||
&:hover {
|
||||
background-color: hsla(0, 0%, 70%, 0.2);
|
||||
background-color: hsla(0,0%,70%,.2);
|
||||
}
|
||||
|
||||
&:hover:active,
|
||||
&[open] {
|
||||
background-color: hsla(0, 0%, 70%, 0.3);
|
||||
background-color: hsla(0,0%,70%,.3);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -158,6 +158,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.screen-icon {
|
||||
list-style-image: url(chrome://browser/skin/notification-icons/screen.svg);
|
||||
|
||||
@@ -249,24 +250,16 @@
|
||||
list-style-image: url("chrome://browser/skin/drm-icon.svg");
|
||||
}
|
||||
|
||||
.notification-anchor-icon[animate="true"],
|
||||
#eme-notification-icon[firstplay="true"] {
|
||||
.notification-anchor-icon[animate=true],
|
||||
#eme-notification-icon[firstplay=true] {
|
||||
animation: emeTeachingMoment 0.2s linear 0s 5 normal;
|
||||
}
|
||||
|
||||
@keyframes emeTeachingMoment {
|
||||
0% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
25% {
|
||||
transform: translateX(3px);
|
||||
}
|
||||
75% {
|
||||
transform: translateX(-3px);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
0% {transform: translateX(0); }
|
||||
25% {transform: translateX(3px) }
|
||||
75% {transform: translateX(-3px) }
|
||||
100% { transform: translateX(0); }
|
||||
}
|
||||
|
||||
/* INSTALL ADDONS */
|
||||
|
||||
@@ -96,12 +96,12 @@
|
||||
}
|
||||
|
||||
#viewGroup > radio:hover {
|
||||
background-color: #e0e8f6;
|
||||
background-color: #E0E8F6;
|
||||
color: black;
|
||||
}
|
||||
|
||||
#viewGroup > radio[selected="true"] {
|
||||
background-color: #c1d2ee;
|
||||
background-color: #C1D2EE;
|
||||
color: black;
|
||||
}
|
||||
|
||||
@@ -128,9 +128,9 @@
|
||||
}
|
||||
|
||||
@media (-moz-mac-big-sur-theme: 0) {
|
||||
#viewGroup > radio[selected="true"],
|
||||
#viewGroup > toolbarbutton[checked="true"] {
|
||||
color: #fff !important;
|
||||
#viewGroup > radio[selected=true],
|
||||
#viewGroup > toolbarbutton[checked=true] {
|
||||
color: #FFF !important;
|
||||
text-shadow: rgba(0, 0, 0, 0.4) 0 1px;
|
||||
}
|
||||
}
|
||||
@@ -138,7 +138,7 @@
|
||||
|
||||
/* Misc */
|
||||
tree {
|
||||
margin: 0.5em;
|
||||
margin: .5em;
|
||||
}
|
||||
|
||||
html|input {
|
||||
@@ -152,7 +152,7 @@ html|input.header {
|
||||
}
|
||||
|
||||
#imagecontainerbox {
|
||||
margin: 0.5em;
|
||||
margin: .5em;
|
||||
background: white;
|
||||
overflow: auto;
|
||||
border: 1px solid ThreeDLightShadow;
|
||||
@@ -200,7 +200,7 @@ html|input:disabled {
|
||||
|
||||
@media not (-moz-platform: macos) {
|
||||
#mediaSplitter {
|
||||
height: 0.8em;
|
||||
height: .8em;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -222,7 +222,7 @@ treechildren::-moz-tree-cell-text(broken) {
|
||||
#permList {
|
||||
appearance: auto;
|
||||
-moz-default-appearance: listbox;
|
||||
margin: 0.5em;
|
||||
margin: .5em;
|
||||
overflow: auto;
|
||||
color: FieldText;
|
||||
}
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user