|
|
|
|
@ -4,6 +4,7 @@
|
|
|
|
|
* @author Anthony
|
|
|
|
|
* @version 0.1
|
|
|
|
|
* @source https://code.cif.su/anthony/Themes/src/branch/main/Discord/Golden-Devil.theme.css
|
|
|
|
|
* @updateUrl https://code.cif.su/anthony/Themes/src/branch/main/Discord/Golden-Devil.theme.css
|
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
/* IMPORTANT: make sure to enable dark mode in discord settings for the theme to apply properly!!! */
|
|
|
|
|
@ -18,15 +19,15 @@
|
|
|
|
|
--corner-text: 'UwU';
|
|
|
|
|
|
|
|
|
|
/* color of status indicators and window controls */
|
|
|
|
|
--online-indicator: rgb(85, 5, 44); /* change to #23a55a for default green */
|
|
|
|
|
--dnd-indicator: hsl(340, 60%, 60%); /* change to #f13f43 for default red */
|
|
|
|
|
--idle-indicator: hsl(50, 60%, 60%); /* change to #f0b232 for default yellow */
|
|
|
|
|
--streaming-indicator: hsl(260, 60%, 60%); /* change to #593695 for default purple */
|
|
|
|
|
--online-indicator: rgb(0, 215, 135); /* change to #23a55a for default green */
|
|
|
|
|
--dnd-indicator: rgb(255, 0, 0); /* change to #f13f43 for default red */
|
|
|
|
|
--idle-indicator: rgb(255, 255, 0); /* change to #f0b232 for default yellow */
|
|
|
|
|
--streaming-indicator: rgb(0, 0, 255); /* change to #593695 for default purple */
|
|
|
|
|
|
|
|
|
|
/* accent colors */
|
|
|
|
|
--accent-1: rgb(6, 6, 6); /* links */
|
|
|
|
|
--accent-2: hsl(190, 70%, 48%); /* general unread/mention elements */
|
|
|
|
|
--accent-3: hsl(190, 70%, 42%); /* accent buttons */
|
|
|
|
|
--accent-3: rgb(6, 6, 6); /* accent buttons */
|
|
|
|
|
--accent-4: hsl(190, 70%, 36%); /* accent buttons when hovered */
|
|
|
|
|
--accent-5: hsl(190, 70%, 30%); /* accent buttons when clicked */
|
|
|
|
|
--mention: rgb(0, 215, 135); /* mentions & mention messages */
|
|
|
|
|
@ -36,7 +37,7 @@
|
|
|
|
|
--text-0: white; /* text on colored elements */
|
|
|
|
|
--text-1: rgb(0, 215, 145); /* other normally white text */
|
|
|
|
|
--text-2: rgb(0, 215, 145); /* headings and important text */
|
|
|
|
|
--text-3: hsl(220, 15%, 60%); /* normal text */
|
|
|
|
|
--text-3: rgba(255, 255, 255, 0.5); /* normal text */
|
|
|
|
|
--text-4: rgb(0, 215, 145); /* icon buttons and channels */
|
|
|
|
|
--text-5: hsl(220, 15%, 25%); /* muted channels/chats and timestamps */
|
|
|
|
|
|
|
|
|
|
@ -45,8 +46,8 @@
|
|
|
|
|
--bg-2: hsl(220, 15%, 16%); /* dark buttons */
|
|
|
|
|
--bg-3: rgb(6, 6, 6); /* spacing, secondary elements */
|
|
|
|
|
--bg-4: rgb(85, 5, 44); /* main background color */
|
|
|
|
|
--hover: hsla(230, 20%, 40%, 0.1); /* channels and buttons when hovered */
|
|
|
|
|
--active: hsla(220, 20%, 40%, 0.2); /* channels and buttons when clicked or selected */
|
|
|
|
|
--hover: rgb(6, 6, 6); /* channels and buttons when hovered */
|
|
|
|
|
--active: rgb(0, 215, 135); /* channels and buttons when clicked or selected */
|
|
|
|
|
--message-hover: hsla(220, 0%, 0%, 0.1); /* messages when hovered */
|
|
|
|
|
|
|
|
|
|
/* amount of spacing and padding */
|
|
|
|
|
@ -56,8 +57,8 @@
|
|
|
|
|
/* ALL ANIMATIONS CAN BE DISABLED WITH REDUCED MOTION IN DISCORD SETTINGS */
|
|
|
|
|
--list-item-transition: 0.2s ease; /* channels/members/settings hover transition */
|
|
|
|
|
--unread-bar-transition: 0.2s ease; /* unread bar moving into view transition */
|
|
|
|
|
--moon-spin-transition: 0.4s ease; /* moon icon spin */
|
|
|
|
|
--icon-spin-transition: 1s ease; /* round icon button spin (settings, emoji, etc.) */
|
|
|
|
|
--moon-spin-transition: 0.5s ease; /* moon icon spin */
|
|
|
|
|
--icon-spin-transition: 0.5s ease; /* round icon button spin (settings, emoji, etc.) */
|
|
|
|
|
|
|
|
|
|
/* corner roundness (border-radius) */
|
|
|
|
|
--roundness-xl: 22px; /* roundness of big panel outer corners */
|
|
|
|
|
@ -704,7 +705,7 @@ button.button_dd4f85 /* small buttons */,
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 65%;
|
|
|
|
|
height: 65%;
|
|
|
|
|
background: var(--text-4);
|
|
|
|
|
background: rgb(0, 215, 145);
|
|
|
|
|
-webkit-mask-image: var(--moon-icon-url);
|
|
|
|
|
-webkit-mask-size: var(--moon-icon-size);
|
|
|
|
|
-webkit-mask-repeat: none;
|
|
|
|
|
@ -716,7 +717,7 @@ button.button_dd4f85 /* small buttons */,
|
|
|
|
|
}
|
|
|
|
|
.wrapper_f90abb:hover > .childWrapper_f90abb::before,
|
|
|
|
|
.wrapper_f90abb.selected_f90abb > .childWrapper_f90abb::before {
|
|
|
|
|
background: var(--text-0);
|
|
|
|
|
background: rgb(0, 215, 145);
|
|
|
|
|
transform: rotate(-360deg) scale(0.8);
|
|
|
|
|
}
|
|
|
|
|
.lowerBadge_c5f96a::before {
|
|
|
|
|
@ -855,11 +856,7 @@ button.button_f67531 /* make user panel buttons round */ {
|
|
|
|
|
margin-bottom: -12px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.theme-light {
|
|
|
|
|
--text-link: var(--accent-5);
|
|
|
|
|
}
|
|
|
|
|
html.theme-light,
|
|
|
|
|
.theme-dark {
|
|
|
|
|
html.theme-dark {
|
|
|
|
|
--activity-card-background: var(--bg-3);
|
|
|
|
|
--android-navigation-bar-background: var(--primary-830);
|
|
|
|
|
--android-navigation-scrim-background: hsl(var(--primary-830-hsl) / 0.5);
|
|
|
|
|
@ -1119,7 +1116,7 @@ html.theme-light,
|
|
|
|
|
--status-positive: var(--green-360);
|
|
|
|
|
--status-positive-background: var(--green-430);
|
|
|
|
|
--status-positive-text: var(--text-0);
|
|
|
|
|
--status-speaking: var(--green-360);
|
|
|
|
|
--status-speaking: rgb(0, 215, 145);
|
|
|
|
|
--status-warning: var(--yellow-300);
|
|
|
|
|
--status-warning-background: var(--yellow-300);
|
|
|
|
|
--status-warning-text: var(--black-500);
|
|
|
|
|
|
anthony
3 months ago