feat: move config from arc
This commit is contained in:
657
config/vencord/gruv.theme.css
Normal file
657
config/vencord/gruv.theme.css
Normal file
@@ -0,0 +1,657 @@
|
||||
/**
|
||||
* @name Gruvbox Dark
|
||||
* @description Gruvbox Dark for Discord (new UI update)
|
||||
* @author shved.
|
||||
* @version 0.0.1
|
||||
* @authorId 833767278969225266
|
||||
* @website https://github.com/shvedes/discord-gruvbox
|
||||
*/
|
||||
|
||||
* {
|
||||
--gruv-dark-bg-hard: 29, 32, 33;
|
||||
--gruv-dark-bg: 40 40 40;
|
||||
--gruv-dark-bg-alt: 33, 33, 33;
|
||||
--gruv-dark-bg-soft: 50, 48, 47;
|
||||
--gruv-dark-bg1: 60, 56, 54;
|
||||
--gruv-dark-bg2: 80, 73, 69;
|
||||
--gruv-dark-bg3: 102, 92, 84;
|
||||
--gruv-dark-bg4: 124, 111, 100;
|
||||
|
||||
--gruv-dark-fg-hard: 251, 241, 199;
|
||||
--gruv-dark-fg: 235, 219, 178;
|
||||
--gruv-dark-fg1: 213, 196, 161;
|
||||
--gruv-dark-fg2: 189, 174, 147;
|
||||
--gruv-dark-fg3: 168, 153, 132;
|
||||
|
||||
--gruv-dark-purple-dark: 177, 98, 134;
|
||||
--gruv-dark-purple-light: 211, 134, 155;
|
||||
|
||||
--gruv-dark-yellow-dark: 215, 153, 33;
|
||||
--gruv-dark-yellow-light: 250, 189, 47;
|
||||
|
||||
--gruv-dark-red-dark: 204, 36, 29;
|
||||
--gruv-dark-red-light: 251, 73, 52;
|
||||
|
||||
--gruv-dark-orange-dark: 214, 93, 14;
|
||||
--gruv-dark-orange-light: 254, 128, 25;
|
||||
|
||||
--gruv-dark-blue-dark: 69, 133, 136;
|
||||
--gruv-dark-blue-light: 131, 165, 152;
|
||||
|
||||
--gruv-dark-green-dark: 104 157 106;
|
||||
--gruv-dark-green-light: 142, 192, 124;
|
||||
|
||||
--gruv-dark-aqua-dark: 104, 157, 106;
|
||||
--gruv-dark-aqua-light: 142, 192, 124;
|
||||
|
||||
--gruv-dark-gray-dark: 146, 131, 116;
|
||||
--gruv-dark-gray-light: 168, 153, 132;
|
||||
|
||||
/* ============================================================== */
|
||||
|
||||
--gruv-dark-text-hard: var(--gruv-dark-fg-hard);
|
||||
--gruv-dark-text-primary: var(--gruv-dark-fg);
|
||||
--gruv-dark-text-secondary: var(--gruv-dark-fg1);
|
||||
--gruv-dark-text-tertiary: var(--gruv-dark-fg2);
|
||||
--gruv-dark-text-muted: var(--gruv-dark-fg3);
|
||||
--gruv-dark-text-danger: var(--gruv-dark-red-light);
|
||||
--gruv-dark-text-inverted-hard: var(--gruv-dark-text-hard);
|
||||
--gruv-dark-text-inverted: var(--gruv-dark-bg);
|
||||
|
||||
--gruv-dark-background-positive: var(--gruv-dark-green-dark);
|
||||
|
||||
--gruv-dark-accent: var(--gruv-dark-green-light);
|
||||
--gruv-dark-accent-hover: var(--gruv-dark-green-dark);
|
||||
|
||||
--gruv-dark-icon-color: var(--gruv-dark-fg2);
|
||||
--gruv-dark-icon-color-hover: var(--gruv-dark-fg);
|
||||
--gruv-dark-icon-color-hover-harder: var(--gruv-dark-fg-hard);
|
||||
--gruv-dark-icon-color-muted: var(--gruv-dark-fg3);
|
||||
|
||||
--gruv-dark-link-color: var(--gruv-dark-blue-light);
|
||||
|
||||
--gruv-dark-border-default: var(--gruv-dark-bg2);
|
||||
--gruv-dark-border-hover: var(--gruv-dark-bg3);
|
||||
|
||||
--gruv-dark-button-color-default: var(--gruv-dark-accent);
|
||||
--gruv-dark-button-color-hover: rgba(var(--gruv-dark-button-color-default), 0.7);
|
||||
--gruv-dark-button-text-default: var(--gruv-dark-bg);
|
||||
--gruv-dark-button-text-dark: var(--gruv-dark-text-primary);
|
||||
--gruv-dark-button-text-dark-muted: var(--gruv-dark-text-muted);
|
||||
|
||||
--gruv-dark-button-alt-default: var(--gruv-dark-bg-soft);
|
||||
--gruv-dark-button-alt-hover: var(--gruv-dark-bg);
|
||||
|
||||
--gruv-dark-button-positive-default: var(--gruv-dark-green-dark);
|
||||
--gruv-dark-button-positive-hover: rgba(var(--gruv-dark-green-dark), 0.8);
|
||||
|
||||
--gruv-dark-input-box-background: var(--gruv-dark-bg-soft);
|
||||
|
||||
--gruv-dark-scrollbar-color: var(--gruv-dark-bg3);
|
||||
--gruv-dark-scrollbar-background: transparent;
|
||||
|
||||
--gruv-dark-selected-tab: var(--gruv-dark-bg1);
|
||||
|
||||
--gruv-dark-status-online: var(--gruv-dark-green-dark);
|
||||
--gruv-dark-status-offline: var(--gruv-dark-text-muted);
|
||||
--gruv-dark-status-idle: rgba(var(--gruv-dark-accent), 0.8);
|
||||
--gruv-dark-status-dnd: var(--gruv-dark-red-dark);
|
||||
|
||||
--vc-spotify-green: rgba(var(--gruv-dark-green-dark));
|
||||
--vc-spotify-green-90: rgba(var(--gruv-dark-green-dark), 0.2);
|
||||
--vc-spotify-green-80: rgba(var(--gruv-dark-green-dark), 0.3);
|
||||
}
|
||||
|
||||
.visual-refresh.theme-dark,
|
||||
.visual-refresh .theme-dark,
|
||||
[class*=vc-membercount-total], /* vesktop plugin */
|
||||
.visual-refresh,
|
||||
.theme-dark {
|
||||
--__header-bar-background: rgba(var(--gruv-dark-bg-hard));
|
||||
--autocomplete-bg: rgba(var(--gruv-dark-bg));
|
||||
|
||||
--background-primary: rgba(var(--gruv-dark-bg)); /* #282828 */
|
||||
--background-secondary: rgba(var(--gruv-dark-bg-alt)) ; /* #212121 */
|
||||
--background-secondary-alt: rgba(var(--gruv-dark-bg-soft));
|
||||
--background-tertiary: rgba(var(--gruv-dark-bg-soft)); /* #32302f */
|
||||
|
||||
--background-base-lower: rgba(var(--gruv-dark-bg));
|
||||
--background-base-low: rgba(var(--gruv-dark-bg));
|
||||
--background-base-lowest: rgba(var(--gruv-dark-bg-hard));
|
||||
--background-floating: rgba(var(--gruv-dark-bg-hard)); /* #1d2021 */
|
||||
|
||||
--background-surface-high: rgba(var(--gruv-dark-bg-soft));
|
||||
--background-surface-higher: rgba(var(--gruv-dark-bg));
|
||||
--background-surface-highest: rgba(var(--gruv-dark-bg));
|
||||
|
||||
--background-feedback-critical: rgba(var(--gruv-dark-red-dark), 0.08);
|
||||
--background-feedback-positive: rgba(var(--gruv-dark-green-dark), 0.08);
|
||||
|
||||
--background-modifier-accent: rgba(var(--gruv-dark-border-default));
|
||||
--background-modifier-selected: rgba(var(--gruv-dark-selected-tab));
|
||||
|
||||
--background-mentioned: rgba(var(--gruv-dark-accent), 0.1);
|
||||
--background-mentioned-hover: rgba(var(--gruv-dark-accent), 0.15);
|
||||
|
||||
--background-message-automod: rgba(var(--gruv-dark-accent), 0.1);
|
||||
--background-message-automod-hover: rgba(var(--gruv-dark-accent), 0.15);
|
||||
|
||||
--background-accent: rgba(var(--gruv-dark-bg1));
|
||||
|
||||
--bg-base-primary: rgba(var(--gruv-dark-bg));
|
||||
--bg-base-secondary: rgba(var(--gruv-dark-bg));
|
||||
--bg-base-tertiary: rgba(var(--gruv-dark-bg-hard));
|
||||
|
||||
--bg-surface-overlay: rgba(var(--gruv-dark-bg));
|
||||
|
||||
--card-primary-bg: rgba(var(--gruv-dark-bg-hard));
|
||||
|
||||
--bg-brand: rgba(var(--gruv-dark-accent), 0.8);
|
||||
|
||||
--bg-mod-faint: rgba(var(--gruv-dark-bg-soft));
|
||||
--bg-mod-strong: rgba(var(--gruv-dark-bg2));
|
||||
--bg-mod-subtle: rgba(var(--gruv-dark-bg1));
|
||||
|
||||
--border-normal: rgba(var(--gruv-dark-border-default));
|
||||
--border-strong: rgba(var(--gruv-dark-border-default));
|
||||
--border-faint: rgba(var(--gruv-dark-border-default));
|
||||
--border-subtle: rgba(var(--gruv-dark-border-default));
|
||||
|
||||
--background-message-hover: rgba(var(--gruv-dark-bg1));
|
||||
|
||||
--text-primary: rgba(var(--gruv-dark-fg-hard)); /* #fbf1c7 */
|
||||
--text-normal: rgba(var(--gruv-dark-fg)); /* #ebdbb2 */
|
||||
--text-default: rgba(var(--gruv-dark-fg)); /* #ebdbb2 */
|
||||
--text-secondary: rgba(var(--gruv-dark-fg1)); /* #d5c4a1 */
|
||||
--text-tertiary: rgba(var(--gruv-dark-fg2)); /* #bdae93 */
|
||||
--text-positive: rgba(var(--gruv-dark-green-dark));
|
||||
|
||||
--chat-text-muted: var(--text-tertiary);
|
||||
--embed-title: rgba(var(--gruv-dark-text-hard));
|
||||
|
||||
--text-link: rgba(var(--gruv-dark-link-color));
|
||||
--text-muted: rgba(var(--gruv-dark-text-muted));
|
||||
--text-brand: rgba(var(--gruv-dark-accent));
|
||||
--text-muted-on-default: rgba(var(--gruv-dark-text-muted));
|
||||
|
||||
--text-feedback-positive: rgba(var(--gruv-dark-green-dark));
|
||||
|
||||
--text-code-comment: rgba(var(--gruv-dark-gray-light));
|
||||
--text-code-default: rgba(var(--gruv-dark-blue-light));
|
||||
--text-code-keyword: rgba(var(--gruv-dark-purple-light));
|
||||
--text-code-variable: rgba(var(--gruv-dark-blue-light));
|
||||
--text-code-builtin: rgba(var(--gruv-dark-purple-light));
|
||||
--text-code-string: rgba(var(--gruv-dark-aqua-light));
|
||||
|
||||
--header-primary: rgba(var(--gruv-dark-text-primary));
|
||||
--header-secondary: rgba(var(--gruv-dark-text-tertiary));
|
||||
--header-muted: rgba(var(--gruv-dark-text-muted));
|
||||
|
||||
--checkbox-border-default: rgba(var(--gruv-dark-border-default));
|
||||
--checkbox-border-checked: rgba(var(--gruv-dark-border-default));
|
||||
--checkbox-background-default: rgba(var(--gruv-dark-bg-soft));
|
||||
--checkbox-background-checked: rgba(var(--gruv-dark-background-positive));
|
||||
|
||||
--channel-icon: rgba(var(--gruv-dark-icon-color));
|
||||
--channels-default: rgba(var(--gruv-dark-fg3));
|
||||
|
||||
--custom-notice-background: rgba(var(--gruv-dark-green-dark));
|
||||
--custom-notice-text: rgba(var(--gruv-dark-text-hard));
|
||||
|
||||
--notice-background-positive: rgba(var(--gruv-dark-green-dark));
|
||||
--notice-background-warning: rgba(var(--gruv-dark-yellow-dark), 0.8);
|
||||
--notice-background-critical: rgba(var(--gruv-dark-red-dark));
|
||||
|
||||
--notice-text-positive: rgba(var(--gruv-dark-text-inverted-hard));
|
||||
|
||||
--link-color: rgba(var(--gruv-dark-blue-dark));
|
||||
|
||||
--icon-primary: rgba(var(--gruv-dark-icon-color));
|
||||
--icon-secondary: rgba(var(--gruv-dark-icon-color));
|
||||
--icon-tertiary: rgba(var(--gruv-dark-icon-color));
|
||||
--icon-default: rgba(var(--gruv-dark-icon-color));
|
||||
--icon-muted: rgba(var(--gruv-dark-icon-color-muted));
|
||||
|
||||
--input-background: rgba(var(--gruv-dark-input-box-background));
|
||||
--input-border: rgba(var(--gruv-dark-border-default));
|
||||
--input-placeholder-text: rgba(var(--gruv-dark-text-tertiary));
|
||||
|
||||
--modal-background: rgba(var(--gruv-dark-bg-hard));
|
||||
--modal-footer-background: rgba(var(--gruv-dark-bg));
|
||||
|
||||
--mention-foreground: rgba(var(--gruv-dark-fg-hard));
|
||||
--mention-background: rgba(var(--gruv-dark-bg2));
|
||||
|
||||
--scrollbar-auto-thumb: rgba(var(--gruv-dark-scrollbar-color));
|
||||
--scrollbar-auto-track: rgba(var(--gruv-dark-scrollbar-background));
|
||||
--scrollbar-thin-thumb: rgba(var(--gruv-dark-scrollbar-color));
|
||||
--scrollbar-auto-scrollbar-color-thumb: rgba(var(--gruv-dark-scrollbar-color));
|
||||
--scrollbar-auto-scrollbar-color-track: rgba(var(--gruv-dark-scrollbar-color));
|
||||
|
||||
--button-filled-brand-text: rgba(var(--gruv-dark-button-text-default));
|
||||
--button-filled-brand-border: rgba(var(--gruv-dark-button-color-default));
|
||||
--button-filled-brand-background: rgba(var(--gruv-dark-button-color-default));
|
||||
--button-filled-brand-background-active: rgba(var(--gruv-dark-button-color-default));
|
||||
--button-filled-brand-background-hover: var(--gruv-dark-button-color-hover);
|
||||
|
||||
--button-danger-background: rgba(var(--gruv-dark-red-dark));
|
||||
--button-danger-background-active: rgba(var(--gruv-dark-red-light));
|
||||
--button-danger-background-disabled: rgba(var(--gruv-dark-red-dark), 0.8);
|
||||
--button-danger-background-hover: rgba(var(--gruv-dark-red-dark), 0.7);
|
||||
--button-danger-border: rgba(var(--gruv-dark-red-dark));
|
||||
|
||||
--button-outline-danger-background: rgba(var(--gruv-dark-button-alt-default));
|
||||
--button-outline-danger-background-hover: rgba(var(--gruv-dark-button-alt-hover));
|
||||
--button-outline-danger-border: rgba(var(--gruv-dark-border-default));
|
||||
--button-outline-danger-border-hover: rgba(var(--gruv-dark-border-default));
|
||||
--button-outline-danger-text: rgba(var(--gruv-dark-button-text-dark-muted));
|
||||
--button-outline-danger-text-hover: rgba(var(--gruv-dark-text-danger));
|
||||
|
||||
--button-outline-positive-text: rgba(var(--gruv-dark-text-primary));
|
||||
|
||||
--button-positive-background: rgba(var(--gruv-dark-button-positive-default));
|
||||
--button-positive-background-hover: var(--gruv-dark-button-positive-hover);
|
||||
--button-positive-background-active: rgba(var(--gruv-dark-button-positive-default));
|
||||
--button-positive-background-disabled: rgba(var(--gruv-dark-green-dark));
|
||||
--button-positive-border: rgba(var(--gruv-dark-button-positive-default));
|
||||
|
||||
--button-secondary-background: rgba(var(--gruv-dark-bg-soft));
|
||||
--button-secondary-background-hover: rgba(var(--gruv-dark-bg));
|
||||
--button-secondary-text: rgba(var(--gruv-dark-button-text-dark-muted));
|
||||
|
||||
--button-transparent-background: rgba(var(--gruv-dark-button-alt-default));
|
||||
--button-transparent-background-hover: rgba(var(--gruv-dark-button-alt-hover));
|
||||
--button-transparent-text: rgba(var(--gruv-dark-button-text-dark));
|
||||
|
||||
--primary-630: rgba(var(--gruv-dark-button-alt-default));
|
||||
--primary-700: rgba(var(--gruv-dark-button-alt-hover));
|
||||
|
||||
--background-code: rgba(var(--gruv-dark-bg-hard));
|
||||
|
||||
--status-online: rgba(var(--gruv-dark-status-online));
|
||||
--status-offline: rgba(var(--gruv-dark-status-offline));
|
||||
--status-idle: var(--gruv-dark-status-idle);
|
||||
--status-dnd: rgba(var(--gruv-dark-status-dnd));
|
||||
|
||||
--status-positive: rgba(var(--gruv-dark-green-dark));
|
||||
--status-positive-background: rgba(var(--gruv-dark-green-dark));
|
||||
--status-positive-text: rgba(var(--gruv-dark-text-inverted-hard));
|
||||
|
||||
--status-danger: rgba(var(--gruv-dark-red-dark));
|
||||
--status-danger-background: rgba(var(--gruv-dark-red-dark));
|
||||
--status-danger-text: rgba(var(--gruv-dark-text-primary));
|
||||
|
||||
--status-warning: rgba(var(--gruv-dark-orange-dark));
|
||||
--status-warning-background: rgba(var(--gruv-dark-orange-dark));
|
||||
--status-warning-text: rgba(var(--gruv-dark-text-inverted-hard));
|
||||
|
||||
--status-speaking: rgba(var(--gruv-dark-green-light));
|
||||
|
||||
--info-danger-background: rgba(var(--gruv-dark-red-dark), 0.08);
|
||||
--info-danger-text: rgba(rgba(gruv-dark-red-light));
|
||||
|
||||
--info-help-foreground: rgba(var(--gruv-dark-blue-light));
|
||||
--info-help-background: rgba(var(--gruv-dark-blue-dark), 0.1);
|
||||
|
||||
--info-positive-background: rgba(var(--gruv-dark-green-dark), 0.08);
|
||||
--info-positive-text: rgba(var(--gruv-dark-green-light));
|
||||
|
||||
--info-warning-background: rgba(var(--gruv-dark-orange-dark), 0.08);
|
||||
--info-warning-text: rgba(var(--gruv-dark-text-primary));
|
||||
|
||||
--background-mod-normal: rgba(var(--gruv-dark-selected-tab));
|
||||
--background-mod-strong: rgba(var(--gruv-dark-bg2));
|
||||
--background-mod-subtle: rgba(var(--gruv-dark-bg-soft));
|
||||
|
||||
|
||||
--interactive-normal: rgba(var(--gruv-dark-icon-color));
|
||||
--interactive-hover: rgba(var(--gruv-dark-icon-color-hover-harder));
|
||||
--interactive-active: rgba(var(--gruv-dark-icon-color-hover-harder));
|
||||
--interactive-muted: rgba(var(--gruv-dark-bg3));
|
||||
|
||||
--message-reacted-text: rgba(var(--gruv-dark-text-hard));
|
||||
--message-reacted-background: rgba(var(--gruv-dark-accent), 0.1);
|
||||
|
||||
--background-message-highlight: rgba(var(--gruv-dark-accent), 0.1);
|
||||
--background-message-highlight-hover: rgba(var(--gruv-dark-accent), 0.15);
|
||||
|
||||
--spoiler-hidden-background: rgba(var(--gruv-dark-bg2));
|
||||
--spoiler-hidden-background-hover: rgba(var(--gruv-dark-bg3));
|
||||
|
||||
--chat-background-default: rgba(var(--gruv-dark-bg-soft));
|
||||
--premium-nitro-pink-text: rgba(var(--gruv-dark-purple-light));
|
||||
--guild-boosting-pink: rgba(var(--gruv-dark-purple-light));
|
||||
--spine-default: rgba(var(--gruv-dark-bg4));
|
||||
--app-border-frame: rgba(var(--gruv-dark-border-default));
|
||||
--twitch: rgba(var(--gruv-dark-purple-dark));
|
||||
--opacity-blurple-12: rgba(var(--gruv-dark-bg));
|
||||
|
||||
--custom-store-colors-premium-gradient: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
--custom-premium-colors-premium-gradient-tier-0: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
--custom-premium-colors-premium-gradient-tier-1: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
--custom-premium-colors-premium-gradient-tier-2: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
--custom-premium-colors-premium-gradient-tier-2-transparent: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark), 0.3), rgba(var(--gruv-dark-purple-light), 0.3));
|
||||
--custom-premium-colors-premium-gradient-tier-2-diagonal: linear-gradient(45deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
--custom-premium-colors-premium-gradient-tier-2-tri-color: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)), rgba(var(--gruv-dark-purple-dark)));
|
||||
--custom-premium-colors-premium-gradient-tier-2-tri-color-reverse: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)), rgba(var(--gruv-dark-purple-dark)));
|
||||
--custom-premium-colors-premium-gradient-tier-2-tri-color-vertical: linear-gradient(0deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)), rgba(var(--gruv-dark-purple-dark)));
|
||||
--custom-premium-colors-premium-gradient-tier-2-old: linear-gradient(90deg, rgba(var(--gruv-dark-purple-dark)), rgba(var(--gruv-dark-purple-light)));
|
||||
|
||||
--premium-nitro-pink-dark: rgba(var(--gruv-dark-purple-dark));
|
||||
--premium-nitro-pink-light: rgba(var(--gruv-dark-purple-light));
|
||||
--premium-perk-blue: rgba(var(--gruv-dark-blue-dark));
|
||||
--premium-perk-blue-alt: rgba(var(--gruv-dark-blue-dark));
|
||||
--premium-perk-dark-blue: rgba(var(--gruv-dark-blue-dark));
|
||||
|
||||
--brand-260: rgba(var(--gruv-dark-accent-hover), 0.8);
|
||||
--brand-360: rgba(var(--gruv-dark-accent));
|
||||
--brand-500: rgba(var(--gruv-dark-accent-hover), 0.8);
|
||||
--brand-05: rgba(var(--gruv-dark-accent-hover), 0.2);
|
||||
--white-500: rgba(var(--gruv-dark-text-hard));
|
||||
--blurple-50: rgba(var(--gruv-dark-accent));
|
||||
--green-300: rgba(var(--gruv-dark-green-dark));
|
||||
--green-360: rgba(var(--gruv-dark-green-dark));
|
||||
--color-total: rgba(var(--gruv-dark-text-muted));
|
||||
--primary-300: rgba(var(--gruv-dark-text-hard));
|
||||
--primary-500: rgba(var(--gruv-dark-bg1));
|
||||
--white: rgba(var(--gruv-dark-text-hard));
|
||||
|
||||
--badge-brand-text: rgba(var(--gruv-dark-text-inverted));
|
||||
--badge-brand-bg: rgba(var(--gruv-dark-accent-hover), 0.8);
|
||||
|
||||
--redesign-button-positive-background: rgba(var(--gruv-dark-green-dark));
|
||||
--redesign-button-positive-pressed-background: rgba(var(--gruv-dark-green-dark), 0.8);
|
||||
--redesign-button-positive-text: rgba(var(--gruv-dark-text-hard));
|
||||
--redesign-button-overlay-alpha-text: rgba(var(--gruv-dark-text-hard));
|
||||
--redesign-button-overlay-alpha-background: rgba(0, 0, 0, 0.3);
|
||||
|
||||
--user-profile-overlay-background: rgba(var(--gruv-dark-bg));
|
||||
}
|
||||
|
||||
.visual-refresh .textBadge__2b1f5 {
|
||||
color: rgb(var(--gruv-dark-text-inverted)) !important
|
||||
}
|
||||
|
||||
/* Invite button inside call box */
|
||||
.buttonColor__7b3e8 {
|
||||
color: rgba(var(--gruv-dark-text-primary))
|
||||
}
|
||||
|
||||
.theme-dark .button_e131a9.buttonColor_e131a9.buttonActive_e131a9 {
|
||||
background-color: rgba(var(--gruv-dark-button-positive-default), 0.1)
|
||||
}
|
||||
.theme-dark .button_e131a9.buttonColor_e131a9.buttonActive_e131a9:hover {
|
||||
background-color: rgba(var(--gruv-dark-button-positive-default), 0.2)
|
||||
}
|
||||
|
||||
/* Input / Output Volume slider (context menu) */
|
||||
:where(.visual-refresh) .mini_a562c8 .grabber_a562c8, :where(.visual-refresh) .slider_a562c8 .grabber_a562c8 {
|
||||
background-color: rgba(var(--gruv-dark-text-primary))
|
||||
}
|
||||
|
||||
[class*=notches_] {
|
||||
background-color: rgba(var(--gruv-dark-bg3))
|
||||
}
|
||||
|
||||
[class^=control_] [class*=checked_],
|
||||
#vc-spotify-player [class*=barFill_] {
|
||||
background-color: rgba(var(--gruv-dark-accent-hover), 0.8) !important;
|
||||
}
|
||||
|
||||
.slider__87bf1 > rect {
|
||||
fill: rgba(var(--gruv-dark-text-hard));
|
||||
}
|
||||
.slider__87bf1 svg > path {
|
||||
fill: rgba(var(--gruv-dark-bg))
|
||||
}
|
||||
.container__87bf1 {
|
||||
background-color: rgba(var(--gruv-dark-bg2)) !important
|
||||
}
|
||||
.checked__87bf1 {
|
||||
background-color: rgba(var(--gruv-dark-yellow-dark)) !important;
|
||||
}
|
||||
|
||||
/* "Share your screen" button */
|
||||
.theme-dark [class*="experimentButton_"][class*="buttonColor_"][class*="buttonActive_"] {
|
||||
background-color: rgba(var(--gruv-dark-green-dark), 0.2);
|
||||
border: 1px solid rgba(var(--gruv-dark-green-dark), 0.25);
|
||||
}
|
||||
.theme-dark [class*="experimentButton_"][class*="buttonColor_"][class*="buttonActive_"]:hover {
|
||||
background-color: rgba(var(--gruv-dark-green-dark), 0.4);
|
||||
border: 1px solid rgba(var(--gruv-dark-green-dark), 0.3);
|
||||
}
|
||||
|
||||
/* call container bg */
|
||||
[class^=callContainer],
|
||||
[class^=callContainer] [class^=scroller_] {
|
||||
background-color: rgba(var(--gruv-dark-bg-hard));
|
||||
}
|
||||
/* Room preview animation */
|
||||
.gradientBackground__11664 {
|
||||
background: rgba(var(--gruv-dark-bg)) !important
|
||||
}
|
||||
.backgroundDark__11664 {
|
||||
background: rgba(var(--gruv-dark-bg)) !important
|
||||
}
|
||||
.foregroundRing__11664 {
|
||||
background: rgba(var(--gruv-dark-accent-hover), 0.3) !important
|
||||
}
|
||||
.foregroundBase__11664 {
|
||||
background: rgba(var(--gruv-dark-accent-hover), 1) !important
|
||||
}
|
||||
|
||||
/* Online statuses */
|
||||
[mask^="url(#svg-mask-status-online"] {
|
||||
fill: rgba(var(--gruv-dark-status-online));
|
||||
}
|
||||
|
||||
[mask^="url(#svg-mask-status-dnd"] {
|
||||
fill: rgba(var(--gruv-dark-status-dnd));
|
||||
}
|
||||
|
||||
[mask^="url(#svg-mask-status-idle"] {
|
||||
fill: var(--gruv-dark-status-idle);
|
||||
}
|
||||
|
||||
[mask^="url(#svg-mask-status-offline"] {
|
||||
fill: rgba(var(--gruv-dark-status-offline));
|
||||
}
|
||||
|
||||
[class^=avatarWrapper_] {
|
||||
[aria-label*=online i] svg > svg > rect {
|
||||
fill: rgba(var(--gruv-dark-status-online)) !important;
|
||||
}
|
||||
}
|
||||
[class^=avatarWrapper_] {
|
||||
[aria-label*=idle i] svg > svg > rect {
|
||||
fill: rgba(var(--gruv-dark-status-idle)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
[class^=avatarWrapper_] {
|
||||
[aria-label*=dnd i] svg > svg > rect {
|
||||
fill: rgba(var(--gruv-dark-status-dnd)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
[class^=avatarWrapper_] {
|
||||
[aria-label*=invisible i] svg > svg > rect {
|
||||
fill: rgba(var(--gruv-dark-status-offline)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
rect[fill="#43a25a"] {
|
||||
fill: var(--status-online);
|
||||
}
|
||||
|
||||
rect[fill="#ca9654"] {
|
||||
fill: var(--status-idle);
|
||||
}
|
||||
|
||||
rect[fill="#d83a42"] {
|
||||
fill: var(--status-dnd);
|
||||
}
|
||||
|
||||
rect[fill="#82838b"] {
|
||||
fill: var(--status-offline);
|
||||
}
|
||||
|
||||
div.status_a423bd {
|
||||
background-color: var(--status-online) !important;
|
||||
}
|
||||
|
||||
/* Screenshare icon */
|
||||
.icon_c9d15c > path {
|
||||
fill: rgba(var(--gruv-dark-accent))
|
||||
}
|
||||
|
||||
[class^=callContainer] [class^=root] {
|
||||
background-color: rgba(var(--gruv-dark-bg-hard)) !important
|
||||
}
|
||||
|
||||
.flex__7c0ba .lineClamp1__4bd52 {
|
||||
color: rgba(var(--gruv-dark-text-hard)) !important
|
||||
}
|
||||
|
||||
/* Vesktop plugins / themes */
|
||||
.vc-addon-card {
|
||||
border: 1px solid rgba(var(--gruv-dark-border-default))
|
||||
}
|
||||
|
||||
/* Use solid background for banners in the "Discover" category */
|
||||
.theme-dark .gradientOverlay_e9ef78,
|
||||
.theme-dark .bannerGradient__955a3 {
|
||||
background-color: rgba(var(--gruv-dark-bg));
|
||||
border-bottom: 1px solid rgba(var(--gruv-dark-border-hover))
|
||||
}
|
||||
|
||||
/* Share your screen / Stop stream / change windows / ets bototm button inside call window */
|
||||
[class^="colorable_"][class*="greenGlow_"] {
|
||||
background-color: rgba(var(--gruv-dark-green-dark), 0.2);
|
||||
}
|
||||
[class^="colorable_"][class*="greenGlow_"]:hover,
|
||||
[class^="colorable_"][class*="greenGlow_"][class*="popoutOpen_"] {
|
||||
background-color: rgba(var(--gruv-dark-green-dark), 0.4);
|
||||
}
|
||||
|
||||
/* Add right border for left section */
|
||||
.visual-refresh .sidebarList_c48ade {
|
||||
border-right: 1px solid rgba(var(--gruv-dark-border-default))
|
||||
}
|
||||
|
||||
/* N new messages */
|
||||
.newMessagesBar__0f481 {
|
||||
background-color: rgba(var(--gruv-dark-bg-soft));
|
||||
color: rgba(var(--gruv-dark-text-primary))
|
||||
}
|
||||
.visual-refresh .barButtonAlt__0f481:hover {
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
/* Open voice button */
|
||||
/* .custom-profile-theme.theme-dark .themeColor_fb7f94.secondary_fb7f94 { */
|
||||
/* background-color: rgba(var(--gruv-dark-button-alt-default)) */
|
||||
/* } */
|
||||
/* .custom-profile-theme.theme-dark .themeColor_fb7f94.secondary_fb7f94:hover { */
|
||||
/* background-color: rgba(var(--gruv-dark-button-alt-hover)) */
|
||||
/* } */
|
||||
.custom-profile-theme.theme-dark [class*=themeColor i][class*=secondary i] {
|
||||
background-color: rgba(var(--gruv-dark-button-alt-default))
|
||||
}
|
||||
.custom-profile-theme.theme-dark [class*=themeColor i][class*=secondary i]:hover {
|
||||
background-color: rgba(var(--gruv-dark-button-alt-hover))
|
||||
}
|
||||
|
||||
.visual-refresh .section__00943 {
|
||||
background-color: rgba(var(--gruv-dark-bg))
|
||||
}
|
||||
|
||||
:where(.visual-refresh) .lookFilled__201d5.colorPrimary__201d5,
|
||||
:where(.visual-refresh) .medium_a45028 .inner_a45028 {
|
||||
background-color: rgba(var(--gruv-dark-bg))
|
||||
}
|
||||
|
||||
.menuOverlay_af7fb7,
|
||||
.card__39ec2 {
|
||||
background-color: rgba(var(--gruv-dark-bg))
|
||||
}
|
||||
|
||||
/* Background tweaks to fix Discord's inconsistent styling */
|
||||
|
||||
.connection_c7f964,
|
||||
.connectContainer_c7f964,
|
||||
.appDetailsContainer__50a54 {
|
||||
background-color: rgba(var(--gruv-dark-bg-soft));
|
||||
border: 1px solid rgba(var(--gruv-dark-border-default))
|
||||
}
|
||||
|
||||
.background__1fed1,
|
||||
.background__1fed1 > .fieldList__1fed1 {
|
||||
background-color: var(--user-profile-overlay-background);
|
||||
}
|
||||
|
||||
.badgeList__1fed1 {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* Hovering over gifs would cause them to go blank */
|
||||
.result__2dc39:after {
|
||||
content: normal;
|
||||
}
|
||||
|
||||
/* Contrast for some action buttons was too high, so.. */
|
||||
/* To see changes: Settings > Authorized Apps */
|
||||
|
||||
[class^="actionMenuButton_"] {
|
||||
background-color: rgba(var(--gruv-dark-bg-soft));
|
||||
border: 1px solid rgba(var(--gruv-dark-border-default));
|
||||
border-radius: 12px
|
||||
}
|
||||
[class^="actionMenuButton_"]:hover {
|
||||
background-color: rgba(var(--gruv-dark-bg));
|
||||
border: 1px solid rgba(var(--gruv-dark-border-hover));
|
||||
}
|
||||
|
||||
.visual-refresh .searchBar__35e86 {
|
||||
border: none !important
|
||||
}
|
||||
|
||||
/* Add border to account overview */
|
||||
/* Settings > My Account */
|
||||
[class^=accountProfileCard__] {
|
||||
border: 1px solid rgba(var(--gruv-dark-border-default));
|
||||
}
|
||||
|
||||
[class^=accountProfileCard__] {
|
||||
box-shadow: 0 0 5px black !important
|
||||
}
|
||||
|
||||
[class^=accountProfileCard__]:hover {
|
||||
box-shadow: 0 0 10px black !important
|
||||
}
|
||||
|
||||
.visual-refresh [class^=box_],
|
||||
[class^=appDetailsContainer],
|
||||
[class^=connectionOptionsWrapper] {
|
||||
background-color: var(--background-base-low) !important
|
||||
}
|
||||
|
||||
/* Make all titlebars the same */
|
||||
.visual-refresh .title_f75fb {
|
||||
background-color: rgba(var(--gruv-dark-bg-hard)) !important
|
||||
}
|
||||
|
||||
/* Remove bottom border for server title section */
|
||||
.visual-refresh [class^=header_] {
|
||||
border-bottom: none !important
|
||||
}
|
||||
|
||||
/* ==== Nuked elements ==== */
|
||||
|
||||
/* Top to bottom */
|
||||
|
||||
/* Quests banner */
|
||||
.wrapper__0d616 {
|
||||
display: none !important
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user