mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2025-12-31 06:20:48 -08:00
698 lines
26 KiB
CSS
698 lines
26 KiB
CSS
@media (-moz-proton) {
|
|
@-moz-document url("about:home"), url("about:newtab") {
|
|
/** Activity Stream - Search Focus Border: like URL ***********************/
|
|
/* At DarkMode, Color */
|
|
body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"],
|
|
body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"],
|
|
body[style*="--newtab-background-color: rgba(42, 42, 46, 1);"] {
|
|
/* inner */
|
|
--newtab-focus-border: rgba(0, 221, 255, 0.5) !important; /* Original: #B5D3FF, Better color-mix(in srgb, #B5D3FF 70%, transparent) */
|
|
--newtab-focus-border-selected: rgba(0, 221, 255, 0.5) !important; /* Original: #B5D3FF */
|
|
}
|
|
|
|
/** Activity Stream - Web Site Icon: full size ****************************/
|
|
.top-site-outer .tile .icon-wrapper {
|
|
width: 100% !important; /* Original: 48px */
|
|
height: 100% !important; /* Original: 48px */
|
|
}
|
|
}
|
|
|
|
/** Error Page - Restore illustrations **************************************/
|
|
@-moz-document url-prefix("about:neterror"),
|
|
url("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml"),
|
|
url("about:sessionrestore"), url(chrome://browser/content/aboutSessionRestore.xhtml) {
|
|
/* Illustrations Position */
|
|
#errorPageContainer, .description-wrapper {
|
|
min-height: 300px;
|
|
background-position: left center;
|
|
background-repeat: no-repeat;
|
|
background-size: 38%;
|
|
}
|
|
|
|
#errorPageContainer {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.description-wrapper {
|
|
padding-inline-start: 38%;
|
|
}
|
|
|
|
/* Container */
|
|
.container {
|
|
min-width: var(--in-content-container-min-width); /* 13em */
|
|
max-width: var(--in-content-container-max-width); /* 52em */
|
|
}
|
|
|
|
/* Text Position */
|
|
#text-container {
|
|
margin: auto;
|
|
padding-inline-start: 38%;
|
|
}
|
|
}
|
|
|
|
@-moz-document url-prefix("about:neterror?e=connectionFailure"),
|
|
url-prefix("about:neterror?e=netInterrupt"),
|
|
url-prefix("about:neterror?e=netTimeout"),
|
|
url-prefix("about:neterror?e=netReset"),
|
|
url-prefix("about:neterror?e=netOffline"),
|
|
url("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml") {
|
|
#errorPageContainer {
|
|
background-image: url("./icons/error-connection-failure.svg");
|
|
}
|
|
}
|
|
@-moz-document url-prefix("about:neterror?e=dnsNotFound") {
|
|
#errorPageContainer {
|
|
background-image: url("./icons/error-server-not-found.svg");
|
|
}
|
|
}
|
|
@-moz-document url-prefix("about:neterror?e=malformedURI") {
|
|
#errorPageContainer {
|
|
background-image: url("chrome://browser/skin/illustrations/error-malformed-url.svg");
|
|
}
|
|
}
|
|
@-moz-document url-prefix("about:neterror?e=clockSkewError"),
|
|
url-prefix("about:neterror?e=nssFailure") {
|
|
#errorPageContainer {
|
|
background-image: url("./icons/blue-berror.svg");
|
|
background-size: 18.5em;
|
|
}
|
|
}
|
|
|
|
@-moz-document url("about:sessionrestore"), url(chrome://browser/content/aboutSessionRestore.xhtml) {
|
|
.description-wrapper {
|
|
background-image: url("./icons/error-session-restore.svg");
|
|
}
|
|
}
|
|
|
|
@-moz-document url-prefix("about:neterror?e=fileNotFound") {
|
|
@media (min-width: 970px) {
|
|
.title {
|
|
background-image:
|
|
url("chrome://global/skin/icons/info.svg") !important;
|
|
}
|
|
}
|
|
|
|
#text-container {
|
|
padding-inline-start: 0;
|
|
}
|
|
}
|
|
@-moz-document url-prefix("about:tabcrashed") {
|
|
@media (min-width: 970px) {
|
|
.title {
|
|
background-image: url("chrome://browser/skin/tab-crashed.svg") !important;
|
|
}
|
|
}
|
|
}
|
|
@-moz-document url("about:robots"), url("chrome://browser/content/aboutRobots.xhtml") {
|
|
@media (min-width: 970px) {
|
|
.title {
|
|
background-image: url("chrome://browser/content/aboutRobots-icon.png") !important;
|
|
}
|
|
}
|
|
}
|
|
@-moz-document url("about:welcomeBack"), url("chrome://browser/content/aboutWelcomeBack.xhtml") {
|
|
@media (min-width: 970px) {
|
|
.title {
|
|
background-image: url("./icons/welcome-back.svg") !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
/** Fully Dark Mode *********************************************************/
|
|
/*= Fully Dark Mode - Dark Mode Colors =====================================*/
|
|
/* Based on chrome://global/skin/in-content/common.css */
|
|
:host,
|
|
:root {
|
|
--in-content-page-color: rgb(21, 20, 26);
|
|
--in-content-page-background: #fff;
|
|
--in-content-text-color: var(--in-content-page-color);
|
|
--in-content-deemphasized-text: rgb(91, 91, 102);
|
|
--in-content-box-background: #fff;
|
|
--in-content-box-background-odd: rgba(12, 12, 13, 0.05); /* grey 90 a05 */
|
|
--in-content-box-border-color: color-mix(in srgb, currentColor 41%, transparent);
|
|
--in-content-box-info-background: #f0f0f4;
|
|
--in-content-item-hover: color-mix(in srgb, var(--in-content-primary-button-background) 20%, transparent);
|
|
--in-content-item-hover-text: var(--in-content-page-color);
|
|
--in-content-item-selected: var(--in-content-primary-button-background);
|
|
--in-content-item-selected-text: var(--in-content-primary-button-text-color);
|
|
--in-content-icon-color: rgb(91,91,102);
|
|
--in-content-accent-color: #0a84ff;
|
|
--in-content-accent-color-active: #0060df;
|
|
--in-content-border-hover: var(--grey-90-a50);
|
|
--in-content-border-invalid: var(--red-50);
|
|
--in-content-border-color: #d7d7db;
|
|
--in-content-error-text-color: #c50042;
|
|
--in-content-link-color: var(--blue-60);
|
|
--in-content-link-color-hover: var(--blue-70);
|
|
--in-content-link-color-active: var(--blue-80);
|
|
--in-content-link-color-visited: var(--blue-60);
|
|
/* button background states are also used for checkboxes and radiobuttons */
|
|
--in-content-button-text-color: var(--in-content-text-color);
|
|
--in-content-button-text-color-hover: var(--in-content-text-color);
|
|
--in-content-button-background: rgba(207,207,216,.33);
|
|
--in-content-button-background-hover: rgba(207,207,216,.66);
|
|
--in-content-button-background-active: rgb(207,207,216);
|
|
--in-content-primary-button-text-color: rgb(251,251,254);
|
|
--in-content-primary-button-text-color-hover: var(--in-content-primary-button-text-color);
|
|
--in-content-primary-button-background: #0061e0;
|
|
--in-content-primary-button-background-hover: #0250bb;
|
|
--in-content-primary-button-background-active: #053e94;
|
|
--in-content-danger-button-background: #e22850;
|
|
--in-content-danger-button-background-hover: #c50042;
|
|
--in-content-danger-button-background-active: #810220;
|
|
--in-content-focus-outline-color: var(--in-content-primary-button-background);
|
|
|
|
/* Note: 1px smaller than we want because we have a 1px transparent border. */
|
|
/* Once proton ships, these can probably stop being variables. */
|
|
--in-content-button-border-radius: 4px;
|
|
--in-content-button-horizontal-padding: 15px;
|
|
--in-content-button-vertical-padding: 7px;
|
|
|
|
--in-content-table-background: #f8f8fa;
|
|
--in-content-table-border-dark-color: #d1d1d1;
|
|
--in-content-table-header-background: #0a84ff;
|
|
--in-content-table-header-color: #ffffff;
|
|
--in-content-sidebar-width: 240px;
|
|
|
|
--dialog-warning-text-color: var(--red-60);
|
|
|
|
--checkbox-border-color: var(--in-content-box-border-color);
|
|
--checkbox-unchecked-bgcolor: var(--in-content-button-background);
|
|
--checkbox-unchecked-hover-bgcolor: var(--in-content-button-background-hover);
|
|
--checkbox-unchecked-active-bgcolor: var(--in-content-button-background-active);
|
|
--checkbox-checked-bgcolor: var(--in-content-primary-button-background);
|
|
--checkbox-checked-color: var(--in-content-primary-button-text-color);
|
|
--checkbox-checked-border-color: transparent;
|
|
--checkbox-checked-hover-bgcolor: var(--in-content-primary-button-background-hover);
|
|
--checkbox-checked-active-bgcolor: var(--in-content-primary-button-background-active);
|
|
|
|
--blue-40: #45a1ff;
|
|
--blue-50: #0a84ff;
|
|
--blue-60: #0060df;
|
|
--blue-70: #003eaa;
|
|
--blue-80: #002275;
|
|
--grey-30: #d7d7db;
|
|
--grey-60: #4a4a4f;
|
|
--grey-90-a10: rgba(12, 12, 13, 0.1);
|
|
--grey-90-a20: rgba(12, 12, 13, 0.2);
|
|
--grey-90-a30: rgba(12, 12, 13, 0.3);
|
|
--grey-90-a50: rgba(12, 12, 13, 0.5);
|
|
--grey-90-a60: rgba(12, 12, 13, 0.6);
|
|
--green-50: #30e60b;
|
|
--green-60: #12bc00;
|
|
--green-70: #058b00;
|
|
--green-80: #006504;
|
|
--green-90: #003706;
|
|
--orange-50: #ff9400;
|
|
--red-40: #ff4f5e;
|
|
--red-50: #ff0039;
|
|
--red-60: #d70022;
|
|
--red-70: #a4000f;
|
|
--red-80: #5a0002;
|
|
--red-90: #3e0200;
|
|
--yellow-50: #ffe900;
|
|
--yellow-60: #d7b600;
|
|
--yellow-60-a30: rgba(215, 182, 0, 0.3);
|
|
--yellow-70: #a47f00;
|
|
--yellow-80: #715100;
|
|
--yellow-90: #3e2800;
|
|
|
|
--shadow-10: 0 1px 4px var(--grey-90-a10);
|
|
--shadow-30: 0 4px 16px var(--grey-90-a10);
|
|
|
|
--card-padding: 16px;
|
|
--card-shadow: var(--shadow-10);
|
|
--card-outline-color: var(--grey-30);
|
|
--card-shadow-hover: var(--card-shadow), 0 0 0 5px var(--card-outline-color);
|
|
}
|
|
|
|
@media (-moz-toolbar-prefers-color-scheme: dark) {
|
|
:host,
|
|
:root {
|
|
/* Keep these in sync with layout/base/PresShell.cpp, and plaintext.css */
|
|
--in-content-page-background: rgb(28,27,34);
|
|
--in-content-page-color: rgb(251,251,254);
|
|
--in-content-deemphasized-text: rgb(191,191,201);
|
|
|
|
--in-content-box-background: rgb(35, 34, 43);
|
|
--in-content-box-background-odd: rgba(249,249,250,0.05);
|
|
--in-content-box-info-background: rgba(249,249,250,0.15);
|
|
|
|
--in-content-border-color: rgba(249,249,250,0.2);
|
|
--in-content-border-hover: rgba(249,249,250,0.3);
|
|
--in-content-border-invalid: rgb(255,132,139);
|
|
|
|
--in-content-error-text-color: #FF9AA2;
|
|
|
|
--in-content-button-background: rgb(43,42,51);
|
|
--in-content-button-background-hover: rgb(82,82,94);
|
|
--in-content-button-background-active: rgb(91,91,102);
|
|
--in-content-icon-color: rgb(251,251,254);
|
|
|
|
--in-content-primary-button-text-color: rgb(43,42,51);
|
|
--in-content-primary-button-background: rgb(0,221,255);
|
|
--in-content-primary-button-background-hover: rgb(128,235,255);
|
|
--in-content-primary-button-background-active: rgb(170,242,255);
|
|
|
|
--in-content-danger-button-background: #ff848b;
|
|
--in-content-danger-button-background-hover: #ffbdc5;
|
|
--in-content-danger-button-background-active: #ffdfe7;
|
|
|
|
--in-content-table-background: rgb(35, 34, 43);
|
|
--in-content-table-border-dark-color: rgba(249,249,250,0.2);
|
|
--in-content-table-header-background: rgb(5, 64, 150);
|
|
--in-content-table-header-color: var(--in-content-page-color);
|
|
|
|
--in-content-accent-color: var(--in-content-primary-button-background);
|
|
--in-content-accent-color-active: var(--in-content-primary-button-background-hover);
|
|
--in-content-link-color: var(--in-content-primary-button-background);
|
|
--in-content-link-color-hover: var(--in-content-primary-button-background-hover);
|
|
--in-content-link-color-active: var(--in-content-primary-button-background-active);
|
|
--in-content-link-color-visited: var(--in-content-link-color);
|
|
|
|
--card-outline-color: var(--grey-60);
|
|
|
|
--dialog-warning-text-color: var(--red-40);
|
|
|
|
scrollbar-color: rgba(249,249,250,.4) rgba(20,20,25,.3);
|
|
}
|
|
|
|
/*= Fully Dark Mode - abouts' common =======================================*/
|
|
@-moz-document url-prefix("about:plugins"),
|
|
url-prefix("about:cache"),
|
|
url-prefix("about:checkerboard") {
|
|
/* Base */
|
|
:root {
|
|
font: message-box !important;
|
|
appearance: none !important;
|
|
}
|
|
:root,
|
|
body {
|
|
background-color: var(--in-content-page-background) !important;
|
|
color: var(--in-content-page-color) !important;
|
|
}
|
|
body {
|
|
font-size: 15px !important;
|
|
font-weight: normal !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
h1 {
|
|
line-height: 1.2 !important;
|
|
}
|
|
h2 {
|
|
line-height: 1.4em !important;
|
|
}
|
|
|
|
/* Link */
|
|
a {
|
|
color: var(--in-content-link-color) !important;
|
|
}
|
|
a:hover,
|
|
.text-link:hover {
|
|
color: var(--in-content-link-color-hover) !important;
|
|
text-decoration: underline !important;
|
|
}
|
|
a:visited {
|
|
color: var(--in-content-link-color-visited) !important;
|
|
}
|
|
a:hover:active,
|
|
.text-link:hover:active {
|
|
color: var(--in-content-link-color-active) !important;
|
|
}
|
|
a:-moz-focusring,
|
|
.text-link:-moz-focusring {
|
|
outline: 2px solid var(--in-content-focus-outline-color) !important;
|
|
outline-offset: 1px !important;
|
|
border-radius: 4px !important;
|
|
}
|
|
|
|
/* Button */
|
|
button {
|
|
font: inherit;
|
|
}
|
|
button,
|
|
select,
|
|
input[type="color"] {
|
|
appearance: none !important;
|
|
min-height: 32px !important;
|
|
color: var(--in-content-button-text-color, inherit) !important;
|
|
border: 1px solid transparent !important; /* shows up in high-contrast mode */
|
|
border-radius: var(--in-content-button-border-radius) !important;
|
|
background-color: var(--in-content-button-background) !important;
|
|
font-weight: 400 !important;
|
|
padding: var(--in-content-button-vertical-padding) var(--in-content-button-horizontal-padding) !important;
|
|
text-decoration: none !important;
|
|
margin: 4px 8px !important;
|
|
/* Ensure font-size isn't overridden by widget styling (e.g. in forms.css) */
|
|
font-size: 1em !important;
|
|
}
|
|
button {
|
|
font-weight: 600 !important;
|
|
/* Use the same margin of other elements for the alignment */
|
|
margin-inline: 4px !important;
|
|
min-width: 6.3em !important;
|
|
}
|
|
/* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding
|
|
* the 1px border): */
|
|
button.medium {
|
|
--in-content-button-vertical-padding: 6px;
|
|
--in-content-button-horizontal-padding: 13px;
|
|
min-height: 28px !important;
|
|
font-size: 0.95em !important;
|
|
}
|
|
button.small {
|
|
--in-content-button-vertical-padding: 5px;
|
|
--in-content-button-horizontal-padding: 11px;
|
|
min-height: 24px !important;
|
|
font-size: 0.9em !important;
|
|
}
|
|
::-moz-focus-inner {
|
|
border: none !important;
|
|
}
|
|
button:-moz-focusring {
|
|
box-shadow: none !important;
|
|
outline: 2px solid var(--in-content-focus-outline-color) !important;
|
|
outline-offset: 2px !important;
|
|
}
|
|
button:enabled:hover,
|
|
input[type="color"]:hover {
|
|
background-color: var(--in-content-button-background-hover) !important;
|
|
color: var(--in-content-button-text-color-hover) !important;
|
|
border-color: transparent !important;
|
|
}
|
|
button:enabled:hover:active,
|
|
input[type="color"]:enabled:hover:active {
|
|
background-color: var(--in-content-button-background-active) !important;
|
|
}
|
|
button:disabled,
|
|
input[type="color"]:disabled {
|
|
opacity: 0.4 !important;
|
|
}
|
|
button[autofocus],
|
|
button[type="submit"],
|
|
button.primary {
|
|
background-color: var(--in-content-primary-button-background) !important;
|
|
color: var(--in-content-primary-button-text-color) !important;
|
|
}
|
|
button[autofocus]:enabled:hover,
|
|
button[type="submit"]:enabled:hover,
|
|
button.primary:enabled:hover {
|
|
background-color: var(--in-content-primary-button-background-hover) !important;
|
|
color: var(--in-content-primary-button-text-color-hover) !important;
|
|
}
|
|
button[autofocus]:enabled:hover:active,
|
|
button[type="submit"]:enabled:hover:active,
|
|
button.primary:enabled:hover:active {
|
|
background-color: var(--in-content-primary-button-background-active) !important;
|
|
}
|
|
|
|
/* Checkbox */
|
|
input[type="checkbox"] {
|
|
margin-block: 2px !important;
|
|
}
|
|
input[type="checkbox"] {
|
|
appearance: none !important;
|
|
height: 16px !important;
|
|
width: 16px !important;
|
|
border: 1px solid var(--checkbox-border-color) !important;
|
|
background-color: var(--checkbox-unchecked-bgcolor) !important;
|
|
border-radius: 2px !important;
|
|
margin-inline: 0 6px !important;
|
|
flex-shrink: 0 !important; /* avoid shrinking inside flex container */
|
|
}
|
|
input[type="checkbox"]:enabled:hover {
|
|
background-color: var(--checkbox-unchecked-hover-bgcolor) !important;
|
|
}
|
|
input[type="checkbox"]:enabled:hover:active {
|
|
background-color: var(--checkbox-unchecked-active-bgcolor) !important;
|
|
}
|
|
input[type="checkbox"]:checked {
|
|
border-color: var(--checkbox-checked-border-color) !important;
|
|
background-color: var(--checkbox-checked-bgcolor) !important;
|
|
background-image: url("chrome://global/skin/icons/check.svg") !important;
|
|
background-position: center !important;
|
|
background-repeat: no-repeat !important;
|
|
-moz-context-properties: fill !important;
|
|
fill: currentColor !important;
|
|
color: var(--checkbox-checked-color) !important;
|
|
/* Style the button also when printing with "Print Backgrounds" unchecked */
|
|
color-adjust: exact !important;
|
|
}
|
|
input[type="checkbox"]:enabled:checked:hover {
|
|
background-color: var(--checkbox-checked-hover-bgcolor) !important;
|
|
}
|
|
input[type="checkbox"]:enabled:checked:hover:active {
|
|
background-color: var(--checkbox-checked-active-bgcolor) !important;
|
|
}
|
|
|
|
/* Textarea */
|
|
input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]),
|
|
textarea {
|
|
appearance: none !important;
|
|
border: 1px solid var(--in-content-box-border-color) !important;
|
|
border-radius: 4px !important;
|
|
color: inherit !important;
|
|
background-color: var(--in-content-box-background) !important;
|
|
}
|
|
input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]),
|
|
textarea {
|
|
font-family: inherit !important;
|
|
font-size: inherit !important;
|
|
padding: 8px !important;
|
|
margin: 2px 4px !important;
|
|
}
|
|
input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):focus,
|
|
textarea:focus,
|
|
search-textbox[focused],
|
|
tree:focus-visible,
|
|
richlistbox:focus-visible {
|
|
border-color: transparent !important;
|
|
outline: 2px solid var(--in-content-focus-outline-color) !important;
|
|
outline-offset: -1px !important; /* Prevents antialising around the corners */
|
|
}
|
|
input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):-moz-ui-invalid,
|
|
textarea:-moz-ui-invalid {
|
|
border-color: transparent !important;
|
|
outline: 2px solid var(--in-content-border-invalid) !important;
|
|
outline-offset: -1px !important; /* Prevents antialising around the corners */
|
|
}
|
|
input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):disabled,
|
|
textarea:disabled,
|
|
search-textbox[disabled="true"] {
|
|
opacity: 0.4 !important;
|
|
}
|
|
|
|
/* Table */
|
|
table {
|
|
width: 100% !important;
|
|
border: 1px solid var(--in-content-border-color) !important;
|
|
border-radius: 0 !important;
|
|
}
|
|
}
|
|
|
|
@-moz-document url-prefix("about:cache"),
|
|
url-prefix("about:checkerboard") {
|
|
th, td {
|
|
border: 1px solid var(--in-content-border-color) !important;
|
|
}
|
|
th {
|
|
background-color: var(--in-content-table-header-background) !important;
|
|
color: var(--in-content-table-header-color) !important;
|
|
}
|
|
}
|
|
/*= Fully Dark Mode - about:plugins ========================================*/
|
|
@-moz-document url-prefix("about:plugins") {
|
|
.notice {
|
|
background: var(--in-content-box-background) !important;
|
|
border: 1px solid var(--in-content-border-color) !important;
|
|
}
|
|
}
|
|
|
|
/*= Fully Dark Mode - about:cache ==========================================*/
|
|
@-moz-document url-prefix("about:cache") {
|
|
table {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
th, td {
|
|
padding: 4px !important;
|
|
text-align: match-parent !important;
|
|
}
|
|
}
|
|
|
|
@-moz-document url-prefix("about:checkerboard") {
|
|
#canvas {
|
|
border: 1px solid var(--in-content-border-color) !important;
|
|
}
|
|
#excludePageFromZoom {
|
|
vertical-align: bottom !important;
|
|
}
|
|
}
|
|
|
|
/*= Fully Dark Mode - Addons.org ===========================================*/
|
|
@-moz-document url-prefix("https://addons.mozilla.org") {
|
|
/* Basic */
|
|
.Page-content,
|
|
.SecondaryHero,
|
|
main[aria-label="Content"] {
|
|
color: var(--in-content-page-color) !important;
|
|
background: var(--in-content-page-background) !important;
|
|
}
|
|
|
|
/* Text */
|
|
.AutoSearchInput-query,
|
|
.AutoSearchInput-suggestions-list,
|
|
.Page-content h1,
|
|
.Page-content h2,
|
|
.SearchResult-link,
|
|
.Home-SubjectShelf-link:link,
|
|
.Home-SubjectShelf-link:visited,
|
|
.DropdownMenuItem-link a,
|
|
.Select,
|
|
.Button--neutral,
|
|
.blog-entry-title,
|
|
.blogpost-nav * {
|
|
color: var(--in-content-text-color)!important;
|
|
}
|
|
.AutoSearchInput-suggestions-item:is(:active, :focus, :hover),
|
|
.SecondaryHero-message-link,
|
|
.SecondaryHero-module-link,
|
|
.Card-footer-link a,
|
|
.SearchResult-link:is(:active, :focus, :hover),
|
|
.SearchResult:hover .SearchResult-link,
|
|
.Home-SubjectShelf-link:is(:active, :focus, :hover),
|
|
.DropdownMenuItem-link a:is(:active, :focus, :hover),
|
|
.AddonMeta .MetadataCard-title a:is(:active, :hover),
|
|
.AddonMeta .MetadataCard-title a.AddonMeta-reviews-content-link:is(:active, :hover),
|
|
.AddonMeta .MetadataCard-content a:is(:active, :hover),
|
|
.AddonMeta .MetadataCard-content a.AddonMeta-reviews-content-link:is(:active, :hover),
|
|
.RatingsByStar-count a:hover,
|
|
.RatingsByStar-star a:hover,
|
|
.AddonTitle-author a,
|
|
.PermissionsCard-learn-more,
|
|
.DefinitionList a,
|
|
.ShowMoreCard-contents a,
|
|
.AddonDescription-contents a,
|
|
.AddonTitle a,
|
|
.TooltipMenu-opener,
|
|
.LanguageTools .Card-contents a,
|
|
.blog-entry-read-more-link,
|
|
.blogpost-nav-next.blogpost-nav-no-prev:hover p,
|
|
.blogpost-content-wrapper p a,
|
|
.blogpost-nav-prev:hover p,
|
|
.blogpost-nav-next:hover p {
|
|
color: var(--in-content-link-color) !important;
|
|
}
|
|
.SearchResult--meta-section,
|
|
.MetadataCard-title,
|
|
.MetadataCard-title a,
|
|
.MetadataCard-content a,
|
|
.CollectionSort-label,
|
|
.SearchResult-summary,
|
|
.AddonMeta .MetadataCard-content a.AddonMeta-reviews-content-link,
|
|
.AddonMeta .MetadataCard-title a.AddonMeta-reviews-content-link,
|
|
.PermissionsCard-subhead--optional,
|
|
.PermissionsCard-subhead--required,
|
|
.Definition-dt,
|
|
.RatingsByStar-count a,
|
|
.RatingsByStar-star a,
|
|
.AddonSummaryCard-addonAverage,
|
|
.AddonReviewCard-authorByLine,
|
|
.Home-heroHeader-subtitle,
|
|
.blog-entry-date,
|
|
.blogpost-breadcrumb *,
|
|
.AddonTitle-author {
|
|
color: var(--in-content-deemphasized-text) !important;
|
|
}
|
|
.PromotedBadge-label--recommended {
|
|
color: color-mix(in srgb, #712b00 15%, #ff9400) !important;
|
|
}
|
|
|
|
/* Background */
|
|
.Button--action {
|
|
color: var(--in-content-primary-button-text-color) !important;
|
|
background: var(--in-content-primary-button-background) !important;
|
|
}
|
|
.Select,
|
|
.Button--neutral, .Button--neutral:link {
|
|
background-color: var(--in-content-button-background) !important;
|
|
}
|
|
.Button--neutral.Button--micro:not(.Button--disabled):hover,
|
|
.Button--neutral:not(.Button--disabled):hover {
|
|
background: var(--in-content-button-background-hover) !important;
|
|
}
|
|
.Button--action.Button--micro:not(.Button--disabled):hover,
|
|
.Button--action:not(.Button--disabled):hover {
|
|
background: var(--in-content-primary-button-background-hover) !important;
|
|
}
|
|
.ShowMoreCard-contents::after {
|
|
background: linear-gradient(hsla(0,0%,100%,0), var(--in-content-table-background)) !important;
|
|
}
|
|
.AutoSearchInput-query,
|
|
.AutoSearchInput-suggestions-list,
|
|
.SecondaryHero-module,
|
|
.Card-header,
|
|
.Card-contents,
|
|
.CardList ul > li,
|
|
.AddonsCard--horizontal ul.AddonsCard-list .SearchResult-wrapper:is(:focus, :hover),
|
|
.LandingPage-header,
|
|
.DropdownMenu-items,
|
|
.DropdownMenu-items::after,
|
|
.MetadataCard,
|
|
.AddonsCard-list,
|
|
.Card-footer,
|
|
.StaticAddonCard,
|
|
.blogpost-nav * {
|
|
background: var(--in-content-table-background) !important;
|
|
}
|
|
|
|
.LanguageTools-header-row {
|
|
color: var(--in-content-table-header-color) !important;
|
|
background: var(--in-content-table-header-background) !important;
|
|
}
|
|
.LanguageTools-table.responsiveTable tbody tr:nth-child(2n) {
|
|
background-color: var(--in-content-box-background-odd) !important;;
|
|
}
|
|
|
|
/* Fill */
|
|
.Icon-arrow-blue.SearchSuggestion-icon-arrow {
|
|
filter: hue-rotate(330deg) brightness(1.3) !important;
|
|
}
|
|
.SecondaryHero-module-icon {
|
|
-moz-context-properties: fill, fill-opacity !important;
|
|
fill: currentColor !important;
|
|
}
|
|
.Icon-magnifying-glass {
|
|
filter: invert(65%) !important;
|
|
}
|
|
.Icon-heart {
|
|
filter: brightness(0) !important;;
|
|
}
|
|
.Permission .Icon {
|
|
filter: grayscale(100%) brightness(30) !important;;
|
|
}
|
|
|
|
/* Others */
|
|
.DropdownMenu-items {
|
|
box-shadow: 0 0 2px var(--in-content-border-color) !important;
|
|
}
|
|
|
|
.AutoSearchInput-query {
|
|
border: 1px solid var(--in-content-table-background) !important;
|
|
}
|
|
.AutoSearchInput-query:is(:hover, :focus) {
|
|
border-color: var(--in-content-primary-button-background) !important;
|
|
}
|
|
|
|
.blog-entry-read-more-link {
|
|
border-color: var(--in-content-link-color) !important;
|
|
}
|
|
|
|
.blogpost-nav-arrow-left .cls-1,
|
|
.blogpost-nav-arrow-right .cls-1 {
|
|
stroke: var(--in-content-text-color) !important;
|
|
}
|
|
}
|
|
}
|
|
}
|