mirror of
https://git.sr.ht/~azikx/userstyles
synced 2024-10-30 07:26:19 +00:00
192 lines
6.4 KiB
CSS
192 lines
6.4 KiB
CSS
/* ==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; };
|
|
}
|
|
|