├── .gitignore ├── .idea ├── .gitignore ├── Discord.iml ├── icon.svg ├── modules.xml ├── php.xml └── vcs.xml ├── LICENCE ├── README.md ├── _variables.scss ├── app.scss ├── assets ├── banner.png ├── bonfire.gif ├── icon.png └── preview.png ├── betterdiscord ├── better-spotify.css ├── comfy.theme.css ├── main.css ├── no-scrollbar.css └── vencord-spotify.css └── stuff ├── _channel-bar.scss ├── _channel-list.scss ├── _chat.scss ├── _friends.scss ├── _member-list.scss ├── _other.scss ├── _plugins_support.scss ├── _server-list.scss ├── _settings.scss └── custom └── _no-scrollbar.scss /.gitignore: -------------------------------------------------------------------------------- 1 | prepros.config 2 | /.vscode/ 3 | sass.txt 4 | .prettierignore 5 | CHECKUP.txt 6 | node_modules 7 | dist 8 | .parcel-cache 9 | -------------------------------------------------------------------------------- /.idea/.gitignore: -------------------------------------------------------------------------------- 1 | # Default ignored files 2 | /shelf/ 3 | /workspace.xml 4 | # Editor-based HTTP Client requests 5 | /httpRequests/ 6 | -------------------------------------------------------------------------------- /.idea/Discord.iml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /.idea/icon.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.idea/modules.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.idea/php.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 9 | 10 | 13 | 14 | 16 | 17 | 19 | -------------------------------------------------------------------------------- /.idea/vcs.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /LICENCE: -------------------------------------------------------------------------------- 1 | DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE 2 | Version 2, December 2004 3 | 4 | Copyright (C) 2004 Sam Hocevar 5 | 6 | Everyone is permitted to copy and distribute verbatim or modified 7 | copies of this license document, and changing it is allowed as long 8 | as the name is changed. 9 | 10 | DO WHAT THE FUCK YOU WANT TO PUBLIC LICENSE 11 | 12 | TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION 13 | 14 | 0. You just DO WHAT THE FUCK YOU WANT TO. 15 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Preview 2 | 3 |
4 | Logo 5 | 6 |

Comfy

7 |

Stay comfy while talking to your friends

8 | 9 |
10 | 11 | » Theme Preview 12 | ・ 13 | Report an issue 14 | ・ 15 | Join the support server 16 |
17 |
18 | 19 | ## 📥 Installation 20 | 21 |
22 |
23 | BetterDiscord 24 |

BetterDiscord 25 |
Open Settings > Themes > Themes folder and copy the file downloaded here

26 |
27 | 28 |
29 | Vencord 30 |

Vencord 31 |
Copy https://comfy-themes.github.io/Discord/betterdiscord/comfy.theme.css into the box in Settings > Themes > Online Themes tab 32 |
Or upload the file downloaded here by clicking Upload Theme in Settings > Themes > Local Themes tab

33 |

34 | 35 | ## 🖌️ Customization 36 | 37 |
38 |
39 | BetterDiscord 40 |

BetterDiscord 41 |
Open Settings > Themes > Themes folder and open comfy.theme.css

42 |
43 | 44 |
45 | Vencord 46 |

Vencord 47 |
You need to have the theme in local, not online, then same steps as BetterDiscord

48 |
49 | 50 | ## 🫰 Credits 51 | 52 | Thanks a lot to : 53 | 54 | 🎨 Snapperito
55 | 🐶 Harley
56 | 🌴 Tropical
57 | 🥨 Strencher
58 | 💾 _david_ 59 | 60 | and others fren that I forgot for the help ! -------------------------------------------------------------------------------- /_variables.scss: -------------------------------------------------------------------------------- 1 | @use "app.scss"; 2 | 3 | @forward "stuff/custom/no-scrollbar"; 4 | 5 | :root { 6 | --disable-animations: 2s channel-unread infinite; 7 | --user-buttons-spacing: 8px; 8 | --user-buttons-color: #096DC0; 9 | --avatar-radius: 5px; 10 | --status-radius: 3px; 11 | --server-radius: 8px; 12 | --colored-emoji: grayscale(0%); 13 | --mention-color: #F04747; 14 | --unread-color: #7289DA; 15 | --mention-color-bar: #C66262; 16 | --mention-color-background: #C662621F; 17 | --mention-color-hover: #C6626226; 18 | --chat-buttons: #7289DA; 19 | --spotify-color: #1EDC62 !important; 20 | --online: #43B581; 21 | --iddle: #FAA61A; 22 | --dnd: #F04747; 23 | --offline: #747F8D; 24 | --streaming: #593695; 25 | --playing: #7289da; 26 | --listening: #1db653; 27 | --role-circle: 5px; 28 | --discord-logo: none; 29 | 30 | } 31 | 32 | .theme-dark { 33 | --modal-background: #23283d; 34 | --background-tertiary: #101320; 35 | --background-secondary: #1e2233; 36 | --background-secondary-alt: #191f2e; 37 | --background-primary: #23283d; 38 | --background-mobile-primary: #23283d; 39 | --background-mobile-secondary: #1e2233; 40 | --channeltextarea-background: #191f2e; 41 | --background-accent: #6E85D3; 42 | --background-message-hover: transparent; 43 | --background-modifier-hover: #00000010; 44 | --background-modifier-active: #0000001a; 45 | --background-modifier-selected: #0000001f; 46 | --deprecated-card-bg: #12141f63; 47 | --background-floating: #101320; 48 | --deprecated-quickswitcher-input-background:#101320; 49 | --elevation-low: none; 50 | --scrollbar-auto-thumb: #121722; 51 | --scrollbar-auto-track: #191f2e; 52 | --scrollbar-thin-thumb: #141925; 53 | --toast-background: #1e2233 !important; 54 | --toast-header: #101320 !important; 55 | --toast-contents: #23283d !important; 56 | --activity-card-background: #101320; 57 | --input-background: #1e2233; 58 | } 59 | 60 | .theme-light { 61 | --modal-background: #23283d; 62 | --background-tertiary: #101320; 63 | --background-secondary: #1e2233; 64 | --background-secondary-alt: #191f2e; 65 | --background-primary: #23283d; 66 | --background-accent: #6E85D3; 67 | --background-modifier-hover: #262b41; 68 | --background-modifier-active: #262b41; 69 | --header-primary: #fff; 70 | --header-secondary: #b1b5b9; 71 | --text-normal: #8e9297; 72 | --interactive-active: #fff; 73 | --interactive-hover: #b1b5b9; 74 | --input-background: var(--background-secondary-alt); 75 | } -------------------------------------------------------------------------------- /app.scss: -------------------------------------------------------------------------------- 1 | @forward "stuff/chat"; 2 | @forward "stuff/server-list"; 3 | @forward "stuff/channel-list"; 4 | @forward "stuff/channel-bar"; 5 | @forward "stuff/member-list"; 6 | @forward "stuff/settings"; 7 | @forward "stuff/friends"; 8 | @forward "stuff/other"; 9 | @forward "stuff/plugins_support"; 10 | 11 | @import url("https://nyri4.github.io/donators/donators.css"); 12 | 13 | .member_aa4760 .username__11d8c::after { 14 | bottom: 2px !important; 15 | left: 15px !important; 16 | } -------------------------------------------------------------------------------- /assets/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Comfy-Themes/Discord/5c10112e174f67a250404074e880e8c3cedc80bc/assets/banner.png -------------------------------------------------------------------------------- /assets/bonfire.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Comfy-Themes/Discord/5c10112e174f67a250404074e880e8c3cedc80bc/assets/bonfire.gif -------------------------------------------------------------------------------- /assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Comfy-Themes/Discord/5c10112e174f67a250404074e880e8c3cedc80bc/assets/icon.png -------------------------------------------------------------------------------- /assets/preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Comfy-Themes/Discord/5c10112e174f67a250404074e880e8c3cedc80bc/assets/preview.png -------------------------------------------------------------------------------- /betterdiscord/better-spotify.css: -------------------------------------------------------------------------------- 1 | /* ═══════『 🎵 ・ Better SpotifyControls seek bar 』*/ 2 | .container_6sXIoE { 3 | border-bottom: none !important; 4 | margin-bottom: 0 !important; 5 | } 6 | .container_6sXIoE .timeline_UWmgAx { 7 | position: relative !important; 8 | } 9 | .container_6sXIoE .bar_g2ZMIm { 10 | position: absolute !important; 11 | bottom: -6px !important; 12 | left: -8px !important; 13 | width: 240px !important; 14 | height: 53px !important; 15 | margin: 0 !important; 16 | -webkit-mask-image: linear-gradient(0.25turn, #0008, #0002) !important; 17 | mask-image: linear-gradient(0.25turn, #0008, #0002) !important; 18 | border-radius: 0 !important; 19 | } 20 | .barFill_Dhkah7 { 21 | border-radius: 0 !important; 22 | } 23 | .container_6sXIoE.maximized_vv2Wr0 .bar_g2ZMIm { 24 | height: 88px !important; 25 | } 26 | .container_6sXIoE .button_f67531:hover { 27 | background-color: transparent !important; 28 | } 29 | .barFill_Dhkah7, 30 | .timeline_UWmgAx:hover .barFill_Dhkah7 { 31 | background: var(--spotify-color) !important; 32 | } 33 | .inner_WRV6k5 { 34 | z-index: 1 !important; 35 | } 36 | .barText_lmqc5O, 37 | .grabber_7sd5f5 { 38 | display: none !important; 39 | } 40 | -------------------------------------------------------------------------------- /betterdiscord/comfy.theme.css: -------------------------------------------------------------------------------- 1 | /** 2 | * @name Comfy 3 | * @author Nyria#3863 4 | * @description Stay comfy while talking to your friends 5 | * @invite rtBQX5D3bD 6 | * @version 2.4 7 | * @donate https://ko-fi.com/nyria 8 | */ 9 | 10 | @import "https://comfy-themes.github.io/Discord/betterdiscord/main.css"; 11 | 12 | /* ═══════『 ⚠️・Important tips 』═══════ 13 | * 14 | * ➥ To comment or uncomment a line you need to put those "/" and "*" characters as you can see at the beginning and ending of my comments. 15 | * (You don't need to put a * at each line like I do, it's just for readability). See more here : https://developer.mozilla.org/en-US/docs/Web/CSS/Comments 16 | * 17 | * ➥ You can play with the values and see how it goes, don't delete "px" after the value if you don't have knowledge of CSS. 18 | * 19 | * ➥ To change the colors, replace the HEX code with the one you picked here : https://htmlcolorcodes.com 20 | */ 21 | 22 | /* ═══════『 🚫 ・ No scrollbars 』- Comment the line below if you want the scrollbar back */ 23 | @import "https://comfy-themes.github.io/Discord/betterdiscord/no-scrollbar.css"; 24 | 25 | /* ═══════『 🎵 ・ Better SpotifyControls seek bar 』- Comment the line below if you don't want this spotify bar */ 26 | @import "https://comfy-themes.github.io/Discord/betterdiscord/better-spotify.css"; 27 | 28 | /* ═══════『 🎵 ・ Vencord Spotify Plugin 』- Comment the line below if you don't want this spotify bar FOR VENCORD */ 29 | @import "https://comfy-themes.github.io/Discord/betterdiscord/vencord-spotify.css"; 30 | 31 | :root { 32 | /* ═══════『 💨 ・ Animations 』- If you don't want a high CPU usage, comment the line below */ 33 | --disable-animations: 2s channel-unread infinite; 34 | 35 | /* ═══════『 ⚙️ / 🎤 / 🎧 ・ User button 』═══════ 36 | * 37 | * ➥ A higher value means more space between the icons and a lower ... 38 | * 39 | * ℹ️ : If you want to revert those to the old area, join the support server and check #css-snippets 40 | * 41 | */ 42 | 43 | /* Spacing - Default value : 8px */ 44 | --user-buttons-spacing: 8px; 45 | 46 | /* Color - Default value : #096DC0 */ 47 | --user-buttons-color: #096dc0; 48 | 49 | /* ═══════『 ⭕ Roundness settings 』═══════ 50 | * 51 | * ➥ A higher value means more rounded corners and a lower ... 52 | * 0 ➜ Square 53 | * 25 ➜ Circle 54 | */ 55 | 56 | /* Avatars - Default value : 5px */ 57 | --avatar-radius: 5px; 58 | 59 | /* Status - Default value : 3px */ 60 | --status-radius: 3px; 61 | 62 | /* Servers - Default value : 8px */ 63 | --server-radius: 8px; 64 | 65 | /* ═══════『 😃 Colored emoji picker 』═══════ 66 | * Change the value to "100%" if you want the default one */ 67 | 68 | --colored-emoji: grayscale(0%); 69 | 70 | /* ═══════『 📜 Server/channel list 』═══════ */ 71 | 72 | /* Mention - Default value : #F04747 */ 73 | --mention-color: #f04747; 74 | 75 | /* Unread - Default value : #7289DA */ 76 | --unread-color: #7289da; 77 | 78 | /* 『 🔴 Mention colors in chat 』 */ 79 | 80 | /* Bar on the right - Default value : #C66262 */ 81 | --mention-color-bar: #c66262; 82 | 83 | /* Background - Default value : #C662621F */ 84 | --mention-color-background: #c662621f; 85 | 86 | /* On hover - Default value : #C6626226 */ 87 | --mention-color-hover: #c6626226; 88 | 89 | /* ═══════『 💬 Chat buttons 』═══════ */ 90 | 91 | /* Default value : #7289DA */ 92 | --chat-buttons: #7289da; 93 | 94 | /* ═══════『 💬 SpotifyControls seek bar 』═══════ 95 | * ℹ️ : If you don't have the plugin : https://betterdiscord.app/plugin/SpotifyControls */ 96 | 97 | /* Default value : #1EDC62 */ 98 | --spotify-color: #1edc62; 99 | 100 | /* ═══════『 🟢 Status 』═══════ */ 101 | 102 | /* Online - Default value : #43B581 */ 103 | --online: #43b581; 104 | 105 | /* Idle - Default value : #FAA61A */ 106 | --iddle: #faa61a; 107 | 108 | /* Do Not Disturb - Default value : #F04747 */ 109 | --dnd: #f04747; 110 | 111 | /* Offline - Default value : #747F8D */ 112 | --offline: #747f8d; 113 | 114 | /* Streaming - Default value : #593695 */ 115 | --streaming: #593695; 116 | 117 | /* ═══════『 🔰 User popout 』═══════ */ 118 | 119 | /* Playing wave color */ 120 | --playing: #7289da; 121 | 122 | /* Listening wave color */ 123 | --listening: #1db653; 124 | 125 | /* Role circle - Default value : 5px */ 126 | --role-circle: 5px; 127 | 128 | /* ═══════『 🗑️ Discord logo 』═══════ 129 | * Set it to "block" if you still want it */ 130 | 131 | --discord-logo: none; 132 | } 133 | 134 | .theme-dark { 135 | --background-primary: #23283d; 136 | --background-secondary: #1e2233; 137 | --background-secondary-alt: #191f2e; 138 | --background-tertiary: #101320; 139 | --background-accent: #7289da; 140 | 141 | --modal-background: #23283d; 142 | --background-mobile-primary: #23283d; 143 | --background-mobile-secondary: #1e2233; 144 | --channeltextarea-background: #191f2e; 145 | --background-message-hover: transparent; 146 | --background-modifier-hover: #00000010; 147 | --background-modifier-active: #0000001a; 148 | --background-modifier-selected: #0000001f; 149 | --deprecated-card-bg: #12141f63; 150 | --background-floating: #101320; 151 | --deprecated-quickswitcher-input-background: #101320; 152 | --elevation-low: none; 153 | --scrollbar-auto-thumb: #121722; 154 | --scrollbar-auto-track: #191f2e; 155 | --scrollbar-thin-thumb: #141925; 156 | --activity-card-background: #101320; 157 | --input-background: #1e2233; 158 | } 159 | 160 | .theme-light { 161 | --background-primary: #23283d; 162 | --background-secondary: #1e2233; 163 | --background-secondary-alt: #191f2e; 164 | --background-tertiary: #101320; 165 | --background-accent: #7289da; 166 | --background-modifier-hover: #262b41; 167 | --background-modifier-active: #262b41; 168 | --modal-background: var(--background-primary); 169 | --header-primary: #fff; 170 | --header-secondary: #b1b5b9; 171 | --text-normal: #8e9297; 172 | } 173 | -------------------------------------------------------------------------------- /betterdiscord/main.css: -------------------------------------------------------------------------------- 1 | @import url("https://nyri4.github.io/donators/donators.css"); 2 | :root .buttons_d5deea { 3 | transition: opacity 150ms; 4 | } 5 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 6 | position: fixed; 7 | bottom: 26.5px; 8 | left: 327.5px; 9 | z-index: 2; 10 | margin: 0; 11 | padding: 0; 12 | min-width: unset; 13 | } 14 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13 { 15 | width: 40px !important; 16 | height: 40px !important; 17 | } 18 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13 > svg { 19 | contain: unset; 20 | } 21 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13 foreignObject { 22 | width: 100% !important; 23 | height: 100% !important; 24 | } 25 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13 .pointerEvents_c51b4e { 26 | x: 31px; 27 | y: 31px; 28 | ry: var(--status-radius); 29 | width: 12px; 30 | height: 12px; 31 | } 32 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13:hover { 33 | opacity: 1; 34 | } 35 | :root .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 > .avatar_b2ca13 + .nameTag_b2ca13 { 36 | display: none; 37 | } 38 | :root .content_a4d4d9 > :nth-child(2):not(.chat_a7d72e), 39 | :root .callContainer_ed4410, 40 | :root .gatedContent_def860, 41 | :root .chat_a7d72e > .content_a7d72e > .container_a6d69a > .list_a6d69a[data-list-id^=forum-channel-list], 42 | :root .chat_a7d72e > .content_a7d72e > .pageContainer_a9a262, 43 | :root .forumOrHome_ff5f90 + .content_a7d72e > .container__93316, 44 | :root .container_f1fd9c, 45 | :root .background_e85cee, 46 | :root .page_d20375 { 47 | z-index: 2; 48 | } 49 | :root .chat_a7d72e > .content_a7d72e > .container_a6d69a > .list_a6d69a[data-list-id^=forum-channel-list] { 50 | background-color: var(--background-primary); 51 | } 52 | :root .chat_a7d72e .form_a7d72e { 53 | padding-left: 66px; 54 | } 55 | :root .chat_a7d72e .form_a7d72e .wrapper_faf5ab { 56 | z-index: unset; 57 | } 58 | :root .chat_a7d72e .form_a7d72e .channelTextArea_a7d72e .scrollableContainer_d0696b::after, 59 | :root .chat_a7d72e .form_a7d72e .wrapper_faf5ab::after { 60 | position: absolute; 61 | content: ""; 62 | bottom: 2px; 63 | left: -50px; 64 | width: 40px; 65 | height: 40px; 66 | background-color: var(--background-secondary); 67 | border-radius: calc(var(--avatar-radius) + 2px); 68 | } 69 | :root .typing_d7ebeb { 70 | left: 66px; 71 | right: 26px; 72 | } 73 | :root .lookFilled-yCfaCM.colorPrimary-2AuQVo, 74 | :root .lookFilled-yCfaCM.colorPrimary-2AuQVo:hover { 75 | background-color: var(--brand-experiment); 76 | } 77 | :root .container_d29eee { 78 | margin-left: 14px; 79 | margin-bottom: 16px; 80 | border-radius: 8px; 81 | } 82 | :root .spamBanner_c1da2c { 83 | position: relative; 84 | flex-direction: column; 85 | left: 56px; 86 | bottom: 8px; 87 | width: 330px; 88 | height: fit-content; 89 | row-gap: 30px; 90 | } 91 | :root .spamBanner_c1da2c .bannerTextContainer_c1da2c { 92 | min-width: 0; 93 | } 94 | :root .spamBanner_c1da2c .actionButtons_c1da2c { 95 | justify-content: space-around; 96 | } 97 | :root .messagesErrorBar_cf58b5 { 98 | border-radius: 15px; 99 | padding-bottom: 0; 100 | margin-bottom: 15px; 101 | } 102 | :root .messagesErrorBar_cf58b5:active { 103 | margin-bottom: 14px; 104 | } 105 | :root .newMessagesBar_cf58b5 { 106 | background-color: var(--background-accent); 107 | border-radius: 50px; 108 | margin-top: 5px; 109 | } 110 | :root .message_d5deea.mentioned_d5deea { 111 | background-color: var(--mention-color-background); 112 | } 113 | :root .message_d5deea.mentioned_d5deea::before { 114 | background: var(--mention-color-bar); 115 | padding: 1px; 116 | } 117 | :root .message_d5deea.mentioned_d5deea:hover { 118 | background-color: var(--mention-color-hover) !important; 119 | } 120 | :root .wrapper_ed5275:not([style]) { 121 | position: relative; 122 | color: var(--brand-experiment); 123 | background: transparent; 124 | } 125 | :root .wrapper_ed5275:not([style])::after { 126 | content: ""; 127 | opacity: 0.1; 128 | top: 0; 129 | left: 0; 130 | z-index: -1; 131 | position: absolute; 132 | width: 100%; 133 | height: 100%; 134 | background-color: var(--brand-experiment); 135 | border-radius: inherit; 136 | } 137 | :root .jumpToPresentBar_cf58b5, 138 | :root .jumpToPresentBar_cf58b5:active { 139 | margin-bottom: 13px; 140 | border-radius: 20px; 141 | padding: 0; 142 | } 143 | :root .autocompleteRow_bcc24e { 144 | padding: 0; 145 | } 146 | :root .autocompleteRow_bcc24e .base_bcc24e { 147 | border-radius: 0; 148 | } 149 | :root .autocompleteRow_bcc24e:first-of-type, 150 | :root .autocompleteRow_bcc24e .option_bea3ee { 151 | background-color: var(--background-tertiary); 152 | } 153 | :root .autocomplete_bcc24e { 154 | background: var(--background-secondary-alt); 155 | } 156 | :root .categoryHeader_fe2299, 157 | :root .autocomplete_bcc24e { 158 | background: var(--background-secondary); 159 | } 160 | :root .selected-3H3-RC { 161 | background: var(--background-primary); 162 | } 163 | :root .sprite_d91a75.spriteColored_d91a75 { 164 | opacity: 1 !important; 165 | } 166 | :root .sprite_d91a75.spriteGreyscale_d91a75 { 167 | opacity: 0 !important; 168 | } 169 | :root #emoji-picker-tab .contents_dd4f85, 170 | :root #sticker-picker-tab .contents_dd4f85, 171 | :root #bd-emotes-tab .contents_dd4f85 { 172 | text-indent: 100%; 173 | overflow: hidden; 174 | } 175 | :root .navList_af5dbb > *:not(#gif-picker-tab).navButton_af5dbb::after { 176 | position: absolute; 177 | content: ""; 178 | width: 20px; 179 | height: 20px; 180 | background-size: 100%; 181 | background-repeat: no-repeat; 182 | } 183 | :root .navList_af5dbb #sticker-picker-tab.navButton_af5dbb::after { 184 | background-image: url("https://i.imgur.com/S79punc.png"); 185 | } 186 | :root .navList_af5dbb #emoji-picker-tab.navButton_af5dbb::after { 187 | background-image: url("https://i.imgur.com/YOshExa.png"); 188 | } 189 | :root .navList_af5dbb #bd-emotes-tab.navButton_af5dbb::after { 190 | background-image: url("https://i.imgur.com/efz6JwF.png"); 191 | } 192 | :root .navList_af5dbb .navButton_af5dbb { 193 | width: 40px; 194 | padding: 8px; 195 | } 196 | :root .navButtonActive_af5dbb, 197 | :root .emojiItem_fbfedd.emojiItemSelected_fbfedd { 198 | background-color: rgba(110, 133, 211, 0.1294117647); 199 | } 200 | :root .imageLoading_b000dd { 201 | background-image: none !important; 202 | background-color: var(--background-primary); 203 | border-radius: 8px; 204 | } 205 | :root .contentWrapper_af5dbb { 206 | grid-row-gap: 20px; 207 | padding-top: 8px; 208 | } 209 | :root .contentWrapper_af5dbb .arrow_d64d50 { 210 | display: none; 211 | } 212 | :root .stickerInspected_a708c4 .inspectedIndicator_a708c4 { 213 | background-color: rgba(110, 133, 211, 0.1294117647); 214 | } 215 | :root .attachButton_d0696b .attachButtonPlus_f298d4, 216 | :root .attachButton_d0696b:hover .attachButtonPlus_f298d4 { 217 | fill: var(--chat-buttons); 218 | } 219 | :root .buttonWrapper_f9af59, 220 | :root .icon_f9af59 { 221 | color: var(--chat-buttons); 222 | } 223 | :root .contentWrapper_f7506e { 224 | background-color: var(--background-primary); 225 | } 226 | :root .container_e5da8b, :root .clickable_b78bb6 { 227 | background-color: var(--background-secondary); 228 | } 229 | :root .contentWarningPopout_fa823b { 230 | background-color: var(--background-secondary); 231 | } 232 | :root .scroller_f2bfbb { 233 | background: var(--background-tertiary); 234 | } 235 | :root .container_f2bfbb, 236 | :root .reactors_f2bfbb { 237 | background: var(--background-secondary); 238 | } 239 | :root .reactionSelected_f2bfbb, 240 | :root .reactionDefault_f2bfbb:hover { 241 | margin-right: 6px; 242 | } 243 | :root .reactionSelected_f2bfbb { 244 | background-color: rgba(110, 133, 211, 0.1294117647); 245 | } 246 | :root .invite_f61cb8 { 247 | background-color: var(--background-secondary); 248 | border-color: transparent; 249 | } 250 | :root .attachment_b52bef { 251 | border: none; 252 | } 253 | :root .embedSpotify_b0068a { 254 | border-radius: 5px; 255 | } 256 | :root .tile_ab47a1 { 257 | background-color: var(--background-secondary); 258 | } 259 | :root .tileHorizontal_ab47a1.tile_ab47a1:hover { 260 | background-color: var(--background-secondary-alt); 261 | } 262 | :root .invalidPoop_ff31dd { 263 | background-color: rgba(0, 0, 0, 0.103); 264 | } 265 | :root .spoilerText-27bIiA.hidden-3B-Rum, 266 | :root .spoilerText-27bIiA.hidden-3B-Rum:hover { 267 | background-color: var(--background-secondary-alt); 268 | } 269 | :root .wrapperAudio_f316dd { 270 | padding: 10px 0 0 0; 271 | border-color: transparent; 272 | } 273 | :root .audioMetadata_f316dd { 274 | padding: 5px 10px; 275 | } 276 | :root .audioControls_f316dd { 277 | border-radius: 0; 278 | } 279 | :root .hljs.scrollbar_c858ce { 280 | background-color: var(--background-secondary) !important; 281 | } 282 | :root .markup_f8f345 code { 283 | background: var(--deprecated-card-bg); 284 | } 285 | :root .emptyChannelIcon_c2668b { 286 | position: relative; 287 | background-color: transparent; 288 | } 289 | :root .emptyChannelIcon_c2668b::after { 290 | content: ""; 291 | opacity: 0.3; 292 | top: 0; 293 | left: 0; 294 | z-index: -1; 295 | position: absolute; 296 | width: 100%; 297 | height: 100%; 298 | background-color: var(--brand-experiment); 299 | border-radius: 8px; 300 | } 301 | 302 | :root .guilds_a4d4d9 .scroller_fea3ef { 303 | contain: none !important; 304 | padding-bottom: 170px; 305 | } 306 | :root .expandedFolderBackground_bc7085 { 307 | border-radius: var(--server-radius); 308 | } 309 | :root .folder_bc7085 { 310 | background-color: transparent; 311 | } 312 | :root .discoverHeader_b992d4 ~ .categoryItem_c72b37 { 313 | margin-left: 0; 314 | } 315 | :root .discoverHeader_b992d4 ~ .categoryItem_c72b37 .itemInner_c72b37 { 316 | padding: 8px; 317 | border-radius: 0; 318 | } 319 | :root .pageWrapper_a3a4ce { 320 | background-color: var(--background-primary); 321 | } 322 | :root .pageWrapper_a3a4ce .scroller-3j5xK2 { 323 | padding: 0 !important; 324 | } 325 | :root .pageWrapper_a3a4ce .headerImage-2D5D-v { 326 | position: relative; 327 | top: -8px; 328 | border-radius: 0; 329 | -webkit-mask: linear-gradient(black, transparent); 330 | } 331 | :root .pageWrapper_a3a4ce .guildListSection_c8c448 { 332 | padding: 0 32px 32px; 333 | box-sizing: border-box; 334 | } 335 | :root .scroller_a39aa3 { 336 | padding: 0 !important; 337 | } 338 | :root .scroller_a39aa3 .headerImage_a39aa3 { 339 | position: relative; 340 | top: -8px; 341 | border-radius: 0; 342 | -webkit-mask: linear-gradient(black, transparent); 343 | } 344 | :root .scroller_a39aa3 .guildListSection_ac51fa, 345 | :root .scroller_a39aa3 .footerDescription_a39aa3 { 346 | padding: 0 32px 32px; 347 | box-sizing: border-box; 348 | } 349 | :root .css-bcsufo-menu { 350 | background: var(--background-secondary-alt); 351 | } 352 | :root .css-1a1o7fb-control, 353 | :root .css-2dw5y-control, 354 | :root .css-p0ralp-control { 355 | background: var(--background-secondary); 356 | } 357 | :root .itemInner__2abad { 358 | padding: 8px; 359 | margin-left: 0; 360 | } 361 | :root .header_d33b18 { 362 | margin: -32px -32px 0 -32px; 363 | border-radius: 0; 364 | } 365 | :root .header_d33b18 .headerImage_d33b18 { 366 | border-radius: 0; 367 | -webkit-mask: linear-gradient(black, transparent); 368 | } 369 | :root .theme-light .root_f9a4c9, 370 | :root .theme-light .footer_f9a4c9 { 371 | box-shadow: none; 372 | } 373 | :root .theme-light .lookFilled_dd4f85.colorPrimary_dd4f85 { 374 | background-color: var(--brand-experiment); 375 | } 376 | :root .theme-light .contents_dd4f85 { 377 | color: #fff; 378 | } 379 | :root .theme-light .templatesList_fc9dae, 380 | :root .theme-light .optionsList_f5507e { 381 | padding: 0 !important; 382 | border-radius: 0; 383 | } 384 | :root .theme-light .templatesList_fc9dae .container_a47d49, 385 | :root .theme-light .optionsList_f5507e .container_a47d49 { 386 | border: none; 387 | border-radius: 0; 388 | } 389 | :root .theme-light .templatesList_fc9dae .optionHeader_fc9dae, 390 | :root .theme-light .optionsList_f5507e .optionHeader_fc9dae { 391 | text-align: center; 392 | margin: 12px 0; 393 | } 394 | :root .theme-light .createGuild_c1ee6b { 395 | padding: 10px !important; 396 | } 397 | :root .panels_a4d4d9 { 398 | z-index: 2; 399 | } 400 | :root .panels_a4d4d9 > .container_b2ca13 { 401 | height: 0; 402 | } 403 | :root .panels_a4d4d9 > .container_b2ca13 > .flex_dc333f { 404 | position: fixed; 405 | bottom: 0; 406 | left: 0; 407 | width: 72px; 408 | padding: 20px 0 10px 0; 409 | flex-direction: column; 410 | background: linear-gradient(transparent, var(--background-tertiary) 15%); 411 | } 412 | :root .panels_a4d4d9 > .container_b2ca13 > .flex_dc333f > .button_adca65 { 413 | color: var(--user-buttons-color); 414 | margin: var(--user-buttons-spacing) auto 0 auto; 415 | } 416 | :root .inner-1ilYF7 > .modal_c97cbd > .header_f9a4c9, 417 | :root .modal_c97cbd, 418 | :root .inner-1ilYF7 > .modal_c97cbd > .scrollerBase_eed6a8 { 419 | background: var(--background-secondary); 420 | } 421 | :root .unreadMentionsBar_fea3ef .text_edf32f { 422 | display: none; 423 | } 424 | :root .unreadMentionsIndicatorTop_fea3ef { 425 | width: 100%; 426 | height: 50px; 427 | top: -7px; 428 | padding: 0; 429 | } 430 | :root .unreadMentionsIndicatorTop_fea3ef .unreadMentionsBar_fea3ef { 431 | border-radius: 0; 432 | background: linear-gradient(var(--mention-color), rgba(0, 0, 0, 0)); 433 | transition: 100ms; 434 | } 435 | :root .unreadMentionsIndicatorTop_fea3ef .unreadMentionsBar_fea3ef:active { 436 | background: linear-gradient(var(--mention-color), rgba(0, 0, 0, 0)); 437 | } 438 | :root .unreadMentionsIndicatorBottom_fea3ef { 439 | width: 100%; 440 | height: 15px; 441 | padding: 0; 442 | } 443 | :root .unreadMentionsIndicatorBottom_fea3ef .unreadMentionsBar_fea3ef { 444 | border-radius: 0; 445 | background: linear-gradient(rgba(0, 0, 0, 0), var(--mention-color)); 446 | } 447 | :root .unreadMentionsIndicatorBottom_fea3ef .unreadMentionsBar_fea3ef:active { 448 | background: linear-gradient(rgba(0, 0, 0, 0), var(--mention-color)); 449 | } 450 | :root .lowerBadge_c5f96a { 451 | top: 0; 452 | left: 0; 453 | } 454 | :root .lowerBadge_c5f96a .numberBadge__40d6f { 455 | background-color: var(--mention-color) !important; 456 | } 457 | :root .lowerBadge_c5f96a .numberBadge__40d6f::before { 458 | content: ""; 459 | position: absolute; 460 | width: 16px; 461 | height: 16px; 462 | background-color: inherit; 463 | border-radius: 100%; 464 | z-index: -1; 465 | animation: var(--disable-animations), 2s pulse infinite; 466 | will-change: transform; 467 | } 468 | 469 | @keyframes pulse { 470 | 0% { 471 | transform: scale(1); 472 | opacity: 1; 473 | } 474 | 100% { 475 | transform: scale(1.75); 476 | opacity: 0; 477 | } 478 | } 479 | :root #guild-header-popout .item_d90b3d { 480 | flex-direction: row-reverse; 481 | } 482 | :root #guild-header-popout .item_d90b3d .iconContainer_d90b3d { 483 | margin: 0 8px 0 0; 484 | } 485 | :root #guild-header-popout .icon_ad5fac { 486 | width: 100%; 487 | height: 100%; 488 | } 489 | :root #guild-header-popout-premium-subscribe:hover, :root #guild-header-popout-premium-subscribe:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-premium-subscribe.focused_d90b3d { 490 | background-color: rgba(255, 115, 250, 0.1098039216); 491 | } 492 | :root #guild-header-popout-premium-subscribe .icon_d90b3d { 493 | color: #ff73fa; 494 | } 495 | :root #guild-header-popout-invite-people { 496 | color: #677bc4; 497 | } 498 | :root #guild-header-popout-invite-people:hover, :root #guild-header-popout-invite-people:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-invite-people.focused_d90b3d { 499 | background-color: rgba(103, 123, 196, 0.1176470588); 500 | } 501 | :root #guild-header-popout-invite-people .icon_d90b3d { 502 | color: #677bc4; 503 | } 504 | :root #guild-header-popout-settings:hover, :root #guild-header-popout-settings:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-settings.focused_d90b3d { 505 | background-color: rgba(84, 110, 122, 0.1176470588); 506 | } 507 | :root #guild-header-popout-settings .icon_d90b3d { 508 | color: #546e7a; 509 | } 510 | :root #guild-header-popout-insights:hover, :root #guild-header-popout-insights:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-insights.focused_d90b3d { 511 | background-color: rgba(26, 188, 156, 0.137254902); 512 | } 513 | :root #guild-header-popout-insights .icon_d90b3d { 514 | color: #1abc9c; 515 | } 516 | :root #guild-header-popout-create-channel:hover, :root #guild-header-popout-create-channel:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-create-channel.focused_d90b3d { 517 | background-color: rgba(233, 30, 98, 0.1294117647); 518 | } 519 | :root #guild-header-popout-create-channel .icon_d90b3d { 520 | color: #e91e63; 521 | } 522 | :root #guild-header-popout-create-category:hover, :root #guild-header-popout-create-category:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-create-category.focused_d90b3d { 523 | background-color: rgba(234, 161, 78, 0.0745098039); 524 | } 525 | :root #guild-header-popout-create-category .icon_d90b3d { 526 | color: #eaa14e; 527 | } 528 | :root #guild-header-popout-create-event:hover, :root #guild-header-popout-create-event:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-create-event.focused_d90b3d { 529 | background-color: rgba(237, 233, 230, 0.0666666667); 530 | } 531 | :root #guild-header-popout-create-event .icon_d90b3d > path:first-child { 532 | fill: #677bc4; 533 | } 534 | :root #guild-header-popout-create-event .icon_d90b3d > path:last-child { 535 | fill: #ede9e6; 536 | } 537 | :root #guild-header-popout-active-threads:hover, :root #guild-header-popout-active-threads:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-active-threads.focused_d90b3d { 538 | background-color: rgba(84, 136, 247, 0.1921568627); 539 | } 540 | :root #guild-header-popout-active-threads .icon_d90b3d { 541 | color: #5488f7; 542 | } 543 | :root #guild-header-popout-application-directory:hover, :root #guild-header-popout-application-directory:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-application-directory.focused_d90b3d { 544 | background-color: rgba(48, 73, 87, 0.0745098039); 545 | } 546 | :root #guild-header-popout-application-directory .icon_d90b3d { 547 | color: #304957; 548 | } 549 | :root #guild-header-popout-notifications:hover, :root #guild-header-popout-notifications:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-notifications.focused_d90b3d { 550 | background-color: rgba(233, 187, 72, 0.0823529412); 551 | } 552 | :root #guild-header-popout-notifications .icon_d90b3d { 553 | color: #fcd462; 554 | } 555 | :root #guild-header-popout-privacy:hover, :root #guild-header-popout-privacy:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-privacy.focused_d90b3d { 556 | background-color: rgba(74, 131, 212, 0.0941176471); 557 | } 558 | :root #guild-header-popout-privacy .icon_d90b3d { 559 | color: #4a84d4; 560 | } 561 | :root #guild-header-popout-change-nickname:hover, :root #guild-header-popout-change-nickname:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-change-nickname.focused_d90b3d { 562 | background-color: rgba(67, 181, 130, 0.0941176471); 563 | } 564 | :root #guild-header-popout-change-nickname .icon_d90b3d { 565 | color: #43b581; 566 | } 567 | :root #guild-header-popout-hide-muted-channels:hover, :root #guild-header-popout-hide-muted-channels:active:not(.hideInteraction_d90b3d), :root #guild-header-popout-hide-muted-channels.focused_d90b3d { 568 | background-color: rgba(92, 110, 177, 0.0901960784); 569 | } 570 | :root #guild-header-popout-hide-muted-channels:hover svg > path:first-child { 571 | color: var(--control-brand-foreground); 572 | } 573 | :root #guild-header-popout-hide-muted-channels:hover svg > path:last-child { 574 | color: #fff; 575 | } 576 | :root .mainContent_a08117 .arrow_d64d50 { 577 | display: none; 578 | } 579 | :root .spine_e1e976 { 580 | z-index: 1; 581 | } 582 | :root .container_fd6364 { 583 | background: var(--background-secondary); 584 | z-index: 3; 585 | } 586 | :root .unreadTop__6e8c4 { 587 | top: -9px; 588 | z-index: 2; 589 | width: 100%; 590 | padding: 0; 591 | } 592 | :root .unreadTop__6e8c4 .unreadBar_c43953.mention_edf32f { 593 | border-radius: 0; 594 | background: linear-gradient(var(--mention-color), rgba(0, 0, 0, 0)); 595 | } 596 | :root .unreadTop__6e8c4 .unreadBar_c43953.unread_edf32f { 597 | border-radius: 0; 598 | background: linear-gradient(var(--unread-color), rgba(0, 0, 0, 0)); 599 | } 600 | :root .unreadBottom__6be9f { 601 | width: 100%; 602 | height: 15px; 603 | padding: 0; 604 | } 605 | :root .unreadBottom__6be9f .unreadBar_c43953.mention_edf32f { 606 | border-radius: 0; 607 | background: linear-gradient(rgba(0, 0, 0, 0), var(--mention-color)); 608 | } 609 | :root .unreadBottom__6be9f .unreadBar_c43953.unread_edf32f { 610 | border-radius: 0; 611 | background: linear-gradient(rgba(0, 0, 0, 0), var(--unread-color)); 612 | } 613 | :root .unreadBar_c43953 > .text_edf32f { 614 | display: none; 615 | } 616 | :root .mentionsBadge_e2a798 .numberBadge__40d6f { 617 | background-color: var(--mention-color) !important; 618 | } 619 | :root .mentionsBadge_e2a798 .numberBadge__40d6f::before { 620 | content: ""; 621 | position: absolute; 622 | width: 16px; 623 | height: 16px; 624 | background-color: inherit; 625 | border-radius: 100%; 626 | z-index: -1; 627 | animation: var(--disable-animations), 2s pulse infinite; 628 | will-change: transform; 629 | } 630 | :root .unread_d8bfb3 { 631 | top: 50%; 632 | left: 5px; 633 | width: 6px; 634 | height: 6px; 635 | z-index: 1; 636 | background-color: var(--unread-color); 637 | border-radius: 10px; 638 | margin-top: 0; 639 | transform: translate(0%, -50%); 640 | } 641 | :root .unread_d8bfb3::before { 642 | content: ""; 643 | position: absolute; 644 | width: 6px; 645 | height: 6px; 646 | background-color: inherit; 647 | border-radius: 100%; 648 | z-index: 1; 649 | animation: var(--disable-animations), pulse 2s infinite; 650 | will-change: transform; 651 | } 652 | :root .activityPanel_a4d4d9, 653 | :root .container_adcaac { 654 | border-bottom: none; 655 | } 656 | :root .voiceUserSummary_c43953 svg:not(.icon_d03bba) { 657 | padding-right: 10px; 658 | } 659 | :root [mask="url(#svg-mask-voice-user-summary-item)"] { 660 | mask: none; 661 | } 662 | :root .tile_dc5fc4 { 663 | background-color: var(--background-secondary-alt); 664 | } 665 | :root .tile_dc5fc4 .button_e5cc00, 666 | :root .tile_dc5fc4 .buttonColor_d4af21 { 667 | background-color: var(--brand-experiment); 668 | } 669 | :root .container__13b2a .header-2C89wJ { 670 | background-color: var(--background-tertiary); 671 | } 672 | :root .container__13b2a section { 673 | background-color: var(--background-secondary); 674 | } 675 | :root .group_d25d19 { 676 | width: 110px; 677 | border: none; 678 | gap: 5px; 679 | } 680 | :root .group_d25d19 .item_d25d19 { 681 | border-radius: 8px; 682 | } 683 | :root .group_d25d19 .item_d25d19:hover.deny_d25d19, :root .group_d25d19 .item_d25d19.selected_d25d19.deny_d25d19 { 684 | color: #ed4245; 685 | background-color: rgba(237, 66, 69, 0.1843137255); 686 | } 687 | :root .group_d25d19 .item_d25d19:hover.passthrough_d25d19, :root .group_d25d19 .item_d25d19.selected_d25d19.passthrough_d25d19 { 688 | color: #dcddde; 689 | background-color: rgba(100, 100, 100, 0.2274509804); 690 | } 691 | :root .group_d25d19 .item_d25d19:hover.allow_d25d19, :root .group_d25d19 .item_d25d19.selected_d25d19.allow_d25d19 { 692 | color: #43b581; 693 | background-color: rgba(67, 181, 130, 0.231372549); 694 | } 695 | :root .inviteRow_cedfaf { 696 | border-radius: 0; 697 | padding-left: 15px; 698 | } 699 | :root .inviteRow_cedfaf:hover { 700 | background-color: var(--background-modifier-hover); 701 | } 702 | :root .autocompleteShadow-1aXK3x { 703 | box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1921568627); 704 | } 705 | :root .autocompleteShadow-1aXK3x + .autocompleteArrow-2CRgr2, :root .autocompleteShadow-1aXK3x ~ .header-PfVfAO { 706 | background: var(--background-secondary-alt); 707 | } 708 | :root .autocompleteShadow-1aXK3x ~ .sectionTag-euh3ZW { 709 | background: var(--background-secondary); 710 | } 711 | :root .autocompleteShadow-1aXK3x ~ .sectionTag-euh3ZW .row-3UUG_l { 712 | padding: 0; 713 | } 714 | :root .autocompleteShadow-1aXK3x ~ .header-PfVfAO .headerText-3k--Lk { 715 | margin-left: 15px; 716 | } 717 | :root .innerWrapper_aecbd6 { 718 | border-radius: 5px; 719 | } 720 | 721 | :root .container_fc4f04.themed_fc4f04 { 722 | background: var(--background-secondary); 723 | } 724 | :root .container_fc4f04.themed_fc4f04 .children_fc4f04::after { 725 | background: linear-gradient(90deg, rgba(54, 57, 63, 0) 0, var(--background-secondary)); 726 | } 727 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 { 728 | order: 1; 729 | margin-left: 4px; 730 | } 731 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef) .searchBar_a46bef { 732 | width: 27px; 733 | transition: 250ms; 734 | background-color: transparent; 735 | } 736 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef) .searchBar_a46bef .iconContainer_effbe2 { 737 | transform: scale(1.3); 738 | transition: 250ms; 739 | } 740 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef) .searchBar_a46bef .iconContainer_effbe2 .icon_effbe2 { 741 | color: var(--interactive-normal); 742 | } 743 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef):hover .searchBar_a46bef { 744 | width: 220px; 745 | background-color: var(--background-tertiary); 746 | } 747 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef):hover .searchBar_a46bef .iconContainer_effbe2 { 748 | transform: scale(1); 749 | } 750 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .search_a46bef:not(.open_a46bef):hover .searchBar_a46bef .iconContainer_effbe2 .icon_effbe2 { 751 | color: var(--text-muted); 752 | } 753 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .searchAnswer_b0fa94, 754 | :root .container_fc4f04.themed_fc4f04 .search_ff5f90 .searchFilter_b0fa94 { 755 | background-color: var(--background-primary); 756 | } 757 | :root .toolbar_fc4f04 > a[href="https://support.discord.com"], 758 | :root .searchLearnMore_b0286e { 759 | display: none; 760 | } 761 | :root .container_eedf95 { 762 | background-color: var(--background-secondary-alt); 763 | box-shadow: none; 764 | } 765 | :root .container_eedf95 .resultsGroup-1BPR25 .header-3A13BX { 766 | text-align: center; 767 | } 768 | :root .container_eedf95 .queryContainer_eedf95 { 769 | background-color: var(--background-tertiary); 770 | } 771 | :root .container_eedf95 .option_b0286e { 772 | margin: 0; 773 | border-radius: 0; 774 | } 775 | :root .container_eedf95 .option_b0286e::after { 776 | background: linear-gradient(90deg, rgba(54, 57, 63, 0), var(--background-secondary-alt) 80%); 777 | } 778 | :root .container_eedf95 .option_b0286e.selected-rZcOL- { 779 | background: linear-gradient(90deg, rgba(54, 57, 63, 0), var(--background-secondary) 80%); 780 | } 781 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker { 782 | background-color: var(--background-secondary-alt); 783 | } 784 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__day, :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__header { 785 | background: var(--background-secondary-alt) !important; 786 | border-color: var(--background-tertiary); 787 | } 788 | 789 | :root .bannerSVGWrapper_b32cc2 mask { 790 | display: none; 791 | } 792 | :root .userPopoutOuter_c69a7b { 793 | max-height: unset !important; 794 | } 795 | :root .userPopoutOuter_c69a7b .userPopoutInner_c69a7b { 796 | max-height: unset !important; 797 | } 798 | :root .userPopoutOuter_c69a7b .header_b8cc6d { 799 | min-height: 120px !important; 800 | } 801 | :root .userPopoutOuter_c69a7b .mask_d5fdb1 { 802 | overflow: visible; 803 | min-height: 120px !important; 804 | } 805 | :root .userPopoutOuter_c69a7b .mask_d5fdb1 foreignObject { 806 | mask: unset; 807 | } 808 | :root .userPopoutOuter_c69a7b .mask_d5fdb1 .banner_d5fdb1 { 809 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.6549019608), rgba(0, 0, 0, 0.6549019608)); 810 | height: 120px !important; 811 | } 812 | :root .userPopoutOuter_c69a7b .mask_d5fdb1 .pencilContainer_c3e427 { 813 | display: none; 814 | } 815 | :root .userPopoutOuter_c69a7b .mask_d5fdb1[viewBox="0 0 300 105"] foreignObject { 816 | transform: translateY(0px); 817 | } 818 | :root .userPopoutOuter_c69a7b .avatar_f94206 { 819 | top: 20px !important; 820 | left: 16px; 821 | } 822 | :root .userPopoutOuter_c69a7b .avatar_f94206 circle { 823 | display: none; 824 | } 825 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarHint_f89da9 { 826 | border-radius: 5px; 827 | } 828 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarHint_f89da9 foreignObject { 829 | mask: none; 830 | } 831 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarDecorationHint_f89da9 { 832 | border-radius: 5px !important; 833 | top: 0; 834 | left: 0; 835 | width: 80px; 836 | height: 80px; 837 | } 838 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarDecorationHint_f89da9 foreignObject { 839 | mask: none; 840 | } 841 | :root .userPopoutOuter_c69a7b .avatar_f94206 .overlay_f94206:after { 842 | border-radius: var(--avatar-radius); 843 | } 844 | :root .userPopoutOuter_c69a7b .statusBubble_d22603 { 845 | background-color: var(--background-tertiary); 846 | } 847 | :root .userPopoutOuter_c69a7b .body_b8cc6d { 848 | position: static; 849 | overflow: visible; 850 | } 851 | :root .userPopoutOuter_c69a7b .body_b8cc6d .container_c32acf { 852 | position: absolute; 853 | top: 20px; 854 | left: 115px; 855 | z-index: 1; 856 | max-width: 180px; 857 | text-overflow: ellipsis; 858 | white-space: nowrap; 859 | overflow: hidden; 860 | display: block; 861 | pointer-events: none; 862 | } 863 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d { 864 | padding: 16px; 865 | margin-top: 25px; 866 | z-index: 1; 867 | background: none !important; 868 | } 869 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d [style="color: var(--text-normal);"] { 870 | color: white !important; 871 | } 872 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .button_dd4f85 { 873 | border: none; 874 | background-color: rgba(255, 255, 255, 0.2); 875 | box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1294117647); 876 | color: #fff; 877 | border-radius: 8px; 878 | } 879 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .headerTextNormal_c1d9fd::before { 880 | content: ""; 881 | position: absolute; 882 | height: 25px; 883 | z-index: 1; 884 | width: 276px; 885 | top: -25px; 886 | left: 0; 887 | background: var(--background-secondary); 888 | background: var(--profile-gradient-primary-color); 889 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 890 | animation: animate2 8s linear infinite; 891 | animation-delay: 0s; 892 | opacity: 1; 893 | } 894 | @keyframes animate2 { 895 | 0% { 896 | -webkit-mask-position-x: 276px; 897 | } 898 | 100% { 899 | -webkit-mask-position-x: 0; 900 | } 901 | } 902 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d::before { 903 | content: ""; 904 | position: absolute; 905 | width: 100%; 906 | height: 100%; 907 | z-index: -2; 908 | left: 0; 909 | top: 0; 910 | background: #7289da; 911 | background: var(--playing); 912 | border-radius: 0 0 10px 10px; 913 | } 914 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d::after { 915 | content: ""; 916 | position: absolute; 917 | height: 25px; 918 | z-index: 2; 919 | width: 276px; 920 | top: -24px; 921 | left: 0; 922 | background: #7289da; 923 | background: var(--playing); 924 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 925 | animation: animate 6s linear infinite; 926 | animation-delay: 0s; 927 | opacity: 1; 928 | } 929 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .bar_b5cd55::before { 930 | content: ""; 931 | position: absolute; 932 | width: 100%; 933 | height: 100%; 934 | z-index: -1; 935 | left: 0; 936 | top: 0; 937 | background: #1db954; 938 | background: var(--listening); 939 | border-radius: 0 0 10px 10px; 940 | } 941 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .bar_b5cd55::after { 942 | content: ""; 943 | position: absolute; 944 | height: 25px; 945 | width: 276px; 946 | top: -24px; 947 | left: 0; 948 | z-index: 3; 949 | background: #1db653; 950 | background: var(--listening); 951 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 952 | animation: animate 6s linear infinite; 953 | animation-delay: 0s; 954 | } 955 | @keyframes animate { 956 | 0% { 957 | -webkit-mask-position-x: 0; 958 | } 959 | 100% { 960 | -webkit-mask-position-x: 276px; 961 | } 962 | } 963 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .bar_b5cd55 .barInner_ec2fa7 { 964 | background-color: white; 965 | } 966 | :root .userPopoutOuter_c69a7b .body_b8cc6d .activity_b8cc6d .platformIcon_c1d9fd { 967 | display: none; 968 | } 969 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e { 970 | position: relative; 971 | overflow: hidden; 972 | border: none; 973 | z-index: 1; 974 | } 975 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e:not(.addButton_e4010c) { 976 | pointer-events: none; 977 | } 978 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e .roleRemoveButton_f9575e { 979 | position: static; 980 | } 981 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e .roleRemoveButton_f9575e .roleCircle_a26d7b { 982 | width: var(--role-circle) !important; 983 | height: var(--role-circle) !important; 984 | pointer-events: auto; 985 | } 986 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e .roleRemoveButton_f9575e .roleCircle_a26d7b::before { 987 | position: absolute; 988 | content: ""; 989 | top: 0; 990 | left: 0; 991 | width: 100%; 992 | height: 100%; 993 | background: inherit; 994 | opacity: 0.3; 995 | z-index: -1; 996 | pointer-events: none; 997 | transition: background 200ms; 998 | } 999 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e .roleRemoveButton_f9575e .roleCircle_a26d7b:hover { 1000 | background: #fd5959 !important; 1001 | } 1002 | :root .userPopoutOuter_c69a7b .body_b8cc6d .role_f9575e .roleRemoveButton_f9575e .roleRemoveIcon_e4010c { 1003 | display: none; 1004 | } 1005 | :root .container_ac201b { 1006 | position: relative; 1007 | z-index: 1005; 1008 | border: none; 1009 | padding: 0; 1010 | background-color: #191f2e; 1011 | } 1012 | :root .container_ac201b .container_c18ec9 { 1013 | border-radius: 5px 5px 0 0; 1014 | } 1015 | :root .container_ac201b .list_eef3ef { 1016 | margin: 0; 1017 | padding: 0; 1018 | } 1019 | :root .container_ac201b .list_eef3ef .item_eef3ef { 1020 | margin: 5px; 1021 | position: relative; 1022 | overflow: hidden; 1023 | border-radius: 0; 1024 | } 1025 | :root .container_ac201b .list_eef3ef .item_eef3ef .popoutRoleCircle_f50ea3 { 1026 | width: 0; 1027 | border: none; 1028 | margin: 0; 1029 | } 1030 | :root .container_ac201b .list_eef3ef .item_eef3ef .popoutRoleCircle_f50ea3::before { 1031 | position: absolute; 1032 | border-radius: 5px; 1033 | content: ""; 1034 | top: 0; 1035 | left: 0; 1036 | width: 100%; 1037 | height: 100%; 1038 | background: inherit; 1039 | opacity: 0.2; 1040 | z-index: -1; 1041 | } 1042 | :root .root_b9fccc > .userProfileOuter_c69a7b { 1043 | width: 700px; 1044 | } 1045 | :root .root_b9fccc > .userProfileOuter_c69a7b header { 1046 | position: absolute; 1047 | width: 100%; 1048 | } 1049 | :root .root_b9fccc > .userProfileOuter_c69a7b header .mask_d5fdb1 > mask { 1050 | display: none; 1051 | } 1052 | :root .root_b9fccc > .userProfileOuter_c69a7b header .headerInner_b9fccc { 1053 | width: calc(100% - 8px); 1054 | box-sizing: border-box; 1055 | } 1056 | :root .root_b9fccc > .userProfileOuter_c69a7b header .avatar_f94206 { 1057 | top: -143px; 1058 | } 1059 | :root .root_b9fccc > .userProfileOuter_c69a7b .body_b9fccc { 1060 | position: relative; 1061 | top: 150px; 1062 | height: calc(100% - 185px); 1063 | } 1064 | :root .root_b9fccc > .userProfileOuter_c69a7b .body_b9fccc .container_c32acf { 1065 | position: relative; 1066 | top: 0px; 1067 | left: 150px; 1068 | z-index: 1; 1069 | font-size: 23px; 1070 | font-weight: 600; 1071 | } 1072 | :root .root_b9fccc > .userProfileOuter_c69a7b .body_b9fccc .overlay_b9fccc { 1073 | margin-top: 80px; 1074 | } 1075 | :root .root_b9fccc > .userProfileOuter_c69a7b .mask_c51b4e rect[fill=black], 1076 | :root .root_b9fccc > .userProfileOuter_c69a7b .mask_c51b4e circle[fill=black] { 1077 | display: none; 1078 | } 1079 | :root .root_b9fccc > .userProfileOuter_c69a7b .mask_c51b4e .cursorDefault_c51b4e rect, 1080 | :root .root_b9fccc > .userProfileOuter_c69a7b .mask_c51b4e .pointerEvents_c51b4e { 1081 | rx: calc(1px + var(--status-radius)); 1082 | ry: calc(1px + var(--status-radius)); 1083 | } 1084 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd { 1085 | padding: 16px; 1086 | margin: 12px; 1087 | border-radius: 5px; 1088 | overflow: hidden; 1089 | z-index: 1; 1090 | } 1091 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .headerText_c1d9fd, 1092 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .activityName_c1d9fd, 1093 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .null, 1094 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .details_c1d9fd, 1095 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .name_c1d9fd, 1096 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .nameNormal_c1d9fd, 1097 | :root .root_b9fccc > .userProfileOuter_c69a7b .activityProfileV2_c1d9fd .nameWrap_c1d9fd { 1098 | color: white; 1099 | } 1100 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6 { 1101 | position: relative; 1102 | padding: 0; 1103 | outline: 2px solid rgba(0, 0, 0, 0.25); 1104 | border: none; 1105 | border-radius: 4px; 1106 | width: 296px; 1107 | transition: outline-color 100ms; 1108 | overflow: hidden; 1109 | } 1110 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6 .connectedAccount_ab12c6 { 1111 | height: 100%; 1112 | } 1113 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6 .connectedAccount_ab12c6 .connectedAccountIcon_ab12c6 { 1114 | padding: 12px; 1115 | border-radius: 0; 1116 | height: 100%; 1117 | } 1118 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6 .connectedAccount_ab12c6 .connectedAccountNameContainer_ab12c6 { 1119 | padding: 12px 12px 12px 4px; 1120 | } 1121 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6.connectedAccountContainerWithMetadata_ab12c6 .connectedAccount_ab12c6 { 1122 | align-items: flex-start; 1123 | padding-bottom: 20px; 1124 | } 1125 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6.connectedAccountContainerWithMetadata_ab12c6 .connectedAccount_ab12c6 .connectedAccountIcon_ab12c6 { 1126 | padding: 12px; 1127 | width: 48px; 1128 | box-sizing: border-box; 1129 | } 1130 | :root .root_b9fccc > .userProfileOuter_c69a7b .connectedAccountContainer_ab12c6 .connectedAccountChildren_ab12c6 { 1131 | position: absolute; 1132 | left: 0; 1133 | bottom: 12px; 1134 | margin-left: 60px; 1135 | } 1136 | :root .root_b9fccc > .userProfileOuter_c69a7b .listRow_d2d6cb { 1137 | margin: 0; 1138 | padding: 8px 12px; 1139 | } 1140 | :root .root_b9fccc > .userProfileOuter_c69a7b .pencilContainer_c3e427 { 1141 | display: none; 1142 | } 1143 | :root .connectionIcon_e2a436[alt="Battle.net"], 1144 | :root .accountButtonInner_e2a436[aria-label="Battle.net"], 1145 | :root .connectedAccountIcon_ab12c6[aria-label="Battle.net"] { 1146 | background-color: rgba(29, 160, 242, 0.2823529412); 1147 | } 1148 | :root .connectionIcon_e2a436[alt=Twitch], 1149 | :root .accountButtonInner_e2a436[aria-label=Twitch], 1150 | :root .connectedAccountIcon_ab12c6[aria-label=Twitch] { 1151 | background-color: rgba(96, 27, 216, 0.3215686275); 1152 | } 1153 | :root .connectionIcon_e2a436[alt=YouTube], 1154 | :root .accountButtonInner_e2a436[aria-label=YouTube], 1155 | :root .connectedAccountIcon_ab12c6[aria-label=YouTube] { 1156 | background-color: rgba(217, 37, 43, 0.2862745098); 1157 | } 1158 | :root .connectionIcon_e2a436[alt=X], 1159 | :root .accountButtonInner_e2a436[aria-label=X], 1160 | :root .connectedAccountIcon_ab12c6[aria-label=X] { 1161 | background-color: rgba(0, 0, 0, 0.25); 1162 | } 1163 | :root .connectionIcon_e2a436[alt=Steam], 1164 | :root .accountButtonInner_e2a436[aria-label=Steam], 1165 | :root .connectedAccountIcon_ab12c6[aria-label=Steam] { 1166 | background-color: rgba(0, 0, 0, 0.2039215686); 1167 | } 1168 | :root .connectionIcon_e2a436[alt=Reddit], 1169 | :root .accountButtonInner_e2a436[aria-label=Reddit], 1170 | :root .connectedAccountIcon_ab12c6[aria-label=Reddit] { 1171 | background-color: rgba(254, 68, 1, 0.2392156863); 1172 | } 1173 | :root .connectionIcon_e2a436[alt=Facebook], 1174 | :root .accountButtonInner_e2a436[aria-label=Facebook], 1175 | :root .connectedAccountIcon_ab12c6[aria-label=Facebook] { 1176 | background-color: rgba(46, 50, 118, 0.5215686275); 1177 | } 1178 | :root .connectionIcon_e2a436[alt=Spotify], 1179 | :root .accountButtonInner_e2a436[aria-label=Spotify], 1180 | :root .connectedAccountIcon_ab12c6[aria-label=Spotify] { 1181 | background-color: rgba(30, 215, 95, 0.2039215686); 1182 | } 1183 | :root .connectionIcon_e2a436[alt=Xbox], 1184 | :root .accountButtonInner_e2a436[aria-label=Xbox], 1185 | :root .connectedAccountIcon_ab12c6[aria-label=Xbox] { 1186 | background-color: rgba(93, 194, 30, 0.2117647059); 1187 | } 1188 | :root .connectionIcon_e2a436[alt="League of Legends"], 1189 | :root .accountButtonInner_e2a436[aria-label="League of Legends"], 1190 | :root .connectedAccountIcon_ab12c6[aria-label="League of Legends"] { 1191 | background-color: rgba(206, 161, 70, 0.2196078431); 1192 | } 1193 | :root .connectionIcon_e2a436[alt=GitHub], 1194 | :root .accountButtonInner_e2a436[aria-label=GitHub], 1195 | :root .connectedAccountIcon_ab12c6[aria-label=GitHub] { 1196 | background-color: rgba(36, 41, 46, 0.3843137255); 1197 | } 1198 | :root .connectionIcon_e2a436[alt=Skype], 1199 | :root .accountButtonInner_e2a436[aria-label=Skype], 1200 | :root .connectedAccountIcon_ab12c6[aria-label=Skype] { 1201 | background-color: rgba(0, 118, 215, 0.2941176471); 1202 | } 1203 | :root .connectionIcon_e2a436[alt="Epic Games"], 1204 | :root .accountButtonInner_e2a436[aria-label="Epic Games"], 1205 | :root .connectedAccountIcon_ab12c6[aria-label="Epic Games"] { 1206 | background-color: rgba(47, 47, 47, 0.3490196078); 1207 | } 1208 | :root .connectionIcon_e2a436[alt="Riot Games"], 1209 | :root .accountButtonInner_e2a436[aria-label="Riot Games"], 1210 | :root .connectedAccountIcon_ab12c6[aria-label="Riot Games"] { 1211 | background-color: rgba(235, 28, 45, 0.2196078431); 1212 | } 1213 | :root .connectionIcon_e2a436[alt=PayPal], 1214 | :root .accountButtonInner_e2a436[aria-label=PayPal], 1215 | :root .connectedAccountIcon_ab12c6[aria-label=PayPal] { 1216 | background-color: rgba(0, 159, 227, 0.231372549); 1217 | } 1218 | :root .connectionIcon_e2a436[alt=TikTok], 1219 | :root .accountButtonInner_e2a436[aria-label=TikTok], 1220 | :root .connectedAccountIcon_ab12c6[aria-label=TikTok] { 1221 | background-color: rgba(100, 191, 197, 0.2745098039); 1222 | } 1223 | :root .connectionIcon_e2a436[alt=eBay], 1224 | :root .accountButtonInner_e2a436[aria-label=eBay], 1225 | :root .connectedAccountIcon_ab12c6[aria-label=eBay] { 1226 | background-color: rgba(197, 0, 0, 0.231372549); 1227 | } 1228 | :root .connectionIcon_e2a436[alt="PlayStation Network"], 1229 | :root .accountButtonInner_e2a436[aria-label="PlayStation Network"], 1230 | :root .connectedAccountIcon_ab12c6[aria-label="PlayStation Network"] { 1231 | background-color: rgba(0, 81, 174, 0.3254901961); 1232 | } 1233 | :root .connectionIcon_e2a436[alt=Instagram], 1234 | :root .accountButtonInner_e2a436[aria-label=Instagram], 1235 | :root .connectedAccountIcon_ab12c6[aria-label=Instagram] { 1236 | background-color: rgba(175, 1, 182, 0.25); 1237 | } 1238 | :root .connectionIcon_e2a436[alt=Roblox], 1239 | :root .accountButtonInner_e2a436[aria-label=Roblox], 1240 | :root .connectedAccountIcon_ab12c6[aria-label=Roblox] { 1241 | background-color: rgba(182, 191, 204, 0.25); 1242 | } 1243 | :root .connectionIcon_e2a436[alt=Crunchyroll], 1244 | :root .accountButtonInner_e2a436[aria-label=Crunchyroll], 1245 | :root .connectedAccountIcon_ab12c6[aria-label=Crunchyroll] { 1246 | background-color: rgba(243, 117, 33, 0.3); 1247 | } 1248 | 1249 | :root .contentRegion_c25c6d { 1250 | flex: 1 1 100%; 1251 | } 1252 | :root .contentColumn_c25c6d, 1253 | :root .customColumn_c25c6d, 1254 | :root .sidebarScrollable_ff90b2 + .content_ff90b2, 1255 | :root .customScroller_c25c6d > div { 1256 | max-width: 95%; 1257 | } 1258 | :root .sidebar_c25c6d { 1259 | padding: 60px 0 35px 65px; 1260 | width: 285px; 1261 | } 1262 | :root .searchBar_e7c031 { 1263 | border-radius: 5px 0 0 5px; 1264 | } 1265 | :root .sidebar_c25c6d > div > .item_a0, 1266 | :root #bd-settings-sidebar .ui-tab-bar-item { 1267 | padding: 8px 0 8px 10px; 1268 | border-radius: 5px 0 0 5px; 1269 | } 1270 | :root .closeButton_df5532 { 1271 | border-radius: 5px; 1272 | } 1273 | :root .keybind_df5532 { 1274 | display: none; 1275 | } 1276 | :root .accountProfileCard_b69b77 { 1277 | background-color: var(--background-secondary); 1278 | } 1279 | :root .accountProfileCard_b69b77 .mask_d5fdb1 > mask { 1280 | display: none; 1281 | } 1282 | :root .accountProfileCard_b69b77 .userInfo_b69b77 { 1283 | position: relative; 1284 | } 1285 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 { 1286 | top: -14px; 1287 | border-color: transparent; 1288 | border-width: 9px 0; 1289 | background-color: transparent; 1290 | } 1291 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 .imageUploaderInner_de76e4 { 1292 | border: none; 1293 | border-radius: var(--avatar-radius); 1294 | background-color: transparent; 1295 | } 1296 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 .imageUploaderIcon_de76e4 { 1297 | display: none; 1298 | } 1299 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 .pointerEvents_c51b4e { 1300 | x: 66px; 1301 | y: 66px; 1302 | width: 20px; 1303 | height: 20px; 1304 | rx: calc(var(--status-radius) + 1px); 1305 | stroke: var(--background-secondary); 1306 | stroke-width: 4px; 1307 | } 1308 | :root .accountProfileCard_b69b77 .background_b69b77 { 1309 | margin-right: 0; 1310 | } 1311 | :root .preview_bad983 .mask_d5fdb1 { 1312 | overflow: visible; 1313 | } 1314 | :root .preview_bad983 .mask_d5fdb1 mask { 1315 | display: none; 1316 | } 1317 | :root .preview_bad983 .mask_d5fdb1 foreignObject { 1318 | mask: unset; 1319 | } 1320 | :root .preview_bad983 .mask_d5fdb1 .banner_ab876d { 1321 | height: 120px; 1322 | } 1323 | :root .preview_bad983 .avatarUploaderPremium_ab876d { 1324 | top: 16px; 1325 | } 1326 | :root .preview_bad983 .avatarUploaderInner_ab876d { 1327 | border: none; 1328 | border-radius: var(--avatar-radius); 1329 | background-color: transparent; 1330 | } 1331 | :root .preview_bad983 .imageUploaderIcon_de76e4 { 1332 | display: none; 1333 | } 1334 | :root .preview_bad983 .status_ab876d { 1335 | background-color: transparent; 1336 | } 1337 | :root .preview_bad983 .status_ab876d rect { 1338 | mask: none; 1339 | rx: var(--status-radius); 1340 | ry: var(--status-radius); 1341 | } 1342 | :root .preview_bad983 .userText_c9ccf6 { 1343 | position: absolute; 1344 | top: 25px; 1345 | left: 115px; 1346 | } 1347 | :root .preview_bad983 .customStatus-3XAoF9 { 1348 | padding: 0 12px 12px 16px; 1349 | margin-bottom: 0; 1350 | background-color: var(--background-tertiary); 1351 | } 1352 | :root .preview_bad983 .divider-1wtgZ3 { 1353 | display: none; 1354 | } 1355 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f { 1356 | position: relative; 1357 | padding: 16px; 1358 | margin: 16px 0; 1359 | background-color: #7289da; 1360 | border-radius: 0 0 5px 5px; 1361 | } 1362 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f .defaultColor__77578, 1363 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f h3 { 1364 | color: white !important; 1365 | } 1366 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f::before { 1367 | content: ""; 1368 | position: absolute; 1369 | height: 21px; 1370 | z-index: 2; 1371 | width: 284px; 1372 | top: -20px; 1373 | left: 0; 1374 | background: #7289da; 1375 | background: var(--playing); 1376 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 1377 | animation: animate 6s linear infinite; 1378 | animation-delay: 0s; 1379 | opacity: 1; 1380 | } 1381 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f .fakeActivityTitle_dfbe6b::before { 1382 | content: ""; 1383 | position: absolute; 1384 | height: 21px; 1385 | z-index: 1; 1386 | width: 284px; 1387 | top: -21px; 1388 | left: 0; 1389 | background: var(--background-secondary); 1390 | background: var(--profile-gradient-primary-color); 1391 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 1392 | animation: animate2 4s linear infinite; 1393 | animation-delay: 0s; 1394 | opacity: 1; 1395 | } 1396 | :root .preview_bad983 .profileCustomizationPreview_ab876d .lastSection_d7a21f .button_dd4f85 { 1397 | border: none; 1398 | background-color: var(--listening-test); 1399 | box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1294117647); 1400 | color: #fff; 1401 | } 1402 | :root #activity-tab .max-width_d00e26, :root #activity-tab .max-width_a2e886, :root #requests-tab .container_f70f48 { 1403 | max-width: unset; 1404 | } 1405 | :root .cardPrimaryOutline-1ofwVz { 1406 | background-color: var(--background-secondary); 1407 | } 1408 | :root .tabBarItemContainer_e7c031, 1409 | :root .landingPageTabLink_f7189e { 1410 | flex-direction: row-reverse; 1411 | justify-content: flex-end; 1412 | } 1413 | :root .tabBarItemContainer_e7c031 .textBadge_f05120.baseShapeRound_df8943, 1414 | :root .landingPageTabLink_f7189e .textBadge_f05120.baseShapeRound_df8943 { 1415 | margin-right: 7px; 1416 | } 1417 | :root .connectionIcon_e2a436 { 1418 | border-radius: 5px; 1419 | padding: 4px; 1420 | } 1421 | :root .accountButtonInner_e2a436 { 1422 | border: none; 1423 | } 1424 | :root .premiumLabel_ae3c77 { 1425 | flex-direction: row-reverse; 1426 | justify-content: flex-end; 1427 | } 1428 | :root .premiumLabel_ae3c77 svg { 1429 | margin-right: 8px; 1430 | } 1431 | :root .premiumLabel_ae3c77 + .background_ae3c77 { 1432 | border-radius: 5px 0 0 5px; 1433 | } 1434 | :root .hero-1aNo0v { 1435 | max-width: unset; 1436 | } 1437 | :root .featuresHeader-2bjq5B { 1438 | text-align: center; 1439 | } 1440 | :root .banner_b12c98 { 1441 | max-width: unset; 1442 | } 1443 | :root .gemIndicatorContainer_b03ca0 { 1444 | background-color: var(--background-tertiary); 1445 | } 1446 | :root .boostContainer_dba803, :root .card_d1fdce { 1447 | background-color: var(--background-secondary); 1448 | } 1449 | :root .paymentRow_f66684, 1450 | :root .pageActions_d6a4eb, 1451 | :root .codeRedemptionRedirect_cb70f4 { 1452 | background: var(--background-secondary-alt); 1453 | } 1454 | :root .payment_a28a08:hover { 1455 | background-color: var(--background-secondary); 1456 | } 1457 | :root .expandedInfo_a28a08 { 1458 | background: var(--background-secondary); 1459 | } 1460 | :root .checked-1pZh2h { 1461 | background: transparent; 1462 | border-color: transparent; 1463 | } 1464 | :root .bottomDivider_f66684 { 1465 | border-bottom-color: transparent; 1466 | } 1467 | :root .notDetected-2HEmAp, 1468 | :root .addGamePopout_fd966d { 1469 | background: var(--background-secondary-alt); 1470 | } 1471 | :root .gameNameInput-3TuPuA:hover, 1472 | :root .gameNameInput-3TuPuA:focus { 1473 | background: var(--background-secondary-alt); 1474 | border: none; 1475 | } 1476 | :root .game-3x3aDt { 1477 | box-shadow: 0 1px 0 0 var(--background-secondary); 1478 | } 1479 | :root .game-3x3aDt .removeGame-3Le1LJ { 1480 | top: -3px; 1481 | right: -5px; 1482 | border-radius: 5px; 1483 | } 1484 | :root .css-17e1tep-control { 1485 | border: none; 1486 | } 1487 | :root .progress_a1107d { 1488 | background: var(--background-primary); 1489 | } 1490 | :root .notches_a1107d { 1491 | color: var(--background-secondary) !important; 1492 | } 1493 | :root .bannerUpsellContainer-31E9J5 { 1494 | background-color: var(--background-secondary); 1495 | } 1496 | :root .flexChild_dc333f[style="flex: 1 1 50%;"] { 1497 | flex: 1 !important; 1498 | } 1499 | :root .noticeRegion_c25c6d { 1500 | max-width: unset; 1501 | right: 0; 1502 | } 1503 | :root .noticeRegion_c25c6d .container_b6cd66 { 1504 | background: var(--background-tertiary) !important; 1505 | } 1506 | :root .customColorPicker_bbc020, 1507 | :root .container__33507 { 1508 | background: var(--background-secondary); 1509 | border-radius: 5px; 1510 | } 1511 | :root .roleRow_a930f1 { 1512 | margin: 5px 0; 1513 | background-color: var(--background-secondary); 1514 | } 1515 | :root .roleRow_a930f1:last-child { 1516 | border-radius: 4px 4px 0 0; 1517 | } 1518 | :root .roleRow_a930f1::before { 1519 | display: none; 1520 | } 1521 | :root .sidebar_e87574 { 1522 | border: none; 1523 | } 1524 | :root .sidebar_e87574 .list_e87574 { 1525 | padding: 0 20px; 1526 | position: relative; 1527 | overflow: hidden; 1528 | z-index: 1; 1529 | border-radius: 0; 1530 | } 1531 | :root .sidebar_e87574 .list_e87574 .role_e4010c { 1532 | border-radius: 5px; 1533 | margin-bottom: 6px; 1534 | padding-left: 20px; 1535 | } 1536 | :root .sidebar_e87574 .list_e87574 .role_e4010c .roleCircle_a26d7b { 1537 | width: 0; 1538 | margin: 0; 1539 | } 1540 | :root .sidebar_e87574 .list_e87574 .role_e4010c .roleCircle_a26d7b::before { 1541 | position: absolute; 1542 | border-radius: 5px; 1543 | content: ""; 1544 | top: 0; 1545 | left: 8px; 1546 | width: calc(100% - 8px); 1547 | height: 100%; 1548 | background: inherit; 1549 | opacity: 0.2; 1550 | z-index: -1; 1551 | transition: opacity 200ms; 1552 | } 1553 | :root .sidebar_e87574 .list_e87574 .role_e4010c .roleName-3910zV { 1554 | margin-left: 0; 1555 | } 1556 | :root .sidebar_e87574 .item_a0:hover:not(.disabled_a0), 1557 | :root .sidebar_e87574 .topPill-3DJJNV .item_a0:hover:not(.disabled_a0), 1558 | :root .sidebar_e87574 .selected_a0.item_a0, 1559 | :root .sidebar_e87574 .topPill-3DJJNV .selected_a0.item_a0 { 1560 | background: none; 1561 | } 1562 | :root .sidebar_e87574 .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::after, 1563 | :root .sidebar_e87574 .topPill-3DJJNV .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::after, 1564 | :root .sidebar_e87574 .selected_a0.item_a0 .roleCircle_a26d7b::after, 1565 | :root .sidebar_e87574 .topPill-3DJJNV .selected_a0.item_a0 .roleCircle_a26d7b::after { 1566 | position: absolute; 1567 | border-radius: 3px; 1568 | content: ""; 1569 | top: 0.5px; 1570 | bottom: 0.5px; 1571 | left: -3px; 1572 | width: 8px; 1573 | background: inherit; 1574 | z-index: -1; 1575 | transition: opacity 200ms; 1576 | } 1577 | :root .sidebar_e87574 .item_a0:hover:not(.disabled_a0), 1578 | :root .sidebar_e87574 .topPill-3DJJNV .item_a0:hover:not(.disabled_a0) { 1579 | background: none; 1580 | } 1581 | :root .sidebar_e87574 .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::before, 1582 | :root .sidebar_e87574 .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::after, 1583 | :root .sidebar_e87574 .topPill-3DJJNV .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::before, 1584 | :root .sidebar_e87574 .topPill-3DJJNV .item_a0:hover:not(.disabled_a0) .roleCircle_a26d7b::after { 1585 | opacity: 0.3; 1586 | } 1587 | :root .sidebar_e87574 .selected_a0.item_a0, 1588 | :root .sidebar_e87574 .topPill-3DJJNV .selected_a0.item_a0 { 1589 | background: none; 1590 | } 1591 | :root .sidebar_e87574 .selected_a0.item_a0 .roleCircle_a26d7b::before, 1592 | :root .sidebar_e87574 .selected_a0.item_a0 .roleCircle_a26d7b::after, 1593 | :root .sidebar_e87574 .topPill-3DJJNV .selected_a0.item_a0 .roleCircle_a26d7b::before, 1594 | :root .sidebar_e87574 .topPill-3DJJNV .selected_a0.item_a0 .roleCircle_a26d7b::after { 1595 | opacity: 0.5 !important; 1596 | } 1597 | :root .contentWidth_bd05f1 { 1598 | max-width: unset; 1599 | } 1600 | :root .contentWidth_bd05f1 .previewContainer_da1bd9 { 1601 | border: none; 1602 | } 1603 | :root .contentWidth_bd05f1 .previewContainer_da1bd9 .theme-light { 1604 | display: none; 1605 | } 1606 | :root .contentWidth_bd05f1 .previewContainer_da1bd9 .messageContainer_da1bd9 { 1607 | background-color: var(--background-secondary); 1608 | } 1609 | :root .banner_ad4cb5 { 1610 | max-width: unset; 1611 | } 1612 | :root div.emojiRow_dc1809 { 1613 | display: inline-grid; 1614 | grid-template-areas: "image name" "uploader uploader"; 1615 | height: unset; 1616 | box-shadow: none; 1617 | row-gap: 32px; 1618 | column-gap: 16px; 1619 | margin: 0 8px 8px 0; 1620 | background-color: var(--background-secondary); 1621 | border-radius: 8px; 1622 | overflow: hidden; 1623 | } 1624 | :root div.emojiRow_dc1809::before { 1625 | top: -5px; 1626 | height: calc(50% + 10px); 1627 | background-color: var(--background-secondary-alt); 1628 | border-radius: 0; 1629 | } 1630 | :root div.emojiRow_dc1809 .emojiColumn_dc1809 { 1631 | grid-area: image; 1632 | } 1633 | :root div.emojiRow_dc1809 .emojiColumn_dc1809 .emojiImage_dc1809 { 1634 | width: 40px; 1635 | height: 40px; 1636 | } 1637 | :root div.emojiRow_dc1809 .column_dc1809:nth-child(2) { 1638 | grid-area: name; 1639 | margin: 0; 1640 | } 1641 | :root div.emojiRow_dc1809 .column_dc1809:nth-child(3) { 1642 | grid-area: uploader; 1643 | margin-left: 0; 1644 | } 1645 | :root div.emojiRow_dc1809 .emojiRemove_dc1809 { 1646 | top: unset; 1647 | bottom: -25px; 1648 | right: 5px; 1649 | opacity: 1; 1650 | border-radius: 8px; 1651 | transition: 200ms bottom; 1652 | } 1653 | :root div.emojiRow_dc1809:hover .emojiRemove_dc1809 { 1654 | bottom: 5px; 1655 | } 1656 | :root .emojiAliasInput_dc1809 .emojiInput_dc1809 { 1657 | background: var(--background-secondary); 1658 | } 1659 | :root .card_ffe375 { 1660 | box-shadow: none; 1661 | padding: 16px; 1662 | } 1663 | :root .card_ffe375::before { 1664 | left: 0; 1665 | right: 0; 1666 | background: var(--background-secondary); 1667 | border-color: transparent; 1668 | opacity: 1; 1669 | margin: 5px 0; 1670 | } 1671 | :root .inputWrapper-1YNMmM { 1672 | width: unset; 1673 | } 1674 | :root .inputWrapper-1YNMmM .input-2g-os5 { 1675 | border: none; 1676 | } 1677 | :root .headerClickable_eebd33, 1678 | :root .headerDefault_eebd33, 1679 | :root .headerExpanded_eebd33 { 1680 | background: var(--background-secondary); 1681 | border-radius: 8px; 1682 | } 1683 | :root .auditLog_eebd33 { 1684 | border: none; 1685 | } 1686 | :root .auditLog_eebd33 .headerClickable_eebd33 { 1687 | background-color: var(--background-secondary-alt); 1688 | border-radius: 8px; 1689 | } 1690 | :root .auditLog_eebd33 .headerExpanded_eebd33 { 1691 | background-color: var(--background-secondary-alt); 1692 | border-radius: 8px 8px 0 0; 1693 | } 1694 | :root .auditLog_eebd33 .changeDetails_eebd33 { 1695 | background-color: var(--background-secondary); 1696 | border-radius: 0 0 8px 8px; 1697 | } 1698 | :root .auditLog_eebd33 .divider-_0um2u { 1699 | display: none; 1700 | } 1701 | :root .card_ea2a21, 1702 | :root .header_adb740 { 1703 | border: none; 1704 | } 1705 | :root .body_adb740, 1706 | :root .cardPrimaryEditable-2mz_3i { 1707 | background: var(--background-secondary); 1708 | border: none; 1709 | } 1710 | :root .copyInput_d7e343 { 1711 | border: none; 1712 | } 1713 | :root .css-gvi9bl-control, 1714 | :root .css-6fzn47-control { 1715 | border: none; 1716 | } 1717 | :root .css-3vaxre-menu { 1718 | background: var(--background-secondary-alt); 1719 | border: none; 1720 | } 1721 | :root .css-dwar6a-menu { 1722 | background-color: var(--background-secondary-alt); 1723 | } 1724 | :root .editableFieldsContainer-1p_q_4 { 1725 | width: unset; 1726 | } 1727 | :root .channelIcon-1eKmlw, 1728 | :root .channelIcon_e3f8c2 { 1729 | background: var(--background-secondary-alt); 1730 | } 1731 | :root .descriptionInput-3b30C8 { 1732 | background: var(--background-secondary-alt); 1733 | border: none; 1734 | } 1735 | :root .serverBoostTabItem_f7189e > div { 1736 | flex-direction: row-reverse; 1737 | justify-content: flex-end; 1738 | } 1739 | :root .serverBoostTabItem_f7189e > div .icon_f7189e { 1740 | margin-right: 8px; 1741 | } 1742 | :root .tierBody_da77bd { 1743 | background: var(--background-secondary); 1744 | } 1745 | :root .tierHeaderContent_da77bd, 1746 | :root .tierInProgress_bfac79 { 1747 | background: var(--background-secondary-alt); 1748 | } 1749 | :root .background_bfac79 { 1750 | color: var(--background-secondary-alt); 1751 | } 1752 | :root .subscribers_da77bd .subscriberMask_da77bd { 1753 | margin-right: 8px; 1754 | } 1755 | :root .member-2cj2PI:nth-child(3) { 1756 | margin-top: 10px; 1757 | } 1758 | :root .overflowRolesPopout_e4010c { 1759 | background: var(--background-secondary); 1760 | } 1761 | 1762 | :root .peopleColumn_c2739c { 1763 | background: var(--background-primary); 1764 | } 1765 | :root .nowPlayingColumn_c2739c { 1766 | background: var(--background-secondary-alt); 1767 | } 1768 | :root .nowPlayingColumn_c2739c .scroller_bf550a { 1769 | border: none; 1770 | } 1771 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf { 1772 | border: none; 1773 | } 1774 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf.active_ac5d22, :root .nowPlayingColumn_c2739c .itemCard_f02fcf.interactive_ac5d22:hover { 1775 | background: var(--background-secondary); 1776 | } 1777 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf .section_cd82a7:last-child { 1778 | margin-top: 10px; 1779 | } 1780 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf .inset_ac5d22 { 1781 | background: transparent; 1782 | } 1783 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf .applicationStreamingPreviewWrapper_cd82a7 { 1784 | background-color: var(--background-secondary); 1785 | } 1786 | :root .nowPlayingColumn_c2739c .itemCard_f02fcf .separator_cd82a7 { 1787 | display: none; 1788 | } 1789 | :root .bottomControls_dd069c .centerButton_ef18ee { 1790 | border-radius: 7px; 1791 | } 1792 | :root .bottomControls_dd069c .colorable_ef18ee.primaryDark_ef18ee { 1793 | background: var(--background-secondary-alt); 1794 | } 1795 | :root .bottomControls_dd069c foreignObject { 1796 | mask: none; 1797 | } 1798 | :root .participantsButton_b83b18 { 1799 | background: var(--background-secondary-alt); 1800 | } 1801 | :root .quickSelect__540d0 { 1802 | margin-top: 10px; 1803 | } 1804 | :root .quickSelectPopout_abbf45.regionSelectPopout_ccb5ca { 1805 | background: var(--background-secondary-alt); 1806 | box-shadow: none; 1807 | } 1808 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 { 1809 | overflow: visible; 1810 | min-height: 120px !important; 1811 | } 1812 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 foreignObject { 1813 | mask: unset; 1814 | } 1815 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 .banner_d5fdb1 { 1816 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.6549019608), rgba(0, 0, 0, 0.6549019608)); 1817 | height: 120px; 1818 | } 1819 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 .pencilContainer_c3e427 { 1820 | display: none; 1821 | } 1822 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2[viewBox="0 0 340 60"] foreignObject { 1823 | transform: translateY(-30px); 1824 | } 1825 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2[viewBox="0 0 340 90"] foreignObject { 1826 | transform: translateY(-15px); 1827 | } 1828 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 { 1829 | top: 20px !important; 1830 | left: 16px; 1831 | } 1832 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 circle { 1833 | display: none; 1834 | } 1835 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 { 1836 | border-radius: 5px; 1837 | } 1838 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 foreignObject { 1839 | mask: none; 1840 | } 1841 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarDecorationHint_f89da9 { 1842 | border-radius: 5px !important; 1843 | top: 0; 1844 | left: 0; 1845 | width: 80px; 1846 | height: 80px; 1847 | } 1848 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarDecorationHint_f89da9 foreignObject { 1849 | mask: none; 1850 | } 1851 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) { 1852 | position: static; 1853 | overflow: visible; 1854 | margin: 16px; 1855 | max-height: calc(100vh - 200px); 1856 | } 1857 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f > .copiableNameTag_c9ccf6 > .clickTarget__440f0, :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f > div > .userText_c9ccf6 { 1858 | position: absolute; 1859 | top: 25px; 1860 | left: 115px; 1861 | z-index: 1; 1862 | max-width: 200px; 1863 | text-overflow: ellipsis; 1864 | white-space: nowrap; 1865 | overflow: hidden; 1866 | display: block; 1867 | } 1868 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f > .copiableNameTag_c9ccf6 > .clickTarget__440f0 > span, :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f > div > .userText_c9ccf6 > span { 1869 | word-break: unset; 1870 | white-space: unset; 1871 | } 1872 | :root .userPanelOuter_c69a7b .pronouns_c9ccf6 { 1873 | padding-top: 12px; 1874 | } 1875 | :root .userPanelOuter_c69a7b .badgelistGroup_ab525a { 1876 | min-height: 0px; 1877 | } 1878 | :root .userPanelOuter_c69a7b .badgeList_ab525a { 1879 | position: absolute; 1880 | top: 70px; 1881 | left: 110px; 1882 | height: unset; 1883 | z-index: 1; 1884 | background-color: transparent; 1885 | } 1886 | :root .userPanelOuter_c69a7b .divider_ae36e5 { 1887 | display: none; 1888 | } 1889 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) { 1890 | padding: 12px; 1891 | } 1892 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .scroller_d2b491 { 1893 | padding-right: 12px !important; 1894 | } 1895 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e { 1896 | padding: 16px; 1897 | margin-top: 25px; 1898 | z-index: 1; 1899 | } 1900 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .text_ec2fa7, 1901 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .textRow_c1d9fd, 1902 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .anchor_af404b, 1903 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .activityName_c1d9fd { 1904 | color: white; 1905 | } 1906 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .buttonColor_e36233 { 1907 | border: none; 1908 | background-color: var(--listening-test); 1909 | box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1294117647); 1910 | color: #fff; 1911 | } 1912 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .headerTextNormal_c1d9fd::before { 1913 | content: ""; 1914 | position: absolute; 1915 | height: 25px; 1916 | z-index: 1; 1917 | width: 284px; 1918 | top: -25px; 1919 | left: 0; 1920 | background: var(--background-secondary); 1921 | background: var(--profile-gradient-primary-color); 1922 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 1923 | animation: animate2 8s linear infinite; 1924 | animation-delay: 0s; 1925 | opacity: 1; 1926 | } 1927 | @keyframes animate2 { 1928 | 0% { 1929 | -webkit-mask-position-x: 284px; 1930 | } 1931 | 100% { 1932 | -webkit-mask-position-x: 0; 1933 | } 1934 | } 1935 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e::before { 1936 | content: ""; 1937 | position: absolute; 1938 | width: 100%; 1939 | height: 100%; 1940 | z-index: -2; 1941 | left: 0; 1942 | top: 0; 1943 | background: #7289da; 1944 | background: var(--playing); 1945 | border-radius: 0 0 10px 10px; 1946 | } 1947 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e::after { 1948 | content: ""; 1949 | position: absolute; 1950 | height: 25px; 1951 | z-index: 2; 1952 | width: 284px; 1953 | top: -24px; 1954 | left: 0; 1955 | background: #7289da; 1956 | background: var(--playing); 1957 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 1958 | animation: animate 6s linear infinite; 1959 | animation-delay: 0s; 1960 | opacity: 1; 1961 | } 1962 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .timeBarUserPopoutV2_c1d9fd::before { 1963 | content: ""; 1964 | position: absolute; 1965 | width: 100%; 1966 | height: 100%; 1967 | z-index: -1; 1968 | left: 0; 1969 | top: 0; 1970 | background: #1db954; 1971 | background: var(--listening); 1972 | border-radius: 0 0 10px 10px; 1973 | } 1974 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .timeBarUserPopoutV2_c1d9fd::after { 1975 | content: ""; 1976 | position: absolute; 1977 | height: 25px; 1978 | width: 284px; 1979 | top: -24px; 1980 | left: 0; 1981 | z-index: 3; 1982 | background: #1db653; 1983 | background: var(--listening); 1984 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 1985 | animation: animate 6s linear infinite; 1986 | animation-delay: 0s; 1987 | } 1988 | @keyframes animate { 1989 | 0% { 1990 | -webkit-mask-position-x: 0; 1991 | } 1992 | 100% { 1993 | -webkit-mask-position-x: 284px; 1994 | } 1995 | } 1996 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .timeBarUserPopoutV2_c1d9fd .barInner_ec2fa7 { 1997 | background-color: white; 1998 | } 1999 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) .activity__20c1e .platformIcon_c1d9fd { 2000 | display: none; 2001 | } 2002 | 2003 | .titleBar_a934d8 { 2004 | z-index: 1001; 2005 | } 2006 | 2007 | .winButton_a934d8:not(:last-child) > svg { 2008 | display: none; 2009 | } 2010 | .winButton_a934d8:not(:last-child)::after { 2011 | content: ""; 2012 | border-radius: 50px; 2013 | pointer-events: fill; 2014 | } 2015 | .winButton_a934d8:hover { 2016 | background-color: var(--background-tertiary); 2017 | } 2018 | 2019 | .winButtonClose_a934d8 { 2020 | margin-right: 5px; 2021 | } 2022 | .winButtonClose_a934d8::after { 2023 | padding: 6px; 2024 | background-image: url("https://i.imgur.com/WAbJScJ.png"); 2025 | background-size: 100%; 2026 | } 2027 | .winButtonClose_a934d8:hover::after { 2028 | background-image: url("https://i.imgur.com/ipwGE9a.png"); 2029 | background-size: 100%; 2030 | } 2031 | 2032 | .winButtonMinMax_a934d8:nth-child(3)::after { 2033 | background-color: #faa61a; 2034 | padding: 5px; 2035 | } 2036 | .winButtonMinMax_a934d8:nth-child(3):hover::after { 2037 | background-color: rgba(250, 168, 26, 0.8980392157); 2038 | } 2039 | .winButtonMinMax_a934d8:last-child { 2040 | color: #43b581; 2041 | } 2042 | .winButtonMinMax_a934d8:last-child:hover { 2043 | color: rgba(67, 181, 130, 0.8901960784); 2044 | } 2045 | .winButtonMinMax_a934d8:last-child rect { 2046 | height: 3px; 2047 | rx: 2px; 2048 | } 2049 | 2050 | :root { 2051 | --brand-experiment: #7289da; 2052 | --brand-experiment-560: #5b70be; 2053 | } 2054 | :root .select_f6639d, 2055 | :root .popout_f6639d { 2056 | border: none; 2057 | } 2058 | :root .select_f6639d.open_f6639d, 2059 | :root .popout_f6639d { 2060 | background-color: var(--background-secondary-alt); 2061 | } 2062 | :root .footer_f9a4c9 { 2063 | background: var(--background-tertiary); 2064 | } 2065 | :root .accountProfilePopoutWrapper_b2ca13 .submenuPaddingContainer_d90b3d { 2066 | margin-left: -5px; 2067 | } 2068 | :root .menu_d90b3d { 2069 | border-radius: 5px; 2070 | overflow: hidden; 2071 | } 2072 | :root .menu_d90b3d .scroller_d90b3d { 2073 | padding: 0; 2074 | } 2075 | :root .menu_d90b3d .scroller_d90b3d .separator_d90b3d { 2076 | display: none; 2077 | } 2078 | :root .submenuPaddingContainer_d90b3d { 2079 | padding: 0; 2080 | } 2081 | :root .item_d90b3d { 2082 | margin: 0; 2083 | padding: 10px 15px; 2084 | border-radius: 0; 2085 | transition: 150ms; 2086 | } 2087 | :root .item_d90b3d.colorDefault_d90b3d:hover, :root .item_d90b3d.colorDefault_d90b3d.focused_d90b3d, :root .item_d90b3d.colorDefault_d90b3d:active:not(.hideInteraction-2jPGL_) { 2088 | background-color: rgba(92, 110, 177, 0.1647058824); 2089 | } 2090 | :root .item_d90b3d.colorDanger_d90b3d { 2091 | color: #fd5959; 2092 | } 2093 | :root .item_d90b3d.colorDanger_d90b3d:hover, :root .item_d90b3d.colorDanger_d90b3d.focused_d90b3d, :root .item_d90b3d.colorDanger_d90b3d:active:not(.hideInteraction-2jPGL_) { 2094 | background-color: rgba(240, 71, 71, 0.1019607843); 2095 | } 2096 | :root [class*=disabledPointerEvents][style*="left: -"] { 2097 | left: 0 !important; 2098 | } 2099 | :root .container_e40c16 > .content_e40c16 { 2100 | position: relative; 2101 | } 2102 | :root .container_e40c16 > .content_e40c16 .ready_e40c16 { 2103 | display: none; 2104 | } 2105 | :root .container_e40c16 > .content_e40c16 .ready_e40c16 + .text_e40c16 { 2106 | top: 82px; 2107 | } 2108 | :root .container_e40c16 > .content_e40c16::before { 2109 | content: ""; 2110 | position: absolute; 2111 | bottom: 20px; 2112 | left: calc(50% - 100px); 2113 | width: 200px; 2114 | height: 200px; 2115 | background: url("https://comfy-themes.github.io/Discord/assets/bonfire.gif") center/80% no-repeat; 2116 | } 2117 | :root .pointerEvents_c51b4e[fill="#23a55a"] { 2118 | fill: var(--online); 2119 | } 2120 | :root .pointerEvents_c51b4e[fill="#f0b232"] { 2121 | fill: var(--iddle); 2122 | } 2123 | :root .pointerEvents_c51b4e[fill="#f23f43"] { 2124 | fill: var(--dnd); 2125 | } 2126 | :root .pointerEvents_c51b4e[fill="#80848e"] { 2127 | fill: var(--offline); 2128 | } 2129 | :root .pointerEvents_c51b4e[fill="#593695"] { 2130 | fill: var(--streaming); 2131 | } 2132 | :root .contentWrapper_ed5743 { 2133 | background: var(--background-secondary); 2134 | } 2135 | :root .wordmark_a934d8 svg { 2136 | display: var(--discord-logo); 2137 | } 2138 | :root .body-2khErn { 2139 | background: var(--background-tertiary); 2140 | } 2141 | :root .message_ddcc45 { 2142 | background: var(--background-primary); 2143 | } 2144 | :root .keyboardShortcutsModal_ad95dc { 2145 | background: var(--background-primary); 2146 | } 2147 | :root .keyboardShortcutsModal_ad95dc .keybindShortcut-3zF1P9 span { 2148 | border-radius: 1px; 2149 | } 2150 | :root .root_f9a4c9, 2151 | :root .footer_f9a4c9, 2152 | :root .modal_c97cbd { 2153 | box-shadow: none; 2154 | } 2155 | :root .default_a467ac, 2156 | :root .default_a467ac:hover { 2157 | background-color: var(--background-tertiary); 2158 | } 2159 | :root .messageGroupWrapper_ac90a2, 2160 | :root .inputDefault-3FGxgL, 2161 | :root .container-30qY7E, 2162 | :root .cardPrimary_cb7a0e, 2163 | :root .cardPrimaryOutline-1ofwVz, 2164 | :root .codeRedemptionRedirect_cb70f4, 2165 | :root .previewOverlay-2reuWf, 2166 | :root .markup_f8f345 code { 2167 | border: none; 2168 | } 2169 | :root .pointerEvents_c51b4e { 2170 | mask: none; 2171 | pointer-events: none; 2172 | } 2173 | :root .pointerEvents_c51b4e[width="8"]:not([mask="url(#svg-mask-status-online-mobile)"]), :root .pointerEvents_c51b4e[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]), :root .pointerEvents_c51b4e[width="12"]:not([mask="url(#svg-mask-status-online-mobile)"]), :root .pointerEvents_c51b4e[width="16"]:not([mask="url(#svg-mask-status-online-mobile)"]) { 2174 | rx: var(--status-radius); 2175 | } 2176 | :root .pointerEvents_c51b4e[width="25"], :root .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"] { 2177 | rx: 5px; 2178 | } 2179 | :root .mask_c51b4e, 2180 | :root .userInfo_b69b77 { 2181 | overflow: visible; 2182 | } 2183 | :root .cursorDefault--wfhy5, 2184 | :root .mask_c51b4e > svg { 2185 | overflow: visible; 2186 | } 2187 | :root div:not(.avatarWrapper_b2ca13) .mask_c51b4e > svg > mask > rect:first-child { 2188 | y: 8; 2189 | rx: var(--status-radius); 2190 | } 2191 | :root .mask_c51b4e > svg > mask > rect[width="10"]:first-child { 2192 | x: 8.5; 2193 | width: 14px; 2194 | height: 11px; 2195 | } 2196 | :root .avatarWrapper_b2ca13 .wrapper_c51b4e > .mask_c51b4e > svg > rect { 2197 | mask: none; 2198 | x: 17; 2199 | y: 15; 2200 | width: 10px; 2201 | height: 10px; 2202 | rx: var(--status-radius); 2203 | } 2204 | :root .mask_c51b4e > svg > rect { 2205 | height: 40px; 2206 | } 2207 | :root .mask_c51b4e > svg > mask > rect:nth-child(2), :root .mask_c51b4e > svg > mask > circle, :root .mask_c51b4e > svg > mask > polygon { 2208 | display: none; 2209 | } 2210 | :root .channel_c91bad .pointerEvents_c51b4e, 2211 | :root .members_cbd271 .pointerEvents_c51b4e, 2212 | :root .avatarWrapper_b2ca13 .pointerEvents_c51b4e, 2213 | :root .peopleListItem_d51464 .pointerEvents_c51b4e, 2214 | :root .nowPlayingColumn_c2739c .pointerEvents_c51b4e { 2215 | height: 12px; 2216 | y: 24; 2217 | stroke-width: 2.5px; 2218 | } 2219 | :root .channel_c91bad .pointerEvents_c51b4e[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]), 2220 | :root .members_cbd271 .pointerEvents_c51b4e[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]), 2221 | :root .avatarWrapper_b2ca13 .pointerEvents_c51b4e, 2222 | :root .peopleListItem_d51464 .pointerEvents_c51b4e[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]), 2223 | :root .nowPlayingColumn_c2739c .pointerEvents_c51b4e[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]) { 2224 | width: 12px; 2225 | x: 24; 2226 | } 2227 | :root .channel_c91bad .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 2228 | :root .members_cbd271 .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 2229 | :root .peopleListItem_d51464 .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 2230 | :root .nowPlayingColumn_c2739c .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 2231 | :root .menu_d90b3d .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"] { 2232 | width: 12px; 2233 | height: 16px; 2234 | x: 24; 2235 | y: 20; 2236 | } 2237 | :root #account-avatar .pointerEvents_c51b4e { 2238 | width: 18px; 2239 | height: 18px; 2240 | x: 68; 2241 | y: 68; 2242 | stroke-width: 3.5px; 2243 | rx: calc(1px + var(--status-radius)); 2244 | } 2245 | :root .listAvatar-1NlAhb .pointerEvents_c51b4e { 2246 | x: 30; 2247 | y: 30; 2248 | stroke-width: 2.5px; 2249 | } 2250 | :root .menu_d90b3d .pointerEvents_c51b4e:not([mask="url(#svg-mask-status-online-mobile)"]) { 2251 | width: 10px; 2252 | height: 10px; 2253 | stroke-width: 2.5px; 2254 | } 2255 | :root .menu_d90b3d .pointerEvents_c51b4e { 2256 | stroke: var(--background-tertiary); 2257 | } 2258 | :root .channel_c91bad .pointerEvents_c51b4e, 2259 | :root .members_cbd271 .pointerEvents_c51b4e, 2260 | :root .listAvatar-1NlAhb .pointerEvents_c51b4e, 2261 | :root .nowPlayingColumn_c2739c .pointerEvents_c51b4e { 2262 | stroke: var(--background-secondary-alt); 2263 | } 2264 | :root .avatarWrapper_b2ca13[aria-expanded] .pointerEvents_c51b4e, 2265 | :root .peopleListItem_d51464 .pointerEvents_c51b4e { 2266 | stroke: var(--background-primary); 2267 | } 2268 | :root .wrapper_c51b4e .dots_ce0450 { 2269 | overflow: visible; 2270 | } 2271 | :root .wrapper_c51b4e .dots_ce0450 g { 2272 | transform: translateY(2.5px); 2273 | } 2274 | :root .wrapper_c51b4e foreignObject, 2275 | :root .callAvatarMask_db83a2 foreignObject, 2276 | :root .avatarContainer_d03bba foreignObject, 2277 | :root .avatarMasked__0b3c8 { 2278 | mask: none; 2279 | -webkit-mask: none; 2280 | } 2281 | :root .wrapper_c51b4e, 2282 | :root .avatar_c51b4e, 2283 | :root .profile_d6fbe8 .avatarUploaderInner-yEhTv5, 2284 | :root .voiceAvatar_db83a2, 2285 | :root .avatar_f9f2ca, 2286 | :root .border_db83a2, 2287 | :root .avatar_d80634, 2288 | :root .clickableAvatar_d03bba, 2289 | :root .emptyUser_d03bba, 2290 | :root .avatar_d03bba, 2291 | :root .wrapper_db83a2.ringingIncoming_db83a2::after, 2292 | :root .wrapper_db83a2.ringingOutgoing_db83a2::after, 2293 | :root .replyAvatar_f9f2ca, 2294 | :root .avatarSpeaking_c51b4e, 2295 | :root .avatar-2EVtgZ, 2296 | :root .avatarContainerMasked_d03bba, 2297 | :root .appAvatar-2_lufo, 2298 | :root .embedAuthorIcon_b0068a { 2299 | border-radius: var(--avatar-radius); 2300 | } 2301 | :root .wrapper_c5f96a foreignObject { 2302 | mask: none; 2303 | -webkit-mask: none; 2304 | } 2305 | :root .wrapperSimple_c5f96a { 2306 | overflow: visible; 2307 | } 2308 | :root .wrapperSimple_c5f96a, 2309 | :root .wrapper_c5f96a foreignObject, 2310 | :root .folderIconWrapper_bc7085, 2311 | :root .expandedFolderBackground_bc7085, 2312 | :root .flexChild_dc333f .avatarUploaderInner_f0a9ff { 2313 | border-radius: var(--server-radius); 2314 | } 2315 | :root .iconInactive_a64689 { 2316 | border-radius: calc(var(--server-radius) - 4px); 2317 | } 2318 | :root .wrapper_c5f96a foreignObject { 2319 | transition: border-radius 200ms; 2320 | } 2321 | :root .wrapper_c5f96a:hover foreignObject { 2322 | border-radius: calc(var(--server-radius) - 3px); 2323 | } 2324 | :root .container-2nx-BQ, 2325 | :root .input-2XRLou { 2326 | border-radius: 5px; 2327 | } 2328 | :root .slider-32CRPX rect { 2329 | rx: 5px; 2330 | } 2331 | :root .mini_c7a159 { 2332 | height: 25px; 2333 | } 2334 | :root :not(.themedPopout-1TrfdI) > .slider_c7a159:not(.mini_c7a159) { 2335 | height: 50px; 2336 | } 2337 | :root .themedPopout-1TrfdI > .slider_c7a159 { 2338 | height: 15px; 2339 | margin: 0; 2340 | } 2341 | :root .themedPopout-1TrfdI > .slider_c7a159 .bar_c7a159 { 2342 | top: 0 !important; 2343 | } 2344 | :root .bar_c7a159 { 2345 | height: 15px !important; 2346 | background-color: var(--background-secondary); 2347 | } 2348 | :root .slider_c7a159 .grabber_c7a159 { 2349 | background-color: transparent; 2350 | box-shadow: none; 2351 | border: none; 2352 | } 2353 | :root .barFill_c7a159 { 2354 | border-radius: 0 3px 3px 0; 2355 | } 2356 | :root .streamPreview_adbea6 { 2357 | width: 370px; 2358 | background-color: var(--background-secondary); 2359 | } 2360 | :root .streamPreview_adbea6 .previewContainer_adbea6 { 2361 | height: 211px; 2362 | } 2363 | :root .streamPreview_adbea6 .previewContainer_adbea6 .emptyPreviewImage-3LUxKH { 2364 | margin-bottom: 18px; 2365 | } 2366 | :root .streamPreview_adbea6 .button_dd4f85 { 2367 | border: none; 2368 | background-color: #e9edff; 2369 | color: var(--background-tertiary); 2370 | transition: background-color 0.15s; 2371 | } 2372 | :root .streamPreview_adbea6 .button_dd4f85:hover { 2373 | background-color: #fff; 2374 | } 2375 | :root .container-1rn8Cv > img { 2376 | z-index: unset; 2377 | } 2378 | :root .contentWarningPopout_fa823b { 2379 | background-color: var(--background-primary); 2380 | box-shadow: none; 2381 | } 2382 | :root .layerContainer-2v_Sit *::-webkit-scrollbar { 2383 | display: none; 2384 | } 2385 | :root .layerContainer-2v_Sit .scroller-3nFW5p { 2386 | padding-left: 0; 2387 | } 2388 | :root .layerContainer-2v_Sit .scroller-3nFW5p > .content_eed6a8, 2389 | :root .layerContainer-2v_Sit .scroller-3nFW5p .buttons_d0696b, 2390 | :root .layerContainer-2v_Sit .scroller-3nFW5p .messagesPopout_ac90a2 { 2391 | padding-right: 10px !important; 2392 | } 2393 | :root .lookFilled-yCfaCM.colorGrey-2iAG-B, 2394 | :root .lookFilled-yCfaCM.colorBrandNew-2-gGsS { 2395 | background-color: var(--brand-experiment); 2396 | } 2397 | :root .lookFilled-yCfaCM.colorGrey-2iAG-B:hover, 2398 | :root .lookFilled-yCfaCM.colorBrandNew-2-gGsS:hover { 2399 | background-color: var(--brand-experiment-560); 2400 | } 2401 | :root .gameVerifiedIcon-3t4jtr .flowerStar_c91f7d > path { 2402 | fill: var(--brand-experiment); 2403 | } 2404 | :root .wrapper__8436d:hover .childWrapper_a6ce15 { 2405 | background-color: var(--background-accent); 2406 | } 2407 | :root .homeIcon__560eb > path { 2408 | d: path("M 20.6644 20 C 20.6644 20 19.8014 18.9762 19.0822 18.0714 C 22.2226 17.1905 23.4212 15.2381 23.4212 15.2381 C 22.4384 15.881 21.5034 16.3334 20.6644 16.6429 C 19.4658 17.1429 18.3151 17.4762 17.1884 17.6667 C 14.887 18.0953 12.7774 17.9762 10.9795 17.6429 C 9.61301 17.381 8.43836 17 7.45548 16.6191 C 6.90411 16.4048 6.30479 16.1429 5.70548 15.8096 C 5.63356 15.7619 5.56164 15.7381 5.48973 15.6905 C 5.44178 15.6667 5.41781 15.6429 5.39384 15.6191 C 4.96233 15.381 4.7226 15.2143 4.7226 15.2143 C 4.7226 15.2143 5.87329 17.1191 8.91781 18.0238 C 8.19863 18.9286 7.31164 20 7.31164 20 C 2.0137 19.8333 0 16.381 0 16.381 C 0 8.7144 3.45205 2.50017 3.45205 2.50017 C 6.90411 -0.07123 10.1884 0.000197861 10.1884 0.000197861 L 10.4281 0.285909 C 6.11301 1.52399 4.12329 3.40493 4.12329 3.40493 C 4.12329 3.40493 4.65068 3.11921 5.53767 2.71446 C 8.10274 1.59542 10.1404 1.2859 10.9795 1.21447 C 11.1233 1.19066 11.2432 1.16685 11.387 1.16685 C 12.8493 0.976379 14.5034 0.92876 16.2295 1.11923 C 18.5068 1.38114 20.9521 2.0478 23.4452 3.40493 C 23.4452 3.40493 21.5514 1.61923 17.476 0.381146 L 17.8116 0.000197861 C 17.8116 0.000197861 21.0959 -0.07123 24.5479 2.50017 C 24.5479 2.50017 28 8.7144 28 16.381 C 28 16.381 25.9623 19.8333 20.6644 20 Z M 9.51712 8.88106 C 8.15068 8.88106 7.07192 10.0715 7.07192 11.5239 C 7.07192 12.9763 8.17466 14.1667 9.51712 14.1667 C 10.8836 14.1667 11.9623 12.9763 11.9623 11.5239 C 11.9863 10.0715 10.8836 8.88106 9.51712 8.88106 Z M 18.2671 8.88106 C 16.9007 8.88106 15.8219 10.0715 15.8219 11.5239 C 15.8219 12.9763 16.9247 14.1667 18.2671 14.1667 C 19.6336 14.1667 20.7123 12.9763 20.7123 11.5239 C 20.7123 10.0715 19.6336 8.88106 18.2671 8.88106 Z"); 2409 | } 2410 | :root .guildPopout-G6M0fK { 2411 | background-color: var(--background-secondary); 2412 | } 2413 | :root .guildPopout-G6M0fK .iconMask-1lJhcS { 2414 | background-color: transparent; 2415 | } 2416 | :root .container_a6d69a { 2417 | background-color: var(--background-primary); 2418 | } 2419 | :root .container_a6d69a .mainCard_a6d69a { 2420 | background-color: var(--background-secondary); 2421 | } 2422 | :root .bd-sidebar-header { 2423 | padding-right: 10px; 2424 | } 2425 | :root .bd-addon-list.bd-grid-view { 2426 | grid-template-columns: 1fr 1fr; 2427 | } 2428 | :root .directoryModal-YJsOMv { 2429 | background-color: var(--background-primary); 2430 | } 2431 | :root .container_f1fd9c, 2432 | :root .header_f1fd9c, 2433 | :root .emptyPage_c6b11b, 2434 | :root .scrollerContainer_c6b11b, 2435 | :root .container_c2efea, 2436 | :root .background_e85cee, 2437 | :root .container_d20375, 2438 | :root .pageBody_c2efea, 2439 | :root .page_d20375 { 2440 | background-color: var(--background-primary) !important; 2441 | } 2442 | :root .homeContent_e85cee .row_b53f4f, :root .channelRow_f04d06 { 2443 | background-color: var(--background-secondary); 2444 | } 2445 | :root .headerArtPlaceholder_d32e26 { 2446 | background-color: var(--background-tertiary); 2447 | } 2448 | 2449 | .soundButtonRefresh_f40049 { 2450 | background-color: var(--background-primary); 2451 | } 2452 | 2453 | .theme-dark { 2454 | --card-secondary-bg: var(--background-secondary); 2455 | } 2456 | 2457 | :root #GameActivityToggleBtn .st0 { 2458 | fill: var(--user-buttons-color); 2459 | } 2460 | :root #status-picker [aria-label="Hide Game Activity"]::after, 2461 | :root #status-picker [aria-label="Show Game Activity"]::after { 2462 | content: "Not supported in this area"; 2463 | } 2464 | :root #status-picker .submenuContainer-3EVTeH { 2465 | grid-column: 1/5; 2466 | } 2467 | :root #permissions-modal-wrapper #permissions-modal { 2468 | box-shadow: none !important; 2469 | border: none !important; 2470 | } 2471 | :root #permissions-modal-wrapper .header { 2472 | background: var(--background-tertiary) !important; 2473 | text-align: center !important; 2474 | } 2475 | :root #permissions-modal-wrapper .role-side, 2476 | :root #permissions-modal-wrapper .perm-side { 2477 | background: var(--background-secondary) !important; 2478 | } 2479 | :root #MemberCount { 2480 | background-color: var(--background-secondary) !important; 2481 | } 2482 | :root .guilds_a4d4d9.content-Pph8t6 + .base_a4d4d9 .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 2483 | transition: margin-left 300ms linear; 2484 | } 2485 | :root .guilds_a4d4d9.content-Pph8t6:not(.closed-j55_T-) + .base_a4d4d9 .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 2486 | margin-left: 72px; 2487 | } 2488 | :root .vc-bf-folder-sidebar + .base_a4d4d9 .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 2489 | transition: margin-left 300ms linear; 2490 | } 2491 | :root .vc-bf-folder-sidebar + .base_a4d4d9 .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 2492 | margin-left: 72px; 2493 | } 2494 | :root .sidebar_a4d4d9 .avatarWrapper_b2ca13 { 2495 | transition: margin-left 400ms ease; 2496 | } 2497 | :root .sidebar_a4d4d9.hideChannelElement .avatarWrapper_b2ca13 { 2498 | margin-left: -240px; 2499 | } 2500 | :root .root-8LYsGj .UserBackgrounds-banner-container { 2501 | position: static; 2502 | } 2503 | :root .root-8LYsGj .UserBackgrounds-banner-container .UserBackgrounds-banner-badge { 2504 | top: 13px; 2505 | right: 50px; 2506 | } 2507 | 2508 | .member_aa4760 .username__11d8c::after { 2509 | bottom: 2px !important; 2510 | left: 15px !important; 2511 | } 2512 | -------------------------------------------------------------------------------- /betterdiscord/no-scrollbar.css: -------------------------------------------------------------------------------- 1 | ::-webkit-scrollbar { 2 | display: none; 3 | } 4 | .wrapper_d8bfb3 { 5 | margin-left: 0; 6 | } 7 | .link_d8bfb3 { 8 | padding-left: 16px; 9 | border-radius: 0; 10 | } 11 | .mainContent-20q_Hp { 12 | padding-left: 8px; 13 | } 14 | .container_b15955, 15 | .container_e9f61e { 16 | margin: 0; 17 | max-width: unset; 18 | } 19 | .layout_f9647d, 20 | .layout_e9f61e { 21 | border-radius: 0; 22 | padding: 0 16px; 23 | } 24 | .unread_d8bfb3 { 25 | z-index: 1; 26 | } 27 | .buttons_d0696b { 28 | padding-right: 10px !important; 29 | } 30 | .typeThread_d8bfb3 .link_d8bfb3 { 31 | padding-left: 34px; 32 | } -------------------------------------------------------------------------------- /betterdiscord/vencord-spotify.css: -------------------------------------------------------------------------------- 1 | :root #vc-spotify-player { 2 | position: relative; 3 | border-bottom: none; 4 | padding: 0; 5 | } 6 | 7 | /* Album image & infos */ 8 | :root #vc-spotify-info-wrapper { 9 | padding: 0.375rem 0.5rem; 10 | position: relative; 11 | z-index: 1; 12 | } 13 | 14 | :root #vc-spotify-info-wrapper #vc-spotify-album-image { 15 | height: 100%; 16 | } 17 | 18 | :root #vc-spotify-album-expanded-wrapper { 19 | position: relative; 20 | z-index: 1; 21 | padding: 0.375rem 0.5rem; 22 | } 23 | 24 | :root #vc-spotify-album-expanded-wrapper > img { 25 | border-radius: 8px; 26 | } 27 | 28 | /* Progress bar */ 29 | :root #vc-spotify-info-wrapper + #vc-spotify-progress-bar { 30 | position: static; 31 | margin: 0; 32 | } 33 | 34 | :root #vc-spotify-info-wrapper + #vc-spotify-progress-bar .slider_c7a159 { 35 | position: static; 36 | height: 100%; 37 | } 38 | 39 | :root 40 | #vc-spotify-info-wrapper 41 | + #vc-spotify-progress-bar 42 | .slider_c7a159 43 | .bar_c7a159 { 44 | position: absolute; 45 | top: 0; 46 | height: 61px !important; 47 | width: 100%; 48 | border-radius: 0; 49 | transition: height 200ms; 50 | } 51 | 52 | :root 53 | #vc-spotify-player:hover 54 | #vc-spotify-info-wrapper 55 | + #vc-spotify-progress-bar 56 | .slider_c7a159 57 | .bar_c7a159 { 58 | height: 95px !important; 59 | } 60 | 61 | :root #vc-spotify-progress-bar .slider_c7a159 .barFill_c7a159 { 62 | background-color: var(--spotify-color); 63 | -webkit-mask-image: linear-gradient(0.25turn, #0008, #0002) !important; 64 | mask-image: linear-gradient(0.25turn, #0008, #0002) !important; 65 | border-radius: 0; 66 | } 67 | 68 | :root 69 | #vc-spotify-info-wrapper 70 | + #vc-spotify-progress-bar 71 | .vc-spotify-progress-time { 72 | display: none; 73 | } 74 | 75 | :root .vc-spotify-button-row { 76 | position: relative; 77 | z-index: 1; 78 | } 79 | 80 | :root #vc-spotify-progress-bar .sliderContainer_e13f88 .grabber_c7a159 { 81 | top: 0; 82 | height: 100% !important; 83 | border-radius: 0; 84 | opacity: 0; 85 | z-index: 1; 86 | } 87 | 88 | :root #vc-spotify-album-expanded-wrapper + #vc-spotify-progress-bar { 89 | padding: 0 0.5rem; 90 | box-sizing: border-box; 91 | } 92 | 93 | :root 94 | #vc-spotify-album-expanded-wrapper 95 | + #vc-spotify-progress-bar 96 | .slider_c7a159 97 | .bar_c7a159 { 98 | top: 3px; 99 | height: 20px !important; 100 | } 101 | 102 | :root 103 | #vc-spotify-album-expanded-wrapper 104 | + #vc-spotify-progress-bar 105 | .vc-spotify-time-left { 106 | left: 0.5rem; 107 | } 108 | 109 | :root 110 | #vc-spotify-album-expanded-wrapper 111 | + #vc-spotify-progress-bar 112 | .vc-spotify-time-right { 113 | right: 0.5rem; 114 | } 115 | -------------------------------------------------------------------------------- /stuff/_channel-bar.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | .container_fc4f04.themed_fc4f04 { 3 | background: var(--background-secondary); 4 | 5 | .children_fc4f04::after { 6 | background: linear-gradient( 7 | 90deg, 8 | rgba(54, 57, 63, 0) 0, 9 | var(--background-secondary) 10 | ); 11 | } 12 | 13 | // Search bar 14 | .search_ff5f90 { 15 | order: 1; 16 | margin-left: 4px; 17 | 18 | .search_a46bef:not(.open_a46bef) { 19 | .searchBar_a46bef { 20 | width: 27px; 21 | transition: 250ms; 22 | background-color: transparent; 23 | 24 | .iconContainer_effbe2 { 25 | transform: scale(1.3); 26 | transition: 250ms; 27 | 28 | .icon_effbe2 { 29 | color: var(--interactive-normal); 30 | } 31 | } 32 | } 33 | 34 | &:hover .searchBar_a46bef { 35 | width: 220px; 36 | background-color: var(--background-tertiary); 37 | 38 | .iconContainer_effbe2 { 39 | transform: scale(1); 40 | 41 | .icon_effbe2 { 42 | color: var(--text-muted); 43 | } 44 | } 45 | } 46 | } 47 | .searchAnswer_b0fa94, 48 | .searchFilter_b0fa94 { 49 | background-color: var(--background-primary); 50 | } 51 | } 52 | } 53 | 54 | // I'm a pro 55 | .toolbar_fc4f04 > a[href="https://support.discord.com"], 56 | .searchLearnMore_b0286e { 57 | display: none; 58 | } 59 | 60 | // -- Search bar and modal -- 61 | .container_eedf95 { 62 | background-color: var(--background-secondary-alt); 63 | box-shadow: none; 64 | 65 | .resultsGroup-1BPR25 .header-3A13BX { 66 | text-align: center; 67 | } 68 | 69 | .queryContainer_eedf95 { 70 | background-color: var(--background-tertiary); 71 | } 72 | 73 | .option_b0286e { 74 | margin: 0; 75 | border-radius: 0; 76 | 77 | &::after { 78 | background: linear-gradient( 79 | 90deg, 80 | rgba(54, 57, 63, 0), 81 | var(--background-secondary-alt) 80% 82 | ); 83 | } 84 | &.selected-rZcOL- { 85 | background: linear-gradient( 86 | 90deg, 87 | rgba(54, 57, 63, 0), 88 | var(--background-secondary) 80% 89 | ); 90 | } 91 | } 92 | 93 | // Calendar 94 | .calendarPicker_be05cd .react-datepicker { 95 | background-color: var(--background-secondary-alt); 96 | 97 | &__day, 98 | &__header { 99 | background: var(--background-secondary-alt) !important; 100 | border-color: var(--background-tertiary); 101 | } 102 | } 103 | } 104 | } -------------------------------------------------------------------------------- /stuff/_channel-list.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // -- Guild header popout -- 3 | #guild-header-popout { 4 | .item_d90b3d { 5 | flex-direction: row-reverse; 6 | 7 | .iconContainer_d90b3d { 8 | margin: 0 8px 0 0; 9 | } 10 | } 11 | 12 | // Server profile icon fix 13 | .icon_ad5fac { 14 | width: 100%; 15 | height: 100%; 16 | } 17 | 18 | // Boost 19 | &-premium-subscribe { 20 | &:hover, 21 | &:active:not(.hideInteraction_d90b3d), 22 | &.focused_d90b3d { 23 | background-color: #ff73fa1c; 24 | } 25 | .icon_d90b3d { 26 | color: #ff73fa; 27 | } 28 | } 29 | 30 | // Invite 31 | &-invite-people { 32 | color: #677bc4; 33 | 34 | &:hover, 35 | &:active:not(.hideInteraction_d90b3d), 36 | &.focused_d90b3d { 37 | background-color: #677bc41e; 38 | } 39 | .icon_d90b3d { 40 | color: #677bc4; 41 | } 42 | } 43 | 44 | // Settings 45 | &-settings { 46 | &:hover, 47 | &:active:not(.hideInteraction_d90b3d), 48 | &.focused_d90b3d { 49 | background-color: #546e7a1e; 50 | } 51 | .icon_d90b3d { 52 | color: #546e7a; 53 | } 54 | } 55 | 56 | // Insights 57 | &-insights { 58 | &:hover, 59 | &:active:not(.hideInteraction_d90b3d), 60 | &.focused_d90b3d { 61 | background-color: #1abc9c23; 62 | } 63 | .icon_d90b3d { 64 | color: #1abc9c; 65 | } 66 | } 67 | 68 | // Create channel 69 | &-create-channel { 70 | &:hover, 71 | &:active:not(.hideInteraction_d90b3d), 72 | &.focused_d90b3d { 73 | background-color: #e91e6221; 74 | } 75 | .icon_d90b3d { 76 | color: #e91e63; 77 | } 78 | } 79 | 80 | // Create category 81 | &-create-category { 82 | &:hover, 83 | &:active:not(.hideInteraction_d90b3d), 84 | &.focused_d90b3d { 85 | background-color: #eaa14e13; 86 | } 87 | .icon_d90b3d { 88 | color: #eaa14e; 89 | } 90 | } 91 | 92 | // Create event 93 | &-create-event { 94 | &:hover, 95 | &:active:not(.hideInteraction_d90b3d), 96 | &.focused_d90b3d { 97 | background-color: #ede9e611; 98 | } 99 | .icon_d90b3d { 100 | & > path:first-child { 101 | fill: #677bc4; 102 | } 103 | & > path:last-child { 104 | fill: #ede9e6; 105 | } 106 | } 107 | } 108 | 109 | // Active threads 110 | &-active-threads { 111 | &:hover, 112 | &:active:not(.hideInteraction_d90b3d), 113 | &.focused_d90b3d { 114 | background-color: #5488f731; 115 | } 116 | .icon_d90b3d { 117 | color: #5488f7; 118 | } 119 | } 120 | 121 | // Application directory 122 | &-application-directory { 123 | &:hover, 124 | &:active:not(.hideInteraction_d90b3d), 125 | &.focused_d90b3d { 126 | background-color: #30495713; 127 | } 128 | .icon_d90b3d { 129 | color: #304957; 130 | } 131 | } 132 | 133 | // Notifications 134 | &-notifications { 135 | &:hover, 136 | &:active:not(.hideInteraction_d90b3d), 137 | &.focused_d90b3d { 138 | background-color: #e9bb4815; 139 | } 140 | .icon_d90b3d { 141 | color: #fcd462; 142 | } 143 | } 144 | 145 | // Privacy 146 | &-privacy { 147 | &:hover, 148 | &:active:not(.hideInteraction_d90b3d), 149 | &.focused_d90b3d { 150 | background-color: #4a83d418; 151 | } 152 | .icon_d90b3d { 153 | color: #4a84d4; 154 | } 155 | } 156 | 157 | // Nickname 158 | &-change-nickname { 159 | &:hover, 160 | &:active:not(.hideInteraction_d90b3d), 161 | &.focused_d90b3d { 162 | background-color: #43b58218; 163 | } 164 | .icon_d90b3d { 165 | color: #43b581; 166 | } 167 | } 168 | 169 | // Hide muted channels 170 | &-hide-muted-channels { 171 | &:hover, 172 | &:active:not(.hideInteraction_d90b3d), 173 | &.focused_d90b3d { 174 | background-color: #5c6eb117; 175 | } 176 | &:hover svg > path { 177 | &:first-child { 178 | color: var(--control-brand-foreground); 179 | } 180 | &:last-child { 181 | color: #fff; 182 | } 183 | } 184 | } 185 | } 186 | 187 | // Categories arrows 188 | .mainContent_a08117 .arrow_d64d50 { 189 | display: none; 190 | } 191 | 192 | // Thread channels 193 | .spine_e1e976 { 194 | z-index: 1; 195 | } 196 | 197 | // -- Notification -- 198 | .container_fd6364 { 199 | background: var(--background-secondary); 200 | z-index: 3; 201 | } 202 | 203 | .unreadTop__6e8c4 { 204 | top: -9px; 205 | z-index: 2; 206 | width: 100%; 207 | padding: 0; 208 | 209 | .unreadBar_c43953 { 210 | &.mention_edf32f { 211 | border-radius: 0; 212 | background: linear-gradient(var(--mention-color), #0000); 213 | } 214 | 215 | &.unread_edf32f { 216 | border-radius: 0; 217 | background: linear-gradient(var(--unread-color), #0000); 218 | } 219 | } 220 | } 221 | 222 | .unreadBottom__6be9f { 223 | width: 100%; 224 | height: 15px; 225 | padding: 0; 226 | 227 | .unreadBar_c43953 { 228 | &.mention_edf32f { 229 | border-radius: 0; 230 | background: linear-gradient(#0000, var(--mention-color)); 231 | } 232 | 233 | &.unread_edf32f { 234 | border-radius: 0; 235 | background: linear-gradient(#0000, var(--unread-color)); 236 | } 237 | } 238 | } 239 | 240 | .unreadBar_c43953 > .text_edf32f { 241 | display: none; 242 | } 243 | 244 | // Mention pill 245 | .mentionsBadge_e2a798 .numberBadge__40d6f { 246 | background-color: var(--mention-color) !important; 247 | 248 | &::before { 249 | content: ""; 250 | position: absolute; 251 | width: 16px; 252 | height: 16px; 253 | background-color: inherit; 254 | border-radius: 100%; 255 | z-index: -1; 256 | animation: var(--disable-animations), 2s pulse infinite; 257 | will-change: transform; 258 | } 259 | } 260 | 261 | // Unread pill 262 | .unread_d8bfb3 { 263 | top: 50%; 264 | left: 5px; 265 | width: 6px; 266 | height: 6px; 267 | z-index: 1; 268 | background-color: var(--unread-color); 269 | border-radius: 10px; 270 | margin-top: 0; 271 | transform: translate(0%, -50%); 272 | 273 | &::before { 274 | content: ""; 275 | position: absolute; 276 | width: 6px; 277 | height: 6px; 278 | background-color: inherit; 279 | border-radius: 100%; 280 | z-index: 1; 281 | animation: var(--disable-animations), pulse 2s infinite; 282 | will-change: transform; 283 | } 284 | } 285 | 286 | // Game activity / call area 287 | .activityPanel_a4d4d9, 288 | .container_adcaac { 289 | border-bottom: none; 290 | } 291 | 292 | // Channel call 293 | .voiceUserSummary_c43953 svg:not(.icon_d03bba) { 294 | padding-right: 10px; 295 | } 296 | [mask="url(#svg-mask-voice-user-summary-item)"] { 297 | mask: none; 298 | } 299 | 300 | .tile_dc5fc4 { 301 | background-color: var(--background-secondary-alt); 302 | 303 | .button_e5cc00, 304 | .buttonColor_d4af21 { 305 | background-color: var(--brand-experiment); 306 | } 307 | } 308 | 309 | // SCTR connection 310 | .container__13b2a { 311 | .header-2C89wJ { 312 | background-color: var(--background-tertiary); 313 | } 314 | section { 315 | background-color: var(--background-secondary); 316 | } 317 | } 318 | 319 | // Channel settings 320 | .group_d25d19 { 321 | width: 110px; 322 | border: none; 323 | gap: 5px; 324 | 325 | .item_d25d19 { 326 | border-radius: 8px; 327 | 328 | &:hover, 329 | &.selected_d25d19 { 330 | &.deny_d25d19 { 331 | color: #ed4245; 332 | background-color: #ed42452f; 333 | } 334 | &.passthrough_d25d19 { 335 | color: #dcddde; 336 | background-color: #6464643a; 337 | } 338 | &.allow_d25d19 { 339 | color: #43b581; 340 | background-color: #43b5823b; 341 | } 342 | } 343 | } 344 | } 345 | 346 | // Invite popout 347 | .inviteRow_cedfaf { 348 | border-radius: 0; 349 | padding-left: 15px; 350 | 351 | &:hover { 352 | background-color: var(--background-modifier-hover); 353 | } 354 | } 355 | 356 | // Adding roles 357 | .autocompleteShadow-1aXK3x { 358 | box-shadow: 0 4px 15px #00000031; 359 | 360 | & + .autocompleteArrow-2CRgr2, 361 | & ~ .header-PfVfAO { 362 | background: var(--background-secondary-alt); 363 | } 364 | & ~ .sectionTag-euh3ZW { 365 | background: var(--background-secondary); 366 | 367 | .row-3UUG_l { 368 | padding: 0; 369 | } 370 | } 371 | & ~ .header-PfVfAO .headerText-3k--Lk { 372 | margin-left: 15px; 373 | } 374 | } 375 | 376 | // Boost 377 | .innerWrapper_aecbd6 { 378 | border-radius: 5px; 379 | } 380 | } -------------------------------------------------------------------------------- /stuff/_chat.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Messages buttons 3 | .buttons_d5deea { 4 | transition: opacity 150ms; 5 | } 6 | 7 | // Avatar of the user 8 | .panels_a4d4d9 > .container_b2ca13 > .avatarWrapper_b2ca13 { 9 | position: fixed; 10 | bottom: 26.5px; 11 | left: 327.5px; 12 | z-index: 2; 13 | margin: 0; 14 | padding: 0; 15 | min-width: unset; 16 | 17 | & > .avatar_b2ca13 { 18 | width: 40px !important; 19 | height: 40px !important; 20 | 21 | & > svg { 22 | contain: unset; 23 | } 24 | 25 | foreignObject { 26 | width: 100% !important; 27 | height: 100% !important; 28 | } 29 | 30 | .pointerEvents_c51b4e { 31 | x: 31px; 32 | y: 31px; 33 | ry: var(--status-radius); 34 | width: 12px; 35 | height: 12px; 36 | } 37 | 38 | &:hover { 39 | opacity: 1; 40 | } 41 | & + .nameTag_b2ca13 { 42 | display: none; 43 | } 44 | } 45 | } 46 | 47 | // Hiding avatar 48 | .content_a4d4d9 > :nth-child(2):not(.chat_a7d72e), 49 | .callContainer_ed4410, 50 | .gatedContent_def860, 51 | .chat_a7d72e > .content_a7d72e > .container_a6d69a > .list_a6d69a[data-list-id^='forum-channel-list'], 52 | .chat_a7d72e > .content_a7d72e > .pageContainer_a9a262, 53 | .forumOrHome_ff5f90 + .content_a7d72e > .container__93316, 54 | .container_f1fd9c, 55 | .background_e85cee, 56 | .page_d20375 57 | { 58 | z-index: 2; 59 | } 60 | 61 | .chat_a7d72e > .content_a7d72e > .container_a6d69a > .list_a6d69a[data-list-id^='forum-channel-list'] { 62 | background-color: var(--background-primary); 63 | } 64 | 65 | // Chat bar 66 | .chat_a7d72e .form_a7d72e { 67 | padding-left: 66px; 68 | 69 | .wrapper_faf5ab { 70 | z-index: unset; 71 | } 72 | 73 | .channelTextArea_a7d72e .scrollableContainer_d0696b::after, 74 | .wrapper_faf5ab::after { 75 | position: absolute; 76 | content: ""; 77 | bottom: 2px; 78 | left: -50px; 79 | width: 40px; 80 | height: 40px; 81 | background-color: var(--background-secondary); 82 | border-radius: calc(var(--avatar-radius) + 2px); 83 | } 84 | } 85 | 86 | // Typing indicator 87 | .typing_d7ebeb { 88 | left: 66px; 89 | right: 26px; 90 | } 91 | 92 | // Annoucement bar 93 | .lookFilled-yCfaCM.colorPrimary-2AuQVo, 94 | .lookFilled-yCfaCM.colorPrimary-2AuQVo:hover { 95 | background-color: var(--brand-experiment); 96 | } 97 | 98 | // Server discovery steps bar 99 | .container_d29eee { 100 | margin-left: 14px; 101 | margin-bottom: 16px; 102 | border-radius: 8px; 103 | } 104 | 105 | // Spam bar 106 | .spamBanner_c1da2c { 107 | position: relative; 108 | flex-direction: column; 109 | left: 56px; 110 | bottom: 8px; 111 | width: 330px; 112 | height: fit-content; 113 | row-gap: 30px; 114 | 115 | .bannerTextContainer_c1da2c { 116 | min-width: 0; 117 | } 118 | .actionButtons_c1da2c { 119 | justify-content: space-around; 120 | } 121 | } 122 | 123 | // Messages error bar 124 | .messagesErrorBar_cf58b5 { 125 | border-radius: 15px; 126 | padding-bottom: 0; 127 | margin-bottom: 15px; 128 | 129 | &:active { 130 | margin-bottom: 14px; 131 | } 132 | } 133 | 134 | // New messages 135 | .newMessagesBar_cf58b5 { 136 | background-color: var(--background-accent); 137 | border-radius: 50px; 138 | margin-top: 5px; 139 | } 140 | 141 | // Mentions 142 | .message_d5deea.mentioned_d5deea { 143 | background-color: var(--mention-color-background); 144 | 145 | &::before { 146 | background: var(--mention-color-bar); 147 | padding: 1px; 148 | } 149 | 150 | &:hover { 151 | background-color: var(--mention-color-hover) !important; 152 | } 153 | } 154 | 155 | // Channel/User tag 156 | .wrapper_ed5275:not([style]) { 157 | position: relative; 158 | color: var(--brand-experiment); 159 | background: transparent; 160 | 161 | &::after { 162 | content: ""; 163 | opacity: 0.1; 164 | top: 0; 165 | left: 0; 166 | z-index: -1; 167 | position: absolute; 168 | width: 100%; 169 | height: 100%; 170 | background-color: var(--brand-experiment); 171 | border-radius: inherit; 172 | } 173 | } 174 | 175 | // Going back to new messages 176 | .jumpToPresentBar_cf58b5, 177 | .jumpToPresentBar_cf58b5:active { 178 | margin-bottom: 13px; 179 | border-radius: 20px; 180 | padding: 0; 181 | } 182 | 183 | // # @ / autocomplete menu 184 | .autocompleteRow_bcc24e { 185 | padding: 0; 186 | 187 | .base_bcc24e { 188 | border-radius: 0; 189 | } 190 | 191 | &:first-of-type, 192 | .option_bea3ee { 193 | background-color: var(--background-tertiary); 194 | } 195 | } 196 | .autocomplete_bcc24e { 197 | background: var(--background-secondary-alt); 198 | } 199 | .categoryHeader_fe2299, 200 | .autocomplete_bcc24e { 201 | background: var(--background-secondary); 202 | } 203 | .selected-3H3-RC { 204 | background: var(--background-primary); 205 | } 206 | 207 | // -- Emote picker -- 208 | .sprite_d91a75.spriteColored_d91a75 { 209 | opacity: 1 !important; 210 | } 211 | .sprite_d91a75.spriteGreyscale_d91a75 { 212 | opacity: 0 !important; 213 | } 214 | 215 | #emoji-picker-tab .contents_dd4f85, 216 | #sticker-picker-tab .contents_dd4f85, 217 | #bd-emotes-tab .contents_dd4f85 { 218 | text-indent: 100%; 219 | overflow: hidden; 220 | } 221 | 222 | .navList_af5dbb { 223 | & > *:not(#gif-picker-tab).navButton_af5dbb::after { 224 | position: absolute; 225 | content: ""; 226 | width: 20px; 227 | height: 20px; 228 | background-size: 100%; 229 | background-repeat: no-repeat; 230 | } 231 | 232 | #sticker-picker-tab.navButton_af5dbb::after { 233 | background-image: url("https://i.imgur.com/S79punc.png"); 234 | } 235 | #emoji-picker-tab.navButton_af5dbb::after { 236 | background-image: url("https://i.imgur.com/YOshExa.png"); 237 | } 238 | #bd-emotes-tab.navButton_af5dbb::after { 239 | background-image: url("https://i.imgur.com/efz6JwF.png"); 240 | } 241 | 242 | .navButton_af5dbb { 243 | width: 40px; 244 | padding: 8px; 245 | } 246 | } 247 | 248 | .navButtonActive_af5dbb, 249 | .emojiItem_fbfedd.emojiItemSelected_fbfedd { 250 | background-color: #6e85d321; 251 | } 252 | 253 | .imageLoading_b000dd { 254 | background-image: none !important; 255 | background-color: var(--background-primary); 256 | border-radius: 8px; 257 | } 258 | 259 | .contentWrapper_af5dbb { 260 | grid-row-gap: 20px; 261 | padding-top: 8px; 262 | 263 | .arrow_d64d50 { 264 | display: none; 265 | } 266 | } 267 | 268 | // Stickers 269 | .stickerInspected_a708c4 .inspectedIndicator_a708c4 { 270 | background-color: #6e85d321; 271 | } 272 | 273 | // Chat buttons 274 | .attachButton_d0696b .attachButtonPlus_f298d4, 275 | .attachButton_d0696b:hover .attachButtonPlus_f298d4 { 276 | fill: var(--chat-buttons); 277 | } 278 | .buttonWrapper_f9af59, 279 | .icon_f9af59 { 280 | color: var(--chat-buttons); 281 | } 282 | 283 | // Apps 284 | .contentWrapper_f7506e { 285 | background-color: var(--background-primary); 286 | } 287 | .container_e5da8b, .clickable_b78bb6 { 288 | background-color: var(--background-secondary); 289 | } 290 | 291 | // @everyone popout 292 | .contentWarningPopout_fa823b { 293 | background-color: var(--background-secondary); 294 | } 295 | 296 | // Reaction popout 297 | .scroller_f2bfbb { 298 | background: var(--background-tertiary); 299 | } 300 | .container_f2bfbb, 301 | .reactors_f2bfbb { 302 | background: var(--background-secondary); 303 | } 304 | .reactionSelected_f2bfbb, 305 | .reactionDefault_f2bfbb:hover { 306 | margin-right: 6px; 307 | } 308 | .reactionSelected_f2bfbb { 309 | background-color: #6e85d321; 310 | } 311 | 312 | // Spotify session 313 | .invite_f61cb8 { 314 | background-color: var(--background-secondary); 315 | border-color: transparent; 316 | } 317 | 318 | // Attachement 319 | .attachment_b52bef { 320 | border: none; 321 | } 322 | 323 | // Spotify embed 324 | .embedSpotify_b0068a { 325 | border-radius: 5px; 326 | } 327 | 328 | // Discord Gift 329 | .tile_ab47a1 { 330 | background-color: var(--background-secondary); 331 | } 332 | .tileHorizontal_ab47a1.tile_ab47a1:hover { 333 | background-color: var(--background-secondary-alt); 334 | } 335 | .invalidPoop_ff31dd { 336 | background-color: rgba(0, 0, 0, 0.103); 337 | } 338 | 339 | // Spoiler 340 | .spoilerText-27bIiA.hidden-3B-Rum, 341 | .spoilerText-27bIiA.hidden-3B-Rum:hover { 342 | background-color: var(--background-secondary-alt); 343 | } 344 | 345 | // Audio player 346 | .wrapperAudio_f316dd { 347 | padding: 10px 0 0 0; 348 | border-color: transparent; 349 | } 350 | .audioMetadata_f316dd { 351 | padding: 5px 10px; 352 | } 353 | .audioControls_f316dd { 354 | border-radius: 0; 355 | } 356 | 357 | // HLJS Support 358 | .hljs.scrollbar_c858ce { 359 | background-color: var(--background-secondary) !important; 360 | } 361 | 362 | // Code 363 | .markup_f8f345 code { 364 | background: var(--deprecated-card-bg); 365 | } 366 | 367 | // Empty channel icon 368 | .emptyChannelIcon_c2668b { 369 | position: relative; 370 | background-color: transparent; 371 | 372 | &::after { 373 | content: ""; 374 | opacity: 0.3; 375 | top: 0; 376 | left: 0; 377 | z-index: -1; 378 | position: absolute; 379 | width: 100%; 380 | height: 100%; 381 | background-color: var(--brand-experiment); 382 | border-radius: 8px; 383 | } 384 | } 385 | } -------------------------------------------------------------------------------- /stuff/_friends.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Friend column 3 | .peopleColumn_c2739c { 4 | background: var(--background-primary); 5 | } 6 | 7 | // Friend activities 8 | .nowPlayingColumn_c2739c { 9 | background: var(--background-secondary-alt); 10 | 11 | .scroller_bf550a { 12 | border: none; 13 | } 14 | 15 | .itemCard_f02fcf { 16 | border: none; 17 | 18 | &.active_ac5d22, 19 | &.interactive_ac5d22:hover { 20 | background: var(--background-secondary); 21 | } 22 | 23 | .section_cd82a7:last-child { 24 | margin-top: 10px; 25 | } 26 | .inset_ac5d22 { 27 | background: transparent; 28 | } 29 | .applicationStreamingPreviewWrapper_cd82a7 { 30 | background-color: var(--background-secondary); 31 | } 32 | .separator_cd82a7 { 33 | display: none; 34 | } 35 | } 36 | } 37 | 38 | // Friend call buttons 39 | .bottomControls_dd069c { 40 | .centerButton_ef18ee { 41 | border-radius: 7px; 42 | } 43 | .colorable_ef18ee.primaryDark_ef18ee { 44 | background: var(--background-secondary-alt); 45 | } 46 | foreignObject { 47 | mask: none; 48 | } 49 | } 50 | .participantsButton_b83b18 { 51 | background: var(--background-secondary-alt); 52 | } 53 | 54 | // Regionnal selector friend call 55 | .quickSelect__540d0 { 56 | margin-top: 10px; 57 | } 58 | 59 | .quickSelectPopout_abbf45.regionSelectPopout_ccb5ca { 60 | background: var(--background-secondary-alt); 61 | box-shadow: none; 62 | } 63 | 64 | // User profile 65 | .userPanelOuter_c69a7b { 66 | 67 | // Banner 68 | .bannerSVGWrapper_b32cc2 { 69 | overflow: visible; 70 | min-height: 120px !important; 71 | 72 | foreignObject { 73 | mask: unset; 74 | } 75 | 76 | .banner_d5fdb1 { 77 | -webkit-mask-image: linear-gradient(#000000a7, #000000a7); 78 | height: 120px; 79 | } 80 | 81 | .pencilContainer_c3e427 { 82 | display: none; 83 | } 84 | 85 | &[viewBox="0 0 340 60"] foreignObject { 86 | transform: translateY(-30px); 87 | } 88 | &[viewBox="0 0 340 90"] foreignObject { 89 | transform: translateY(-15px); 90 | } 91 | } 92 | 93 | // Avatar 94 | .avatarWrapper_f89da9 { 95 | top: 20px !important; 96 | left: 16px; 97 | 98 | circle { 99 | display: none; 100 | } 101 | 102 | .avatarHint_f89da9 { 103 | border-radius: 5px; 104 | 105 | foreignObject { 106 | mask: none; 107 | } 108 | } 109 | 110 | .avatarDecorationHint_f89da9 { 111 | border-radius: 5px !important; 112 | top: 0; 113 | left: 0; 114 | width: 80px; 115 | height: 80px; 116 | 117 | foreignObject { 118 | mask: none; 119 | } 120 | } 121 | } 122 | 123 | // Username 124 | .userPanelOverlayBackground_a2b6ae:nth-child(2) { 125 | position: static; 126 | overflow: visible; 127 | margin: 16px; 128 | max-height: calc(100vh - 200px); 129 | 130 | .section_d7a21f { 131 | & > .copiableNameTag_c9ccf6 > .clickTarget__440f0, 132 | & > div > .userText_c9ccf6 { 133 | position: absolute; 134 | top: 25px; 135 | left: 115px; 136 | z-index: 1; 137 | max-width: 200px; 138 | text-overflow: ellipsis; 139 | white-space: nowrap; 140 | overflow: hidden; 141 | display: block; 142 | 143 | & > span { 144 | word-break: unset; 145 | white-space: unset; 146 | } 147 | } 148 | } 149 | } 150 | 151 | // Pronouns 152 | .pronouns_c9ccf6 { 153 | padding-top: 12px; 154 | } 155 | 156 | // Badges 157 | .badgelistGroup_ab525a { 158 | min-height: 0px; 159 | } 160 | 161 | .badgeList_ab525a { 162 | position: absolute; 163 | top: 70px; 164 | left: 110px; 165 | height: unset; 166 | z-index: 1; 167 | background-color: transparent; 168 | } 169 | 170 | // Dividers 171 | .divider_ae36e5 { 172 | display: none; 173 | } 174 | 175 | // Body 176 | .userPanelOverlayBackground_a2b6ae:nth-child(3):not(.profilePanelConnections_b433b4) { 177 | padding: 12px; 178 | 179 | .scroller_d2b491 { 180 | padding-right: 12px !important; 181 | } 182 | 183 | // -- Activities -- 184 | .activity__20c1e { 185 | padding: 16px; 186 | margin-top: 25px; 187 | z-index: 1; 188 | 189 | .text_ec2fa7, 190 | .textRow_c1d9fd, 191 | .anchor_af404b, 192 | .activityName_c1d9fd { 193 | color: white; 194 | } 195 | 196 | .buttonColor_e36233 { 197 | border: none; 198 | background-color: var(--listening-test); 199 | box-shadow: 0 4px 15px #00000021; 200 | color: #fff; 201 | } 202 | 203 | // Waves are back :D 204 | .headerTextNormal_c1d9fd::before { 205 | content: ""; 206 | position: absolute; 207 | height: 25px; 208 | z-index: 1; 209 | width: 284px; 210 | top: -25px; 211 | left: 0; 212 | background: var(--background-secondary); 213 | background: var(--profile-gradient-primary-color); 214 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 215 | animation: animate2 8s linear infinite; 216 | animation-delay: 0s; 217 | opacity: 1; 218 | 219 | @keyframes animate2 { 220 | 0% { 221 | -webkit-mask-position-x: 284px; 222 | } 223 | 100% { 224 | -webkit-mask-position-x: 0; 225 | } 226 | } 227 | } 228 | 229 | // Playing 230 | &::before { 231 | content: ""; 232 | position: absolute; 233 | width: 100%; 234 | height: 100%; 235 | z-index: -2; 236 | left: 0; 237 | top: 0; 238 | background: #7289da; 239 | background: var(--playing); 240 | border-radius: 0 0 10px 10px; 241 | } 242 | 243 | &::after { 244 | content: ""; 245 | position: absolute; 246 | height: 25px; 247 | z-index: 2; 248 | width: 284px; 249 | top: -24px; 250 | left: 0; 251 | background: #7289da; 252 | background: var(--playing); 253 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 254 | animation: animate 6s linear infinite; 255 | animation-delay: 0s; 256 | opacity: 1; 257 | } 258 | 259 | // Spotify 260 | .timeBarUserPopoutV2_c1d9fd { 261 | &::before { 262 | content: ""; 263 | position: absolute; 264 | width: 100%; 265 | height: 100%; 266 | z-index: -1; 267 | left: 0; 268 | top: 0; 269 | background: #1db954; 270 | background: var(--listening); 271 | border-radius: 0 0 10px 10px; 272 | } 273 | 274 | &::after { 275 | content: ""; 276 | position: absolute; 277 | height: 25px; 278 | width: 284px; 279 | top: -24px; 280 | left: 0; 281 | z-index: 3; 282 | background: #1db653; 283 | background: var(--listening); 284 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 285 | animation: animate 6s linear infinite; 286 | animation-delay: 0s; 287 | 288 | @keyframes animate { 289 | 0% { 290 | -webkit-mask-position-x: 0; 291 | } 292 | 100% { 293 | -webkit-mask-position-x: 284px; 294 | } 295 | } 296 | } 297 | 298 | .barInner_ec2fa7 { 299 | background-color: white; 300 | } 301 | } 302 | 303 | .platformIcon_c1d9fd { 304 | display: none; 305 | } 306 | } 307 | } 308 | } 309 | } -------------------------------------------------------------------------------- /stuff/_member-list.scss: -------------------------------------------------------------------------------- 1 | @use "sass:string"; 2 | 3 | :root { 4 | .bannerSVGWrapper_b32cc2 mask { 5 | display: none; 6 | } 7 | 8 | // -- Member popout -- 9 | .userPopoutOuter_c69a7b { 10 | max-height: unset !important; 11 | 12 | .userPopoutInner_c69a7b { 13 | max-height: unset !important; 14 | } 15 | 16 | .header_b8cc6d { 17 | min-height: 120px !important; 18 | } 19 | 20 | // Banner 21 | .mask_d5fdb1 { 22 | overflow: visible; 23 | min-height: 120px !important; 24 | 25 | foreignObject { 26 | mask: unset; 27 | } 28 | 29 | .banner_d5fdb1 { 30 | -webkit-mask-image: linear-gradient(#000000a7, #000000a7); 31 | height: 120px !important; 32 | } 33 | 34 | .pencilContainer_c3e427 { 35 | display: none; 36 | } 37 | 38 | &[viewBox="0 0 300 105"] foreignObject { 39 | transform: translateY(-0px); 40 | } 41 | } 42 | 43 | // Avatar 44 | .avatar_f94206 { 45 | top: 20px !important; 46 | left: 16px; 47 | 48 | circle { 49 | display: none; 50 | } 51 | 52 | .avatarHint_f89da9 { 53 | border-radius: 5px; 54 | 55 | foreignObject { 56 | mask: none; 57 | } 58 | } 59 | 60 | .avatarDecorationHint_f89da9 { 61 | border-radius: 5px !important; 62 | top: 0; 63 | left: 0; 64 | width: 80px; 65 | height: 80px; 66 | 67 | foreignObject { 68 | mask: none; 69 | } 70 | } 71 | 72 | .overlay_f94206:after { 73 | border-radius: var(--avatar-radius); 74 | } 75 | } 76 | 77 | // goofy status thing 78 | .statusBubble_d22603 { 79 | background-color: var(--background-tertiary); 80 | } 81 | 82 | // Body 83 | .body_b8cc6d { 84 | position: static; 85 | overflow: visible; 86 | 87 | 88 | // Username 89 | .container_c32acf { 90 | position: absolute; 91 | top: 20px; 92 | left: 115px; 93 | z-index: 1; 94 | max-width: 180px; 95 | text-overflow: ellipsis; 96 | white-space: nowrap; 97 | overflow: hidden; 98 | display: block; 99 | pointer-events: none; 100 | } 101 | 102 | // -- Activities -- 103 | .activity_b8cc6d { 104 | padding: 16px; 105 | margin-top: 25px; 106 | z-index: 1; 107 | background: none !important; 108 | 109 | [style="color: var(--text-normal);"] { 110 | color: white !important; 111 | } 112 | 113 | .button_dd4f85 { 114 | border: none; 115 | background-color: rgba(255, 255, 255, 0.2); 116 | box-shadow: 0 4px 15px #00000021; 117 | color: #fff; 118 | border-radius: 8px; 119 | } 120 | 121 | // Waves are back :D 122 | .headerTextNormal_c1d9fd::before { 123 | content: ""; 124 | position: absolute; 125 | height: 25px; 126 | z-index: 1; 127 | width: 276px; 128 | top: -25px; 129 | left: 0; 130 | background: var(--background-secondary); 131 | background: var(--profile-gradient-primary-color); 132 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 133 | animation: animate2 8s linear infinite; 134 | animation-delay: 0s; 135 | opacity: 1; 136 | 137 | @keyframes animate2 { 138 | 0% { 139 | -webkit-mask-position-x: 276px; 140 | } 141 | 100% { 142 | -webkit-mask-position-x: 0; 143 | } 144 | } 145 | } 146 | 147 | // Playing 148 | &::before { 149 | content: ""; 150 | position: absolute; 151 | width: 100%; 152 | height: 100%; 153 | z-index: -2; 154 | left: 0; 155 | top: 0; 156 | background: #7289da; 157 | background: var(--playing); 158 | border-radius: 0 0 10px 10px; 159 | } 160 | 161 | &::after { 162 | content: ""; 163 | position: absolute; 164 | height: 25px; 165 | z-index: 2; 166 | width: 276px; 167 | top: -24px; 168 | left: 0; 169 | background: #7289da; 170 | background: var(--playing); 171 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 172 | animation: animate 6s linear infinite; 173 | animation-delay: 0s; 174 | opacity: 1; 175 | } 176 | 177 | // Spotify 178 | .bar_b5cd55 { 179 | &::before { 180 | content: ""; 181 | position: absolute; 182 | width: 100%; 183 | height: 100%; 184 | z-index: -1; 185 | left: 0; 186 | top: 0; 187 | background: #1db954; 188 | background: var(--listening); 189 | border-radius: 0 0 10px 10px; 190 | } 191 | 192 | &::after { 193 | content: ""; 194 | position: absolute; 195 | height: 25px; 196 | width: 276px; 197 | top: -24px; 198 | left: 0; 199 | z-index: 3; 200 | background: #1db653; 201 | background: var(--listening); 202 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 203 | animation: animate 6s linear infinite; 204 | animation-delay: 0s; 205 | 206 | @keyframes animate { 207 | 0% { 208 | -webkit-mask-position-x: 0; 209 | } 210 | 100% { 211 | -webkit-mask-position-x: 276px; 212 | } 213 | } 214 | } 215 | 216 | .barInner_ec2fa7 { 217 | background-color: white; 218 | } 219 | } 220 | 221 | .platformIcon_c1d9fd { 222 | display: none; 223 | } 224 | } 225 | 226 | // Roles 227 | .role_f9575e { 228 | position: relative; 229 | overflow: hidden; 230 | border: none; 231 | z-index: 1; 232 | 233 | &:not(.addButton_e4010c) { 234 | pointer-events: none; 235 | } 236 | 237 | .roleRemoveButton_f9575e { 238 | position: static; 239 | 240 | .roleCircle_a26d7b { 241 | width: var(--role-circle) !important; 242 | height: var(--role-circle) !important; 243 | pointer-events: auto; 244 | 245 | &::before { 246 | position: absolute; 247 | content: ""; 248 | top: 0; 249 | left: 0; 250 | width: 100%; 251 | height: 100%; 252 | background: inherit; 253 | opacity: 0.3; 254 | z-index: -1; 255 | pointer-events: none; 256 | transition: background 200ms; 257 | } 258 | 259 | &:hover { 260 | background: #fd5959 !important; 261 | } 262 | } 263 | 264 | .roleRemoveIcon_e4010c { 265 | display: none; 266 | } 267 | } 268 | } 269 | } 270 | } 271 | 272 | // Roles selector 273 | .container_ac201b { 274 | position: relative; 275 | z-index: 1005; 276 | border: none; 277 | padding: 0; 278 | background-color: #191f2e; 279 | 280 | .container_c18ec9 { 281 | border-radius: 5px 5px 0 0; 282 | } 283 | 284 | .list_eef3ef { 285 | margin: 0; 286 | padding: 0; 287 | 288 | .item_eef3ef { 289 | margin: 5px; 290 | position: relative; 291 | overflow: hidden; 292 | border-radius: 0; 293 | 294 | .popoutRoleCircle_f50ea3 { 295 | width: 0; 296 | border: none; 297 | margin: 0; 298 | 299 | &::before { 300 | position: absolute; 301 | border-radius: 5px; 302 | content: ""; 303 | top: 0; 304 | left: 0; 305 | width: 100%; 306 | height: 100%; 307 | background: inherit; 308 | opacity: 0.2; 309 | z-index: -1; 310 | } 311 | } 312 | } 313 | } 314 | } 315 | 316 | // -- User modal -- 317 | .root_b9fccc > .userProfileOuter_c69a7b { 318 | width: 700px; 319 | 320 | header { 321 | position: absolute; 322 | width: 100%; 323 | 324 | .mask_d5fdb1 > mask { 325 | display: none; 326 | } 327 | 328 | .headerInner_b9fccc { 329 | width: calc(100% - 8px); 330 | box-sizing: border-box; 331 | } 332 | 333 | .avatar_f94206 { 334 | top: -143px; 335 | } 336 | } 337 | 338 | .body_b9fccc { 339 | position: relative; 340 | top: 150px; 341 | height: calc(100% - 185px); 342 | 343 | .container_c32acf { 344 | position: relative; 345 | top: 0px; 346 | left: 150px; 347 | z-index: 1; 348 | font-size: 23px; 349 | font-weight: 600; 350 | } 351 | 352 | .overlay_b9fccc { 353 | margin-top: 80px; 354 | } 355 | } 356 | 357 | .mask_c51b4e rect[fill="black"], 358 | .mask_c51b4e circle[fill="black"] { 359 | display: none; 360 | } 361 | .mask_c51b4e .cursorDefault_c51b4e rect, 362 | .mask_c51b4e .pointerEvents_c51b4e { 363 | rx: calc(1px + var(--status-radius)); 364 | ry: calc(1px + var(--status-radius)); 365 | } 366 | 367 | // -- Activities -- 368 | .activityProfileV2_c1d9fd { 369 | padding: 16px; 370 | margin: 12px; 371 | border-radius: 5px; 372 | overflow: hidden; 373 | z-index: 1; 374 | 375 | .headerText_c1d9fd, 376 | .activityName_c1d9fd, 377 | .null, 378 | .details_c1d9fd, 379 | .name_c1d9fd, 380 | .nameNormal_c1d9fd, 381 | .nameWrap_c1d9fd { 382 | color: white; 383 | } 384 | } 385 | 386 | // Connections 387 | .connectedAccountContainer_ab12c6 { 388 | position: relative; 389 | padding: 0; 390 | outline: 2px solid rgba(0, 0, 0, 0.25); 391 | border: none; 392 | border-radius: 4px; 393 | width: 296px; 394 | transition: outline-color 100ms; 395 | overflow: hidden; 396 | 397 | .connectedAccount_ab12c6 { 398 | height: 100%; 399 | 400 | .connectedAccountIcon_ab12c6 { 401 | padding: 12px; 402 | border-radius: 0; 403 | height: 100%; 404 | } 405 | 406 | .connectedAccountNameContainer_ab12c6 { 407 | padding: 12px 12px 12px 4px; 408 | } 409 | } 410 | 411 | &.connectedAccountContainerWithMetadata_ab12c6 .connectedAccount_ab12c6 { 412 | align-items: flex-start; 413 | padding-bottom: 20px; 414 | 415 | .connectedAccountIcon_ab12c6 { 416 | padding: 12px; 417 | width: 48px; 418 | box-sizing: border-box; 419 | } 420 | } 421 | 422 | .connectedAccountChildren_ab12c6 { 423 | position: absolute; 424 | left: 0; 425 | bottom: 12px; 426 | margin-left: 60px; 427 | } 428 | } 429 | 430 | // Mutuals 431 | .listRow_d2d6cb { 432 | margin: 0; 433 | padding: 8px 12px; 434 | } 435 | 436 | .pencilContainer_c3e427 { 437 | display: none; 438 | } 439 | } 440 | 441 | .connectionIcon_e2a436[alt="Battle.net"], 442 | .accountButtonInner_e2a436[aria-label="Battle.net"], 443 | .connectedAccountIcon_ab12c6[aria-label="Battle.net"] { 444 | background-color: #1da0f248; 445 | } 446 | 447 | .connectionIcon_e2a436[alt="Twitch"], 448 | .accountButtonInner_e2a436[aria-label="Twitch"], 449 | .connectedAccountIcon_ab12c6[aria-label="Twitch"] { 450 | background-color: #601bd852; 451 | } 452 | 453 | .connectionIcon_e2a436[alt="YouTube"], 454 | .accountButtonInner_e2a436[aria-label="YouTube"], 455 | .connectedAccountIcon_ab12c6[aria-label="YouTube"] { 456 | background-color: #d9252b49; 457 | } 458 | 459 | .connectionIcon_e2a436[alt="X"], 460 | .accountButtonInner_e2a436[aria-label="X"], 461 | .connectedAccountIcon_ab12c6[aria-label="X"] { 462 | background-color: rgba(0, 0, 0, 0.25); 463 | } 464 | 465 | .connectionIcon_e2a436[alt="Steam"], 466 | .accountButtonInner_e2a436[aria-label="Steam"], 467 | .connectedAccountIcon_ab12c6[aria-label="Steam"] { 468 | background-color: #00000034; 469 | } 470 | 471 | .connectionIcon_e2a436[alt="Reddit"], 472 | .accountButtonInner_e2a436[aria-label="Reddit"], 473 | .connectedAccountIcon_ab12c6[aria-label="Reddit"] { 474 | background-color: #fe44013d; 475 | } 476 | 477 | .connectionIcon_e2a436[alt="Facebook"], 478 | .accountButtonInner_e2a436[aria-label="Facebook"], 479 | .connectedAccountIcon_ab12c6[aria-label="Facebook"] { 480 | background-color: #2e327685; 481 | } 482 | 483 | .connectionIcon_e2a436[alt="Spotify"], 484 | .accountButtonInner_e2a436[aria-label="Spotify"], 485 | .connectedAccountIcon_ab12c6[aria-label="Spotify"] { 486 | background-color: #1ed75f34; 487 | } 488 | 489 | .connectionIcon_e2a436[alt="Xbox"], 490 | .accountButtonInner_e2a436[aria-label="Xbox"], 491 | .connectedAccountIcon_ab12c6[aria-label="Xbox"] { 492 | background-color: #5dc21e36; 493 | } 494 | 495 | .connectionIcon_e2a436[alt="League of Legends"], 496 | .accountButtonInner_e2a436[aria-label="League of Legends"], 497 | .connectedAccountIcon_ab12c6[aria-label="League of Legends"] { 498 | background-color: #cea14638; 499 | } 500 | 501 | .connectionIcon_e2a436[alt="GitHub"], 502 | .accountButtonInner_e2a436[aria-label="GitHub"], 503 | .connectedAccountIcon_ab12c6[aria-label="GitHub"] { 504 | background-color: #24292e62; 505 | } 506 | 507 | .connectionIcon_e2a436[alt="Skype"], 508 | .accountButtonInner_e2a436[aria-label="Skype"], 509 | .connectedAccountIcon_ab12c6[aria-label="Skype"] { 510 | background-color: #0076d74b; 511 | } 512 | 513 | .connectionIcon_e2a436[alt="Epic Games"], 514 | .accountButtonInner_e2a436[aria-label="Epic Games"], 515 | .connectedAccountIcon_ab12c6[aria-label="Epic Games"] { 516 | background-color: #2f2f2f59; 517 | } 518 | 519 | .connectionIcon_e2a436[alt="Riot Games"], 520 | .accountButtonInner_e2a436[aria-label="Riot Games"], 521 | .connectedAccountIcon_ab12c6[aria-label="Riot Games"] { 522 | background-color: #eb1c2d38; 523 | } 524 | 525 | .connectionIcon_e2a436[alt="PayPal"], 526 | .accountButtonInner_e2a436[aria-label="PayPal"], 527 | .connectedAccountIcon_ab12c6[aria-label="PayPal"] { 528 | background-color: #009fe33b; 529 | } 530 | 531 | .connectionIcon_e2a436[alt="TikTok"], 532 | .accountButtonInner_e2a436[aria-label="TikTok"], 533 | .connectedAccountIcon_ab12c6[aria-label="TikTok"] { 534 | background-color: #64bfc546; 535 | } 536 | 537 | .connectionIcon_e2a436[alt="eBay"], 538 | .accountButtonInner_e2a436[aria-label="eBay"], 539 | .connectedAccountIcon_ab12c6[aria-label="eBay"] { 540 | background-color: #c500003b; 541 | } 542 | 543 | .connectionIcon_e2a436[alt="PlayStation Network"], 544 | .accountButtonInner_e2a436[aria-label="PlayStation Network"], 545 | .connectedAccountIcon_ab12c6[aria-label="PlayStation Network"] { 546 | background-color: #0051ae53; 547 | } 548 | 549 | .connectionIcon_e2a436[alt="Instagram"], 550 | .accountButtonInner_e2a436[aria-label="Instagram"], 551 | .connectedAccountIcon_ab12c6[aria-label="Instagram"] { 552 | background-color: rgba(175, 1, 182, 0.25); 553 | } 554 | 555 | .connectionIcon_e2a436[alt="Roblox"], 556 | .accountButtonInner_e2a436[aria-label="Roblox"], 557 | .connectedAccountIcon_ab12c6[aria-label="Roblox"] { 558 | background-color: rgba(182, 191, 204, 0.25); 559 | } 560 | 561 | .connectionIcon_e2a436[alt="Crunchyroll"], 562 | .accountButtonInner_e2a436[aria-label="Crunchyroll"], 563 | .connectedAccountIcon_ab12c6[aria-label="Crunchyroll"] { 564 | background-color: rgba(243, 117, 33, 0.3); 565 | } 566 | } -------------------------------------------------------------------------------- /stuff/_other.scss: -------------------------------------------------------------------------------- 1 | // -- 🚥 WINDOWS BUTTONS PART -- 2 | .titleBar_a934d8 { 3 | z-index: 1001; 4 | } 5 | 6 | .winButton_a934d8 { 7 | &:not(:last-child) { 8 | & > svg { 9 | display: none; 10 | } 11 | &::after { 12 | content: ""; 13 | border-radius: 50px; 14 | pointer-events: fill; 15 | } 16 | } 17 | &:hover { 18 | background-color: var(--background-tertiary); 19 | } 20 | } 21 | 22 | .winButtonClose_a934d8 { 23 | margin-right: 5px; 24 | 25 | &::after { 26 | padding: 6px; 27 | background-image: url("https://i.imgur.com/WAbJScJ.png"); 28 | background-size: 100%; 29 | } 30 | 31 | &:hover::after { 32 | background-image: url("https://i.imgur.com/ipwGE9a.png"); 33 | background-size: 100%; 34 | } 35 | } 36 | 37 | .winButtonMinMax_a934d8 { 38 | &:nth-child(3)::after { 39 | background-color: #faa61a; 40 | padding: 5px; 41 | } 42 | 43 | &:nth-child(3):hover::after { 44 | background-color: #faa81ae5; 45 | } 46 | &:last-child { 47 | color: #43b581; 48 | 49 | &:hover { 50 | color: #43b582e3; 51 | } 52 | rect { 53 | height: 3px; 54 | rx: 2px; 55 | } 56 | } 57 | } 58 | 59 | :root { 60 | // Custom status modal 61 | .select_f6639d, 62 | .popout_f6639d { 63 | border: none; 64 | } 65 | .select_f6639d.open_f6639d, 66 | .popout_f6639d { 67 | background-color: var(--background-secondary-alt); 68 | } 69 | .footer_f9a4c9 { 70 | background: var(--background-tertiary); 71 | } 72 | 73 | // Profile 74 | .accountProfilePopoutWrapper_b2ca13 .submenuPaddingContainer_d90b3d { 75 | margin-left: -5px; 76 | } 77 | 78 | // -- Better menus -- 79 | 80 | // Menu 81 | .menu_d90b3d { 82 | border-radius: 5px; 83 | overflow: hidden; 84 | 85 | .scroller_d90b3d { 86 | padding: 0; 87 | 88 | .separator_d90b3d { 89 | display: none; 90 | } 91 | } 92 | } 93 | 94 | // Submenu 95 | .submenuPaddingContainer_d90b3d { 96 | padding: 0; 97 | } 98 | 99 | // Label 100 | .item_d90b3d { 101 | margin: 0; 102 | padding: 10px 15px; 103 | border-radius: 0; 104 | transition: 150ms; 105 | 106 | &.colorDefault_d90b3d { 107 | &:hover, 108 | &.focused_d90b3d, 109 | &:active:not(.hideInteraction-2jPGL_) { 110 | background-color: #5c6eb12a; 111 | } 112 | } 113 | &.colorDanger_d90b3d { 114 | color: #fd5959; 115 | 116 | &:hover, 117 | &.focused_d90b3d, 118 | &:active:not(.hideInteraction-2jPGL_) { 119 | background-color: #f047471a; 120 | } 121 | } 122 | } 123 | 124 | // Fix for user menu tooltip (thx Metro420yt) 125 | [class*="disabledPointerEvents"][style*="left: -"] { 126 | left: 0 !important; 127 | } 128 | 129 | // Loading screen 130 | .container_e40c16 > .content_e40c16 { 131 | position: relative; 132 | 133 | .ready_e40c16 { 134 | display: none; 135 | 136 | & + .text_e40c16 { 137 | top: 82px; 138 | } 139 | } 140 | 141 | &::before { 142 | content: ""; 143 | position: absolute; 144 | bottom: 20px; 145 | left: calc(50% - 100px); 146 | width: 200px; 147 | height: 200px; 148 | background: url("https://comfy-themes.github.io/Discord/assets/bonfire.gif") 149 | center/80% no-repeat; 150 | } 151 | } 152 | 153 | // Coloured status when playing 154 | .pointerEvents_c51b4e { 155 | &[fill="#23a55a"] { 156 | fill: var(--online); 157 | } 158 | &[fill="#f0b232"] { 159 | fill: var(--iddle); 160 | } 161 | &[fill="#f23f43"] { 162 | fill: var(--dnd); 163 | } 164 | &[fill="#80848e"] { 165 | fill: var(--offline); 166 | } 167 | &[fill="#593695"] { 168 | fill: var(--streaming); 169 | } 170 | } 171 | 172 | // Joining message 173 | .contentWrapper_ed5743 { 174 | background: var(--background-secondary); 175 | } 176 | 177 | // Deleting Discord watermark 178 | .wordmark_a934d8 svg { 179 | display: var(--discord-logo); 180 | } 181 | 182 | // Watch stream popout 183 | .body-2khErn { 184 | background: var(--background-tertiary); 185 | } 186 | 187 | // Deleting message confirmation 188 | .message_ddcc45 { 189 | background: var(--background-primary); 190 | } 191 | 192 | // Keyboard shortcuts 193 | .keyboardShortcutsModal_ad95dc { 194 | background: var(--background-primary); 195 | 196 | .keybindShortcut-3zF1P9 span { 197 | border-radius: 1px; 198 | } 199 | } 200 | 201 | // Popups 202 | .root_f9a4c9, 203 | .footer_f9a4c9, 204 | .modal_c97cbd { 205 | box-shadow: none; 206 | } 207 | 208 | // Cross 209 | .default_a467ac, 210 | .default_a467ac:hover { 211 | background-color: var(--background-tertiary); 212 | } 213 | 214 | // >:( fuck borders 215 | .messageGroupWrapper_ac90a2, 216 | .inputDefault-3FGxgL, 217 | .container-30qY7E, 218 | .cardPrimary_cb7a0e, 219 | .cardPrimaryOutline-1ofwVz, 220 | .codeRedemptionRedirect_cb70f4, 221 | .previewOverlay-2reuWf, 222 | .markup_f8f345 code { 223 | border: none; 224 | } 225 | 226 | // -- Status masks -- 227 | .pointerEvents_c51b4e { 228 | mask: none; 229 | pointer-events: none; 230 | 231 | &[width="8"]:not([mask="url(#svg-mask-status-online-mobile)"]), 232 | &[width="10"]:not([mask="url(#svg-mask-status-online-mobile)"]), 233 | &[width="12"]:not([mask="url(#svg-mask-status-online-mobile)"]), 234 | &[width="16"]:not([mask="url(#svg-mask-status-online-mobile)"]) { 235 | rx: var(--status-radius); 236 | } 237 | 238 | &[width="25"], 239 | &[mask="url(#svg-mask-status-online-mobile)"] { 240 | rx: 5px; 241 | } 242 | } 243 | 244 | .mask_c51b4e, 245 | .userInfo_b69b77 { 246 | overflow: visible; 247 | } 248 | 249 | // Fixing weird Discord behavior 250 | .cursorDefault--wfhy5, 251 | .mask_c51b4e > svg { 252 | overflow: visible; 253 | } 254 | div:not(.avatarWrapper_b2ca13) .mask_c51b4e > svg > mask > rect:first-child { 255 | y: 8; 256 | rx: var(--status-radius); 257 | } 258 | .mask_c51b4e > svg > mask > rect[width="10"]:first-child { 259 | x: 8.5; 260 | width: 14px; 261 | height: 11px; 262 | } 263 | .avatarWrapper_b2ca13 .wrapper_c51b4e > .mask_c51b4e > svg > rect { 264 | mask: none; 265 | x: 17; 266 | y: 15; 267 | width: 10px; 268 | height: 10px; 269 | rx: var(--status-radius); 270 | } 271 | 272 | .mask_c51b4e > svg { 273 | & > rect { 274 | height: 40px; 275 | } 276 | & > mask { 277 | & > rect:nth-child(2), 278 | & > circle, 279 | & > polygon { 280 | display: none; 281 | } 282 | } 283 | } 284 | 285 | // All masks in DM, user and member part 286 | .channel_c91bad .pointerEvents_c51b4e, 287 | .members_cbd271 .pointerEvents_c51b4e, 288 | .avatarWrapper_b2ca13 .pointerEvents_c51b4e, 289 | .peopleListItem_d51464 .pointerEvents_c51b4e, 290 | .nowPlayingColumn_c2739c .pointerEvents_c51b4e { 291 | height: 12px; 292 | y: 24; 293 | stroke-width: 2.5px; 294 | } 295 | 296 | // All masks except mobile and typing masks in DM, user and member part 297 | .channel_c91bad 298 | .pointerEvents_c51b4e[width="10"]:not( 299 | [mask="url(#svg-mask-status-online-mobile)"] 300 | ), 301 | .members_cbd271 302 | .pointerEvents_c51b4e[width="10"]:not( 303 | [mask="url(#svg-mask-status-online-mobile)"] 304 | ), 305 | .avatarWrapper_b2ca13 .pointerEvents_c51b4e, 306 | .peopleListItem_d51464 307 | .pointerEvents_c51b4e[width="10"]:not( 308 | [mask="url(#svg-mask-status-online-mobile)"] 309 | ), 310 | .nowPlayingColumn_c2739c 311 | .pointerEvents_c51b4e[width="10"]:not( 312 | [mask="url(#svg-mask-status-online-mobile)"] 313 | ) { 314 | width: 12px; 315 | x: 24; 316 | } 317 | 318 | // All mobile masks in DM and member part 319 | .channel_c91bad 320 | .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 321 | .members_cbd271 322 | .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 323 | .peopleListItem_d51464 324 | .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 325 | .nowPlayingColumn_c2739c 326 | .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"], 327 | .menu_d90b3d 328 | .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"] { 329 | width: 12px; 330 | height: 16px; 331 | x: 24; 332 | y: 20; 333 | } 334 | 335 | // Mask in the status picker 336 | #account-avatar .pointerEvents_c51b4e { 337 | width: 18px; 338 | height: 18px; 339 | x: 68; 340 | y: 68; 341 | stroke-width: 3.5px; 342 | rx: calc(1px + var(--status-radius)); 343 | } 344 | 345 | // Mutuals status 346 | .listAvatar-1NlAhb .pointerEvents_c51b4e { 347 | x: 30; 348 | y: 30; 349 | stroke-width: 2.5px; 350 | } 351 | 352 | // Status in menu 353 | .menu_d90b3d 354 | .pointerEvents_c51b4e:not([mask="url(#svg-mask-status-online-mobile)"]) { 355 | width: 10px; 356 | height: 10px; 357 | stroke-width: 2.5px; 358 | } 359 | 360 | // Adding stroke color 361 | .menu_d90b3d .pointerEvents_c51b4e { 362 | stroke: var(--background-tertiary); 363 | } 364 | .channel_c91bad .pointerEvents_c51b4e, 365 | .members_cbd271 .pointerEvents_c51b4e, 366 | .listAvatar-1NlAhb .pointerEvents_c51b4e, 367 | .nowPlayingColumn_c2739c .pointerEvents_c51b4e { 368 | stroke: var(--background-secondary-alt); 369 | } 370 | .avatarWrapper_b2ca13[aria-expanded] .pointerEvents_c51b4e, 371 | .peopleListItem_d51464 .pointerEvents_c51b4e { 372 | stroke: var(--background-primary); 373 | } 374 | 375 | // Typing dots 376 | .wrapper_c51b4e .dots_ce0450 { 377 | overflow: visible; 378 | 379 | g { 380 | transform: translateY(2.5px); 381 | } 382 | } 383 | 384 | // Avatars radius 385 | .wrapper_c51b4e foreignObject, 386 | .callAvatarMask_db83a2 foreignObject, 387 | .avatarContainer_d03bba foreignObject, 388 | .avatarMasked__0b3c8 { 389 | mask: none; 390 | -webkit-mask: none; 391 | } 392 | 393 | .wrapper_c51b4e, 394 | .avatar_c51b4e, 395 | .profile_d6fbe8 .avatarUploaderInner-yEhTv5, 396 | .voiceAvatar_db83a2, 397 | .avatar_f9f2ca, 398 | .border_db83a2, 399 | .avatar_d80634, 400 | .clickableAvatar_d03bba, 401 | .emptyUser_d03bba, 402 | .avatar_d03bba, 403 | .wrapper_db83a2.ringingIncoming_db83a2::after, 404 | .wrapper_db83a2.ringingOutgoing_db83a2::after, 405 | .replyAvatar_f9f2ca, 406 | .avatarSpeaking_c51b4e, 407 | .avatar-2EVtgZ, 408 | .avatarContainerMasked_d03bba, 409 | .appAvatar-2_lufo, 410 | .embedAuthorIcon_b0068a { 411 | border-radius: var(--avatar-radius); 412 | } 413 | 414 | // Server radius 415 | .wrapper_c5f96a foreignObject { 416 | mask: none; 417 | -webkit-mask: none; 418 | } 419 | .wrapperSimple_c5f96a { 420 | overflow: visible; 421 | } 422 | 423 | .wrapperSimple_c5f96a, 424 | .wrapper_c5f96a foreignObject, 425 | .folderIconWrapper_bc7085, 426 | .expandedFolderBackground_bc7085, 427 | .flexChild_dc333f .avatarUploaderInner_f0a9ff { 428 | border-radius: var(--server-radius); 429 | } 430 | 431 | .iconInactive_a64689 { 432 | border-radius: calc(var(--server-radius) - 4px); 433 | } 434 | 435 | .wrapper_c5f96a { 436 | foreignObject { 437 | transition: border-radius 200ms; 438 | } 439 | &:hover foreignObject { 440 | border-radius: calc(var(--server-radius) - 3px); 441 | } 442 | } 443 | 444 | // Buttons 445 | .container-2nx-BQ, 446 | .input-2XRLou { 447 | border-radius: 5px; 448 | } 449 | .slider-32CRPX rect { 450 | rx: 5px; 451 | } 452 | 453 | // Volume bar 454 | .mini_c7a159 { 455 | height: 25px; 456 | } 457 | :not(.themedPopout-1TrfdI) > .slider_c7a159:not(.mini_c7a159) { 458 | height: 50px; 459 | } 460 | .themedPopout-1TrfdI > .slider_c7a159 { 461 | height: 15px; 462 | margin: 0; 463 | 464 | .bar_c7a159 { 465 | top: 0 !important; 466 | } 467 | } 468 | .bar_c7a159 { 469 | height: 15px !important; 470 | background-color: var(--background-secondary); 471 | } 472 | .slider_c7a159 .grabber_c7a159 { 473 | background-color: transparent; 474 | box-shadow: none; 475 | border: none; 476 | } 477 | .barFill_c7a159 { 478 | border-radius: 0 3px 3px 0; 479 | } 480 | 481 | // Bigger stream preview popout 482 | .streamPreview_adbea6 { 483 | width: 370px; 484 | background-color: var(--background-secondary); 485 | 486 | .previewContainer_adbea6 { 487 | height: 211px; 488 | 489 | .emptyPreviewImage-3LUxKH { 490 | margin-bottom: 18px; 491 | } 492 | } 493 | 494 | .button_dd4f85 { 495 | border: none; 496 | background-color: #e9edff; 497 | color: var(--background-tertiary); 498 | transition: background-color 0.15s; 499 | 500 | &:hover { 501 | background-color: #fff; 502 | } 503 | } 504 | } 505 | 506 | // Fix enable community issue 507 | .container-1rn8Cv > img { 508 | z-index: unset; 509 | } 510 | 511 | // Token thing 512 | .contentWarningPopout_fa823b { 513 | background-color: var(--background-primary); 514 | box-shadow: none; 515 | } 516 | 517 | // No scrollbars 518 | .layerContainer-2v_Sit { 519 | *::-webkit-scrollbar { 520 | display: none; 521 | } 522 | 523 | .scroller-3nFW5p { 524 | padding-left: 0; 525 | 526 | & > .content_eed6a8, 527 | .buttons_d0696b, 528 | .messagesPopout_ac90a2 { 529 | padding-right: 10px !important; 530 | } 531 | } 532 | } 533 | 534 | // Revert some Discord internal changes 535 | --brand-experiment: #7289da; 536 | --brand-experiment-560: #5b70be; 537 | 538 | .lookFilled-yCfaCM.colorGrey-2iAG-B, 539 | .lookFilled-yCfaCM.colorBrandNew-2-gGsS { 540 | background-color: var(--brand-experiment); 541 | 542 | &:hover { 543 | background-color: var(--brand-experiment-560); 544 | } 545 | } 546 | 547 | .gameVerifiedIcon-3t4jtr .flowerStar_c91f7d > path { 548 | fill: var(--brand-experiment); 549 | } 550 | 551 | .wrapper__8436d:hover .childWrapper_a6ce15 { 552 | background-color: var(--background-accent); 553 | } 554 | 555 | .homeIcon__560eb > path { 556 | d: path( 557 | "M 20.6644 20 C 20.6644 20 19.8014 18.9762 19.0822 18.0714 C 22.2226 17.1905 23.4212 15.2381 23.4212 15.2381 C 22.4384 15.881 21.5034 16.3334 20.6644 16.6429 C 19.4658 17.1429 18.3151 17.4762 17.1884 17.6667 C 14.887 18.0953 12.7774 17.9762 10.9795 17.6429 C 9.61301 17.381 8.43836 17 7.45548 16.6191 C 6.90411 16.4048 6.30479 16.1429 5.70548 15.8096 C 5.63356 15.7619 5.56164 15.7381 5.48973 15.6905 C 5.44178 15.6667 5.41781 15.6429 5.39384 15.6191 C 4.96233 15.381 4.7226 15.2143 4.7226 15.2143 C 4.7226 15.2143 5.87329 17.1191 8.91781 18.0238 C 8.19863 18.9286 7.31164 20 7.31164 20 C 2.0137 19.8333 0 16.381 0 16.381 C 0 8.7144 3.45205 2.50017 3.45205 2.50017 C 6.90411 -0.07123 10.1884 0.000197861 10.1884 0.000197861 L 10.4281 0.285909 C 6.11301 1.52399 4.12329 3.40493 4.12329 3.40493 C 4.12329 3.40493 4.65068 3.11921 5.53767 2.71446 C 8.10274 1.59542 10.1404 1.2859 10.9795 1.21447 C 11.1233 1.19066 11.2432 1.16685 11.387 1.16685 C 12.8493 0.976379 14.5034 0.92876 16.2295 1.11923 C 18.5068 1.38114 20.9521 2.0478 23.4452 3.40493 C 23.4452 3.40493 21.5514 1.61923 17.476 0.381146 L 17.8116 0.000197861 C 17.8116 0.000197861 21.0959 -0.07123 24.5479 2.50017 C 24.5479 2.50017 28 8.7144 28 16.381 C 28 16.381 25.9623 19.8333 20.6644 20 Z M 9.51712 8.88106 C 8.15068 8.88106 7.07192 10.0715 7.07192 11.5239 C 7.07192 12.9763 8.17466 14.1667 9.51712 14.1667 C 10.8836 14.1667 11.9623 12.9763 11.9623 11.5239 C 11.9863 10.0715 10.8836 8.88106 9.51712 8.88106 Z M 18.2671 8.88106 C 16.9007 8.88106 15.8219 10.0715 15.8219 11.5239 C 15.8219 12.9763 16.9247 14.1667 18.2671 14.1667 C 19.6336 14.1667 20.7123 12.9763 20.7123 11.5239 C 20.7123 10.0715 19.6336 8.88106 18.2671 8.88106 Z" 558 | ); 559 | } 560 | 561 | // Guild popout 562 | .guildPopout-G6M0fK { 563 | background-color: var(--background-secondary); 564 | 565 | .iconMask-1lJhcS { 566 | background-color: transparent; 567 | } 568 | } 569 | 570 | // Forums 571 | .container_a6d69a { 572 | background-color: var(--background-primary); 573 | 574 | .mainCard_a6d69a { 575 | background-color: var(--background-secondary); 576 | } 577 | } 578 | 579 | // BetterDiscord 580 | .bd-sidebar-header { 581 | padding-right: 10px; 582 | } 583 | 584 | .bd-addon-list.bd-grid-view { 585 | grid-template-columns: 1fr 1fr; 586 | } 587 | 588 | .directoryModal-YJsOMv { 589 | background-color: var(--background-primary); 590 | } 591 | 592 | // New channels and role thing and member thing 593 | .container_f1fd9c, 594 | .header_f1fd9c, 595 | .emptyPage_c6b11b, 596 | .scrollerContainer_c6b11b, 597 | .container_c2efea, 598 | .background_e85cee, 599 | .container_d20375, 600 | .pageBody_c2efea, 601 | .page_d20375 { 602 | background-color: var(--background-primary) !important; 603 | } 604 | 605 | .homeContent_e85cee .row_b53f4f, .channelRow_f04d06 { 606 | background-color: var(--background-secondary); 607 | } 608 | 609 | .headerArtPlaceholder_d32e26 { 610 | background-color: var(--background-tertiary); 611 | } 612 | } 613 | 614 | .soundButtonRefresh_f40049 { 615 | background-color: var(--background-primary); 616 | } 617 | 618 | .theme-dark { 619 | --card-secondary-bg: var(--background-secondary); 620 | } -------------------------------------------------------------------------------- /stuff/_plugins_support.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // GameActivity support 3 | #GameActivityToggleBtn .st0 { 4 | fill: var(--user-buttons-color); 5 | } 6 | 7 | // Game Activity Toggle 8 | #status-picker [aria-label="Hide Game Activity"]::after, 9 | #status-picker [aria-label="Show Game Activity"]::after { 10 | content: "Not supported in this area"; 11 | } 12 | 13 | // CustomStatusPresets 14 | #status-picker .submenuContainer-3EVTeH { 15 | grid-column: 1/5; 16 | } 17 | 18 | // PermisssionViewer, thx _david_ 19 | #permissions-modal-wrapper { 20 | #permissions-modal { 21 | box-shadow: none !important; 22 | border: none !important; 23 | } 24 | 25 | .header { 26 | background: var(--background-tertiary) !important; 27 | text-align: center !important; 28 | } 29 | 30 | .role-side, 31 | .perm-side { 32 | background: var(--background-secondary) !important; 33 | } 34 | } 35 | 36 | // Member Count 37 | #MemberCount { 38 | background-color: var(--background-secondary) !important; 39 | } 40 | 41 | // BetterDiscord Server folder 42 | .guilds_a4d4d9.content-Pph8t6 43 | + .base_a4d4d9 44 | .panels_a4d4d9 45 | > .container_b2ca13 46 | > .avatarWrapper_b2ca13 { 47 | transition: margin-left 300ms linear; 48 | } 49 | .guilds_a4d4d9.content-Pph8t6:not(.closed-j55_T-) 50 | + .base_a4d4d9 51 | .panels_a4d4d9 52 | > .container_b2ca13 53 | > .avatarWrapper_b2ca13 { 54 | margin-left: 72px; 55 | } 56 | 57 | // Vencord Sever folder 58 | .vc-bf-folder-sidebar 59 | + .base_a4d4d9 60 | .panels_a4d4d9 61 | > .container_b2ca13 62 | > .avatarWrapper_b2ca13 { 63 | transition: margin-left 300ms linear; 64 | } 65 | .vc-bf-folder-sidebar 66 | + .base_a4d4d9 67 | .panels_a4d4d9 68 | > .container_b2ca13 69 | > .avatarWrapper_b2ca13 { 70 | margin-left: 72px; 71 | } 72 | 73 | // Hide Channels 74 | .sidebar_a4d4d9 .avatarWrapper_b2ca13 { 75 | transition: margin-left 400ms ease; 76 | } 77 | .sidebar_a4d4d9.hideChannelElement .avatarWrapper_b2ca13 { 78 | margin-left: -240px; 79 | } 80 | 81 | // UserBackground 82 | .root-8LYsGj .UserBackgrounds-banner-container { 83 | position: static; 84 | 85 | .UserBackgrounds-banner-badge { 86 | top: 13px; 87 | right: 50px; 88 | } 89 | } 90 | } -------------------------------------------------------------------------------- /stuff/_server-list.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Server list 3 | .guilds_a4d4d9 .scroller_fea3ef { 4 | contain: none !important; 5 | padding-bottom: 170px; 6 | } 7 | 8 | // Folder 9 | .expandedFolderBackground_bc7085 { 10 | border-radius: var(--server-radius); 11 | } 12 | .folder_bc7085 { 13 | background-color: transparent; 14 | } 15 | 16 | // Discover 17 | .discoverHeader_b992d4 ~ .categoryItem_c72b37 { 18 | margin-left: 0; 19 | 20 | .itemInner_c72b37 { 21 | padding: 8px; 22 | border-radius: 0; 23 | } 24 | } 25 | 26 | .pageWrapper_a3a4ce { 27 | background-color: var(--background-primary); 28 | 29 | .scroller-3j5xK2 { 30 | padding: 0 !important; 31 | } 32 | 33 | .headerImage-2D5D-v { 34 | position: relative; 35 | top: -8px; 36 | border-radius: 0; 37 | -webkit-mask: linear-gradient(black, transparent); 38 | } 39 | 40 | .guildListSection_c8c448 { 41 | padding: 0 32px 32px; 42 | box-sizing: border-box; 43 | } 44 | } 45 | 46 | .scroller_a39aa3 { 47 | padding: 0 !important; 48 | 49 | .headerImage_a39aa3 { 50 | position: relative; 51 | top: -8px; 52 | border-radius: 0; 53 | -webkit-mask: linear-gradient(black, transparent); 54 | } 55 | 56 | .guildListSection_ac51fa, 57 | .footerDescription_a39aa3 { 58 | padding: 0 32px 32px; 59 | box-sizing: border-box; 60 | } 61 | } 62 | 63 | .css-bcsufo-menu { 64 | background: var(--background-secondary-alt); 65 | } 66 | 67 | .css-1a1o7fb-control, 68 | .css-2dw5y-control, 69 | .css-p0ralp-control { 70 | background: var(--background-secondary); 71 | } 72 | 73 | // Student Hubs 74 | .itemInner__2abad { 75 | padding: 8px; 76 | margin-left: 0; 77 | } 78 | 79 | .header_d33b18 { 80 | margin: -32px -32px 0 -32px; 81 | border-radius: 0; 82 | 83 | .headerImage_d33b18 { 84 | border-radius: 0; 85 | -webkit-mask: linear-gradient(black, transparent); 86 | } 87 | } 88 | 89 | // Create a server modal 90 | .theme-light { 91 | .root_f9a4c9, 92 | .footer_f9a4c9 { 93 | box-shadow: none; 94 | } 95 | .lookFilled_dd4f85.colorPrimary_dd4f85 { 96 | background-color: var(--brand-experiment); 97 | } 98 | .contents_dd4f85 { 99 | color: #fff; 100 | } 101 | 102 | .templatesList_fc9dae, 103 | .optionsList_f5507e { 104 | padding: 0 !important; 105 | border-radius: 0; 106 | 107 | .container_a47d49 { 108 | border: none; 109 | border-radius: 0; 110 | } 111 | 112 | .optionHeader_fc9dae { 113 | text-align: center; 114 | margin: 12px 0; 115 | } 116 | } 117 | .createGuild_c1ee6b { 118 | padding: 10px !important; 119 | } 120 | } 121 | 122 | // User buttons 123 | .panels_a4d4d9 { 124 | z-index: 2; 125 | } 126 | 127 | .panels_a4d4d9 > .container_b2ca13 { 128 | height: 0; 129 | 130 | & > .flex_dc333f { 131 | position: fixed; 132 | bottom: 0; 133 | left: 0; 134 | width: 72px; 135 | padding: 20px 0 10px 0; 136 | flex-direction: column; 137 | background: linear-gradient(transparent, var(--background-tertiary) 15%); 138 | 139 | & > .button_adca65 { 140 | color: var(--user-buttons-color); 141 | margin: var(--user-buttons-spacing) auto 0 auto; 142 | } 143 | } 144 | } 145 | 146 | // Notifications settings 147 | .inner-1ilYF7 > .modal_c97cbd > .header_f9a4c9, 148 | .modal_c97cbd, 149 | .inner-1ilYF7 > .modal_c97cbd > .scrollerBase_eed6a8 { 150 | background: var(--background-secondary); 151 | } 152 | 153 | // Mention gradient 154 | .unreadMentionsBar_fea3ef .text_edf32f { 155 | display: none; 156 | } 157 | 158 | // Top 159 | .unreadMentionsIndicatorTop_fea3ef { 160 | width: 100%; 161 | height: 50px; 162 | top: -7px; 163 | padding: 0; 164 | 165 | .unreadMentionsBar_fea3ef { 166 | border-radius: 0; 167 | background: linear-gradient(var(--mention-color), #0000); 168 | transition: 100ms; 169 | 170 | &:active { 171 | background: linear-gradient(var(--mention-color), #0000); 172 | } 173 | } 174 | } 175 | 176 | // Bottom 177 | .unreadMentionsIndicatorBottom_fea3ef { 178 | width: 100%; 179 | height: 15px; 180 | padding: 0; 181 | 182 | .unreadMentionsBar_fea3ef { 183 | border-radius: 0; 184 | background: linear-gradient(#0000, var(--mention-color)); 185 | 186 | &:active { 187 | background: linear-gradient(#0000, var(--mention-color)); 188 | } 189 | } 190 | } 191 | 192 | // Mention pill 193 | .lowerBadge_c5f96a { 194 | top: 0; 195 | left: 0; 196 | 197 | .numberBadge__40d6f { 198 | background-color: var(--mention-color) !important; 199 | 200 | &::before { 201 | content: ""; 202 | position: absolute; 203 | width: 16px; 204 | height: 16px; 205 | background-color: inherit; 206 | border-radius: 100%; 207 | z-index: -1; 208 | animation: var(--disable-animations), 2s pulse infinite; 209 | will-change: transform; 210 | } 211 | } 212 | } 213 | } 214 | 215 | @keyframes pulse { 216 | 0% { 217 | transform: scale(1); 218 | opacity: 1; 219 | } 220 | 221 | 100% { 222 | transform: scale(1.75); 223 | opacity: 0; 224 | } 225 | } -------------------------------------------------------------------------------- /stuff/_settings.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // -- 👤 USER SETTINGS -- 3 | 4 | // Wide settings 5 | .contentRegion_c25c6d { 6 | flex: 1 1 100%; 7 | } 8 | .contentColumn_c25c6d, 9 | .customColumn_c25c6d, 10 | .sidebarScrollable_ff90b2 + .content_ff90b2, 11 | .customScroller_c25c6d > div { 12 | max-width: 95%; 13 | } 14 | 15 | .sidebar_c25c6d { 16 | padding: 60px 0 35px 65px; 17 | width: 285px; 18 | } 19 | 20 | // Search bar 21 | .searchBar_e7c031 { 22 | border-radius: 5px 0 0 5px; 23 | } 24 | 25 | .sidebar_c25c6d > div > .item_a0, 26 | #bd-settings-sidebar .ui-tab-bar-item { 27 | padding: 8px 0 8px 10px; 28 | border-radius: 5px 0 0 5px; 29 | } 30 | 31 | .closeButton_df5532 { 32 | border-radius: 5px; 33 | } 34 | .keybind_df5532 { 35 | display: none; 36 | } 37 | 38 | // My account 39 | .accountProfileCard_b69b77 { 40 | background-color: var(--background-secondary); 41 | 42 | .mask_d5fdb1 > mask { 43 | display: none; 44 | } 45 | 46 | .userInfo_b69b77 { 47 | position: relative; 48 | 49 | // Avatar 50 | .avatar_b69b77 { 51 | top: -14px; 52 | border-color: transparent; 53 | border-width: 9px 0; 54 | background-color: transparent; 55 | 56 | .imageUploaderInner_de76e4 { 57 | border: none; 58 | border-radius: var(--avatar-radius); 59 | background-color: transparent; 60 | } 61 | .imageUploaderIcon_de76e4 { 62 | display: none; 63 | } 64 | 65 | .pointerEvents_c51b4e { 66 | x: 66px; 67 | y: 66px; 68 | width: 20px; 69 | height: 20px; 70 | rx: calc(var(--status-radius) + 1px); 71 | stroke: var(--background-secondary); 72 | stroke-width: 4px; 73 | } 74 | } 75 | } 76 | 77 | .background_b69b77 { 78 | margin-right: 0; 79 | } 80 | } 81 | 82 | // User Profile 83 | .preview_bad983 { 84 | // Banner 85 | .mask_d5fdb1 { 86 | overflow: visible; 87 | 88 | mask { 89 | display: none; 90 | } 91 | 92 | foreignObject { 93 | mask: unset; 94 | } 95 | 96 | .banner_ab876d { 97 | height: 120px; 98 | } 99 | } 100 | 101 | // Avatar 102 | .avatarUploaderPremium_ab876d { 103 | top: 16px; 104 | } 105 | 106 | .avatarUploaderInner_ab876d { 107 | border: none; 108 | border-radius: var(--avatar-radius); 109 | background-color: transparent; 110 | } 111 | .imageUploaderIcon_de76e4 { 112 | display: none; 113 | } 114 | 115 | .status_ab876d { 116 | background-color: transparent; 117 | 118 | rect { 119 | mask: none; 120 | rx: var(--status-radius); 121 | ry: var(--status-radius); 122 | } 123 | } 124 | 125 | .userText_c9ccf6 { 126 | position: absolute; 127 | top: 25px; 128 | left: 115px; 129 | } 130 | 131 | .customStatus-3XAoF9 { 132 | padding: 0 12px 12px 16px; 133 | margin-bottom: 0; 134 | background-color: var(--background-tertiary); 135 | } 136 | 137 | .divider-1wtgZ3 { 138 | display: none; 139 | } 140 | 141 | // Activity 142 | .profileCustomizationPreview_ab876d .lastSection_d7a21f { 143 | position: relative; 144 | padding: 16px; 145 | margin: 16px 0; 146 | background-color: #7289da; 147 | border-radius: 0 0 5px 5px; 148 | 149 | .defaultColor__77578, 150 | h3 { 151 | color: white !important; 152 | } 153 | 154 | &::before { 155 | content: ""; 156 | position: absolute; 157 | height: 21px; 158 | z-index: 2; 159 | width: 284px; 160 | top: -20px; 161 | left: 0; 162 | background: #7289da; 163 | background: var(--playing); 164 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 165 | animation: animate 6s linear infinite; 166 | animation-delay: 0s; 167 | opacity: 1; 168 | } 169 | 170 | .fakeActivityTitle_dfbe6b::before { 171 | content: ""; 172 | position: absolute; 173 | height: 21px; 174 | z-index: 1; 175 | width: 284px; 176 | top: -21px; 177 | left: 0; 178 | background: var(--background-secondary); 179 | background: var(--profile-gradient-primary-color); 180 | -webkit-mask-image: url('data:image/svg+xml;utf8,'); 181 | animation: animate2 4s linear infinite; 182 | animation-delay: 0s; 183 | opacity: 1; 184 | } 185 | 186 | .button_dd4f85 { 187 | border: none; 188 | background-color: var(--listening-test); 189 | box-shadow: 0 4px 15px #00000021; 190 | color: #fff; 191 | } 192 | } 193 | } 194 | 195 | // Family center 196 | #activity-tab .max-width_d00e26, #activity-tab .max-width_a2e886, #requests-tab .container_f70f48 { 197 | max-width: unset; 198 | } 199 | 200 | // Authorized apps 201 | .cardPrimaryOutline-1ofwVz { 202 | background-color: var(--background-secondary); 203 | } 204 | 205 | // Apparels 206 | .tabBarItemContainer_e7c031, 207 | .landingPageTabLink_f7189e { 208 | flex-direction: row-reverse; 209 | justify-content: flex-end; 210 | 211 | .textBadge_f05120.baseShapeRound_df8943 { 212 | margin-right: 7px; 213 | } 214 | } 215 | 216 | // Connections 217 | .connectionIcon_e2a436 { 218 | border-radius: 5px; 219 | padding: 4px; 220 | } 221 | .accountButtonInner_e2a436 { 222 | border: none; 223 | } 224 | 225 | // Nitro 226 | .premiumLabel_ae3c77 { 227 | flex-direction: row-reverse; 228 | justify-content: flex-end; 229 | 230 | svg { 231 | margin-right: 8px; 232 | } 233 | + .background_ae3c77 { 234 | border-radius: 5px 0 0 5px; 235 | } 236 | } 237 | 238 | .hero-1aNo0v { 239 | max-width: unset; 240 | } 241 | .featuresHeader-2bjq5B { 242 | text-align: center; 243 | } 244 | 245 | // Subscriptions 246 | .banner_b12c98 { 247 | max-width: unset; 248 | } 249 | 250 | // Boost 251 | .gemIndicatorContainer_b03ca0 { 252 | background-color: var(--background-tertiary); 253 | } 254 | .boostContainer_dba803, .card_d1fdce { 255 | background-color: var(--background-secondary); 256 | } 257 | 258 | // Billing 259 | .paymentRow_f66684, 260 | .pageActions_d6a4eb, 261 | .codeRedemptionRedirect_cb70f4 { 262 | background: var(--background-secondary-alt); 263 | } 264 | .payment_a28a08:hover { 265 | background-color: var(--background-secondary); 266 | } 267 | .expandedInfo_a28a08 { 268 | background: var(--background-secondary); 269 | } 270 | .checked-1pZh2h { 271 | background: transparent; 272 | border-color: transparent; 273 | } 274 | .bottomDivider_f66684 { 275 | border-bottom-color: transparent; 276 | } 277 | 278 | // Activity Status 279 | .notDetected-2HEmAp, 280 | .addGamePopout_fd966d { 281 | background: var(--background-secondary-alt); 282 | } 283 | .gameNameInput-3TuPuA:hover, 284 | .gameNameInput-3TuPuA:focus { 285 | background: var(--background-secondary-alt); 286 | border: none; 287 | } 288 | .game-3x3aDt { 289 | box-shadow: 0 1px 0 0 var(--background-secondary); 290 | 291 | .removeGame-3Le1LJ { 292 | top: -3px; 293 | right: -5px; 294 | border-radius: 5px; 295 | } 296 | } 297 | .css-17e1tep-control { 298 | border: none; 299 | } 300 | 301 | // Voice & Video 302 | .progress_a1107d { 303 | background: var(--background-primary); 304 | } 305 | 306 | .notches_a1107d { 307 | color: var(--background-secondary) !important; 308 | } 309 | 310 | // --------------------------- ⚙️ SERVER SETTINGS --------------------------- 311 | 312 | // Overview 313 | .bannerUpsellContainer-31E9J5 { 314 | background-color: var(--background-secondary); 315 | } 316 | .flexChild_dc333f[style="flex: 1 1 50%;"] { 317 | flex: 1 !important; 318 | } 319 | 320 | // Modifications notification 321 | .noticeRegion_c25c6d { 322 | max-width: unset; 323 | right: 0; 324 | 325 | .container_b6cd66 { 326 | background: var(--background-tertiary) !important; 327 | } 328 | } 329 | 330 | // Roles 331 | .customColorPicker_bbc020, 332 | .container__33507 { 333 | background: var(--background-secondary); 334 | border-radius: 5px; 335 | } 336 | 337 | .roleRow_a930f1 { 338 | margin: 5px 0; 339 | background-color: var(--background-secondary); 340 | 341 | &:last-child { 342 | border-radius: 4px 4px 0 0; 343 | } 344 | 345 | &::before { 346 | display: none; 347 | } 348 | } 349 | 350 | .sidebar_e87574 { 351 | border: none; 352 | 353 | .list_e87574 { 354 | padding: 0 20px; 355 | position: relative; 356 | overflow: hidden; 357 | z-index: 1; 358 | border-radius: 0; 359 | 360 | .role_e4010c { 361 | border-radius: 5px; 362 | margin-bottom: 6px; 363 | padding-left: 20px; 364 | 365 | .roleCircle_a26d7b { 366 | width: 0; 367 | margin: 0; 368 | 369 | &::before { 370 | position: absolute; 371 | border-radius: 5px; 372 | content: ""; 373 | top: 0; 374 | left: 8px; 375 | width: calc(100% - 8px); 376 | height: 100%; 377 | background: inherit; 378 | opacity: 0.2; 379 | z-index: -1; 380 | transition: opacity 200ms; 381 | } 382 | } 383 | .roleName-3910zV { 384 | margin-left: 0; 385 | } 386 | } 387 | } 388 | 389 | .item_a0:hover:not(.disabled_a0), 390 | .topPill-3DJJNV .item_a0:hover:not(.disabled_a0), 391 | .selected_a0.item_a0, 392 | .topPill-3DJJNV .selected_a0.item_a0 { 393 | background: none; 394 | 395 | .roleCircle_a26d7b::after { 396 | position: absolute; 397 | border-radius: 3px; 398 | content: ""; 399 | top: 0.5px; 400 | bottom: 0.5px; 401 | left: -3px; 402 | width: 8px; 403 | background: inherit; 404 | z-index: -1; 405 | transition: opacity 200ms; 406 | } 407 | } 408 | 409 | .item_a0:hover:not(.disabled_a0), 410 | .topPill-3DJJNV .item_a0:hover:not(.disabled_a0) { 411 | background: none; 412 | 413 | .roleCircle_a26d7b::before, 414 | .roleCircle_a26d7b::after { 415 | opacity: 0.3; 416 | } 417 | } 418 | 419 | .selected_a0.item_a0, 420 | .topPill-3DJJNV .selected_a0.item_a0 { 421 | background: none; 422 | 423 | .roleCircle_a26d7b::before, 424 | .roleCircle_a26d7b::after { 425 | opacity: 0.5 !important; 426 | } 427 | } 428 | } 429 | 430 | .contentWidth_bd05f1 { 431 | max-width: unset; 432 | 433 | .previewContainer_da1bd9 { 434 | border: none; 435 | 436 | .theme-light { 437 | display: none; 438 | } 439 | .messageContainer_da1bd9 { 440 | background-color: var(--background-secondary); 441 | } 442 | } 443 | } 444 | 445 | // Emoji 446 | .banner_ad4cb5 { 447 | max-width: unset; 448 | } 449 | 450 | div.emojiRow_dc1809 { 451 | display: inline-grid; 452 | grid-template-areas: 453 | "image name" 454 | "uploader uploader"; 455 | height: unset; 456 | box-shadow: none; 457 | row-gap: 32px; 458 | column-gap: 16px; 459 | margin: 0 8px 8px 0; 460 | background-color: var(--background-secondary); 461 | border-radius: 8px; 462 | overflow: hidden; 463 | 464 | &::before { 465 | top: -5px; 466 | height: calc(50% + 10px); 467 | background-color: var(--background-secondary-alt); 468 | border-radius: 0; 469 | } 470 | 471 | .emojiColumn_dc1809 { 472 | grid-area: image; 473 | 474 | .emojiImage_dc1809 { 475 | width: 40px; 476 | height: 40px; 477 | } 478 | } 479 | 480 | .column_dc1809:nth-child(2) { 481 | grid-area: name; 482 | margin: 0; 483 | } 484 | 485 | .column_dc1809:nth-child(3) { 486 | grid-area: uploader; 487 | margin-left: 0; 488 | } 489 | 490 | .emojiRemove_dc1809 { 491 | top: unset; 492 | bottom: -25px; 493 | right: 5px; 494 | opacity: 1; 495 | border-radius: 8px; 496 | transition: 200ms bottom; 497 | } 498 | 499 | &:hover .emojiRemove_dc1809 { 500 | bottom: 5px; 501 | } 502 | } 503 | 504 | .emojiAliasInput_dc1809 .emojiInput_dc1809 { 505 | background: var(--background-secondary); 506 | } 507 | .card_ffe375 { 508 | box-shadow: none; 509 | padding: 16px; 510 | 511 | &::before { 512 | left: 0; 513 | right: 0; 514 | background: var(--background-secondary); 515 | border-color: transparent; 516 | opacity: 1; 517 | margin: 5px 0; 518 | } 519 | } 520 | .inputWrapper-1YNMmM { 521 | width: unset; 522 | 523 | .input-2g-os5 { 524 | border: none; 525 | } 526 | } 527 | 528 | // Audit logs 529 | .headerClickable_eebd33, 530 | .headerDefault_eebd33, 531 | .headerExpanded_eebd33 { 532 | background: var(--background-secondary); 533 | border-radius: 8px; 534 | } 535 | .auditLog_eebd33 { 536 | border: none; 537 | 538 | .headerClickable_eebd33 { 539 | background-color: var(--background-secondary-alt); 540 | border-radius: 8px; 541 | } 542 | 543 | .headerExpanded_eebd33 { 544 | background-color: var(--background-secondary-alt); 545 | border-radius: 8px 8px 0 0; 546 | } 547 | 548 | .changeDetails_eebd33 { 549 | background-color: var(--background-secondary); 550 | border-radius: 0 0 8px 8px; 551 | } 552 | .divider-_0um2u { 553 | display: none; 554 | } 555 | } 556 | 557 | // Integrations 558 | .card_ea2a21, 559 | .header_adb740 { 560 | border: none; 561 | } 562 | .body_adb740, 563 | .cardPrimaryEditable-2mz_3i { 564 | background: var(--background-secondary); 565 | border: none; 566 | } 567 | 568 | // Widget 569 | .copyInput_d7e343 { 570 | border: none; 571 | } 572 | 573 | // Overview 574 | .css-gvi9bl-control, 575 | .css-6fzn47-control { 576 | border: none; 577 | } 578 | .css-3vaxre-menu { 579 | background: var(--background-secondary-alt); 580 | border: none; 581 | } 582 | 583 | // Activate community modal 584 | .css-dwar6a-menu { 585 | background-color: var(--background-secondary-alt); 586 | } 587 | 588 | // Membership Screening 589 | .editableFieldsContainer-1p_q_4 { 590 | width: unset; 591 | } 592 | 593 | // Welcome screen 594 | .channelIcon-1eKmlw, 595 | .channelIcon_e3f8c2 { 596 | background: var(--background-secondary-alt); 597 | } 598 | .descriptionInput-3b30C8 { 599 | background: var(--background-secondary-alt); 600 | border: none; 601 | } 602 | 603 | // Server Boost Status 604 | .serverBoostTabItem_f7189e > div { 605 | flex-direction: row-reverse; 606 | justify-content: flex-end; 607 | 608 | .icon_f7189e { 609 | margin-right: 8px; 610 | } 611 | } 612 | 613 | .tierBody_da77bd { 614 | background: var(--background-secondary); 615 | } 616 | .tierHeaderContent_da77bd, 617 | .tierInProgress_bfac79 { 618 | background: var(--background-secondary-alt); 619 | } 620 | .background_bfac79 { 621 | color: var(--background-secondary-alt); 622 | } 623 | .subscribers_da77bd .subscriberMask_da77bd { 624 | margin-right: 8px; 625 | } 626 | 627 | // Members 628 | .member-2cj2PI:nth-child(3) { 629 | margin-top: 10px; 630 | } 631 | .overflowRolesPopout_e4010c { 632 | background: var(--background-secondary); 633 | } 634 | } -------------------------------------------------------------------------------- /stuff/custom/_no-scrollbar.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | ::-webkit-scrollbar { 3 | display: none; 4 | } 5 | .wrapper_d8bfb3 { 6 | margin-left: 0; 7 | } 8 | .link_d8bfb3 { 9 | padding-left: 16px; 10 | border-radius: 0; 11 | } 12 | .mainContent-20q_Hp { 13 | padding-left: 8px; 14 | } 15 | .container_b15955, 16 | .container_e9f61e { 17 | margin: 0; 18 | max-width: unset; 19 | } 20 | .layout_f9647d, 21 | .layout_e9f61e { 22 | border-radius: 0; 23 | padding: 0 16px; 24 | } 25 | .unread_d8bfb3 { 26 | z-index: 1; 27 | } 28 | .buttons_d0696b { 29 | padding-right: 10px !important; 30 | } 31 | .typeThread_d8bfb3 .link_d8bfb3 { 32 | padding-left: 34px; 33 | } 34 | } 35 | --------------------------------------------------------------------------------