boris/ElegantFin
1
0
Fork 0
mirror of https://github.com/lscambo13/ElegantFin.git synced 2025-09-18 12:40:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

dev: rearranged and documented variables a bit

Browse Source
This commit is contained in:
lscambo13
2025-05-11 17:46:54 +05:30
parent fb49ca0d7a
commit 721a90aa3f
1 changed files with 32 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
Theme/ElegantFin-theme-nightly.css
View File

@@ -9,43 +9,49 @@
:root { :root {
--elegantFinFooterText: "ElegantFin Nightly"; --elegantFinFooterText: "ElegantFin Nightly";
/* Base theme colors */
color-scheme: dark; color-scheme: dark;
--darkerGradientPoint: #111827; --darkerGradientPoint: #111827;
--darkerGradientPointAlpha: rgba(17, 24, 39, 0.85); --darkerGradientPointAlpha: rgba(17, 24, 39, 0.85);
--lighterGradientPoint: #1d2635; --lighterGradientPoint: #1d2635;
--lighterGradientPointAlpha: rgba(29, 38, 53, 0.85); --lighterGradientPointAlpha: rgba(29, 38, 53, 0.85);
--borderColor: rgb(71, 80, 92);
--lighterBorderColor: rgb(255 255 255 / 20%);
--headerColor: rgba(30, 40, 54, 0.8); --headerColor: rgba(30, 40, 54, 0.8);
--drawerColor: rgba(30, 40, 54, 0.9); --drawerColor: rgba(30, 40, 54, 0.9);
--borderColor: rgb(71, 80, 92);
--lighterBorderColor: rgb(255 255 255 / 20%);
--selectorBackgroundColor: rgb(55, 65, 81); --selectorBackgroundColor: rgb(55, 65, 81);
--selectorBackgroundColorAlpha: rgba(55, 65, 81, 0.5); --selectorBackgroundColorAlpha: rgba(55, 65, 81, 0.5);
--activeColorAlpha: rgba(119, 91, 244, 0.9);
--activeColor: rgb(119, 91, 244);
--tableBodyColor: rgb(31 41 55 / 1);
--uiAccentColor: rgb(117 111 226);
--btnMiniPlayColor: rgb(41 154 93);
/* Base component colors */
--btnDeleteColor: rgb(169, 29, 29); --btnDeleteColor: rgb(169, 29, 29);
--btnDeleteBorderColor: rgb(217, 84, 84); --btnDeleteBorderColor: rgb(217, 84, 84);
--btnSubmitColor: rgb(61, 54, 178); --btnSubmitColor: rgb(61, 54, 178);
--btnSubmitBorderColor: rgb(117 111 226); --btnSubmitBorderColor: rgb(117 111 226);
--checkboxCheckedBgColor: rgb(79, 70, 229); --checkboxCheckedBgColor: rgb(79, 70, 229);
--highlightOutlineColor: rgb(37, 99, 235); --highlightOutlineColor: rgb(37, 99, 235);
--btnPlayBorderColor: color-mix(in srgb, var(--btnMiniPlayColor), rgb(255, 255, 255) 5%);
--defaultBorder: var(--borderWidth) solid var(--borderColor);
--defaultLighterBorder: var(--borderWidth) solid var(--lighterBorderColor);
/* dark theme based text colors */
--textColor: rgb(209, 213, 219); --textColor: rgb(209, 213, 219);
--dimTextColor: rgb(156, 163, 175); --dimTextColor: rgb(156, 163, 175);
--activeColorAlpha: rgba(119, 91, 244, 0.9);
--activeColor: rgb(119, 91, 244); /* textures */
--tableBodyColor: rgb(31 41 55 / 1);
--uiAccentColor: rgb(117 111 226);
--btnMiniPlayColor: rgb(41 154 93);
--btnPlayBorderColor: color-mix(in srgb, var(--btnMiniPlayColor), rgb(255, 255, 255) 5%);
--backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint)); --backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint));
--cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), var(--lighterGradientPoint) 25%); --cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), var(--lighterGradientPoint) 25%);
--hoverGradientA: linear-gradient(130deg, rgb(255 255 255 / 35%) 20%, rgb(255 255 255 / 15%) 40%); --hoverGradientA: linear-gradient(130deg, rgb(255 255 255 / 35%) 20%, rgb(255 255 255 / 15%) 40%);
--hoverGradientB: radial-gradient(100% 250% at 90% 190%, rgba(255, 255, 255, 0.15) 85%, rgba(255, 255, 255, 0.33) 100%); --hoverGradientB: radial-gradient(100% 250% at 90% 190%, rgba(255, 255, 255, 0.15) 85%, rgba(255, 255, 255, 0.33) 100%);
--shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12), 0 3px 1px -2px rgba(0, 0, 0, .2);
--largerRadius: 1.25em;
--largeRadius: 1em;
--smallRadius: .5em;
--smallerRadius: .375em;
--borderWidth: 0.075em;
--defaultBorder: var(--borderWidth) solid var(--borderColor);
--defaultLighterBorder: var(--borderWidth) solid var(--lighterBorderColor);
--ditheringMask: url(https://grainy-gradients.vercel.app/noise.svg); --ditheringMask: url(https://grainy-gradients.vercel.app/noise.svg);
/* login page customizations */ /* login page customizations */
@@ -53,11 +59,20 @@
--loginPageBgUrl: url(""); --loginPageBgUrl: url("");
--loginPageText: "Sign in to continue"; --loginPageText: "Sign in to continue";
/* standard component sizes */
--largerRadius: 1.25em;
--largeRadius: 1em;
--smallRadius: .5em;
--smallerRadius: .375em;
--borderWidth: 0.075em;
--blurSmallest: blur(2px); --blurSmallest: blur(2px);
--blurDefault: blur(5px); --blurDefault: blur(5px);
--blurLarge: blur(10px); --blurLarge: blur(10px);
--blurLargest: blur(20px); --blurLargest: blur(20px);
--shadow: 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12), 0 3px 1px -2px rgba(0, 0, 0, .2);
/* to revert to old icons, use 'Material Icons'*/ /* to revert to old icons, use 'Material Icons'*/
--iconPack: 'Material Icons Round'; --iconPack: 'Material Icons Round';
} }