dotfiles/.config/wal/templates/discord_pywal.css

283 lines
8.7 KiB
CSS

:root {{
/* Special */
--background: {background};
--foreground: {foreground};
--cursor: {cursor};
/* Colors */
--color0: {color0};
--color1: {color1};
--color2: {color2};
--color3: {color3};
--color4: {color4};
--color5: {color5};
--color6: {color6};
--color7: {color7};
--color8: {color8};
--color9: {color9};
--color10: {color10};
--color11: {color11};
--color12: {color12};
--color13: {color13};
--color14: {color14};
--color15: {color15};
/* Transparency values (TODO: make it work with color0)
100% — FF 95% — F2 90% — E6 85% — D9 80% — CC 75% — BF 70% — B3 65% — A6 60% — 99 55% — 8C 50% — 80 45% — 73 40% — 66 35% — 59 30% — 4D 25% — 40 20% — 33 15% — 26 10% — 1A 5% — 0D 0% — 00
--background-lighter: {color0}d9;
*/
}}
element {{
font-size: 100%;
}} /* end element */
.theme-dark {{
--header-primary: var(--color15);
--header-secondary: var(--color7);
--text-normal: var(--color7);
--text-muted: var(--color7);
--text-link: var(--color12);
--channels-default: var(--color15);
--interactive-normal: var(--color15);
--interactive-hover: var(--color15);
--interactive-active: var(--color15);
--interactive-muted: var(--color7);
--background-primary: var(--color0);
--background-secondary: linear-gradient(
rgba(255, 255, 255, 0.02),
rgba(255, 255, 255, 0.02)
), var(--color0);
--background-secondary-alt: var(--color0);
--background-tertiary: var(--color0);
--background-accent: var(--color0);
--background-floating: var(--color0);
--background-mobile-primary: var(--color0);
--background-mobile-secondary: var(--color0);
--background-modifier-hover: rgba(79,84,92,0.16);
--background-modifier-active: rgba(79,84,92,0.24);
--background-modifier-selected: rgba(79,84,92,0.32);
--background-modifier-accent: hsla(0,0%,100%,0.06);
--background-mentioned: rgba(250,166,26,0.05);
--background-mentioned-hover: rgba(250,166,26,0.08);
--background-message-hover: rgba(4,4,5,0.07);
--elevation-stroke: 0 0 0 1px rgba(4,4,5,0.15);
--elevation-low: 0 1px 0 rgba(4,4,5,0.2),0 1.5px 0 rgba(6,6,7,0.05),0 2px 0 rgba(4,4,5,0.05);
--elevation-medium: 0 4px 4px rgba(0,0,0,0.16);
--elevation-high: 0 8px 16px rgba(0,0,0,0.24);
--logo-primary: #fff;
--guild-header-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
--channeltextarea-background: var(--color1);
--activity-card-background: #ff0000;
--textbox-markdown-syntax: var(--color15);
--deprecated-card-bg: rgba(32,34,37,0.6);
--deprecated-card-editable-bg: rgba(32,34,37,0.3);
--deprecated-store-bg: #36393f;
--deprecated-quickswitcher-input-background: var(--color8);
--deprecated-quickswitcher-input-placeholder: var(--color7);
--deprecated-text-input-bg: rgba(0,0,0,0.1);
--deprecated-text-input-border: rgba(0,0,0,0.3);
--deprecated-text-input-border-hover: #040405;
--deprecated-text-input-border-disabled: #202225;
--deprecated-text-input-prefix: #dcddde;
--background-primary-lighter: var(--background-lighter);
}} /* end .theme-dark */
.theme-light {{
--header-primary: var(--color8);
--header-secondary: var(--color0);
--text-normal: var(--color0);
--text-muted: var(--color8);
--text-link: var(--color12);
--channels-default: var(--color0);
--interactive-hover: var(--color8);
--interactive-active: var(--color8);
--interactive-muted: var(--color8);
--background-primary: var(--color7);
--background-secondary: var(--color15);
--background-secondary-alt: var(--color15);
--background-tertiary: var(--color7);
--background-accent: var(--color7);
--background-floating: var(--color7);
--background-mobile-primary: var(--color7);
--background-mobile-secondary: var(--color15);
--background-modifier-hover: rgba(79,84,92,0.16);
--background-modifier-active: rgba(79,84,92,0.24);
--background-modifier-selected: rgba(79,84,92,0.32);
--background-modifier-accent: hsla(0,0%,100%,0.06);
--background-mentioned: rgba(250,166,26,0.05);
--background-mentioned-hover: rgba(250,166,26,0.08);
--background-message-hover: rgba(4,4,5,0.07);
--elevation-stroke: 0 0 0 1px rgba(4,4,5,0.15);
--elevation-low: 0 1px 0 rgba(4,4,5,0.2),0 1.5px 0 rgba(6,6,7,0.05),0 2px 0 rgba(4,4,5,0.05);
--elevation-medium: 0 4px 4px rgba(0,0,0,0.16);
--elevation-high: 0 8px 16px rgba(0,0,0,0.24);
--logo-primary: #fff;
--guild-header-text-shadow: 0 1px 1px rgba(0,0,0,0.4);
--channeltextarea-background: var(--color15);
--activity-card-background: #ff0000;
--textbox-markdown-syntax: var(--color8);
--deprecated-card-bg: rgba(32,34,37,0.6);
--deprecated-card-editable-bg: rgba(32,34,37,0.3);
--deprecated-store-bg: #36393f;
--deprecated-quickswitcher-input-background: var(--color15);
--deprecated-quickswitcher-input-placeholder: var(--color8);
--deprecated-text-input-bg: rgba(0,0,0,0.1);
--deprecated-text-input-border: rgba(0,0,0,0.3);
--deprecated-text-input-border-hover: #040405;
--deprecated-text-input-border-disabled: #202225;
--deprecated-text-input-prefix: #dcddde;
}} /* end .theme-light */
.theme-dark .scrollerThemed-2oenus.themedWithTrack-q8E3vB> .scroller-2FKFPG {{
background-color: var(--background-color);
}}
.theme-dark .scrollerThemed-2oenus.themedWithTrack-q8E3vB>.scroller-2FKFPG::-webkit-scrollbar-track-piece {{
border-radius: 0px;
}}
/* Get rid of gift button */
button[aria-label="Send a gift"] {{
display: none;
}}
/* Change scrollbar to cleaner look */
::-webkit-scrollbar,
::-webkit-scrollbar-track,
::-webkit-scrollbar-track-piece {{
background: transparent !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
border: none !important;
width:5px !important;
}}
::-webkit-scrollbar-thumb{{
background: white !important;
width:5px !important;
border:none !important;
border-radius: 5px !important;
}}
/* Change friend list */
.peopleColumn-29fq28 {{
background-color: var(--background-primary) !important;
}}
/* User popout */
.headerNormal-T_seeN,
.header-2BwW8b,
.size16-14cGz5 {{
background-color: var(--background-primary) !important;
}}
.bodyInner-245q0L {{
background-color: var(--background-primary) !important;
}}
.footer-1fjuF6 {{
background-color: var(--background-primary) !important;
}}
.quickMessage-2XpSaN, .quickMessage-1yeL4E {{
background-color: var(--color1) !important;
}}
::placeholder {{
color: var(--color15) !important;
}}
/* voice chat box next to friend list */
.body-1ld4H7 {{
background-color: var(--color3) !important;
}}
/* invite friends */
.modal-yWgWj-,
.modal-1k91nT,
.sizeSmall-1jtLQy,
.fullscreenOnMobile-1aglG_ {{
background-color: var(--background-primary) !important;
}}
/* pop up windows */
.flex-1xMQg5,
.flex-1O1GKY,
.horizontalReverse-2eTKWD,
.horizontalReverse-3tRjY7,
.flex-1O1GKY,
.directionRowReverse-m8IjIq,
.justifyStart-2NDFzi,
.alignStretch-DpGPf3,
.noWrap-3jynv6,
.footer-3rDWdC,
.footer-1FPmkC,
.message-2qRu38 {{
background-color: var(--background-primary) !important;
}}
/* user settings */
.userInfoViewing-16kqK3,
.cardPrimary-1Hv-to,
.card-3Qj_Yx {{
background-color: var(--background-primary) !important;
}}
.inner-ZyuQk0,
.container-2zArDx,
.content-8biNdB {{
background-color: var(--background-primary) !important;
}}
/* searchbar */
.searchBar-3dMhjb {{
background-color: var(--color1) !important;
}}
/* green shadow while talking */
.avatarSpeaking-3MqCHL {{
-webkit-box-shadow: inset 0 0 0 2px #43b581,inset 0 0 0 3px var(--background-secondary) !important;
box-shadow: inset 0 0 0 0px #43b581,inset 0 0 0 2px #43b581 !important;
}}
.body-3iLsc4, .thin-1ybCId, .autocompleteInner-zh20B_ {{
background-color: var(--background-primary) !important;
}}
.selectorSelected-1_M1WV {{
background-color: var(--color4) !important;
}}
/* Member column
.members-1998pB {{
background-color: var(--background-primary-lighter) !important;
}}
*/
/*
@function lightness($color, $lightnessMultiplier){{
$color: str-replace($color, 'var(');
$color: str-replace($color, ')');
$color-h: var(#{{$color+'-h'}});
$color-s: var(#{{$color+'-s'}});
$color-l: var(#{{$color+'-l'}});
@return hsl($color-h, $color-s, calc(#{{$color-l}} * #{{$lightnessMultiplier}}));
}}
.childWrapper-anI2G9, .acronym-2mOFsV {{
background-color: linear-gradient(var(--color0), var(--color1));
}} */
/* Stream button
.button-1YfofB,
.buttonColor-7qQbGO,
.buttonActive-3FrkXp,
.button-38aScr,
.lookFilled-1Gx00P,
.colorBrand-3pXr91,
.sizeSmall-2cSMqn {{
background-color: var(--color0) !important;
}}