New Dark theme options, more Accent coverage

This commit is contained in:
Vozer
2022-07-07 20:19:02 -05:00
committed by GitHub
parent e950314b89
commit 115480a597
7 changed files with 205 additions and 13 deletions
+21
View File
@@ -127,3 +127,24 @@ backdrop-filter: blur(10px);
.emptyChannelIcon-1YdEz2 {
background-color: var(--accent);
}
/* Reply Highlight */
#app-mount {
.message-2CShn3 {
margin-left: 5px;
border-radius: vaR(--accent-focused); // ARG, MATEY! :KarenPirate:
&::before {
border-radius: 6px;
}
&.replying-eZ7p5z, &.ephemeral-2nDdnn {
background-color: var(--accent-focused);
&::before {
background-color: var(--accent);
}
&:hover {
background-color: var(--accent-focused);
}
}
}
}
+3 -3
View File
@@ -15,7 +15,7 @@
box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.483);
border: 1px solid rgb(78, 78, 81);
border-radius: 5px;
background: rgb(40, 38, 42);
background: var(--surCordFriends);
margin-bottom: 13px;
margin-top: 13px;
padding-left: 10px;
@@ -38,7 +38,7 @@
margin-right: 13px;
}
.peopleColumn-1wMU14 {
background: rgb(33, 31, 35);
background: var(--surcordFriendsBackground);
}
.theme-light {
@@ -66,7 +66,7 @@
box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.483);
border: 1px solid rgb(78, 78, 81);
border-radius: 5px;
background: rgba(88, 84, 85, 0.276);
background: var(--surCordActiveNow);
margin-bottom: 13px;
margin-top: 13px;
padding-left: 10px;
+1 -1
View File
@@ -5,7 +5,7 @@
*/
.theme-dark {
.guilds-2JjMmN .scroller-3X7KbA, .wrapper-1_HaEi {
background-color: rgb(42, 40, 44);
background-color: var(--surCordGuilds);
}
.platform-osx .unreadMentionsIndicatorTop-2bTgUU .unreadMentionsBar-ZXXoOH, .unreadMentionsIndicatorBottom-3RJMnQ .unreadMentionsBar-ZXXoOH{
background: linear-gradient(rgb(44, 192, 90), rgb(45, 179, 87)) ;
+1 -1
View File
@@ -6,5 +6,5 @@
@use '_sidebars.scss';
@use '_flyouts.scss';
@use '_settings.scss';
@use '_accents.scss';
@use '_themeing.scss';
@use 'fixations';
+16 -6
View File
@@ -115,6 +115,9 @@
-webkit-box-shadow: none;
cursor: var(--cursor);
}
input[type='checkbox'] {
accent-color: var(--accent)
}
#app-mount .container-2nx-BQ .slider-32CRPX, #app-mount .checkboxWrapper-2fDzaA .slider-32CRPX {
display: none;
}
@@ -141,13 +144,13 @@ display:none;
/* Color Pallete */
.theme-dark {
--background-tertiary: rgb(42, 40, 44);
--background-secondary: rgb(42, 40, 44);
--background-secondary-alt: rgb(42, 40, 44);
--background-primary: rgb(31, 30, 30);
--channeltextarea-background: rgb(30, 30, 30);
--background-tertiary: var(--surCordBackground2);
--background-secondary: var(--surCordBackground2);
--background-secondary-alt: var(--surCordBackground2);
--background-primary: var(--surCordBackground);
--channeltextarea-background: var(--surCordTextBackground);
--background-accent: var(--accent);
--background-modifier-hover: rgb(65, 63, 66);
--background-modifier-hover: var(--surCordHover);
--background-modifier-active: rgb(30, 30, 30);
--background-modifier-selected: var(--accent-selected);
--deprecated-card-bg: #12141f63;
@@ -157,6 +160,8 @@ display:none;
--toast-background: #000000 !important;
--toast-header: #000000 !important;
--toast-contents: #000000 !important;
--brand-experiment-500: var(--accent-selected);
--brand-experiment-560: var(--accent-selected);
}
.theme-light {
@@ -176,6 +181,8 @@ display:none;
--toast-background: #ffffff !important;
--toast-header: #ffffff !important;
--toast-contents: #ffffff !important;
--brand-experiment-500: var(--accent-selected);
--brand-experiment-560: var(--accent-selected);
.clickable-ZD7xvu .icon-2xnN2Y, .linkButtonIcon-7rsZcu {
color: var(--accent);
@@ -200,6 +207,9 @@ display:none;
text-transform: none;
}
/* MWITTRIEN - EMOJIREPLACE - LICENCE https://github.com/mwittrien/BetterDiscordAddons/blob/master/LICENSE */
/* Uncomment to enable Apple Emojis */
//@import url(https://mwittrien.github.io/BetterDiscordAddons/Themes/EmojiReplace/base/Apple.css);
/* Links */
:root {
+161
View File
@@ -0,0 +1,161 @@
/*
  ,、     ,、 ヾV'/
 r'ー》'´`⌒ヾ‐》,//
 i  iミ リハリ//
 ! i゙瓦゚ ヮ゚ノ!'//| WARNING!!!! YOU CAN VERY EASILY FUCK SOMETHING UP IF YOU DONT OPEN YOUR EYE BALLS!!!!
 !l! ! と.フリ{つ/ ! IF YOU WOULD LIKE TO CHANGE THE ACCENT OF THIS THEME, YOU CAN VERY EASILY DO SO BY
,,ノリ | v/_j_、 i!l i UNCOMMENTING ONE OF THE FOLLOWING COLORS. MAKE SURE ONLY >>>ONE<<< COLOR IS COMMENTED AT A TIME
..ゞノ  ~じ'フ~ル'
*/
/*
/$$$$$$ /$$
/$$__ $$ | $$
| $$ \ $$ /$$$$$$$ /$$$$$$$ /$$$$$$ /$$$$$$$ /$$$$$$
| $$$$$$$$ /$$_____/ /$$_____/ /$$__ $$| $$__ $$|_ $$_/
| $$__ $$| $$ | $$ | $$$$$$$$| $$ \ $$ | $$
| $$ | $$| $$ | $$ | $$_____/| $$ | $$ | $$ /$$
| $$ | $$| $$$$$$$| $$$$$$$| $$$$$$$| $$ | $$ | $$$$/
|__/ |__/ \_______/ \_______/ \_______/|__/ |__/ \___/
*/
/* Blue */
:root {
--accent: rgb(26, 129, 251);
--accent-hover: rgba(26, 129, 251, 0.977);
--accent-selected: rgb(26, 129, 251, 0.612);
--accent-focused: rgb(26, 129, 251, 0.200);
}
/* Red
:root {
--accent: rgb(237, 60, 68);
--accent-hover: rgb(237, 60, 68, 0.977);
--accent-selected: rgb(237, 60, 68, 0.612);
--accent-focused: rgb(237, 60, 68, 0.200);
}
*/
/* Yellow
:root {
--accent: rgb( 251, 192, 45);
--accent-hover: rgba( 251, 192, 45, 0.977);
--accent-selected: rgb(251, 192, 45, 0.612);
--accent-focused: rgb(251, 192, 45, 0.200);
}
*/
/* Pink
:root {
--accent: rgb(248, 74, 156);
--accent-hover: rgba(248, 74, 156, 0.977);
--accent-selected: rgb(248, 74, 156, 0.612);
--accent-focused: rgb(248, 74, 156, 0.200);
}*/
/* Hatsune
:root {
--accent: rgb(0, 166, 166);
--accent-hover: rgb(255, 0, 128, 0.977);
--accent-selected: rgb(255, 0, 128, 0.612);
--accent-focused: rgb(255, 0, 128, 0.200);
}*/
/* Dark
:root {
--accent: rgb(152,129,123)
--accent-hover: rgb(0,0,0);
--accent-selected: rgb(0,0,0);
--accent-focused: rgb(0, 0, 0, 0.200);
}
*/
/* Apple
:root {
--accent: rgba(14,157,219);
--accent-hover: rgba(251,185,56);
--accent-selected: rgba(246,129,41);
--accent-buttons: rgba(150,56,146);
--accent-focused: rgb(2150, 56, 146, 0.200);
}
.clickable-ZD7xvu .icon-2xnN2Y, .linkButtonIcon-7rsZcu {
color: rgb(224,54,60) !important;
}
.iconWrapper-2awDjA .icon-2xnN2Y {
color: rgba(96,189,78);
}
.stickerIcon-3Jx5SE {
color: var(--accent);
}
.icon-1d5zch {
color: rgba(96,189,78);
}
.contents-3ca1mk .button-2fCJ0o .button-3BaQ4X {
color: rgb(224,54,60);
}
.buttonWrapper-3YFQGJ {
color: var(--accent);
}
*/
/*
/$$$$$$$ /$$ /$$
| $$__ $$ | $$ | $$
| $$ \ $$ /$$$$$$ /$$$$$$$| $$ /$$ /$$$$$$ /$$$$$$ /$$$$$$ /$$ /$$ /$$$$$$$ /$$$$$$$
| $$$$$$$ |____ $$ /$$_____/| $$ /$$/ /$$__ $$ /$$__ $$ /$$__ $$| $$ | $$| $$__ $$ /$$__ $$
| $$__ $$ /$$$$$$$| $$ | $$$$$$/ | $$ \ $$| $$ \__/| $$ \ $$| $$ | $$| $$ \ $$| $$ | $$
| $$ \ $$ /$$__ $$| $$ | $$_ $$ | $$ | $$| $$ | $$ | $$| $$ | $$| $$ | $$| $$ | $$
| $$$$$$$/| $$$$$$$| $$$$$$$| $$ \ $$| $$$$$$$| $$ | $$$$$$/| $$$$$$/| $$ | $$| $$$$$$$
|_______/ \_______/ \_______/|__/ \__/ \____ $$|__/ \______/ \______/ |__/ |__/ \_______/
/$$ \ $$
| $$$$$$/
\______/*/
/* AMOLED Theme (Pitch Black by Vozer)
:root {
--surCordBackground: rgb(0, 0, 0);
--surCordBackground2: rgb(0,0,0);
--surCordTextBackground: rgb(7,7,8);
--surcordFriendsBackground: rgb(0, 0, 0);
--surCordFriends: rgb(7,7,8);
--surCordActiveNow: rgba(10, 10, 10);
--surCordGuilds: rgb(0,0,0);
--surCordTitleBar: rgb(0, 0, 0);
--surCordSearch: rgb(7,7,8);
--surCordHover: var(--accent-selected);
} */
/* AMOLED Theme + Contrast (Taken from AMOLED-Cord by LuckFire)
:root {
--surCordBackground: rgb(0, 0, 0);
--surCordBackground2: rgb(10,10,10);
--surCordTextBackground: rgb(7,7,8);
--surcordFriendsBackground: rgb(0, 0, 0);
--surCordFriends: rgb(7,7,8);
--surCordActiveNow: rgba(10, 10, 10);
--surCordGuilds: rgb(10,10,10);
--surCordTitleBar: rgb(10, 10, 10);
--surCordSearch: rgb(10,10,10);
--surCordHover: var(--accent-selected);
}*/
/* Regular Theme (surCord by Vozer) */
:root {
--surCordBackground: rgb(31, 30, 30);
--surCordBackground2: rgb(42, 40, 44);
--surCordTextBackground: rgb(30, 30, 30);
--surcordFriendsBackground: rgb(33, 31, 35);
--surCordFriends: rgb(40, 38, 42);
--surCordActiveNow: rgba(88, 84, 85, 0.276);
--surCordGuilds: rgb(42, 40, 44);
--surCordTitleBar: rgb(55, 53, 55);
--surCordSearch: rgb(53, 51, 55);
--surCordHover: rgb(65, 63, 66);
}
+2 -2
View File
@@ -8,7 +8,7 @@
/* Title Bar */
.theme-dark {
.container-ZMc96U.themed-Hp1KC_, .header-3OsQeK{
background: rgb(55, 53, 55);
background: var(--surCordTitleBar);
border-bottom: .5px solid black;
}
.communityInfoVisible-3zc5_s .header-3OsQeK, .communityInfoVisible-3zc5_s .header-3OsQeK:hover, .hasBanner-2IrYih .header-3OsQeK, .hasBanner-2IrYih .header-3OsQeK:hover {
@@ -53,7 +53,7 @@
/* Search and other Text fields */
.theme-dark {
.searchBar-jGtisZ, .searchBar-3TnChZ .searchBarComponent-3N7dCG, .inner-2pOSmK, .wrapper-n2dlvs, .searchBar-2M9mRP, .input-2z42oC {
background-color: rgb(53, 51, 55);
background-color: var(--surCordSearch);
border-radius: 4px;
border: 1px solid rgb(97, 96, 99);
}