mirror of
https://git.sr.ht/~azikx/userstyles
synced 2024-10-30 05:16:19 +00:00
update
This commit is contained in:
commit
7a548adb0b
16
README.md
Normal file
16
README.md
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
<div align="center">
|
||||
<h1>【 STYLUS USERSTYLES 】</h1>
|
||||
</div>
|
||||
|
||||
## Hi there, this is my userstyles for [Paradise](https://github.com/paradise-theme/paradise) color-scheme, mostly will be based on [catppucin](https://github.com/catppuccin/userstyles), use [stylus](https://github.com/openstyles/stylus) for applying
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
118
codeberg/codeberg.user.css
Normal file
118
codeberg/codeberg.user.css
Normal file
|
|
@ -0,0 +1,118 @@
|
|||
/* ==UserStyle==
|
||||
@name Codeberg paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/codeberg/codeberg.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Codeberg
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain('codeberg.org') {
|
||||
@import (css)
|
||||
url("https://paradisa.github.io/gitea/theme-paradisa-@{darkFlavor}-@{accentColor}.css")
|
||||
(prefers-color-scheme: dark);
|
||||
}
|
||||
|
||||
@-moz-document domain('codeberg.org') {
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
/* Base styles not needed, themed in upstream Gitea port. */
|
||||
|
||||
--color-body: @base;
|
||||
--color-nav-text: @crust;
|
||||
--color-nav-hover-bg: darken(@accent-color, 5%);
|
||||
--color-secondary-nav-bg: @surface0;
|
||||
--color-link: @blue;
|
||||
--color-footer-text: @text;
|
||||
|
||||
.ui.secondary.menu .dropdown.item:hover,
|
||||
.ui.secondary.menu a.item:hover,
|
||||
.ui.secondary.menu a.active.item:hover {
|
||||
background-color: var(--color-nav-hover-bg);
|
||||
color: var(--color-black);
|
||||
}
|
||||
|
||||
.ui.basic.red.buttons .button,
|
||||
.ui.basic.red.button {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: @red;
|
||||
border-color: var(--color-light-border);
|
||||
color: @crust;
|
||||
}
|
||||
}
|
||||
|
||||
#codeberg-logo (@color) {
|
||||
@svg: escape(
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><defs><linearGradient id="b" x1="42519.285" x2="42575.336" y1="-7078.7891" y2="-6966.9312" gradientUnits="userSpaceOnUse" href="#a"/><linearGradient id="a"><stop color="@{color}" offset="0" stop-opacity="0"/><stop offset=".495" stop-color="@{color}" stop-opacity=".3"/><stop offset="1" stop-color="@{color}" stop-opacity=".3"/></linearGradient></defs><path fill="url(#b)" d="M42519.285-7078.79a.76.568 0 0 0-.738.675l33.586 125.888a87.2 87.2 0 0 0 39.381-33.763l-71.565-92.52a.76.568 0 0 0-.664-.28" transform="translate(-5840.572 980.524)scale(.13766)"/><path fill="@{color}" d="M12.003.525A12.003 12.003 0 0 0 0 12.533 11.9 11.9 0 0 0 1.826 18.9L11.838 5.956c.068-.09.25-.09.324 0l10.007 12.939A11.9 11.9 0 0 0 24 12.522 12.003 12.003 0 0 0 12.003.525"/></svg>'
|
||||
);
|
||||
content: url("data:image/svg+xml,@{svg}");
|
||||
}
|
||||
|
||||
#navbar-logo img {
|
||||
#codeberg-logo(@crust);
|
||||
}
|
||||
.branding img {
|
||||
#codeberg-logo(@text);
|
||||
}
|
||||
|
||||
footer {
|
||||
.button:hover {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: @blue !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
[data-theme="codeberg-dark"],
|
||||
[data-theme="codeberg-light"],
|
||||
[data-theme="codeberg-auto"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
188
extranix/extranix.user.css
Normal file
188
extranix/extranix.user.css
Normal file
|
|
@ -0,0 +1,188 @@
|
|||
/* ==UserStyle==
|
||||
@name Extranix paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/extranix/extranix.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Extranix
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain('home-manager-options.extranix.com') {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: @mantle;
|
||||
|
||||
nav.shortcuts li a {
|
||||
color: @text;
|
||||
|
||||
&:hover {
|
||||
background-color: @surface0;
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#lastUpdateElement {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
input,
|
||||
textarea,
|
||||
select {
|
||||
background-color: @mantle;
|
||||
color: @text;
|
||||
caret-color: @text;
|
||||
border-color: @surface0;
|
||||
}
|
||||
|
||||
.progress-bar-striped {
|
||||
background-image: linear-gradient(
|
||||
45deg,
|
||||
fade(@text, 40%) 25%,
|
||||
transparent 25%,
|
||||
transparent 50%,
|
||||
fade(@text, 40%) 50%,
|
||||
fade(@text, 40%) 75%,
|
||||
transparent 75%,
|
||||
transparent
|
||||
);
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
border-color: @accent-color;
|
||||
box-shadow:
|
||||
inset 0 1px 1px rgba(0, 0, 0, 0.075),
|
||||
0 0 8px @accent-color;
|
||||
}
|
||||
|
||||
.table-striped > tbody > tr:nth-of-type(2n + 1) {
|
||||
background-color: @surface0;
|
||||
}
|
||||
|
||||
table#indexedOptionsTable tr td,
|
||||
.table > thead > tr > th {
|
||||
border-color: @surface2 !important;
|
||||
}
|
||||
|
||||
table tr.optrow:focus-visible,
|
||||
table tr.optrow:hover {
|
||||
background-color: @surface1 !important;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
background-color: @base;
|
||||
|
||||
.modal-header,
|
||||
.modal-footer {
|
||||
border-color: @surface0 !important;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: @text;
|
||||
text-shadow: 0 1px 0 @text;
|
||||
}
|
||||
|
||||
pre {
|
||||
color: @text;
|
||||
background-color: @mantle;
|
||||
border-color: @surface0;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
background: @surface0;
|
||||
color: @text;
|
||||
text-shadow: none;
|
||||
box-shadow: none;
|
||||
border-color: @surface0;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
.focus,
|
||||
.active {
|
||||
background-color: @surface1;
|
||||
color: @text;
|
||||
border-color: @surface0;
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
background-color: @mantle;
|
||||
color: @text;
|
||||
border-color: @surface2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
853
github/github.user.css
Normal file
853
github/github.user.css
Normal file
|
|
@ -0,0 +1,853 @@
|
|||
/* ==UserStyle==
|
||||
@name GitHub Paradisa
|
||||
@namespace github.com/axax-loll/userstyles/tree/main
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main/github/github.user.css
|
||||
@version 1.0.2
|
||||
@description Lolz github theme
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document regexp("https:\/\/(gist\.)*github\.com(?!((\/.+?\/.+?\/commit\/[A-Fa-f0-9]+\.(patch|diff)$)|\/home$|\/features($|\/.*)|\/marketplace($|\?.*|\/.*)|\/organizations\/plan)).*$") {
|
||||
[data-color-mode="auto"] {
|
||||
@media (prefers-color-scheme: light) {
|
||||
&[data-light-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
&[data-dark-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[data-color-mode="light"][data-light-theme="dark"],
|
||||
[data-color-mode="dark"][data-dark-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
html:not([data-light-theme="light"], [data-light-theme="dark"]) body:not(.logged-out)::after,
|
||||
html:not([data-dark-theme="dark"], [data-dark-theme="light"]) body:not(.logged-out)::after {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 1rem;
|
||||
margin: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
max-width: 40ch;
|
||||
background-color: var(--color-danger-fg);
|
||||
color: var(--color-header-bg);
|
||||
content: "Unsupported GitHub theme detected! Please switch to the default light/dark theme via the GitHub Appearance settings to get the best experience for the paradisa GitHub userstyle.";
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup =paradisa, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.cm-placeholder {
|
||||
color: @subtext0;
|
||||
}
|
||||
|
||||
accent-color: @accent-color;
|
||||
color: @text;
|
||||
|
||||
--color-social-reaction-bg-reacted-hover: fade(@accent-color, 30%);
|
||||
--color-notifications-button-hover-bg: fade(@accent-color, 60%);
|
||||
--color-workflow-card-header-shadow: rgba(27, 31, 35, 0.04);
|
||||
--color-icon-directory: var(--fgColor-muted, var(--color-fg-muted));
|
||||
--color-calendar-halloween-graph-day-L1-bg: fadeout(@accent-color,
|
||||
60%) !important;
|
||||
--color-calendar-halloween-graph-day-L2-bg: fadeout(@accent-color,
|
||||
40%) !important;
|
||||
--color-calendar-halloween-graph-day-L3-bg: fadeout(@accent-color,
|
||||
20%) !important;
|
||||
--color-calendar-halloween-graph-day-L4-bg: @accent-color !important;
|
||||
--color-calendar-winter-graph-day-L1-bg: fadeout(@accent-color,
|
||||
60%) !important;
|
||||
--color-calendar-winter-graph-day-L2-bg: fadeout(@accent-color,
|
||||
40%) !important;
|
||||
--color-calendar-winter-graph-day-L3-bg: fadeout(@accent-color,
|
||||
20%) !important;
|
||||
--color-calendar-winter-graph-day-L4-bg: @accent-color !important;
|
||||
--color-calendar-graph-day-bg: @surface0 !important;
|
||||
--color-calendar-graph-day-border: transparent !important;
|
||||
--color-calendar-graph-day-L1-bg: fadeout(@accent-color, 60%) !important;
|
||||
--color-calendar-graph-day-L2-bg: fadeout(@accent-color, 40%) !important;
|
||||
--color-calendar-graph-day-L3-bg: fadeout(@accent-color, 20%) !important;
|
||||
--color-calendar-graph-day-L4-bg: @accent-color !important;
|
||||
--color-calendar-graph-day-L2-border: transparent !important;
|
||||
--color-calendar-graph-day-L3-border: transparent !important;
|
||||
--color-calendar-graph-day-L4-border: transparent !important;
|
||||
--color-user-mention-fg: @accent-color;
|
||||
--color-user-mention-bg: fade(@accent-color, 30%);
|
||||
--color-dashboard-feed-bg: var(--color-scale-gray-9);
|
||||
--color-mktg-btn-shadow-outline: rgba(255, 255, 255, 0.25) 0 0 0 1px inset;
|
||||
--color-marketing-icon-secondary: var(--color-scale-blue-5);
|
||||
--color-project-header-bg: var(--color-scale-gray-9);
|
||||
--color-project-sidebar-bg: var(--color-scale-gray-8);
|
||||
--color-project-gradient-in: var(--color-scale-gray-8);
|
||||
--color-project-gradient-out: rgba(22, 27, 34, 0);
|
||||
--color-diff-blob-selected-line-highlight-mix-blend-mode: screen;
|
||||
--topicTag-borderColor: #0000;
|
||||
--highlight-neutral-bgColor: fade(@yellow, 30%);
|
||||
--page-header-bgColor: @crust;
|
||||
--diffBlob-addition-fgColor-text: @text;
|
||||
--diffBlob-addition-fgColor-num: @text;
|
||||
--diffBlob-addition-bgColor-num: fadeout(@green, 70%);
|
||||
--diffBlob-addition-bgColor-line: fadeout(@green, 85%);
|
||||
--diffBlob-addition-bgColor-word: fadeout(@green, 70%);
|
||||
--diffBlob-deletion-fgColor-text: @text;
|
||||
--diffBlob-deletion-fgColor-num: @text;
|
||||
--diffBlob-deletion-bgColor-num: fadeout(@red, 70%);
|
||||
--diffBlob-deletion-bgColor-line: fadeout(@red, 85%);
|
||||
--diffBlob-deletion-bgColor-word: fadeout(@red, 70%);
|
||||
--diffBlob-hunk-bgColor-num: fadeout(@accent-color, 60%);
|
||||
--diffBlob-expander-iconColor: #848d97;
|
||||
--codeMirror-fgColor: @text;
|
||||
--codeMirror-bgColor: @base;
|
||||
--codeMirror-gutters-bgColor: @base;
|
||||
--codeMirror-gutterMarker-fgColor-default: @base;
|
||||
--codeMirror-gutterMarker-fgColor-muted: @overlay0;
|
||||
--codeMirror-lineNumber-fgColor: @overlay1;
|
||||
--codeMirror-cursor-fgColor: @text;
|
||||
--codeMirror-selection-bgColor: #388bfd66;
|
||||
--codeMirror-activeline-bgColor: #6e768166;
|
||||
--codeMirror-matchingBracket-fgColor: @text;
|
||||
--codeMirror-lines-bgColor: @base;
|
||||
--codeMirror-syntax-fgColor-comment: @overlay2;
|
||||
--codeMirror-syntax-fgColor-constant: @blue;
|
||||
--codeMirror-syntax-fgColor-entity: @blue;
|
||||
--codeMirror-syntax-fgColor-keyword: @mauve;
|
||||
--codeMirror-syntax-fgColor-storage: @peach;
|
||||
--codeMirror-syntax-fgColor-string: @green;
|
||||
--codeMirror-syntax-fgColor-support: #79c0ff;
|
||||
--codeMirror-syntax-fgColor-variable: @peach;
|
||||
--header-fgColor-default: @text;
|
||||
--header-fgColor-logo: @text;
|
||||
--header-bgColor: @crust;
|
||||
--header-borderColor-divider: #8b949e;
|
||||
--headerSearch-bgColor: @mantle;
|
||||
--headerSearch-borderColor: @surface0;
|
||||
--avatar-bgColor: fade(@text, 26%);
|
||||
--avatar-borderColor: @surface0;
|
||||
--avatar-shadow: 0px 0px 0px 2px #0d1117;
|
||||
--avatarStack-fade-bgColor-default: @surface1;
|
||||
--avatarStack-fade-bgColor-muted: #21262d;
|
||||
--control-bgColor-rest: @red;
|
||||
--control-bgColor-hover: #292e36;
|
||||
--control-bgColor-active: @surface1;
|
||||
--control-bgColor-disabled: fade(@mantle, 60%);
|
||||
--control-bgColor-selected: #161b22;
|
||||
--control-fgColor-rest: @text;
|
||||
--control-fgColor-placeholder: #484f58;
|
||||
--control-fgColor-disabled: fade(@subtext0, 70%);
|
||||
--control-borderColor-rest: @surface1;
|
||||
--control-borderColor-emphasis: #666e79;
|
||||
--control-borderColor-disabled: fade(@surface1, 75%);
|
||||
--control-borderColor-selected: #f0f6fc;
|
||||
--control-borderColor-success: @green;
|
||||
--control-borderColor-danger: @red;
|
||||
--control-borderColor-warning: @yellow;
|
||||
--control-iconColor-rest: #848d97;
|
||||
--control-transparent-bgColor-rest: #0000;
|
||||
--control-transparent-bgColor-hover: fade(@surface2, 20%);
|
||||
--control-transparent-bgColor-active: fade(@overlay0, 50%);
|
||||
--control-transparent-bgColor-disabled: #21262db3;
|
||||
--control-transparent-bgColor-selected: #b1bac414;
|
||||
--control-transparent-borderColor-rest: #0000;
|
||||
--control-transparent-borderColor-hover: #0000;
|
||||
--control-transparent-borderColor-active: #0000;
|
||||
--control-danger-fgColor-rest: @red;
|
||||
--control-danger-fgColor-hover: @crust;
|
||||
--control-danger-bgColor-hover: fade(@red, 80%);
|
||||
--control-danger-bgColor-active: @red;
|
||||
--control-checked-bgColor-rest: @accent-color;
|
||||
--control-checked-bgColor-hover: lighten(@accent-color, 5%);
|
||||
--control-checked-bgColor-active: lighten(@accent-color, 5%);
|
||||
--control-checked-bgColor-disabled: #6e7681;
|
||||
--control-checked-fgColor-rest: @crust;
|
||||
--control-checked-fgColor-disabled: #010409;
|
||||
--control-checked-borderColor-rest: @accent-color;
|
||||
--control-checked-borderColor-hover: @accent-color;
|
||||
--control-checked-borderColor-active: @accent-color;
|
||||
--control-checked-borderColor-disabled: @surface0;
|
||||
--controlTrack-bgColor-rest: @surface0;
|
||||
--controlTrack-bgColor-hover: @surface1;
|
||||
--controlTrack-bgColor-active: @surface2;
|
||||
--controlTrack-bgColor-disabled: #6e7681;
|
||||
--controlTrack-fgColor-rest: #848d97;
|
||||
--controlTrack-fgColor-disabled: @text;
|
||||
--controlTrack-borderColor-rest: #0000;
|
||||
--controlTrack-borderColor-disabled: #6e7681;
|
||||
--controlKnob-bgColor-rest: @base;
|
||||
--controlKnob-bgColor-disabled: #21262db3;
|
||||
--controlKnob-bgColor-checked: @text;
|
||||
--controlKnob-borderColor-rest: @surface2;
|
||||
--controlKnob-borderColor-disabled: #21262db3;
|
||||
--controlKnob-borderColor-checked: @blue;
|
||||
--button-default-fgColor-rest: @text;
|
||||
--button-default-bgColor-rest: @surface0;
|
||||
--button-default-bgColor-hover: @surface1;
|
||||
--button-default-bgColor-active: @surface2;
|
||||
--button-default-bgColor-selected: @surface2;
|
||||
--button-default-bgColor-disabled: fade(@surface0, 70%);
|
||||
--button-default-borderColor-rest: @surface1;
|
||||
--button-default-borderColor-hover: @surface1;
|
||||
--button-default-borderColor-active: @surface1;
|
||||
--button-default-borderColor-disabled: fade(@surface0, 70%);
|
||||
--button-default-shadow-resting: 0px 0px 0px 0px #000;
|
||||
--button-primary-fgColor-rest: @base;
|
||||
--button-primary-fgColor-disabled: fade(@base, 60%);
|
||||
--button-primary-iconColor-rest: @base;
|
||||
--button-primary-bgColor-rest: @green;
|
||||
--button-primary-bgColor-hover: lighten(@green, 5%);
|
||||
--button-primary-bgColor-active: saturate(@green, 5%);
|
||||
--button-primary-bgColor-disabled: fade(@green, 70%);
|
||||
--button-primary-borderColor-rest: @green;
|
||||
--button-primary-borderColor-hover: @green;
|
||||
--button-primary-borderColor-active: @green;
|
||||
--button-primary-borderColor-disabled: fade(@green, 70%);
|
||||
--button-primary-shadow-selected: 0px 0px 0px 0px #000;
|
||||
--button-invisible-fgColor-rest: @text;
|
||||
--button-invisible-fgColor-hover: lighten(@accent-color, 10%);
|
||||
--button-invisible-fgColor-disabled: #6e7681;
|
||||
--button-invisible-iconColor-rest: @overlay2;
|
||||
--button-invisible-iconColor-hover: #e6edf3;
|
||||
--button-invisible-iconColor-disabled: #6e7681;
|
||||
--button-invisible-bgColor-rest: #0000;
|
||||
--button-invisible-bgColor-hover: #b1bac41f;
|
||||
--button-invisible-bgColor-active: #b1bac433;
|
||||
--button-invisible-bgColor-disabled: fade(@surface1, 70%);
|
||||
--button-invisible-borderColor-rest: #0000;
|
||||
--button-invisible-borderColor-hover: #0000;
|
||||
--button-invisible-borderColor-disabled: fade(@surface1, 70%);
|
||||
--button-outline-fgColor-rest: #388bfd;
|
||||
--button-outline-fgColor-hover: #58a6ff;
|
||||
--button-outline-fgColor-active: @text;
|
||||
--button-outline-fgColor-disabled: #4493f880;
|
||||
--button-outline-bgColor-rest: #f0f6fc;
|
||||
--button-outline-bgColor-hover: @surface1;
|
||||
--button-outline-bgColor-active: #0d419d;
|
||||
--button-outline-bgColor-disabled: #0d1117;
|
||||
--button-outline-borderColor-hover: #f0f6fc1a;
|
||||
--button-outline-borderColor-selected: #f0f6fc1a;
|
||||
--button-outline-shadow-selected: 0px 0px 0px 0px #000;
|
||||
--button-danger-fgColor-rest: @red;
|
||||
--button-danger-fgColor-hover: @base;
|
||||
--button-danger-fgColor-active: @base;
|
||||
--button-danger-fgColor-disabled: fade(@red, 50%);
|
||||
--button-danger-iconColor-rest: @red;
|
||||
--button-danger-iconColor-hover: @crust;
|
||||
--button-danger-bgColor-rest: @surface0;
|
||||
--button-danger-bgColor-hover: @red;
|
||||
--button-danger-bgColor-active: darken(@red, 5%);
|
||||
--button-danger-bgColor-disabled: @base;
|
||||
--button-danger-borderColor-rest: @surface1;
|
||||
--button-danger-borderColor-hover: @red;
|
||||
--button-danger-borderColor-active: darken(@red, 5%);
|
||||
--button-danger-shadow-selected: 0px 0px 0px 0px #000;
|
||||
--button-inactive-fgColor: #8b949e;
|
||||
--button-inactive-bgColor: #21262d;
|
||||
--button-star-iconColor: @yellow;
|
||||
--buttonCounter-default-bgColor-rest: @surface1;
|
||||
--buttonCounter-invisible-bgColor-rest: @surface1;
|
||||
--buttonCounter-primary-bgColor-rest: #04260f33;
|
||||
--buttonCounter-outline-bgColor-rest: #051d4d33;
|
||||
--buttonCounter-outline-bgColor-hover: #051d4d33;
|
||||
--buttonCounter-outline-bgColor-disabled: #1f6feb0d;
|
||||
--buttonCounter-outline-fgColor-rest: #388bfd;
|
||||
--buttonCounter-outline-fgColor-hover: #58a6ff;
|
||||
--buttonCounter-outline-fgColor-disabled: #4493f880;
|
||||
--buttonCounter-danger-bgColor-hover: fade(@text, 20%);
|
||||
--buttonCounter-danger-bgColor-disabled: #da36330d;
|
||||
--buttonCounter-danger-bgColor-rest: #49020233;
|
||||
--buttonCounter-danger-fgColor-rest: @red;
|
||||
--buttonCounter-danger-fgColor-hover: @text;
|
||||
--buttonCounter-danger-fgColor-disabled: fade(@red, 50%);
|
||||
--focus-outlineColor: @accent-color;
|
||||
--menu-bgColor-active: @mantle;
|
||||
--overlay-bgColor: @base;
|
||||
--overlay-borderColor: @surface0;
|
||||
--overlay-backdrop-bgColor: #161b2266;
|
||||
--selectMenu-borderColor: #484f58;
|
||||
--selectMenu-bgColor-active: #0c2d6b;
|
||||
--sideNav-bgColor-selected: #21262d;
|
||||
--skeletonLoader-bgColor: #161b22;
|
||||
--timelineBadge-bgColor: @mantle;
|
||||
--treeViewItem-leadingVisual-iconColor-rest: #848d97;
|
||||
--underlineNav-borderColor-active: @accent-color;
|
||||
--underlineNav-borderColor-hover: #6e768166;
|
||||
--underlineNav-iconColor-rest: #848d97;
|
||||
--selection-bgColor: fade(@accent-color, 30%);
|
||||
--reactionButton-selected-bgColor-rest: fade(@accent-color, 20%);
|
||||
--reactionButton-selected-bgColor-hover: fade(@accent-color, 35%);
|
||||
--reactionButton-selected-fgColor-rest: @accent-color;
|
||||
--reactionButton-selected-fgColor-hover: @accent-color;
|
||||
--fgColor-default: @text;
|
||||
--fgColor-muted: @subtext1;
|
||||
--fgColor-onEmphasis: @base;
|
||||
--fgColor-white: if(@lookup =paradisa, @crust, @text);
|
||||
--fgColor-disabled: @surface2;
|
||||
--fgColor-link: @accent-color;
|
||||
--fgColor-neutral: #6e7681;
|
||||
--fgColor-accent: @accent-color;
|
||||
--fgColor-success: @green;
|
||||
--fgColor-attention: @yellow;
|
||||
--fgColor-severe: @peach;
|
||||
--fgColor-danger: @red;
|
||||
--fgColor-open: @green;
|
||||
--fgColor-closed: @red;
|
||||
--fgColor-done: @mauve;
|
||||
--fgColor-sponsors: @pink;
|
||||
--bgColor-default: @base;
|
||||
--bgColor-muted: @mantle;
|
||||
--bgColor-inset: @crust;
|
||||
--bgColor-emphasis: @overlay2;
|
||||
--bgColor-inverse: @text;
|
||||
--bgColor-disabled: #21262db3;
|
||||
--bgColor-transparent: #0000;
|
||||
--bgColor-neutral-muted: fade(@surface0, 40%);
|
||||
--bgColor-neutral-emphasis: @subtext0;
|
||||
--bgColor-accent-muted: fade(@accent-color, 20%);
|
||||
--bgColor-accent-emphasis: @accent-color;
|
||||
--bgColor-success-muted: #2ea04326;
|
||||
--bgColor-success-emphasis: @green;
|
||||
--bgColor-attention-muted: fade(@yellow, 15%);
|
||||
--bgColor-attention-emphasis: @yellow;
|
||||
--bgColor-severe-muted: fade(@peach, 26%);
|
||||
--bgColor-severe-emphasis: @peach;
|
||||
--bgColor-danger-muted: fade(@red, 26%);
|
||||
--bgColor-danger-emphasis: @red;
|
||||
--bgColor-open-muted: #2ea0431a;
|
||||
--bgColor-open-emphasis: @green;
|
||||
--bgColor-closed-muted: fade(@red, 15%);
|
||||
--bgColor-closed-emphasis: @red;
|
||||
--bgColor-done-muted: #a371f726;
|
||||
--bgColor-done-emphasis: @mauve;
|
||||
--bgColor-sponsors-muted: #db61a21a;
|
||||
--bgColor-sponsors-emphasis: @pink;
|
||||
--borderColor-default: @surface1;
|
||||
--borderColor-muted: @surface0;
|
||||
--borderColor-emphasis: #484f58;
|
||||
--borderColor-disabled: #21262db3;
|
||||
--borderColor-transparent: #0000;
|
||||
--borderColor-neutral-muted: #6e768166;
|
||||
--borderColor-neutral-emphasis: #6e7681;
|
||||
--borderColor-accent-muted: fade(@accent-color, 50%);
|
||||
--borderColor-accent-emphasis: @accent-color;
|
||||
--borderColor-success-muted: darken(@green, 5%);
|
||||
--borderColor-success-emphasis: @green;
|
||||
--borderColor-attention-muted: fade(@flamingo, 30%);
|
||||
--borderColor-attention-emphasis: @flamingo;
|
||||
--borderColor-severe-muted: @peach;
|
||||
--borderColor-severe-emphasis: #bd561d;
|
||||
--borderColor-danger-muted: @red;
|
||||
--borderColor-danger-emphasis: @red;
|
||||
--borderColor-open-muted: darken(@green, 5%);
|
||||
--borderColor-open-emphasis: @green;
|
||||
--borderColor-closed-muted: @red;
|
||||
--borderColor-closed-emphasis: @red;
|
||||
--borderColor-done-muted: @lavender;
|
||||
--borderColor-done-emphasis: @mauve;
|
||||
--borderColor-sponsors-muted: #db61a266;
|
||||
--borderColor-sponsors-emphasis: @pink;
|
||||
|
||||
& when (@lookup =paradisa) {
|
||||
--color-ansi-black: @subtext1;
|
||||
--color-ansi-black-bright: @subtext0;
|
||||
--color-ansi-gray: @subtext0;
|
||||
--color-ansi-white: @surface2;
|
||||
--color-ansi-white-bright: @surface1;
|
||||
}
|
||||
|
||||
& when not (@lookup =paradisa) {
|
||||
--color-ansi-black: @surface1;
|
||||
--color-ansi-black-bright: @surface2;
|
||||
--color-ansi-gray: @surface2;
|
||||
--color-ansi-white: @subtext1;
|
||||
--color-ansi-white-bright: @subtext0;
|
||||
}
|
||||
|
||||
--color-ansi-red: @red;
|
||||
--color-ansi-red-bright: @red;
|
||||
--color-ansi-green: @green;
|
||||
--color-ansi-green-bright: @green;
|
||||
--color-ansi-yellow: @yellow;
|
||||
--color-ansi-yellow-bright: @yellow;
|
||||
--color-ansi-blue: @blue;
|
||||
--color-ansi-blue-bright: @blue;
|
||||
--color-ansi-magenta: @pink;
|
||||
--color-ansi-magenta-bright: @pink;
|
||||
--color-ansi-cyan: @teal;
|
||||
--color-ansi-cyan-bright: @teal;
|
||||
--color-prettylights-syntax-comment: @overlay2;
|
||||
--color-prettylights-syntax-constant: @blue;
|
||||
--color-prettylights-syntax-constant-other-reference-link: @blue;
|
||||
--color-prettylights-syntax-entity: @blue;
|
||||
--color-prettylights-syntax-storage-modifier-import: @peach;
|
||||
--color-prettylights-syntax-entity-tag: @blue;
|
||||
--color-prettylights-syntax-keyword: @mauve;
|
||||
--color-prettylights-syntax-string: @green;
|
||||
--color-prettylights-syntax-variable: @peach;
|
||||
--color-prettylights-syntax-invalid-illegal-text: @red;
|
||||
--color-prettylights-syntax-invalid-illegal-bg: fadeout(@red, 85%);
|
||||
--color-prettylights-syntax-markup-heading: @red;
|
||||
--color-prettylights-syntax-markup-italic: @yellow;
|
||||
--color-prettylights-syntax-markup-bold: @yellow;
|
||||
--color-prettylights-syntax-markup-deleted-text: @text;
|
||||
--color-prettylights-syntax-markup-deleted-bg: fadeout(@red, 60%);
|
||||
--color-prettylights-syntax-markup-inserted-text: @text;
|
||||
--color-prettylights-syntax-markup-inserted-bg: fadeout(@green, 60%);
|
||||
--color-prettylights-syntax-markup-changed-text: @text;
|
||||
--color-prettylights-syntax-markup-changed-bg: fadeout(@yellow, 60%);
|
||||
--color-prettylights-syntax-markup-ignored-text: @text;
|
||||
--bgColor-white: @base;
|
||||
--color-scale-white: @base;
|
||||
--color-scale-gray-3: @overlay2;
|
||||
--color-scale-gray-5: @overlay0;
|
||||
--color-scale-gray-6: @surface1;
|
||||
--color-scale-gray-7: @surface1;
|
||||
--color-scale-blue-2: @sky;
|
||||
--color-scale-blue-5: @blue;
|
||||
--color-scale-green-3: @green;
|
||||
--color-scale-green-4: @green;
|
||||
--color-scale-yellow-3: @peach;
|
||||
--color-scale-orange-4: @peach;
|
||||
--color-scale-red-4: @red;
|
||||
--shadow-inset: inset 0px 1px 0px 0px @crust;
|
||||
--shadow-resting-xsmall: 0px 1px 0px 0px @crust;
|
||||
--shadow-resting-small: 0px 1px 0px 0px @crust, 0px 1px 3px 0px @crust;
|
||||
--shadow-resting-medium: 0px 3px 6px 0px @crust;
|
||||
--shadow-floating-small: 0px 0px 0px 1px @base, 0px 6px 12px -3px @crust,
|
||||
0px 6px 18px 0px @crust;
|
||||
--shadow-floating-medium: 0px 0px 0px 1px @surface0,
|
||||
0px 8px 16px -4px @crust, 0px 4px 32px -4px @crust,
|
||||
0px 24px 48px -12px @crust, 0px 48px 96px -24px @crust;
|
||||
--shadow-floating-large: 0px 0px 0px 1px @surface0,
|
||||
0px 24px 48px 0px #010409;
|
||||
--shadow-floating-xlarge: 0px 0px 0px 1px @surface0,
|
||||
0px 32px 64px 0px #010409;
|
||||
--shadow-floating-legacy: 0px 6px 12px -3px @crust, 0px 6px 18px 0px @crust;
|
||||
--outline-focus: @blue solid 2px;
|
||||
|
||||
/* Enhanced Repo Insights Views - https://github.com/orgs/community/discussions/135572 */
|
||||
--data-blue-color-emphasis: @accent-color;
|
||||
--data-red-color-emphasis: @red;
|
||||
--data-green-color-emphasis: @green;
|
||||
|
||||
--tooltip-fgColor: @text;
|
||||
--tooltip-bgColor: @crust;
|
||||
|
||||
/* Refined GitHub */
|
||||
--rgh-heat-color: @peach;
|
||||
|
||||
.turbo-progress-bar {
|
||||
background-color: @accent-color;
|
||||
}
|
||||
|
||||
.form-select {
|
||||
@svg: escape('<svg width="16" height="16" viewBox="0 0 16 16" fill="@{subtext0}" xmlns="http://www.w3.org/2000/svg"><path d="m4.427 9.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 9H4.604a.25.25 0 0 0-.177.427M4.423 6.47 7.82 3.072a.25.25 0 0 1 .354 0L11.57 6.47a.25.25 0 0 1-.177.427H4.6a.25.25 0 0 1-.177-.427"/></svg>'
|
||||
);
|
||||
background-image: url("data:image/svg+xml,@{svg}");
|
||||
}
|
||||
|
||||
img[src="https://github.githubassets.com/assets/mona-loading-default-c3c7aad1282f.gif"] {
|
||||
content: url("https://giscus.paradisa.com/assets/loading_48x48.gif");
|
||||
}
|
||||
|
||||
/* Header when logged out */
|
||||
.HeaderMenu-link {
|
||||
color: @text;
|
||||
|
||||
&:hover {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
.header-search-button {
|
||||
.placeholder {
|
||||
color: @subtext0;
|
||||
}
|
||||
|
||||
svg {
|
||||
fill: @text !important;
|
||||
}
|
||||
}
|
||||
|
||||
.HeaderMenu-toggle-bar {
|
||||
background-color: @text;
|
||||
}
|
||||
|
||||
.notification-indicator .mail-status {
|
||||
background-image: linear-gradient(@accent-color,
|
||||
darken(@accent-color, 5%));
|
||||
}
|
||||
|
||||
.CheckStep {
|
||||
.ansifg-r {
|
||||
color: var(--color-ansi-red);
|
||||
}
|
||||
|
||||
.ansifg-y {
|
||||
color: var(--color-ansi-yellow);
|
||||
}
|
||||
|
||||
.ansifg-g {
|
||||
color: var(--color-ansi-green);
|
||||
}
|
||||
|
||||
.ansifg-b {
|
||||
color: var(--color-ansi-blue);
|
||||
}
|
||||
|
||||
.ansifg-c {
|
||||
color: var(--color-ansi-cyan);
|
||||
}
|
||||
|
||||
.ansifg-m {
|
||||
color: var(--color-ansi-magenta);
|
||||
}
|
||||
|
||||
.ansifg-gr {
|
||||
color: var(--color-ansi-gray);
|
||||
}
|
||||
}
|
||||
|
||||
.js-activity-overview-graph .js-highlight-blob {
|
||||
fill: @accent-color;
|
||||
stroke: @accent-color;
|
||||
}
|
||||
|
||||
.subnav-link.selected {
|
||||
border-bottom-color: @accent-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("https://viewscreen.githubusercontent.com/markdown/mermaid") {
|
||||
[data-color-mode="auto"] {
|
||||
@media (prefers-color-scheme: light) {
|
||||
&[data-light-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
&[data-dark-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[data-color-mode="light"][data-light-theme="dark"],
|
||||
[data-color-mode="dark"][data-dark-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
background-color: @base;
|
||||
|
||||
--color-btn-text: @text;
|
||||
--color-btn-bg: @surface0;
|
||||
--color-btn-border: @surface1;
|
||||
--color-btn-hover-bg: @surface1;
|
||||
--color-btn-hover-border: @surface2;
|
||||
--color-btn-active-bg: @surface2;
|
||||
--color-btn-selected-bg: @surface2;
|
||||
--color-btn-counter-bg: @surface2;
|
||||
--color-btn-outline-text: @accent-color;
|
||||
--color-fg-muted: @subtext1;
|
||||
|
||||
#diagram {
|
||||
|
||||
.node rect,
|
||||
.node circle,
|
||||
.node ellipse,
|
||||
.node polygon,
|
||||
.node path {
|
||||
fill: fade(@accent-color, 10%);
|
||||
stroke: @accent-color;
|
||||
}
|
||||
|
||||
.label text,
|
||||
span,
|
||||
p {
|
||||
fill: @text;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
.flowchart-link,
|
||||
.marker {
|
||||
stroke: @subtext0;
|
||||
fill: @subtext0;
|
||||
}
|
||||
|
||||
.edgeLabel {
|
||||
background-color: @crust;
|
||||
}
|
||||
}
|
||||
|
||||
.octicon {
|
||||
fill: var(--color-fg-muted) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document regexp("https:\/\/notebooks\.githubusercontent\.com\/view\/ipynb.*") {
|
||||
:root {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup =paradisa, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
--jp-border-color0: var(--color-scale-gray-7);
|
||||
--jp-border-color1: var(--color-scale-gray-7);
|
||||
--jp-border-color2: var(--color-scale-gray-8);
|
||||
--jp-border-color3: var(--color-scale-gray-9);
|
||||
--jp-ui-font-color0: @text;
|
||||
--jp-ui-font-color1: fadeout(@text, 13%);
|
||||
--jp-ui-font-color2: fadeout(@text, 46%);
|
||||
--jp-ui-font-color3: fadeout(@text, 72%);
|
||||
--jp-ui-inverse-font-color0: @crust;
|
||||
--jp-ui-inverse-font-color1: fadeout(@crust, 20%);
|
||||
--jp-ui-inverse-font-color2: fadeout(@crust, 50%);
|
||||
--jp-ui-inverse-font-color3: fadeout(@crust, 70%);
|
||||
--jp-content-font-color0: @text;
|
||||
--jp-content-font-color1: @text;
|
||||
--jp-content-font-color2: fadeout(@text, 30%);
|
||||
--jp-content-font-color3: fadeout(@text, 50%);
|
||||
--jp-content-link-color: @sapphire;
|
||||
--jp-layout-color0: @base !important;
|
||||
--jp-layout-color1: var(--color-scale-gray-9);
|
||||
--jp-layout-color2: var(--color-scale-gray-8);
|
||||
--jp-layout-color3: var(--color-scale-gray-7);
|
||||
--jp-layout-color4: var(--color-scale-gray-6);
|
||||
--jp-inverse-layout-color0: var(--color-scale-white);
|
||||
--jp-inverse-layout-color1: var(--color-scale-white);
|
||||
--jp-inverse-layout-color2: var(--color-scale-gray-2);
|
||||
--jp-inverse-layout-color3: var(--color-scale-gray-4);
|
||||
--jp-inverse-layout-color4: var(--color-scale-gray-6);
|
||||
--jp-brand-color0: var(--color-scale-blue-7);
|
||||
--jp-brand-color1: var(--color-scale-blue-5);
|
||||
--jp-brand-color2: var(--color-scale-blue-3);
|
||||
--jp-brand-color3: var(--color-scale-blue-1);
|
||||
--jp-brand-color4: var(--color-scale-blue-0);
|
||||
--jp-accent-color0: var(--color-scale-green-7);
|
||||
--jp-accent-color1: var(--color-scale-green-5);
|
||||
--jp-accent-color2: var(--color-scale-green-3);
|
||||
--jp-accent-color3: var(--color-scale-green-1);
|
||||
--jp-warn-color0: var(--color-scale-orange-7);
|
||||
--jp-warn-color1: var(--color-scale-orange-5);
|
||||
--jp-warn-color2: var(--color-scale-orange-3);
|
||||
--jp-warn-color3: var(--color-scale-orange-1);
|
||||
--jp-error-color0: var(--color-scale-red-7);
|
||||
--jp-error-color1: var(--color-scale-red-5);
|
||||
--jp-error-color2: var(--color-scale-red-3);
|
||||
--jp-error-color3: var(--color-scale-red-1);
|
||||
--jp-success-color0: var(--color-scale-green-7);
|
||||
--jp-success-color1: var(--color-scale-green-5);
|
||||
--jp-success-color2: var(--color-scale-green-3);
|
||||
--jp-success-color3: var(--color-scale-green-1);
|
||||
--jp-info-color0: var(--color-scale-blue-7);
|
||||
--jp-info-color1: var(--color-scale-blue-5);
|
||||
--jp-info-color2: var(--color-scale-blue-3);
|
||||
--jp-info-color3: var(--color-scale-blue-1);
|
||||
--jp-cell-editor-border-color: var(--color-scale-gray-7);
|
||||
--jp-cell-editor-box-shadow: inset 0 0 2px var(--color-scale-blue-3);
|
||||
--jp-cell-prompt-not-active-font-color: fadeout(@text, 50%);
|
||||
--jp-cell-inprompt-font-color: var(--color-scale-blue-6);
|
||||
--jp-cell-outprompt-font-color: var(--color-scale-coral-6);
|
||||
--jp-notebook-multiselected-color: fadeout(@overlay2, 86%);
|
||||
--jp-rendermime-error-background: fadeout(@red, 82%);
|
||||
--jp-rendermime-table-row-background: var(--color-scale-gray-9);
|
||||
--jp-rendermime-table-row-hover-background: fadeout(@surface2, 86%);
|
||||
--jp-dialog-background: fadeout(@crust, 40%);
|
||||
--jp-toolbar-box-shadow: 0px 0px 2px 0px fadeout(@crust, 20%);
|
||||
--jp-input-box-shadow: inset 0 0 2px var(--color-scale-blue-3);
|
||||
--jp-input-background: var(--color-scale-gray-8);
|
||||
--jp-input-active-box-shadow-color: fadeout(@blue, 70%);
|
||||
--jp-editor-selected-focused-background: fadeout(@blue, 86%);
|
||||
--jp-mirror-editor-keyword-color: var(--color-scale-green-5);
|
||||
--jp-mirror-editor-atom-color: var(--color-scale-blue-3);
|
||||
--jp-mirror-editor-number-color: var(--color-scale-green-4);
|
||||
--jp-mirror-editor-def-color: var(--color-scale-blue-6);
|
||||
--jp-mirror-editor-variable-color: var(--color-scale-gray-3);
|
||||
--jp-mirror-editor-variable-2-color: var(--color-scale-blue-4);
|
||||
--jp-mirror-editor-variable-3-color: var(--color-scale-green-6);
|
||||
--jp-mirror-editor-punctuation-color: var(--color-scale-blue-4);
|
||||
--jp-mirror-editor-property-color: var(--color-scale-blue-4);
|
||||
--jp-mirror-editor-operator-color: @mauve;
|
||||
--jp-mirror-editor-comment-color: @subtext0;
|
||||
--jp-mirror-editor-string-color: @peach;
|
||||
--jp-mirror-editor-string-2-color: var(--color-scale-purple-3);
|
||||
--jp-mirror-editor-meta-color: @mauve;
|
||||
--jp-mirror-editor-qualifier-color: var(--color-scale-gray-5);
|
||||
--jp-mirror-editor-builtin-color: var(--color-scale-green-6);
|
||||
--jp-mirror-editor-bracket-color: var(--color-scale-gray-2);
|
||||
--jp-mirror-editor-tag-color: var(--color-scale-blue-7);
|
||||
--jp-mirror-editor-attribute-color: var(--color-scale-blue-7);
|
||||
--jp-mirror-editor-header-color: var(--color-scale-blue-5);
|
||||
--jp-mirror-editor-quote-color: var(--color-scale-green-3);
|
||||
--jp-mirror-editor-link-color: var(--color-scale-blue-7);
|
||||
--jp-mirror-editor-error-color: @red;
|
||||
--jp-mirror-editor-hr-color: var(--color-scale-gray-8);
|
||||
--jp-vega-background: var(--color-scale-gray-4);
|
||||
--jp-search-selected-match-background-color: @yellow;
|
||||
--jp-search-selected-match-color: @crust;
|
||||
--jp-icon-contrast-color0: var(--color-scale-purple-6);
|
||||
--jp-icon-contrast-color1: var(--color-scale-green-6);
|
||||
--jp-icon-contrast-color2: var(--color-scale-pink-6);
|
||||
--jp-icon-contrast-color3: var(--color-scale-blue-6);
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: {
|
||||
@rosewater: #BBB6B6;
|
||||
@flamingo: #A988B0;
|
||||
@pink: #A988B0;
|
||||
@mauve: #A988B0;
|
||||
@red: #B66467;
|
||||
@maroon: #B66467;
|
||||
@peach: #B66467;
|
||||
@yellow: #D9BC8C;
|
||||
@green: #8C977D;
|
||||
@teal: #8AA6A2;
|
||||
@sky: #8AA6A2;
|
||||
@sapphire: #8DA3B9;
|
||||
@blue: #8DA3B9;
|
||||
@lavender: #8DA3B9;
|
||||
@text: #E8E3E3;
|
||||
@subtext1: #BBB6B6;
|
||||
@subtext0: #BBB6B6;
|
||||
@overlay2: #424242;
|
||||
@overlay1: #424242;
|
||||
@overlay0: #424242;
|
||||
@surface2: #E8E3E3;
|
||||
@surface1: #424242;
|
||||
@surface0: #424242;
|
||||
@base: #151515;
|
||||
@mantle: #1F1F1F;
|
||||
@crust: #1F1F1F;
|
||||
}
|
||||
|
||||
;
|
||||
}
|
||||
967
gmail/gmail.user.css
Normal file
967
gmail/gmail.user.css
Normal file
|
|
@ -0,0 +1,967 @@
|
|||
/* ==UserStyle==
|
||||
@name Gmail paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/gmail/gmail.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Gmail
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain("mail.google.com") {
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
@crust-filter: @paradisa[@@lookup][@crust_filter];
|
||||
@text-filter: @paradisa[@@lookup][@text_filter];
|
||||
@yellow-filter: @paradisa[@@lookup][@yellow_filter];
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
|
||||
caret-color: @text;
|
||||
}
|
||||
|
||||
#input-styling {
|
||||
input,
|
||||
select,
|
||||
button {
|
||||
background-color: @mantle;
|
||||
color: @text;
|
||||
border-color: @surface0;
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
* {
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
/* Gmail logo */
|
||||
[src="https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_default_1x_r5.png"],
|
||||
[src="https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_dark_1x_r5.png"]
|
||||
{
|
||||
height: unset !important;
|
||||
width: unset !important;
|
||||
@svg: escape(
|
||||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="17.727 14.319 30 22.5" width="30" height="22.5"><path fill="@{blue}" d="M19.773 36.819h4.773V25.227l-6.819-5.114v14.659a2.044 2.044 0 0 0 2.045 2.045"/><path fill="@{green}" d="M40.909 36.819h4.773a2.044 2.044 0 0 0 2.045-2.045v-14.66l-6.819 5.114"/><path fill="@{yellow}" d="M40.909 16.364v8.864l6.819-5.114v-2.727c0-2.529-2.888-3.971-4.909-2.455"/><path fill="@{red}" d="M24.545 25.227v-8.863l8.181 6.136 8.181-6.136v8.864l-8.181 6.136m-15-13.977v2.727l6.819 5.114v-8.864l-1.909-1.431c-2.025-1.517-4.91-.075-4.91 2.455"/></svg>'
|
||||
);
|
||||
content: url("data:image/svg+xml,@{svg}");
|
||||
}
|
||||
|
||||
/* Tooltips */
|
||||
.T-ays-iP,
|
||||
.gb_Ac {
|
||||
background-color: @crust;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
|
||||
/* Solid primary */
|
||||
.T-I-atl {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
}
|
||||
|
||||
/* Transparent primary */
|
||||
.l0,
|
||||
div.b8 .a8k,
|
||||
.bAo > .ad {
|
||||
color: @accent-color;
|
||||
|
||||
&::before {
|
||||
background-color: @accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
/* Transparent secondary */
|
||||
.bs0 > .acM,
|
||||
.bti > .btg,
|
||||
.a8Y > .T-I-ax7 {
|
||||
color: @text;
|
||||
|
||||
/* Disabled */
|
||||
&.acN {
|
||||
color: @subtext0;
|
||||
}
|
||||
|
||||
&:hover::before {
|
||||
background-color: @overlay2;
|
||||
}
|
||||
}
|
||||
|
||||
/* Header and sidebars */
|
||||
.w-asV,
|
||||
.bkL,
|
||||
.bhZ.bym,
|
||||
.bhZ.bjB,
|
||||
.bhZ.bym.baA {
|
||||
background-color: @mantle;
|
||||
}
|
||||
/* Header icons */
|
||||
.gb_Lc svg,
|
||||
.gb_Pc.gb_Uc svg,
|
||||
.gb_Lc .gb_rd .gb_sd,
|
||||
.gb_Lc .gb_rd .gb_Kc,
|
||||
.gb_Lc .gb_rd .gb_ud,
|
||||
.gb_Pc.gb_Uc .gb_sd {
|
||||
color: @text;
|
||||
}
|
||||
/* Search mail input */
|
||||
.gb_Lc .gb_hd {
|
||||
background-color: @crust;
|
||||
|
||||
.gb_je,
|
||||
svg {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
/* Active search / filter modal */
|
||||
.gssb_c {
|
||||
/* Icons */
|
||||
button svg,
|
||||
.asor {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* Recent searches */
|
||||
.aRp,
|
||||
.gssb_e,
|
||||
.gssb_m {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Hovered recent searches */
|
||||
.gssb_i {
|
||||
background-color: @surface0;
|
||||
|
||||
> .gssb_a {
|
||||
border-left-color: @accent-color;
|
||||
}
|
||||
|
||||
/* X icon */
|
||||
.gsaq_b {
|
||||
filter: @text-filter;
|
||||
}
|
||||
}
|
||||
|
||||
.aSP,
|
||||
.gssb_e {
|
||||
border-color: @surface2;
|
||||
}
|
||||
|
||||
/* Separator */
|
||||
.gssb_l {
|
||||
background-color: @surface0;
|
||||
}
|
||||
|
||||
/* Search results */
|
||||
|
||||
/* Icons */
|
||||
.gsoi_0,
|
||||
.asor_o,
|
||||
.gsoi_msra {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* People involved */
|
||||
.asor_e {
|
||||
color: @subtext0;
|
||||
}
|
||||
}
|
||||
/* Pill filters */
|
||||
.H2 {
|
||||
background-color: @base;
|
||||
border-color: @surface0;
|
||||
color: @subtext1;
|
||||
fill: @subtext1;
|
||||
|
||||
&:hover {
|
||||
background-color: @mantle;
|
||||
}
|
||||
|
||||
&.bws {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
fill: @crust;
|
||||
|
||||
.HV {
|
||||
filter: @crust-filter;
|
||||
}
|
||||
|
||||
&:hover .H1 {
|
||||
background-color: darken(@accent-color, 5%);
|
||||
}
|
||||
}
|
||||
}
|
||||
.aqc .H2 {
|
||||
border-color: @text;
|
||||
color: @text;
|
||||
|
||||
&.bws {
|
||||
background-color: @surface2;
|
||||
color: @mantle;
|
||||
}
|
||||
}
|
||||
/* Advanced search/filters modal */
|
||||
.ZF-z6,
|
||||
.ZF-zT,
|
||||
.ZF-Av .lJ,
|
||||
.ZF-Av .lN {
|
||||
background-color: @base;
|
||||
|
||||
&,
|
||||
.boo > .ZG,
|
||||
.boo .aQl > .J-JN-M-I-Jm,
|
||||
.boo .aaa > .J-JN-M-I-Jm,
|
||||
.boo .ZE > .J-JN-M-I-Jm {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
.btl.acK,
|
||||
.btn::before {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* Text inputs */
|
||||
.nr {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
|
||||
&:focus {
|
||||
box-shadow: inset 0 -1px 0 0 @accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
/* Calendar input */
|
||||
.bs5::after {
|
||||
filter: @text-filter;
|
||||
}
|
||||
.J-JB-KA,
|
||||
.J-JB-KA-JS,
|
||||
.J-JB-KA-Jk,
|
||||
.J-JB-KA-LG {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
border-color: @surface0;
|
||||
|
||||
/* Past days */
|
||||
.J-JB-KA-Ku-Kk {
|
||||
color: @subtext0;
|
||||
}
|
||||
/* Future days */
|
||||
.J-JB-KA-a1R-JB.J-JB-KA-LH,
|
||||
.J-JB-KA-a1R-JB.J-JB-KA-Ku-Kk,
|
||||
.J-JB-KA-JB.J-JB-KA-a1R-JB {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Hovered day */
|
||||
.J-JB-KA-JB:not(.J-JB-KA-K8, .J-JB-KA-KO):hover {
|
||||
color: @crust;
|
||||
|
||||
&::before {
|
||||
background-color: fade(@accent-color, 70%);
|
||||
}
|
||||
}
|
||||
|
||||
/* Selected day */
|
||||
.J-JB-KA-KO {
|
||||
color: @crust;
|
||||
|
||||
&::before {
|
||||
background-color: @accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
/* Unselected today */
|
||||
.J-JB-KA-K8 {
|
||||
color: @crust;
|
||||
|
||||
&::before {
|
||||
background-color: @overlay2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Checkbox inputs */
|
||||
.bs1 + .bs3,
|
||||
.btj + .aD {
|
||||
color: @text;
|
||||
|
||||
&::before {
|
||||
filter: @text-filter;
|
||||
}
|
||||
}
|
||||
|
||||
/* Dropdown/select inputs */
|
||||
.J-JN-M-I {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
/* Sidebar selected item */
|
||||
.TK .TO.nZ:active,
|
||||
.TK .TO.ol:active,
|
||||
.TK .TO.nZ,
|
||||
.TK .TO.ol,
|
||||
.byl .TK .nZ.aBP,
|
||||
.byl .TK .nZ.aS3,
|
||||
.byl .TK .nZ.aS4,
|
||||
.byl .TK .nZ.aS5,
|
||||
.byl .TK .nZ.aS6,
|
||||
.VDSZAf.H5o3mc {
|
||||
background-color: @surface0;
|
||||
}
|
||||
.TO.NQ,
|
||||
.n6 .ah9:hover,
|
||||
.n6 .ah9.aiu:hover,
|
||||
.n6 .ah9:focus,
|
||||
.TK .TO:active,
|
||||
.n6 .ah9.aiu:active,
|
||||
.CL:hover,
|
||||
.H5o3mc:not(.VDSZAf):hover,
|
||||
.CL.NQ,
|
||||
.H5o3mc:not(.VDSZAf).NQ {
|
||||
background-color: @surface1;
|
||||
}
|
||||
.byl .TK .TO.nZ > .aHS-bnt .n0,
|
||||
.TK .nZ > .aHS-bnt .bsU,
|
||||
.byl .TK .nZ.aS3 .nU > .n0,
|
||||
.TK .nZ.aS3 .bsU,
|
||||
.byl .TK .nZ.aS4 .nU > .n0,
|
||||
.TK .nZ.aS4 .bsU,
|
||||
.byl .TK .nZ.aS5 .nU > .n0,
|
||||
.TK .nZ.aS5 .bsU,
|
||||
.byl .TK .nZ.aS6 .nU > .n0,
|
||||
.TK .nZ.aS6 .bsU,
|
||||
.TK .TO.nZ .nU > .n0,
|
||||
.TK .ol.NQ .nU > .n0,
|
||||
.TK .TO.ol .nU > .n0,
|
||||
.TK .nZ .bsU,
|
||||
.TK .ol .bsU,
|
||||
.VDSZAf.H5o3mc > .Q7,
|
||||
.TO .nU > .n0,
|
||||
.TO.NQ .nU > .n0,
|
||||
.TO.nZ .nU > .n0,
|
||||
.ah9 > .CJ,
|
||||
.n3 > .CL > .CK,
|
||||
.aAv,
|
||||
.bsU {
|
||||
color: @text;
|
||||
}
|
||||
/* Icons */
|
||||
.nZ > .TN.aHS-bnt .qj,
|
||||
.TO:not(.nZ) > .TN > .qj:not([style*="background-color"]),
|
||||
.n6 .n4 .G-asx,
|
||||
.aAw .aAu,
|
||||
.pM,
|
||||
.TO.nZ > .TN > .qj,
|
||||
.n3 .CL::before {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* Compose email button */
|
||||
.z0 > .L3 {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
|
||||
&:focus {
|
||||
background-color: @text;
|
||||
}
|
||||
}
|
||||
.WR .z0 > .L3::before,
|
||||
.WR.anZ .z0 > .L3::before {
|
||||
filter: @crust-filter;
|
||||
}
|
||||
|
||||
/* Top section of inbox */
|
||||
.bkK > .nH {
|
||||
background-color: @surface0;
|
||||
|
||||
/* Icons */
|
||||
.bzn,
|
||||
.aqJ .amJ,
|
||||
.adg .adk {
|
||||
filter: @text-filter;
|
||||
}
|
||||
}
|
||||
/* Inbox categories */
|
||||
.aKx > .aKz {
|
||||
color: @text;
|
||||
}
|
||||
/* Icons */
|
||||
.aAy > div {
|
||||
filter: @text-filter;
|
||||
}
|
||||
/* Currently selected category */
|
||||
.J-KU-KO::before {
|
||||
background-color: @text;
|
||||
}
|
||||
/* Inbox categories hover */
|
||||
.aRz.J-KU:hover {
|
||||
background-color: @surface1;
|
||||
}
|
||||
/* Email count / pagination */
|
||||
div[aria-label="Show more messages"] {
|
||||
.Dj {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
&::before {
|
||||
background-color: @text;
|
||||
}
|
||||
}
|
||||
.h0 {
|
||||
color: @subtext1;
|
||||
}
|
||||
/* Inbox footer */
|
||||
.md.mj,
|
||||
.aeU .ma,
|
||||
.ma .mb,
|
||||
.ae3 .l6,
|
||||
.l9,
|
||||
.l8,
|
||||
.aiD {
|
||||
color: @subtext1;
|
||||
}
|
||||
/* Storage progress bar */
|
||||
.aiC {
|
||||
background-color: @overlay0;
|
||||
|
||||
.aiA {
|
||||
background-color: @subtext0;
|
||||
}
|
||||
}
|
||||
/* External link icon */
|
||||
.aiz {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* Read emails */
|
||||
.yO {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
|
||||
box-shadow: inset 0 -1px 0 0 @surface0;
|
||||
|
||||
&:hover {
|
||||
box-shadow:
|
||||
inset 1px 0 0 @surface0,
|
||||
inset -1px 0 0 @surface0,
|
||||
0 0 4px 0 @surface1,
|
||||
0 0 6px 2px @surface1;
|
||||
}
|
||||
}
|
||||
/* Read email text */
|
||||
.zE {
|
||||
color: @text;
|
||||
}
|
||||
// Select icon
|
||||
.xY > .T-Jo,
|
||||
td.apU > .T-KT.aXw::before,
|
||||
// Important icon
|
||||
.pG .a9q,
|
||||
// Delete/trash icon
|
||||
.aqN,
|
||||
// Hover action icons
|
||||
.bqY li {
|
||||
filter: @text-filter;
|
||||
}
|
||||
/* Important icon filled, star icon filled */
|
||||
.ha .a9q.pH,
|
||||
.a9q.pH,
|
||||
.aoj,
|
||||
td.apU > .T-KT.T-KT-Jp::before {
|
||||
filter: @yellow-filter;
|
||||
}
|
||||
.pG:hover > .a9q::before {
|
||||
background-color: fade(@yellow, 30%);
|
||||
}
|
||||
/* Read email dates */
|
||||
.yO > .xW {
|
||||
color: @subtext0;
|
||||
}
|
||||
/* Read email summary truncated */
|
||||
.y2 {
|
||||
color: @subtext1;
|
||||
}
|
||||
/* Selected unread emails */
|
||||
.x7 {
|
||||
background-color: @accent-color;
|
||||
color: @mantle;
|
||||
|
||||
/* Dates */
|
||||
.xW {
|
||||
color: @crust;
|
||||
}
|
||||
|
||||
// Select icon
|
||||
.xY > .T-Jo,
|
||||
// Star icon
|
||||
td.apU > .T-KT.aXw::before,
|
||||
// Important icon
|
||||
.pG .a9q,
|
||||
// Delete/trash icon
|
||||
.aqN,
|
||||
// Hover action icons
|
||||
.bqY li {
|
||||
filter: @crust-filter;
|
||||
}
|
||||
}
|
||||
/* Unsubscribe button */
|
||||
.aOd.T-I {
|
||||
color: @text;
|
||||
box-shadow: inset 0 0 0 1px @surface2;
|
||||
}
|
||||
/* Draft text */
|
||||
.boq {
|
||||
color: @red;
|
||||
}
|
||||
/* No drafts message, trash 30 days message */
|
||||
.TD,
|
||||
.Tm .ya {
|
||||
background-color: @surface1;
|
||||
color: @text;
|
||||
}
|
||||
/* You could lose access banner */
|
||||
.GR {
|
||||
background-color: @base;
|
||||
|
||||
/* Primary text */
|
||||
.GX {
|
||||
color: @text;
|
||||
}
|
||||
/* Subtext */
|
||||
.GT {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Dismiss button */
|
||||
.GW {
|
||||
color: @text;
|
||||
|
||||
&::before {
|
||||
background-color: @text;
|
||||
}
|
||||
}
|
||||
/* Add recovery info button */
|
||||
.GV {
|
||||
color: @accent-color;
|
||||
|
||||
&::before {
|
||||
background-color: @accent-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
/* Attachments chips */
|
||||
.brc {
|
||||
box-shadow: inset 0 0 0 1px @surface0;
|
||||
color: @text;
|
||||
|
||||
&:hover {
|
||||
background-color: @surface0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Floating menu */
|
||||
.J-M,
|
||||
.OO.Pa {
|
||||
background-color: @surface1;
|
||||
|
||||
/* Menu section header */
|
||||
.J-awr,
|
||||
.asc {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Menu item */
|
||||
|
||||
.J-N,
|
||||
.J-Ks-KO .J-N-Jz,
|
||||
.J-N-JT .J-N-Jz,
|
||||
.J-N-JW .J-N-Jz,
|
||||
.J-LC,
|
||||
.J-JK,
|
||||
.bmz {
|
||||
color: @text;
|
||||
}
|
||||
/* Disabled */
|
||||
.J-N-JE .J-N-atj,
|
||||
.J-N-JE .J-N-Jz {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
|
||||
/* Checkmark, arrow, checkbox, star, calendar icon */
|
||||
.J-Ks-KO .J-N-Jo,
|
||||
.asi .J-Ks-KO::before,
|
||||
.J-Ph-hFsbo,
|
||||
.J-LC-Jo,
|
||||
.bi4 > .T-KT:not(.T-KT-Jp, .byM)::before,
|
||||
.aaA.mYVwse,
|
||||
.J-N-JX {
|
||||
filter: @text-filter;
|
||||
}
|
||||
.bmz.bjF::before {
|
||||
border-color: @subtext0;
|
||||
}
|
||||
|
||||
/* Hovered menu item */
|
||||
.J-N-JT,
|
||||
.J-N-JW,
|
||||
.J-LC-JT,
|
||||
.J-LC-JW,
|
||||
.J-JK-JT,
|
||||
.J-JK-JW,
|
||||
.bmz.bk5 {
|
||||
background-color: @surface2;
|
||||
border-color: @overlay1;
|
||||
}
|
||||
|
||||
/* Menu section divider */
|
||||
.J-Kh {
|
||||
border-top-color: @surface2;
|
||||
}
|
||||
}
|
||||
/* Modal search input */
|
||||
.agd .J-M-JJ input {
|
||||
background-color: @surface1;
|
||||
color: @text;
|
||||
}
|
||||
.bqf {
|
||||
box-shadow: inset 0 -2px 0 0 @surface2;
|
||||
|
||||
&:focus {
|
||||
box-shadow: inset 0 -2px 0 0 @accent-color;
|
||||
}
|
||||
}
|
||||
/* Magnifying glass icon */
|
||||
.A0 {
|
||||
filter: @text-filter;
|
||||
}
|
||||
/* Edit label modal */
|
||||
div.Kj-JD {
|
||||
background-color: @base;
|
||||
|
||||
/* Edit label text */
|
||||
span.Kj-JD-K7-K0 {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Close X icon */
|
||||
span.Kj-JD-K7-Jq::after {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
#input-styling();
|
||||
|
||||
/* Input labels */
|
||||
div.Kj-JD-Jz {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Cancel button */
|
||||
div.Kj-JD-Jl > button,
|
||||
.bBh .Kj-JD-Jl > .J-at1-auR {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Save button */
|
||||
div.Kj-JD-Jl > button.J-at1-atl,
|
||||
div.Kj-JD-Jl > button.J-at1-auR {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
}
|
||||
}
|
||||
|
||||
/* Toast notifications */
|
||||
.bAp.b8.UC .vh {
|
||||
background-color: @crust;
|
||||
color: @text;
|
||||
}
|
||||
/* Close icon */
|
||||
.b8 .bBe .bBf {
|
||||
filter: @text-filter;
|
||||
}
|
||||
|
||||
/* Compose mail window */
|
||||
/* Top header bar */
|
||||
.Hy.Hy .m,
|
||||
.IG {
|
||||
background-color: @mantle;
|
||||
|
||||
.Hp,
|
||||
.zu,
|
||||
.H,
|
||||
.Iy .az9 {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
.Hm img,
|
||||
.SB,
|
||||
.b7 .mK,
|
||||
.bAm .aaq .mK,
|
||||
.Un .mK,
|
||||
.HX .mK,
|
||||
.HQ .Un::after {
|
||||
filter: @text-filter;
|
||||
}
|
||||
}
|
||||
.aaZ,
|
||||
.Ap,
|
||||
.Am,
|
||||
.aDg > .aDj,
|
||||
.aoP .Ar,
|
||||
.wO,
|
||||
.aoT,
|
||||
.agP,
|
||||
.aGb,
|
||||
.GQ {
|
||||
color: @text;
|
||||
caret-color: @text;
|
||||
|
||||
&,
|
||||
&::before {
|
||||
background: @base;
|
||||
}
|
||||
}
|
||||
.gQ,
|
||||
.gO,
|
||||
.oL {
|
||||
color: @subtext0;
|
||||
}
|
||||
/* Bottom toolbar icons */
|
||||
.aaA,
|
||||
.btC .dv,
|
||||
.btC .og.T-I-J3,
|
||||
.btC .J-N-JX.og.T-I-J3,
|
||||
.btC .Y1,
|
||||
.btC .Xv.T-I.J-JN-M-I > .J-JN-M-I-JG,
|
||||
.J-JN-M-I-JG,
|
||||
.J-Z-M-I-J6-H > .J-Z-M-I-JG {
|
||||
filter: @text-filter;
|
||||
}
|
||||
/* Floating toolbar (expanded window) */
|
||||
.J-Z {
|
||||
background-color: @mantle;
|
||||
|
||||
.J-Z-I,
|
||||
.J-Z-M-I {
|
||||
color: @subtext1;
|
||||
}
|
||||
}
|
||||
/* Send button */
|
||||
.gU .v7.T-I:not(.btz),
|
||||
.gU .hG:not(.v6) {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
}
|
||||
.hG > .G-asx,
|
||||
.SI .hG > .G-asx {
|
||||
filter: @crust-filter;
|
||||
}
|
||||
/* Contact autofill */
|
||||
.afC,
|
||||
.bvx {
|
||||
background: @mantle;
|
||||
|
||||
/* Contact list item */
|
||||
.agJ {
|
||||
.aL8,
|
||||
.aXS {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: @base;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
--pkw-background: @mantle;
|
||||
--pkw-outline: @surface0;
|
||||
--pkw-outline-variant: @surface0;
|
||||
--pkw-on-surface-variant: @text;
|
||||
/* Contact chip */
|
||||
.agh,
|
||||
.bbV {
|
||||
background: @base;
|
||||
|
||||
.afV {
|
||||
background: @base;
|
||||
color: @text;
|
||||
|
||||
&:hover {
|
||||
background: @surface0;
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Settings */
|
||||
.dt {
|
||||
color: @text;
|
||||
}
|
||||
/* Navigation header */
|
||||
.v {
|
||||
/* Tabs */
|
||||
.fY,
|
||||
.f1 {
|
||||
background-color: @surface0;
|
||||
|
||||
.f0 {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
/* Currently selected tab */
|
||||
.fZ {
|
||||
box-shadow: inset 0 -2px 0 0 @accent-color;
|
||||
}
|
||||
}
|
||||
/* Main panel */
|
||||
.r4 {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
|
||||
/* Dividers */
|
||||
.r7 td,
|
||||
.Jb .J0:not(:last-child) {
|
||||
border-bottom-color: @surface0;
|
||||
}
|
||||
|
||||
/* Links */
|
||||
.r7 .e,
|
||||
.sA,
|
||||
.r4 .e,
|
||||
.el {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
#input-styling();
|
||||
.qK,
|
||||
.qL {
|
||||
background-color: @mantle;
|
||||
}
|
||||
.nr,
|
||||
.Ar {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
border-color: @surface0 !important;
|
||||
}
|
||||
/* Some buttons */
|
||||
.Uu {
|
||||
box-shadow: inset 0 0 0 1px @surface0;
|
||||
color: @accent-color;
|
||||
}
|
||||
}
|
||||
/* Labels page */
|
||||
.alO {
|
||||
background-color: @base;
|
||||
color: @text;
|
||||
|
||||
.rb {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
/* Table items */
|
||||
.To.Ze {
|
||||
background-color: @surface0;
|
||||
}
|
||||
|
||||
/* Links */
|
||||
.alP {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
/* Dividers */
|
||||
.rZ {
|
||||
background-color: @surface0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Confirm popup modal */
|
||||
div[aria-modal="true"] {
|
||||
--gm3-dialog-refactored-container-color: @base;
|
||||
--gm3-dialog-refactored-supporting-text-color: @text;
|
||||
--gm3-dialog-refactored-headline-color: @text;
|
||||
|
||||
/* Buttons */
|
||||
[data-mdc-dialog-action="ok"] {
|
||||
background-color: @accent-color;
|
||||
--gm3-button-text-label-text-color: @crust;
|
||||
--gm3-button-text-hover-label-text-color: @crust;
|
||||
--gm3-button-text-pressed-label-text-color: @crust;
|
||||
}
|
||||
|
||||
[data-mdc-dialog-action="cancel"] {
|
||||
--gm3-button-text-label-text-color: @subtext1;
|
||||
--gm3-button-text-hover-label-text-color: @text;
|
||||
--gm3-button-text-focus-label-text-color: @text;
|
||||
--gm3-button-text-pressed-label-text-color: @text;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background-color: @surface0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @text_filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(985%) hue-rotate(191deg) brightness(96%) contrast(99%); @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; @crust_filter: brightness(0) saturate(100%) invert(3%) sepia(12%) saturate(3951%) hue-rotate(206deg) brightness(96%) contrast(92%); };
|
||||
}
|
||||
2302
google/google.user.css
Normal file
2302
google/google.user.css
Normal file
File diff suppressed because it is too large
Load diff
839
instagram/instagram.user.css
Normal file
839
instagram/instagram.user.css
Normal file
File diff suppressed because one or more lines are too long
1366
mangalib/mangalib.user.css
Normal file
1366
mangalib/mangalib.user.css
Normal file
File diff suppressed because it is too large
Load diff
191
modrinth/modrinth.user.css
Normal file
191
modrinth/modrinth.user.css
Normal file
|
|
@ -0,0 +1,191 @@
|
|||
/* ==UserStyle==
|
||||
@name Modrinth paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/modrinth/modrinth.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Modrinth
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain("modrinth.com") {
|
||||
.dark-mode,
|
||||
.oled-mode {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
@shadow: if(@lookup = latte, #dbdfef, #010409);
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
* {
|
||||
--text-color: @text;
|
||||
--color-base: @text;
|
||||
--color-bg: @crust;
|
||||
--color-secondary: @subtext0;
|
||||
--color-ad-raised: @surface2;
|
||||
--color-ad: @surface1;
|
||||
--color-ad-highlight: @teal;
|
||||
--color-brand: @accent-color;
|
||||
--color-brand-green: @green;
|
||||
--color-button-bg-active: @overlay0;
|
||||
--color-button-bg-hover: @surface1;
|
||||
--color-button-bg: @surface0;
|
||||
--color-button-text-hover: @text;
|
||||
--color-button-text: @subtext1;
|
||||
--color-button-text-active: @text;
|
||||
--color-divider: @surface0;
|
||||
--color-heading: @text;
|
||||
--color-icon: @text;
|
||||
--color-link-active: @teal;
|
||||
--color-link-hover: @sky;
|
||||
--color-link: @sapphire;
|
||||
--color-raised-bg: @base;
|
||||
--color-blue: @sapphire;
|
||||
--color-special-blue: @sapphire;
|
||||
--color-orange: @peach;
|
||||
--color-special-orange: @peach;
|
||||
--color-purple: @mauve;
|
||||
--color-special-purple: @mauve;
|
||||
--color-red: @red;
|
||||
--color-gray: @subtext0;
|
||||
--color-special-gray: @subtext0;
|
||||
--color-green: @green;
|
||||
--color-text: @subtext1;
|
||||
--color-text-dark: @text;
|
||||
--color-text-inactive: @overlay1;
|
||||
--color-brand-highlight: @surface0;
|
||||
--color-brand-inverted: @shadow;
|
||||
--color-table-alternate-row: @crust;
|
||||
--color-table-border: @overlay0;
|
||||
--color-contrast: @text;
|
||||
--color-accent-contrast: @mantle;
|
||||
--color-brand-shadow: @accent-color;
|
||||
--color-warning-banner-side: @red;
|
||||
--color-warning-banner-bg: fade(@red, 10%);
|
||||
--color-warning-banner-text: @text;
|
||||
--color-platform-fabric: @pink;
|
||||
--color-platform-quilt: @mauve;
|
||||
--color-platform-forge: @blue;
|
||||
--color-platform-neoforge: @peach;
|
||||
--color-platform-liteloader: @sky;
|
||||
--color-platform-bukkit: @peach;
|
||||
--color-platform-bungeecord: @yellow;
|
||||
--color-platform-folia: @green;
|
||||
--color-platform-paper: @red;
|
||||
--color-platform-purpur: @lavender;
|
||||
--color-platform-spigot: @yellow;
|
||||
--color-platform-velocity: @teal;
|
||||
--color-platform-waterfall: @blue;
|
||||
--color-platform-sponge: @yellow;
|
||||
--color-button-border: fade(@crust, 20%);
|
||||
--color-tooltip-bg: @surface1;
|
||||
--color-tooltip-text: @subtext1;
|
||||
--landing-green-label: @accent-color;
|
||||
--landing-green-label-bg: fade(@accent-color, 10%);
|
||||
--landing-blue-label: @blue;
|
||||
--landing-color-heading: @text;
|
||||
--landing-color-subheading: @subtext0;
|
||||
--landing-border-color: @overlay0;
|
||||
--landing-blue-label-bg: fade(@blue, 10%);
|
||||
--landing-border-gradient: linear-gradient(
|
||||
to bottom right,
|
||||
@overlay0,
|
||||
@surface2
|
||||
);
|
||||
}
|
||||
// homepage
|
||||
.blob-demonstration,
|
||||
.blob-demonstration::after {
|
||||
background: linear-gradient(
|
||||
0deg,
|
||||
fade(@accent-color, 20%),
|
||||
fade(@base, 10%)
|
||||
) !important;
|
||||
}
|
||||
.logo-banner path {
|
||||
fill: @accent-color !important;
|
||||
}
|
||||
.logo-banner > svg > g > rect {
|
||||
display: none;
|
||||
}
|
||||
|
||||
[tabindex="0"]:focus-visible,
|
||||
a:focus-visible,
|
||||
button:focus-visible {
|
||||
outline-color: @accent-color;
|
||||
}
|
||||
|
||||
.BDVE3s9MFQttmbMUeYup-2 a b,
|
||||
.BDVE3s9MFQttmbMUeYup-2 a strong {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
// dropdown icon
|
||||
.multiselect__select::before {
|
||||
border-color: @text transparent transparent;
|
||||
color: @text;
|
||||
}
|
||||
// header button hover
|
||||
.btn-wrapper:hover {
|
||||
a,
|
||||
button {
|
||||
--tw-brightness: none !important;
|
||||
}
|
||||
}
|
||||
.nuxt-loading-indicator {
|
||||
background: @accent-color!important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
367
nixos/nixos-wiki.user.css
Normal file
367
nixos/nixos-wiki.user.css
Normal file
|
|
@ -0,0 +1,367 @@
|
|||
/* ==UserStyle==
|
||||
@name NixOS Wiki paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/nixos/nixos-wiki.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for NixOS Wiki
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain('nixos.wiki') {
|
||||
@import url("https://python.paradisa.com/pygments/paradisa-variables.important.css");
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
--ctp-rosewater: @rosewater;
|
||||
--ctp-flamingo: @flamingo;
|
||||
--ctp-pink: @pink;
|
||||
--ctp-mauve: @mauve;
|
||||
--ctp-red: @red;
|
||||
--ctp-maroon: @maroon;
|
||||
--ctp-peach: @peach;
|
||||
--ctp-yellow: @yellow;
|
||||
--ctp-green: @green;
|
||||
--ctp-teal: @teal;
|
||||
--ctp-sky: @sky;
|
||||
--ctp-sapphire: @sapphire;
|
||||
--ctp-blue: @blue;
|
||||
--ctp-lavender: @lavender;
|
||||
--ctp-text: @text;
|
||||
--ctp-subtext1: @subtext1;
|
||||
--ctp-subtext0: @subtext0;
|
||||
--ctp-overlay2: @overlay2;
|
||||
--ctp-overlay1: @overlay1;
|
||||
--ctp-overlay0: @overlay0;
|
||||
--ctp-surface2: @surface2;
|
||||
--ctp-surface1: @surface1;
|
||||
--ctp-surface0: @surface0;
|
||||
--ctp-base: @base;
|
||||
--ctp-mantle: @mantle;
|
||||
--ctp-crust: @crust;
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&[data-darkreader-scheme="dark"] body::before {
|
||||
content: "Please turn off DarkReader for this domain when paradisa for NixOS Wiki is active.";
|
||||
background: @red;
|
||||
box-shadow:
|
||||
0 4px 16px fade(@crust, 10%),
|
||||
0 8px 32px fade(@crust, 5%);
|
||||
color: @crust;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 99999;
|
||||
max-width: 24rem;
|
||||
padding: 0.75rem;
|
||||
margin: 0.5rem;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: @base;
|
||||
}
|
||||
hr {
|
||||
border-color: @surface2;
|
||||
}
|
||||
.navbar-default {
|
||||
color: @text;
|
||||
background-color: @mantle !important;
|
||||
background-image: none !important;
|
||||
border-color: transparent !important;
|
||||
|
||||
.navbar-brand {
|
||||
color: @blue;
|
||||
&:hover {
|
||||
color: @sky;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
a {
|
||||
color: @text !important;
|
||||
&:hover {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
&.nav.open > a,
|
||||
ul {
|
||||
background-color: @surface0 !important;
|
||||
background-image: none !important;
|
||||
a:hover {
|
||||
background-color: fade(@surface1, 50%) !important;
|
||||
background-image: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.active > a {
|
||||
color: @crust !important;
|
||||
&:hover {
|
||||
color: @base !important;
|
||||
}
|
||||
background: @blue !important;
|
||||
}
|
||||
}
|
||||
|
||||
.search-query.form-control {
|
||||
color: @text;
|
||||
background-color: @surface0;
|
||||
border-color: @surface0;
|
||||
}
|
||||
|
||||
* {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
a {
|
||||
color: @blue;
|
||||
&:hover {
|
||||
color: @sky;
|
||||
}
|
||||
&.new {
|
||||
color: @red;
|
||||
&:hover {
|
||||
color: @maroon;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.panel {
|
||||
background-color: @mantle;
|
||||
border-color: @mantle;
|
||||
.panel-heading {
|
||||
color: @text;
|
||||
background-color: @surface0 !important;
|
||||
border-bottom-color: @surface2;
|
||||
img {
|
||||
& when not (@lookup = latte) {
|
||||
filter: invert(100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
color: @crust;
|
||||
background-color: @blue !important;
|
||||
background-image: none !important;
|
||||
border-color: @crust !important;
|
||||
&:hover {
|
||||
color: @crust !important;
|
||||
background-color: @sky !important;
|
||||
background-image: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
&,
|
||||
* {
|
||||
color: @text;
|
||||
border-color: @overlay0 !important;
|
||||
background-color: @mantle;
|
||||
}
|
||||
th {
|
||||
&,
|
||||
* {
|
||||
background-color: @surface0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
blockquote,
|
||||
cite {
|
||||
border-left-color: @pink !important;
|
||||
}
|
||||
|
||||
cite a {
|
||||
color: @pink;
|
||||
&:hover {
|
||||
color: @rosewater;
|
||||
}
|
||||
}
|
||||
|
||||
pre,
|
||||
code {
|
||||
box-shadow: none !important;
|
||||
background-color: @mantle;
|
||||
border-color: @crust;
|
||||
}
|
||||
pre {
|
||||
color: @text;
|
||||
}
|
||||
code {
|
||||
color: @rosewater;
|
||||
}
|
||||
|
||||
*[style*="background-color: #C1E5FF"] {
|
||||
color: @text !important;
|
||||
background-color: fade(@blue, 15%) !important;
|
||||
border-color: @blue !important;
|
||||
}
|
||||
|
||||
*[style*="background-color: #FFD0B7"] {
|
||||
color: @text !important;
|
||||
background-color: fade(@peach, 15%) !important;
|
||||
border-color: @peach !important;
|
||||
}
|
||||
|
||||
*[style*="background: #F6F6F6"] {
|
||||
color: @text !important;
|
||||
background-color: fade(@overlay0, 15%) !important;
|
||||
border-color: @overlay0 !important;
|
||||
}
|
||||
|
||||
.suggestions {
|
||||
.suggestions-result {
|
||||
background-color: @mantle;
|
||||
&:hover {
|
||||
background-color: mix(@base, @mantle, 50%);
|
||||
}
|
||||
color: @text;
|
||||
.highlight {
|
||||
color: @accent-color;
|
||||
}
|
||||
}
|
||||
.suggestions-results {
|
||||
border-color: @surface0 !important;
|
||||
}
|
||||
.suggestions-special {
|
||||
border-color: @surface0 !important;
|
||||
background-color: @mantle;
|
||||
&:hover {
|
||||
background-color: mix(@accent-color, @mantle, 15%);
|
||||
}
|
||||
.special-label {
|
||||
color: @subtext0;
|
||||
}
|
||||
.special-query {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toc {
|
||||
li.active > a {
|
||||
border-left-color: @accent-color !important;
|
||||
}
|
||||
ul.nav a:hover {
|
||||
background: @accent-color !important;
|
||||
&,
|
||||
* {
|
||||
color: @crust !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.page-header {
|
||||
border-bottom-color: @overlay2;
|
||||
}
|
||||
|
||||
#catlinks {
|
||||
background-color: @mantle;
|
||||
border-color: @mantle;
|
||||
}
|
||||
|
||||
#footer {
|
||||
background-color: @mantle;
|
||||
}
|
||||
|
||||
.mw-search-profile-tabs {
|
||||
background-color: @base !important;
|
||||
border-color: @base !important;
|
||||
}
|
||||
|
||||
.search-types .current a {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
.oo-ui-inputWidget-input {
|
||||
background-color: @overlay2 !important;
|
||||
color: @base;
|
||||
}
|
||||
|
||||
.oo-ui-buttonElement-button {
|
||||
background-color: @mantle !important;
|
||||
color: @base !important;
|
||||
border-color: @mantle !important;
|
||||
}
|
||||
|
||||
.oo-ui-labelElement-label {
|
||||
background-color: @mantle !important;
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
.oo-ui-floatableElement-floatable,
|
||||
.oo-ui-widget:hover {
|
||||
background-color: @mantle !important;
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
& when (@lookup = latte) {
|
||||
.oo-ui-inputWidget-input {
|
||||
background-color: @base !important;
|
||||
color: @text;
|
||||
}
|
||||
.oo-ui-buttonElement-button {
|
||||
background-color: @mantle !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
381
planetmc/planetmc.user.css
Normal file
381
planetmc/planetmc.user.css
Normal file
|
|
@ -0,0 +1,381 @@
|
|||
/* ==UserStyle==
|
||||
@name Google Planet MC
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/planetmc/planetmc.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Planet MC
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain("planetminecraft.com") {
|
||||
[data-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
--body-bg: @crust;
|
||||
--header-bg: @base;
|
||||
--content-bg: @surface0;
|
||||
--container-bg: @base;
|
||||
--menu-bg: @surface0;
|
||||
--menu-color: @subtext1;
|
||||
--menu-selected-bg: @surface1;
|
||||
--menu-selected-color: @accent-color;
|
||||
--footer-bg: @mantle;
|
||||
--bg-navbar: @mantle;
|
||||
--tab-selected: @accent-color;
|
||||
--input-bg: @surface0;
|
||||
--dark-mid-bg: @base;
|
||||
--title-color: @text;
|
||||
--text-color: @text;
|
||||
--text-color-medium: @subtext0;
|
||||
--text-color-light: @subtext1;
|
||||
--border-color: @base;
|
||||
--footer-a-color: @accent-color;
|
||||
--nav-hover: @accent-color;
|
||||
--stat-color: @red;
|
||||
--a-color: @accent-color;
|
||||
--a-hover: @accent-color;
|
||||
--a-selected: fade(@accent-color, 80%);
|
||||
--tab-hover: fade(@accent-color, 80%);
|
||||
--tab-color: @subtext0;
|
||||
--nav-color: @text;
|
||||
--widget-wrap-bg: @mantle;
|
||||
--shine-start: @surface2;
|
||||
--shine-end: @surface1;
|
||||
--widget-bg: @surface0;
|
||||
--light-bg: @surface0;
|
||||
--medium-bg: @crust;
|
||||
--toolbar-bg: @surface0;
|
||||
--shine-highlight: @surface0;
|
||||
--border-color-light: @surface0;
|
||||
--site-border-color: @surface0;
|
||||
--graphic-bg: @surface0;
|
||||
--notice-bg: @overlay0;
|
||||
--notice-color: @text;
|
||||
--menu-disabled-color: @crust;
|
||||
--control-bg: @accent-color;
|
||||
--a-visited: @accent-color;
|
||||
--nav-bar-border: none;
|
||||
--feed-alt-bg: @surface1;
|
||||
--nav-selected: @accent-color;
|
||||
|
||||
.tab_options > ul > li.currentpage,
|
||||
.tab_options > ul > li.ui-state-active,
|
||||
.tab_options > ul > li:hover {
|
||||
border-bottom-color: @accent-color;
|
||||
}
|
||||
|
||||
.site_btn_secondary {
|
||||
color: @subtext1;
|
||||
background: @surface1;
|
||||
&:hover {
|
||||
color: @accent-color;
|
||||
background: fade(@surface1, 80%);
|
||||
}
|
||||
}
|
||||
|
||||
.site_btn,
|
||||
.site_btn_alt,
|
||||
#subscribe_full .site_btn,
|
||||
.pagination p a.pagination_page,
|
||||
.pagination p > span.pagination_page,
|
||||
.vert_menu > ul > li:only-child > a.current_select,
|
||||
.vert_menu > ul > li > a.current_select {
|
||||
color: @base;
|
||||
background: @accent-color;
|
||||
&:not(:disabled, [data-disabled="disabled"]):hover {
|
||||
background: fade(@accent-color, 80%);
|
||||
}
|
||||
}
|
||||
|
||||
#profile-bar #profile-actions .togglable.selected {
|
||||
background: @accent-color;
|
||||
color: @base;
|
||||
}
|
||||
|
||||
.tipso_bubble .bottom {
|
||||
background: @surface0 !important;
|
||||
}
|
||||
|
||||
/* because the icons on the display mode buttons are white, we cant have white base here, so we improvise for latte */
|
||||
& when (@lookup = latte) {
|
||||
#display_modes a {
|
||||
background: @text !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
/* fix nav menu dropdown icons */
|
||||
.navbar_icon .dropdown {
|
||||
--svozk: var(--s) -256px -326px !important;
|
||||
background: var(--s) -256px -326px !important;
|
||||
}
|
||||
|
||||
.content-actions li {
|
||||
background: @surface0;
|
||||
|
||||
a,
|
||||
.link,
|
||||
.js_link,
|
||||
.js_link_m {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
.content-actions li .js_link:hover,
|
||||
.content-actions li .js_link_m:hover,
|
||||
.content-actions li .link:hover,
|
||||
.content-actions li a:hover {
|
||||
.material-icons {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
color: @text !important;
|
||||
background: @accent-color !important;
|
||||
}
|
||||
|
||||
.content-actions li .material-icons {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
& when not (@lookup = latte) {
|
||||
#display_modes a {
|
||||
background: @base !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
#display_modes a.selected,
|
||||
#display_modes a:hover {
|
||||
background: @accent-color;
|
||||
}
|
||||
|
||||
.navigation-wrap .navmenu a {
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
#header
|
||||
#header-wrap
|
||||
.header_text
|
||||
> ul
|
||||
> li
|
||||
> .material-btn.mem_submit
|
||||
.material-icons,
|
||||
#header #header-wrap .header_text > ul > li > a.mem_submit .material-icons,
|
||||
#mobileRightPanel
|
||||
.sidr-inner
|
||||
> ul
|
||||
> li
|
||||
> .material-btn.mem_submit
|
||||
.material-icons,
|
||||
#mobileRightPanel .sidr-inner > ul > li > a.mem_submit .material-icons {
|
||||
color: @green !important;
|
||||
}
|
||||
|
||||
#header
|
||||
#header-wrap
|
||||
.header_text
|
||||
> ul
|
||||
> li
|
||||
> .material-btn[data-alert="1"].mem_notifications
|
||||
.material-icons,
|
||||
#header
|
||||
#header-wrap
|
||||
.header_text
|
||||
> ul
|
||||
> li
|
||||
> .material-btn[data-alert="1"].mem_tickets
|
||||
.material-icons,
|
||||
#header
|
||||
#header-wrap
|
||||
.header_text
|
||||
> ul
|
||||
> li
|
||||
> a[data-alert="1"].mem_notifications
|
||||
.material-icons,
|
||||
#header
|
||||
#header-wrap
|
||||
.header_text
|
||||
> ul
|
||||
> li
|
||||
> a[data-alert="1"].mem_tickets
|
||||
.material-icons,
|
||||
#mobileRightPanel
|
||||
.sidr-inner
|
||||
> ul
|
||||
> li
|
||||
> .material-btn[data-alert="1"].mem_notifications
|
||||
.material-icons,
|
||||
#mobileRightPanel
|
||||
.sidr-inner
|
||||
> ul
|
||||
> li
|
||||
> .material-btn[data-alert="1"].mem_tickets
|
||||
.material-icons,
|
||||
#mobileRightPanel
|
||||
.sidr-inner
|
||||
> ul
|
||||
> li
|
||||
> a[data-alert="1"].mem_notifications
|
||||
.material-icons,
|
||||
#mobileRightPanel
|
||||
.sidr-inner
|
||||
> ul
|
||||
> li
|
||||
> a[data-alert="1"].mem_tickets
|
||||
.material-icons {
|
||||
color: @yellow;
|
||||
}
|
||||
|
||||
.material-icons,
|
||||
.mem_submit > span,
|
||||
.mem_notifications > span {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
.green {
|
||||
background: @green;
|
||||
color: @base;
|
||||
|
||||
.material-icons {
|
||||
color: @base;
|
||||
}
|
||||
}
|
||||
|
||||
// .content-actions li:not(:only-child, :first-child) {
|
||||
// border-top: none;
|
||||
// }
|
||||
|
||||
.tipso_content,
|
||||
.member_profile_card_right {
|
||||
background: @surface0;
|
||||
}
|
||||
|
||||
.tipso_arrow {
|
||||
border-color: @surface0;
|
||||
}
|
||||
|
||||
#popular-reel .caption {
|
||||
& when (@lookup = latte) {
|
||||
background: fade(@text, 50%) !important;
|
||||
|
||||
.pop-title {
|
||||
color: @base !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.caption-subtitle {
|
||||
color: @crust !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
& when not (@lookup = latte) {
|
||||
background: fade(@base, 50%) !important;
|
||||
|
||||
.pop-title {
|
||||
color: @text !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.caption-subtitle {
|
||||
color: @subtext0 !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.content-actions li {
|
||||
background: @surface0;
|
||||
|
||||
a,
|
||||
.link,
|
||||
.js_link,
|
||||
.js_link_m {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
.content-actions li .js_link:hover,
|
||||
.content-actions li .js_link_m:hover,
|
||||
.content-actions li .link:hover,
|
||||
.content-actions li a:hover {
|
||||
.material-icons {
|
||||
color: @accent-color !important;
|
||||
}
|
||||
color: @accent-color !important;
|
||||
background: @surface1 !important;
|
||||
}
|
||||
|
||||
.content-actions li .material-icons {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#content_notice .site_btn,
|
||||
#content_notice .site_btn_alt {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.custom_input:focus,
|
||||
input:focus,
|
||||
select:focus,
|
||||
textarea:focus {
|
||||
border-color: @accent-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
1144
reddit/reddit.user.css
Normal file
1144
reddit/reddit.user.css
Normal file
File diff suppressed because it is too large
Load diff
BIN
scr/extranix.png
Normal file
BIN
scr/extranix.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 197 KiB |
BIN
scr/google.png
Normal file
BIN
scr/google.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 323 KiB |
BIN
scr/modrinth.png
Normal file
BIN
scr/modrinth.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 318 KiB |
BIN
scr/planetmc.png
Normal file
BIN
scr/planetmc.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 297 KiB |
BIN
scr/reddit.png
Normal file
BIN
scr/reddit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 755 KiB |
BIN
scr/stylus.png
Normal file
BIN
scr/stylus.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
BIN
scr/twitch.png
Normal file
BIN
scr/twitch.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
BIN
scr/youtube.png
Normal file
BIN
scr/youtube.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
310
stylus/stylus.user.css
Normal file
310
stylus/stylus.user.css
Normal file
|
|
@ -0,0 +1,310 @@
|
|||
/* ==UserStyle==
|
||||
@name Stylus paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/stylus/stylus.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Stylus
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document url-prefix("moz-extension://"), url-prefix(chrome-extension://)
|
||||
{
|
||||
:root {
|
||||
&[data-ui-theme="dark"] {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
--bg: @base;
|
||||
--fg: @text;
|
||||
--c30: @subtext1;
|
||||
--c40: @overlay0;
|
||||
--c45: @surface2;
|
||||
--c50: @subtext0;
|
||||
--c60: @subtext0;
|
||||
--c65: @surface2;
|
||||
--c75: @overlay1;
|
||||
--c80: @surface1;
|
||||
--c85: @surface0;
|
||||
--c90: @base;
|
||||
--c95: @mantle;
|
||||
--c97: @mantle;
|
||||
--c98: @base;
|
||||
--c99: @base;
|
||||
--c100: @base;
|
||||
--red1: @red;
|
||||
--accent-1: @accent-color;
|
||||
--accent-2: @accent-color;
|
||||
--accent-3: fade(@accent-color, 25%);
|
||||
|
||||
.slider {
|
||||
--color-on: fade(@accent-color, 25%);
|
||||
--color-off: @surface2;
|
||||
}
|
||||
|
||||
:focus {
|
||||
--focus-color1: @accent-color !important;
|
||||
--focus-color2: fade(@accent-color, 25%) !important;
|
||||
}
|
||||
|
||||
.active #filters-stats,
|
||||
.dirty #save-button,
|
||||
.dirty #save-button + button {
|
||||
background-color: @accent-color;
|
||||
border-color: @accent-color;
|
||||
color: @base;
|
||||
}
|
||||
#header-resizer {
|
||||
color: @surface1;
|
||||
}
|
||||
#message-box-title::before {
|
||||
@fade_color: fade(@accent-color, 67%);
|
||||
@svg: escape(
|
||||
'<svg version="1.1" viewBox="0 0 34.5 34.5" xmlns="http://www.w3.org/2000/svg"><g transform="translate(1.5 1.5)"><path d="M.68 13.5h.14a.68.68 135 0 0 .68-.68V3.68c0-.375-.012-.988.053-1.357.139-.786.622-2.01 2.27-2.272.37-.06.982-.05 1.357-.05h21.64c.375 0 .987-.009 1.358.049 1.676.26 2.15 1.485 2.279 2.273.06.37.043.982.043 1.357v9.14a.68.68 45 0 0 .68.68h.14a.68.68 45 0 1 .68.68v3.64a.68.68 135 0 1-.68.68h-.14a.68.68 135 0 0-.68.68v9.14c0 .375.017.988-.044 1.358-.13.787-.604 2.013-2.279 2.273-.37.057-.982.05-1.358.05H5.18c-.375 0-.987.007-1.358-.052-1.644-.264-2.128-1.487-2.268-2.272-.066-.37-.054-.982-.054-1.357v-9.14a.68.68 45 0 0-.68-.68H.68a.68.68 45 0 1-.68-.68v-3.64a.68.68 135 0 1 .68-.68z" stroke="@{base}" fill="@{accent-color}" stroke-linejoin="round" stroke-width="2.25" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="black" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="@{fade_color}" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M21.715 4.974c-1.156-.414-3.115-.889-5.815-.75-.74.039-1.94.174-2.656.366-3.022.81-4.142 2.93-4.516 4.402-.183.716-.217 1.939-.079 2.666.277 1.462 1.486 3.747 6.737 6.126.675.306 1.823.772 2.29 1.34q.07.085.137.181c.422.603.666 1.937.21 2.487a2.2 2.2 0 0 1-.487.424c-.616.405-1.829.62-2.57.65-.895.034-2.145-.023-3.445-.42-.709-.216-1.458.073-1.716.768l-.659 1.775c-.258.695.008 1.641.68 1.951 1.132.522 3.136 1.104 6.159.815.738-.07 1.93-.262 2.637-.482 3.15-.981 4.36-3.28 4.822-4.747.221-.706.333-1.916.24-2.65-.192-1.514-.978-3.965-3.922-5.497-.657-.342-1.812-.69-2.509-.942-.912-.332-2.091-.853-2.759-1.515-.507-.503-.47-1.826-.072-2.445a2.4 2.4 0 0 1 1.253-.976c.695-.247 1.925-.167 2.653-.03.667.125 1.38.305 1.976.476.712.204 1.473-.141 1.72-.84l.466-1.317c.248-.7-.202-1.608-.9-1.857Z" stroke="@{base}" stroke-width="2" fill="@{accent-color}" paint-order="stroke fill markers"/></g></svg>'
|
||||
);
|
||||
background-image: url("data:image/svg+xml,@{svg}");
|
||||
}
|
||||
[src="moz-extension://8fc71d5e-96b2-44a4-8d6f-ead6ff4d3c56/images/icon/16.png"], img[src="/images/icon/128.png"]
|
||||
{
|
||||
@fade_color: fade(@accent-color, 67%);
|
||||
@svg: escape(
|
||||
'<svg version="1.1" viewBox="0 0 34.5 34.5" xmlns="http://www.w3.org/2000/svg"><g transform="translate(1.5 1.5)"><path d="M.68 13.5h.14a.68.68 135 0 0 .68-.68V3.68c0-.375-.012-.988.053-1.357.139-.786.622-2.01 2.27-2.272.37-.06.982-.05 1.357-.05h21.64c.375 0 .987-.009 1.358.049 1.676.26 2.15 1.485 2.279 2.273.06.37.043.982.043 1.357v9.14a.68.68 45 0 0 .68.68h.14a.68.68 45 0 1 .68.68v3.64a.68.68 135 0 1-.68.68h-.14a.68.68 135 0 0-.68.68v9.14c0 .375.017.988-.044 1.358-.13.787-.604 2.013-2.279 2.273-.37.057-.982.05-1.358.05H5.18c-.375 0-.987.007-1.358-.052-1.644-.264-2.128-1.487-2.268-2.272-.066-.37-.054-.982-.054-1.357v-9.14a.68.68 45 0 0-.68-.68H.68a.68.68 45 0 1-.68-.68v-3.64a.68.68 135 0 1 .68-.68z" stroke="@{base}" fill="@{accent-color}" stroke-linejoin="round" stroke-width="2.25" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="black" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="@{fade_color}" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M21.715 4.974c-1.156-.414-3.115-.889-5.815-.75-.74.039-1.94.174-2.656.366-3.022.81-4.142 2.93-4.516 4.402-.183.716-.217 1.939-.079 2.666.277 1.462 1.486 3.747 6.737 6.126.675.306 1.823.772 2.29 1.34q.07.085.137.181c.422.603.666 1.937.21 2.487a2.2 2.2 0 0 1-.487.424c-.616.405-1.829.62-2.57.65-.895.034-2.145-.023-3.445-.42-.709-.216-1.458.073-1.716.768l-.659 1.775c-.258.695.008 1.641.68 1.951 1.132.522 3.136 1.104 6.159.815.738-.07 1.93-.262 2.637-.482 3.15-.981 4.36-3.28 4.822-4.747.221-.706.333-1.916.24-2.65-.192-1.514-.978-3.965-3.922-5.497-.657-.342-1.812-.69-2.509-.942-.912-.332-2.091-.853-2.759-1.515-.507-.503-.47-1.826-.072-2.445a2.4 2.4 0 0 1 1.253-.976c.695-.247 1.925-.167 2.653-.03.667.125 1.38.305 1.976.476.712.204 1.473-.141 1.72-.84l.466-1.317c.248-.7-.202-1.608-.9-1.857Z" stroke="@{base}" stroke-width="2" fill="@{accent-color}" paint-order="stroke fill markers"/></g></svg>'
|
||||
);
|
||||
content: url("data:image/svg+xml,@{svg}");
|
||||
}
|
||||
|
||||
#message-box.danger {
|
||||
#message-box-title {
|
||||
background-color: @red;
|
||||
color: @base;
|
||||
|
||||
&::before {
|
||||
@fade_color: fade(@red, 67%);
|
||||
@svg: escape(
|
||||
'<svg version="1.1" viewBox="0 0 34.5 34.5" xmlns="http://www.w3.org/2000/svg"><g transform="translate(1.5 1.5)"><path d="M.68 13.5h.14a.68.68 135 0 0 .68-.68V3.68c0-.375-.012-.988.053-1.357.139-.786.622-2.01 2.27-2.272.37-.06.982-.05 1.357-.05h21.64c.375 0 .987-.009 1.358.049 1.676.26 2.15 1.485 2.279 2.273.06.37.043.982.043 1.357v9.14a.68.68 45 0 0 .68.68h.14a.68.68 45 0 1 .68.68v3.64a.68.68 135 0 1-.68.68h-.14a.68.68 135 0 0-.68.68v9.14c0 .375.017.988-.044 1.358-.13.787-.604 2.013-2.279 2.273-.37.057-.982.05-1.358.05H5.18c-.375 0-.987.007-1.358-.052-1.644-.264-2.128-1.487-2.268-2.272-.066-.37-.054-.982-.054-1.357v-9.14a.68.68 45 0 0-.68-.68H.68a.68.68 45 0 1-.68-.68v-3.64a.68.68 135 0 1 .68-.68z" stroke="@{base}" fill="@{red}" stroke-linejoin="round" stroke-width="2.25" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="black" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M2.788 15h1.175a.54.54 135 0 0 .537-.537V5.538c0-.297-.017-.78.024-1.074.094-.66.475-1.72 1.94-1.928.294-.042.777-.036 1.074-.036h16.925c.296 0 .78-.006 1.073.038 1.426.211 1.821 1.268 1.928 1.927.047.292.036.776.036 1.072v8.925a.54.54 45 0 0 .538.538h1.175a.54.54 45 0 1 .537.537v.925a.54.54 135 0 1-.537.538h-1.175a.54.54 135 0 0-.538.537v8.925c0 .297.01.78-.04 1.073-.111.658-.51 1.714-1.925 1.927-.293.044-.776.038-1.072.038H7.538c-.297 0-.78.006-1.074-.037-1.434-.211-1.826-1.27-1.93-1.928-.046-.292-.034-.776-.034-1.073v-8.925A.54.54 45 0 0 3.963 17H2.788a.54.54 45 0 1-.538-.538v-.925A.54.54 135 0 1 2.788 15z" fill="@{fade_color}" stroke-linejoin="round" stroke="@{base}" stroke-width="2" paint-order="stroke fill markers"/><path d="M21.715 4.974c-1.156-.414-3.115-.889-5.815-.75-.74.039-1.94.174-2.656.366-3.022.81-4.142 2.93-4.516 4.402-.183.716-.217 1.939-.079 2.666.277 1.462 1.486 3.747 6.737 6.126.675.306 1.823.772 2.29 1.34q.07.085.137.181c.422.603.666 1.937.21 2.487a2.2 2.2 0 0 1-.487.424c-.616.405-1.829.62-2.57.65-.895.034-2.145-.023-3.445-.42-.709-.216-1.458.073-1.716.768l-.659 1.775c-.258.695.008 1.641.68 1.951 1.132.522 3.136 1.104 6.159.815.738-.07 1.93-.262 2.637-.482 3.15-.981 4.36-3.28 4.822-4.747.221-.706.333-1.916.24-2.65-.192-1.514-.978-3.965-3.922-5.497-.657-.342-1.812-.69-2.509-.942-.912-.332-2.091-.853-2.759-1.515-.507-.503-.47-1.826-.072-2.445a2.4 2.4 0 0 1 1.253-.976c.695-.247 1.925-.167 2.653-.03.667.125 1.38.305 1.976.476.712.204 1.473-.141 1.72-.84l.466-1.317c.248-.7-.202-1.608-.9-1.857Z" stroke="@{base}" stroke-width="2" fill="@{red}" paint-order="stroke fill markers"/></g></svg>'
|
||||
);
|
||||
background: url("data:image/svg+xml,@{svg}") !important;
|
||||
}
|
||||
}
|
||||
|
||||
#message-box-close-icon i {
|
||||
color: var(--c40);
|
||||
&:hover {
|
||||
color: var(--bg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#filters label:hover,
|
||||
#filters .filter-selection:hover {
|
||||
background-color: @surface0;
|
||||
}
|
||||
.oldUI .disabled h2::after,
|
||||
.entry.usercss .style-name-link::after {
|
||||
background-color: fade(@accent-color, 25%);
|
||||
}
|
||||
|
||||
/* Syntax highlighting */
|
||||
.CodeMirror-activeline-background {
|
||||
background: @mantle;
|
||||
}
|
||||
.CodeMirror-linenumber {
|
||||
color: @subtext0;
|
||||
}
|
||||
div.CodeMirror span.CodeMirror-matchingbracket {
|
||||
color: @green;
|
||||
}
|
||||
.cm-s-default {
|
||||
.cm-string {
|
||||
color: @green;
|
||||
}
|
||||
.cm-qualifier {
|
||||
color: @yellow;
|
||||
}
|
||||
.cm-variable-2 {
|
||||
color: @mauve;
|
||||
}
|
||||
.cm-keyword {
|
||||
color: @mauve;
|
||||
}
|
||||
.cm-atom {
|
||||
color: @red;
|
||||
}
|
||||
.cm-number {
|
||||
color: @peach;
|
||||
}
|
||||
.cm-def {
|
||||
color: @mauve;
|
||||
}
|
||||
.cm-tag {
|
||||
color: @blue;
|
||||
}
|
||||
.cm-builtin {
|
||||
color: @red;
|
||||
}
|
||||
.cm-variable-3 {
|
||||
color: @teal;
|
||||
}
|
||||
.cm-comment {
|
||||
color: @overlay2;
|
||||
}
|
||||
.cm-operator {
|
||||
color: @yellow;
|
||||
}
|
||||
.cm-variable {
|
||||
color: @blue;
|
||||
}
|
||||
.cm-property {
|
||||
color: @blue;
|
||||
}
|
||||
}
|
||||
button:disabled,
|
||||
select:disabled,
|
||||
option:disabled,
|
||||
select[disabled] > option {
|
||||
color: @subtext0;
|
||||
}
|
||||
.applies-to input,
|
||||
.applies-to select {
|
||||
background: @base;
|
||||
border-color: @surface0;
|
||||
color: @subtext0;
|
||||
}
|
||||
button {
|
||||
color: @text !important;
|
||||
background: @mantle !important;
|
||||
border-color: @surface0;
|
||||
&:hover {
|
||||
border-color: @text;
|
||||
}
|
||||
}
|
||||
#save-button[disabled] {
|
||||
background: @surface0 !important;
|
||||
}
|
||||
#message-box-title {
|
||||
color: @text;
|
||||
}
|
||||
.svg-icon {
|
||||
fill: @overlay0;
|
||||
|
||||
&:hover {
|
||||
fill: @overlay1;
|
||||
}
|
||||
}
|
||||
.onoffswitch input:checked + span {
|
||||
background-color: fade(@accent-color, 25%);
|
||||
|
||||
&::before {
|
||||
background-color: @accent-color;
|
||||
}
|
||||
}
|
||||
#options-title {
|
||||
color: @base;
|
||||
}
|
||||
h2 {
|
||||
color: @accent-color !important;
|
||||
}
|
||||
.installed .configure-usercss {
|
||||
i {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
svg,
|
||||
&:hover svg {
|
||||
fill: @accent-color !important;
|
||||
}
|
||||
}
|
||||
#live-reload-install-hint {
|
||||
color: @teal;
|
||||
}
|
||||
#menu.delete {
|
||||
header {
|
||||
background: fade(@red, 25%);
|
||||
}
|
||||
|
||||
> div,
|
||||
[data-cmd="delete"] {
|
||||
border-color: @red;
|
||||
}
|
||||
}
|
||||
.entry.odd {
|
||||
background-color: fade(@surface0, 25%);
|
||||
}
|
||||
.updater-icons > :not(.check-update)::after {
|
||||
border-color: @yellow;
|
||||
background: @base;
|
||||
}
|
||||
.split-btn-menu {
|
||||
border-color: @accent-color;
|
||||
|
||||
> :hover {
|
||||
background: fade(@accent-color, 25%);
|
||||
}
|
||||
}
|
||||
#help-popup .title {
|
||||
background: @mantle;
|
||||
}
|
||||
#toc li:hover {
|
||||
background: fade(@accent-color, 20%);
|
||||
}
|
||||
input:invalid {
|
||||
background: fade(@red, 10%);
|
||||
color: @red;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
674
twitch/twitch.user.css
Normal file
674
twitch/twitch.user.css
Normal file
|
|
@ -0,0 +1,674 @@
|
|||
/* ==UserStyle==
|
||||
@name Twitch paradisa
|
||||
@namespace github.com/axax-loll/userstyles/
|
||||
@homepageURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@version 1.0.1
|
||||
@updateURL https://github.com/axax-loll/userstyles/tree/main/twitch/twitch.user.css
|
||||
@supportURL https://github.com/axax-loll/userstyles/tree/main
|
||||
@description Paradise for Twitch
|
||||
@author azikx
|
||||
@license MIT
|
||||
|
||||
@preprocessor less
|
||||
@var select darkFlavor "Dark Flavor" ["paradisa:paradisa"]
|
||||
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
|
||||
==/UserStyle== */
|
||||
|
||||
@-moz-document domain("twitch.tv") {
|
||||
.tw-root--theme-dark {
|
||||
#paradisa(@darkFlavor, @accentColor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup, @accent) {
|
||||
@rosewater: @paradisa[@@lookup][@rosewater];
|
||||
@flamingo: @paradisa[@@lookup][@flamingo];
|
||||
@pink: @paradisa[@@lookup][@pink];
|
||||
@mauve: @paradisa[@@lookup][@mauve];
|
||||
@red: @paradisa[@@lookup][@red];
|
||||
@maroon: @paradisa[@@lookup][@maroon];
|
||||
@peach: @paradisa[@@lookup][@peach];
|
||||
@yellow: @paradisa[@@lookup][@yellow];
|
||||
@green: @paradisa[@@lookup][@green];
|
||||
@teal: @paradisa[@@lookup][@teal];
|
||||
@sky: @paradisa[@@lookup][@sky];
|
||||
@sapphire: @paradisa[@@lookup][@sapphire];
|
||||
@blue: @paradisa[@@lookup][@blue];
|
||||
@lavender: @paradisa[@@lookup][@lavender];
|
||||
@text: @paradisa[@@lookup][@text];
|
||||
@subtext1: @paradisa[@@lookup][@subtext1];
|
||||
@subtext0: @paradisa[@@lookup][@subtext0];
|
||||
@overlay2: @paradisa[@@lookup][@overlay2];
|
||||
@overlay1: @paradisa[@@lookup][@overlay1];
|
||||
@overlay0: @paradisa[@@lookup][@overlay0];
|
||||
@surface2: @paradisa[@@lookup][@surface2];
|
||||
@surface1: @paradisa[@@lookup][@surface1];
|
||||
@surface0: @paradisa[@@lookup][@surface0];
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
@crust: @paradisa[@@lookup][@crust];
|
||||
@accent-color: @paradisa[@@lookup][@@accent];
|
||||
|
||||
color-scheme: if(@lookup = latte, light, dark);
|
||||
|
||||
::selection {
|
||||
background-color: fade(@accent-color, 30%);
|
||||
}
|
||||
|
||||
input,
|
||||
textarea {
|
||||
&::placeholder {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: @base;
|
||||
}
|
||||
|
||||
&,
|
||||
.tw-dialog-layer {
|
||||
--color-background-input-focus: @crust;
|
||||
--color-background-interactable-hover: @surface0;
|
||||
--color-background-interactable-alpha-hover: @surface0;
|
||||
--color-background-button-text-default: null !important;
|
||||
--color-background-pill-subtle: @subtext0;
|
||||
--color-text-input-placeholder: @text;
|
||||
--color-border-input: @base;
|
||||
--color-text-button-primary: @crust;
|
||||
--color-text-overlay: @base;
|
||||
--color-text-base: @subtext1;
|
||||
--color-text-alt: @text;
|
||||
--color-text-alt-2: @text;
|
||||
--color-text-interactable-selected: @crust;
|
||||
--color-background-alt-2: @crust;
|
||||
--color-text-tag: @text;
|
||||
--color-background-button-secondary-default: @crust;
|
||||
--color-background-button-secondary-hover: @surface0;
|
||||
--color-background-tag-default: @mantle;
|
||||
--color-background-tag-hover: @crust;
|
||||
--color-background-float: @mantle;
|
||||
--color-background-body: @base;
|
||||
--color-background-base: @mantle;
|
||||
--color-background-alt: @mantle;
|
||||
--color-background-input: @crust;
|
||||
--color-brand-muted-cupcake: @pink;
|
||||
--color-brand-muted-mint: @green;
|
||||
--color-brand-muted-sky: @sky;
|
||||
--color-brand-muted-blush: @peach;
|
||||
--color-brand-muted-canary: @peach;
|
||||
--color-brand-muted-lavender: @lavender;
|
||||
--color-brand-muted-mustard: @yellow;
|
||||
--color-brand-muted-emerald: @green;
|
||||
--color-brand-muted-coral: @peach;
|
||||
--color-brand-muted-ocean: @blue;
|
||||
--color-brand-accent-grape: @mauve;
|
||||
--color-brand-accent-dragonfruit: @flamingo;
|
||||
--color-brand-accent-carrot: @peach;
|
||||
--color-brand-accent-sun: @peach;
|
||||
--color-brand-accent-lime: @green;
|
||||
--color-brand-accent-turquoise: @sky;
|
||||
--color-brand-accent-eggplant: @mauve;
|
||||
--color-brand-accent-wine: @flamingo;
|
||||
--color-brand-accent-slime: @green;
|
||||
--color-brand-accent-seafoam: @green;
|
||||
--color-brand-accent-cherry: @red;
|
||||
--color-brand-accent-marine: @blue;
|
||||
--color-brand-accent-seaweed: @teal;
|
||||
--color-brand-accent-fiji: @green;
|
||||
--color-brand-accent-blueberry: @blue;
|
||||
--color-brand-accent-arctic: @sky;
|
||||
--color-brand-accent-highlighter: @yellow;
|
||||
--color-brand-accent-flamingo: @flamingo;
|
||||
--color-brand-accent-ruby: @red;
|
||||
--color-brand-accent-punch: @flamingo;
|
||||
--color-brand-accent-creamsicle: @yellow;
|
||||
--color-red: @maroon;
|
||||
--color-red-darker: @red;
|
||||
--color-orange: @peach;
|
||||
--color-yellow: @yellow;
|
||||
--color-green: @green;
|
||||
--color-green-darker: @green;
|
||||
--color-blue: @blue;
|
||||
--color-prime-blue: @blue;
|
||||
--color-magenta: @flamingo;
|
||||
--color-error: @red;
|
||||
--color-warn: @yellow;
|
||||
--color-success: @green;
|
||||
--color-white: @text;
|
||||
--color-black: @crust;
|
||||
--color-info: @blue;
|
||||
--color-twitch-purple: @accent-color;
|
||||
--color-twitch-purple-4: @accent-color;
|
||||
--color-twitch-purple-5: @accent-color;
|
||||
--color-twitch-purple-6: @accent-color;
|
||||
--color-twitch-purple-7: @accent-color;
|
||||
--color-twitch-purple-8: @accent-color;
|
||||
--color-twitch-purple-9: @accent-color;
|
||||
--color-twitch-purple-10: @accent-color;
|
||||
--color-twitch-purple-11: @accent-color;
|
||||
--color-twitch-purple-12: @accent-color;
|
||||
--color-orange-7: @yellow;
|
||||
--color-orange-8: @yellow;
|
||||
--color-orange-9: @yellow;
|
||||
--color-orange-10: @yellow;
|
||||
--color-orange-11: @yellow;
|
||||
--color-orange-12: @yellow;
|
||||
--color-orange-13: @yellow;
|
||||
--color-yellow-6: @peach;
|
||||
--color-yellow-7: @peach;
|
||||
--color-yellow-8: @peach;
|
||||
--color-yellow-9: @peach;
|
||||
--color-yellow-10: @peach;
|
||||
--color-yellow-11: @peach;
|
||||
--color-yellow-12: @peach;
|
||||
--color-yellow-13: @peach;
|
||||
--color-yellow-14: @peach;
|
||||
--color-yellow-15: @peach;
|
||||
--color-green-5: @green;
|
||||
--color-green-6: @green;
|
||||
--color-green-7: @green;
|
||||
--color-green-8: @green;
|
||||
--color-green-9: @green;
|
||||
--color-green-10: @green;
|
||||
--color-green-11: @green;
|
||||
--color-green-12: @green;
|
||||
--color-green-13: @green;
|
||||
--color-green-14: @green;
|
||||
--color-green-15: @teal;
|
||||
--color-cyan-9: @sapphire;
|
||||
--color-cyan-10: @sapphire;
|
||||
--color-cyan-11: @sapphire;
|
||||
--color-cyan-12: @sapphire;
|
||||
--color-cyan-13: @sapphire;
|
||||
--color-cyan-14: @sapphire;
|
||||
--color-cyan-15: @sky;
|
||||
--color-blue-4: @blue;
|
||||
--color-blue-5: @blue;
|
||||
--color-blue-6: @blue;
|
||||
--color-blue-7: @blue;
|
||||
--color-blue-8: @blue;
|
||||
--color-blue-9: @blue;
|
||||
--color-blue-10: @sky;
|
||||
--color-blue-11: @sky;
|
||||
--color-magenta-5: @flamingo;
|
||||
--color-magenta-6: @flamingo;
|
||||
--color-magenta-7: @flamingo;
|
||||
--color-magenta-8: @flamingo;
|
||||
--color-magenta-9: @flamingo;
|
||||
--color-magenta-10: @flamingo;
|
||||
--color-magenta-11: @pink;
|
||||
--color-magenta-12: @pink;
|
||||
--color-red-4: @accent-color;
|
||||
--color-red-5: @accent-color;
|
||||
--color-red-6: @accent-color;
|
||||
--color-red-7: @accent-color;
|
||||
--color-red-8: @accent-color;
|
||||
--color-red-9: @accent-color;
|
||||
--color-red-10: @accent-color;
|
||||
--color-red-11: @peach;
|
||||
--color-red-12: @peach;
|
||||
--color-twitter: @blue;
|
||||
--color-facebook: @blue;
|
||||
--color-reddit: @peach;
|
||||
--color-snapchat: @yellow;
|
||||
--color-instagram: @blue;
|
||||
--color-youtube: @red;
|
||||
--color-paypal: @blue;
|
||||
--color-paypal-blue: @blue;
|
||||
--color-paypal-yellow: @yellow;
|
||||
--color-venmo: @blue;
|
||||
--color-vk: @blue;
|
||||
--color-amazon: @yellow;
|
||||
--color-background-button-text-hover: @surface0;
|
||||
--color-text-accessible-red: @accent-color;
|
||||
--color-border-input-checkbox: @subtext0;
|
||||
--color-border-input-checkbox-hover: @text;
|
||||
--color-text-label: @text;
|
||||
--color-border-input-hover: @surface0;
|
||||
--color-opac-b-14: @crust;
|
||||
--color-text-button-overlay: @text !important;
|
||||
--color-background-range-overlay-fill: @text !important;
|
||||
--color-text-button-overlay-hover: @text !important;
|
||||
--color-text-tooltip: @base !important;
|
||||
--color-background-tooltip: @text !important;
|
||||
--color-hinted-grey-2: @surface0;
|
||||
--color-hinted-grey-15: @text;
|
||||
--color-background-overlay-alt: @mantle;
|
||||
--color-background-button-overlay-primary-hover: @subtext1;
|
||||
--color-background-button-overlay-text-hover: @crust;
|
||||
--color-border-overlay: @surface0;
|
||||
--color-background-button-disabled: @surface0;
|
||||
--color-text-button-disabled: @subtext0;
|
||||
}
|
||||
|
||||
&,
|
||||
[class*="ScTokenOverrideCSSVars"] {
|
||||
--color-text-link: @blue;
|
||||
--color-text-link-active: @sky;
|
||||
--color-text-link-focus: @sky;
|
||||
--color-text-link-hover: @sky;
|
||||
--color-text-link-visited: @lavender;
|
||||
}
|
||||
|
||||
&,
|
||||
[class*="ScAccentRegionCssVars"] {
|
||||
--color-accent: @accent-color;
|
||||
}
|
||||
/* Hardcoded accent color */
|
||||
[style="color: rgb(160, 84, 255);"] {
|
||||
color: @accent-color !important;
|
||||
}
|
||||
|
||||
/* Full screened video player title & description */
|
||||
|
||||
p[data-test-selector="stream-info-card-component__subtitle"],
|
||||
p[data-test-selector="stream-info-card-component__description"] {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* `Pinned message` popup */
|
||||
|
||||
div.pinned-chat__pinned-by svg {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
p.pinned-chat__message {
|
||||
span {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
a {
|
||||
color: @accent-color;
|
||||
}
|
||||
}
|
||||
|
||||
/* `Intended for certain audiences` label */
|
||||
|
||||
div[data-a-target="content-classification-warning-disclosure-overlay"] p {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* `Hype Train` popup */
|
||||
|
||||
div.hype-train-progress-bar-info-view__level-container p,
|
||||
div.hype-train-approaching-view__leftSide p,
|
||||
div.hype-train-expanded-layout p,
|
||||
div.hype-train-expanded-layout svg {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
path[d="m18 17 4-4V2H6v15h4v4l4-4h4zM12 6h2v6h-2V6zm7 0h-2v6h2V6z"] {
|
||||
fill: @mantle;
|
||||
}
|
||||
|
||||
/* `Is video buffering?` warning */
|
||||
|
||||
div.low-latency-notification p {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* `Includes paid promotion` label */
|
||||
|
||||
div.disclosure-card p,
|
||||
div.disclosure-card svg {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Raiding popup */
|
||||
|
||||
div[data-test-selector="raid-banner"] {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* `Predict with Channel Points` popup */
|
||||
|
||||
div[data-test-selector="expanded-content"] p,
|
||||
p[data-test-selector="community-prediction-highlight-header__top-predictors"],
|
||||
p[data-test-selector="community-prediction-highlight-body__outcome-title"] {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* TODO: ensure that the poll does not default to this */
|
||||
div[data-test-selector="header-content"] p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
div.channel-points-icon svg,
|
||||
div[data-test-selector="header-content"] span,
|
||||
div[data-test-selector="community-prediction-highlight-body__outcome-points"]
|
||||
span {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
button[data-test-selector="community-prediction-highlight-header__how-to-play"],
|
||||
button[data-test-selector="community-prediction-highlight-header__terms-and-conditions"],
|
||||
button[data-test-selector="community-prediction-highlight-header__send-feedback"],
|
||||
button[data-test-selector="community-prediction-highlight-header__dismiss-message"] {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* ??? */
|
||||
|
||||
div.happening-now-disable-prompt p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* Gifting sub popup */
|
||||
|
||||
div.mystery-gift-chat-banner {
|
||||
span {
|
||||
color: @accent-color;
|
||||
}
|
||||
|
||||
p {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
|
||||
/* VOD metadata */
|
||||
|
||||
div.tw-media-card-stat {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* DMCA warning */
|
||||
|
||||
div.muted-segments-alert__content p {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* VOD time labels */
|
||||
|
||||
div.vod-seekbar-time-labels p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* VOD timestamp */
|
||||
|
||||
div.vod-seekbar-preview-overlay__wrapper p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* Seekbar segment */
|
||||
|
||||
div[data-test-selector="seekbar-interaction-area__interactionArea"]
|
||||
span[data-test-selector="seekbar-segment__segment"] {
|
||||
background: @accent-color !important;
|
||||
}
|
||||
|
||||
/* Seekbar DMCA muted segment */
|
||||
|
||||
div[data-test-selector="seekbar-interaction-area__interactionArea"]
|
||||
span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(212, 73, 73, 0.5);"] {
|
||||
background: @red !important;
|
||||
}
|
||||
|
||||
/* Seekbar buffered segment */
|
||||
|
||||
div[data-test-selector="seekbar-interaction-area__interactionArea"]
|
||||
span[data-test-selector="seekbar-segment__segment"][style*="background-color: rgba(255, 255, 255, 0.85);"] {
|
||||
background: @overlay2 !important;
|
||||
}
|
||||
|
||||
/* Recent VOD title */
|
||||
|
||||
div.player-overlay-background h4 {
|
||||
color: @subtext0 !important;
|
||||
}
|
||||
|
||||
a.offline-recommendations-video-card p {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Offline screen follow panel */
|
||||
|
||||
div[data-test-selector="follow-panel-overlay"] p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
div[data-test-selector="follow-panel-overlay"] button div {
|
||||
color: @crust !important;
|
||||
}
|
||||
|
||||
/* Front page warning sign */
|
||||
|
||||
div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"]
|
||||
div.content-overlay-icon
|
||||
svg {
|
||||
color: @red;
|
||||
}
|
||||
|
||||
/* Front page age warning */
|
||||
|
||||
div.content-overlay-gate__content[data-a-target="player-overlay-content-gate"]
|
||||
p.content-overlay-gate__allow-pointers {
|
||||
color: @red !important;
|
||||
}
|
||||
|
||||
/* Front page age selector */
|
||||
|
||||
div[data-a-target="player-overlay-age-gate-form"] select {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Following usercard */
|
||||
|
||||
div[data-a-target="user-card-modal"] p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* PiP username */
|
||||
|
||||
div.mini-overlay__title span {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Viewercard username */
|
||||
|
||||
div.viewer-card-header__display-name h4 {
|
||||
color: @accent-color !important;
|
||||
}
|
||||
|
||||
/* Viewercard metadata */
|
||||
|
||||
div.viewer-card-header__display-name svg:not(button svg) {
|
||||
color: @subtext1;
|
||||
}
|
||||
|
||||
div.viewer-card-header__display-name p {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* Extension name */
|
||||
|
||||
div[aria-describedby="popover-extensions-body"] h6 {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Extension description */
|
||||
|
||||
div.extensions-popover-view-layout__body p {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Extension service buttons */
|
||||
|
||||
div.extensions-popover-view-layout__body svg {
|
||||
color: @subtext0;
|
||||
}
|
||||
|
||||
div.extensions-popover-view-layout__body div {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
/* Extension overlay */
|
||||
|
||||
.extension-view__iframe {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
.carousel-metadata {
|
||||
background: @crust;
|
||||
}
|
||||
.carousel-metadata--fadeout {
|
||||
background: @crust;
|
||||
}
|
||||
.chat-line__timestamp {
|
||||
color: @subtext0;
|
||||
}
|
||||
.chat-line__message-body--highlighted {
|
||||
background-color: @accent-color;
|
||||
color: @crust;
|
||||
border-color: @accent-color;
|
||||
}
|
||||
.chat-scrollable-area__message-container {
|
||||
background-color: @mantle;
|
||||
}
|
||||
.side-nav-card__link:hover {
|
||||
background: @surface0 !important;
|
||||
}
|
||||
.footer {
|
||||
background: @crust;
|
||||
}
|
||||
.whispers-list-item--selected,
|
||||
.whispers-list-item:hover {
|
||||
background-color: @surface0;
|
||||
}
|
||||
.thread-header__title-bar-container--focused {
|
||||
background-color: @mantle;
|
||||
}
|
||||
.thread-header__title-bar-container {
|
||||
background: @mantle;
|
||||
}
|
||||
.thread-header__click-area:focus .thread-header__title-bar-container {
|
||||
background-color: @mantle;
|
||||
}
|
||||
.navigation-link {
|
||||
color: @text;
|
||||
|
||||
&:hover,
|
||||
.active {
|
||||
color: @accent-color;
|
||||
}
|
||||
}
|
||||
.navigation-link__active-indicator {
|
||||
background-color: @accent-color !important;
|
||||
}
|
||||
.chat-room {
|
||||
background: @mantle;
|
||||
}
|
||||
div.pinned-chat__highlight-card div.highlight {
|
||||
background: @mantle;
|
||||
}
|
||||
|
||||
h4,
|
||||
h5 {
|
||||
color: @text;
|
||||
}
|
||||
|
||||
.server-message-alert {
|
||||
border-color: @red !important;
|
||||
border-left-color: @red !important;
|
||||
}
|
||||
|
||||
.server-message-alert__icon {
|
||||
color: @red !important;
|
||||
}
|
||||
|
||||
/* Predictions */
|
||||
.fixed-prediction-button {
|
||||
color: @mantle !important;
|
||||
|
||||
.channel-points-icon svg {
|
||||
color: @mantle !important;
|
||||
}
|
||||
|
||||
&.fixed-prediction-button--disabled {
|
||||
color: @text !important;
|
||||
|
||||
.channel-points-icon svg {
|
||||
color: @text !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
[style*="rgb(255, 255, 255)"] {
|
||||
color: @base !important;
|
||||
}
|
||||
[style="color: rgb(56, 122, 255);"] {
|
||||
color: @blue !important;
|
||||
}
|
||||
[style="color: rgb(245, 0, 155);"] {
|
||||
color: @pink !important;
|
||||
}
|
||||
.fixed-prediction-button--blue,
|
||||
[style*="background-color: rgb(56, 122, 255);"],
|
||||
[style*="background: rgb(56, 122, 255);"] {
|
||||
background-color: @blue !important;
|
||||
}
|
||||
.fixed-prediction-button--pink,
|
||||
[style*="background-color: rgb(245, 0, 155);"],
|
||||
[style*="background: rgb(245, 0, 155);"] {
|
||||
background-color: @pink !important;
|
||||
}
|
||||
|
||||
input[disabled] {
|
||||
background-color: @surface0;
|
||||
}
|
||||
.chat-wysiwyg-input__placeholder {
|
||||
color: @subtext0;
|
||||
}
|
||||
|
||||
button[aria-label="Play"],
|
||||
button[aria-label="Pause"] {
|
||||
+ div svg {
|
||||
color: @subtext0;
|
||||
}
|
||||
}
|
||||
|
||||
[data-a-target="video-ad-label"],
|
||||
[data-a-target="video-ad-countdown"] {
|
||||
color: @text !important;
|
||||
}
|
||||
|
||||
/* Verified badge checkmark */
|
||||
path[fill="#fff"] {
|
||||
fill: @crust !important;
|
||||
}
|
||||
|
||||
/* Override for logo icon */
|
||||
.tw-animated-glitch-logo {
|
||||
--color-white: @crust;
|
||||
}
|
||||
|
||||
/* Modals */
|
||||
.modal__content {
|
||||
color: @text;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain("dashboard.twitch.tv") {
|
||||
.tw-root--theme-dark {
|
||||
#paradisa(@darkFlavor);
|
||||
}
|
||||
|
||||
#paradisa(@lookup) {
|
||||
@base: @paradisa[@@lookup][@base];
|
||||
@mantle: @paradisa[@@lookup][@mantle];
|
||||
.simplebar-content {
|
||||
background-color: @mantle;
|
||||
}
|
||||
.scrollable-area--suppress-scroll-x > .simplebar-scroll-content,
|
||||
.scrollable-area--suppress-scroll-x
|
||||
> .simplebar-scroll-content
|
||||
> .simplebar-content {
|
||||
background-color: @base;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* prettier-ignore */
|
||||
@paradisa: {
|
||||
@paradisa: { @rosewater: #BBB6B6; @flamingo: #A988B0; @pink: #A988B0; @mauve: #A988B0; @red: #B66467; @maroon: #B66467; @peach: #B66467; @yellow: #D9BC8C; @green: #8C977D; @teal: #8AA6A2; @sky: #8AA6A2; @sapphire: #8DA3B9; @blue: #8DA3B9; @lavender: #8DA3B9; @text: #E8E3E3; @subtext1: #BBB6B6; @subtext0: #BBB6B6; @overlay2: #424242; @overlay1: #424242; @overlay0: #424242; @surface2: #2E2E2E; @surface1: #2E2E2E; @surface0: #2E2E2E; @base: #151515; @mantle: #1F1F1F; @crust: #1F1F1F; };
|
||||
}
|
||||
|
||||
1417
youtube/youtube.user.css
Normal file
1417
youtube/youtube.user.css
Normal file
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue