├── .gitignore ├── LICENCE ├── README.md ├── _variables.scss ├── app.scss ├── assets ├── banner.png ├── icon.png ├── modal.png ├── preview.png └── status_picker.png ├── betterdiscord ├── app.css └── couve.theme.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 └── _user-area.scss /.gitignore: -------------------------------------------------------------------------------- 1 | prepros.config 2 | .vscode 3 | .prettierignore 4 | node_modules 5 | .parcel-cache 6 | dist 7 | /.idea/ -------------------------------------------------------------------------------- /LICENCE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) [year] [fullname] 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Preview 2 | 3 |
4 | Logo 5 | 6 |

Couve

7 |

A new look to Discord

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://nyri4.github.io/Couve/betterdiscord/couve.theme.css into the box in Settings > Themes > Themes tab

32 |

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

BetterDiscord 40 |
Open Settings > Themes > Themes folder and open couve.theme.css

41 |
42 | 43 |
44 | Vencord 45 |

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

47 |
48 | 49 | ## 🫰 Credits 50 | 51 | Of course all credits goes to abUwUser/A user, the original creator of this theme and AAGaming that maintained the theme, see his github profile [here](https://github.com/abUwUser) -------------------------------------------------------------------------------- /_variables.scss: -------------------------------------------------------------------------------- 1 | @use "app.scss"; 2 | 3 | // ==> User vars <== 4 | 5 | // Settings 6 | :root { 7 | --version: "2.3.0"; 8 | 9 | // Colors 10 | --main-color: #419e85; 11 | 12 | // Borders 13 | --avatar-radius: 8px; 14 | } 15 | 16 | // Dark/Light vars 17 | .theme-dark { 18 | // BGs 19 | --background-primary: #252a3e; 20 | --background-secondary: #1e2337; 21 | --background-secondary-alt: #1c2438; 22 | --background-secondary-alt-alt: #1b1d31; 23 | --background-tertiary: #060c24; 24 | 25 | --deprecated-store-bg: var(--background-primary); 26 | --background-floating: var(--background-secondary); 27 | --background-mobile-primary: var(--background-primary); 28 | --activity-card-background: var(--background-secondary); 29 | --input-background: var(--background-secondary); 30 | --modal-background: var(--background-primary); 31 | 32 | --colortransparency: #0003; 33 | 34 | // Cards 35 | --card: #212332; 36 | 37 | // Other stuff 38 | --textcolor: #fff; 39 | --epicshadow1: #fff3; 40 | 41 | // Font 42 | --font-display: var(--font-primary) !important; 43 | } 44 | 45 | .theme-light { 46 | // BGs 47 | --background-primary: #fafafa; 48 | --background-secondary: #f7f7f7; 49 | --background-secondary-alt: #fff; 50 | --background-secondary-alt-alt: #eee; 51 | --background-tertiary: #fff; 52 | 53 | --deprecated-store-bg: var(--background-primary); 54 | --background-floating: var(--background-secondary); 55 | --background-mobile-primary: var(--background-primary); 56 | --activity-card-background: var(--background-secondary); 57 | --modal-background: var(--background-primary); 58 | 59 | --colortransparency: #0001; 60 | 61 | // Cards 62 | --card: #aaaaaa; 63 | 64 | // Other stuff 65 | --textcolor: #000; 66 | --epicshadow1: #0003; 67 | } -------------------------------------------------------------------------------- /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/user-area"; 8 | @forward "stuff/friends"; 9 | @forward "stuff/other"; 10 | @forward "stuff/plugins_support"; 11 | 12 | // Premium shit 13 | @import url("https://nyri4.github.io/donators/donators.css"); 14 | 15 | // Font Importing 16 | @import url("https://fonts.googleapis.com/css2?family=Material+Icons"); -------------------------------------------------------------------------------- /assets/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NYRI4/Couve/13216f9811c976c516f799afacff3e824161918e/assets/banner.png -------------------------------------------------------------------------------- /assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NYRI4/Couve/13216f9811c976c516f799afacff3e824161918e/assets/icon.png -------------------------------------------------------------------------------- /assets/modal.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NYRI4/Couve/13216f9811c976c516f799afacff3e824161918e/assets/modal.png -------------------------------------------------------------------------------- /assets/preview.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NYRI4/Couve/13216f9811c976c516f799afacff3e824161918e/assets/preview.png -------------------------------------------------------------------------------- /assets/status_picker.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/NYRI4/Couve/13216f9811c976c516f799afacff3e824161918e/assets/status_picker.png -------------------------------------------------------------------------------- /betterdiscord/app.css: -------------------------------------------------------------------------------- 1 | @import url("https://nyri4.github.io/donators/donators.css"); 2 | @import url("https://fonts.googleapis.com/css2?family=Material+Icons"); 3 | :root .messagesWrapper_e2e187 { 4 | flex-direction: column; 5 | } 6 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca { 7 | padding-left: 50px; 8 | } 9 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca.groupStart_d5deea .contents_f9f2ca::after { 10 | left: 48px; 11 | width: 30px; 12 | height: 30px; 13 | } 14 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .avatar_f9f2ca { 15 | position: relative; 16 | left: -2px; 17 | width: 30px; 18 | height: 30px; 19 | border-radius: var(--avatar-radius); 20 | } 21 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .avatarDecoration_f9f2ca { 22 | left: 43px; 23 | width: 40px; 24 | height: 40px; 25 | } 26 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .header_f9f2ca { 27 | left: 38px; 28 | margin-top: -30px; 29 | margin-bottom: 10px; 30 | width: 100%; 31 | } 32 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .timestamp_f9f2ca.alt_f9f2ca { 33 | position: absolute; 34 | font-size: 0.6875rem !important; 35 | right: 10px; 36 | left: unset; 37 | opacity: 0; 38 | } 39 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca:hover .timestamp_f9f2ca { 40 | opacity: 1; 41 | } 42 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .iconContainer_d76df7 { 43 | position: unset; 44 | width: unset; 45 | margin-right: 10px; 46 | } 47 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .repliedMessage_f9f2ca { 48 | margin-left: 48px; 49 | } 50 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .repliedMessage_f9f2ca .replyAvatar_f9f2ca { 51 | border-radius: calc(var(--avatar-radius) - 3px); 52 | } 53 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .blockquoteContainer_f8f345 .blockquoteDivider_f8f345 { 54 | display: none; 55 | } 56 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .blockquoteContainer_f8f345 blockquote { 57 | padding: 12px; 58 | background: var(--background-secondary); 59 | border-radius: 4px; 60 | width: 100%; 61 | } 62 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .shiki-container { 63 | background-color: transparent; 64 | } 65 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca .shiki-container .shiki-root { 66 | background-color: var(--background-secondary) !important; 67 | border-radius: 8px; 68 | overflow: hidden; 69 | } 70 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca.hasThread_f9f2ca::after { 71 | top: 2.5rem; 72 | left: 3.5rem; 73 | } 74 | :root .messagesWrapper_e2e187 .cozy_f9f2ca.wrapper_f9f2ca.hasThread_f9f2ca .container_c15230 { 75 | margin-left: 48px; 76 | border-radius: 8px; 77 | } 78 | :root .messagesWrapper_e2e187 .scroller_e2e187::-webkit-scrollbar { 79 | display: none; 80 | } 81 | :root .wrapper_f7e168 { 82 | border: none; 83 | box-shadow: none; 84 | background: var(--background-secondary); 85 | } 86 | :root .wrapper_f7e168:hover { 87 | box-shadow: none; 88 | } 89 | :root .botTagRegular_a9e77f { 90 | border-radius: 5px; 91 | background: var(--main-color); 92 | } 93 | :root .botTagOP_e48ddb { 94 | color: white; 95 | } 96 | :root .wrapper_d4fa29 { 97 | background: transparent !important; 98 | position: relative; 99 | color: var(--main-color) !important; 100 | } 101 | :root .wrapper_d4fa29.mention { 102 | border-radius: 5px; 103 | } 104 | :root .wrapper_d4fa29:hover::after { 105 | opacity: 0.2; 106 | } 107 | :root .wrapper_d4fa29::after { 108 | content: ""; 109 | position: absolute; 110 | top: 0; 111 | left: 0; 112 | width: 100%; 113 | height: 100%; 114 | background-color: var(--main-color); 115 | opacity: 0.08; 116 | border-radius: 5px; 117 | transition: opacity 200ms; 118 | pointer-events: none; 119 | } 120 | :root .newMessagesBar_cf58b5 { 121 | position: static; 122 | margin: 5px 40px 0 40px; 123 | padding: 5px; 124 | background: var(--background-secondary); 125 | border-radius: 7px; 126 | opacity: 1; 127 | } 128 | :root .newMessagesBar_cf58b5 .barButtonMain_cf58b5 { 129 | opacity: 0.6; 130 | } 131 | :root .newMessagesBar_cf58b5 .barButtonAlt_cf58b5 { 132 | display: none; 133 | } 134 | :root .divider_c2654d { 135 | margin: 0 56px; 136 | border: none; 137 | height: unset; 138 | background: transparent; 139 | } 140 | :root .divider_c2654d.isUnread_c2654d:not(.hasContent_c2654d) { 141 | margin: 10px 47px; 142 | margin-top: 5px !important; 143 | margin-bottom: 5px !important; 144 | } 145 | :root .divider_c2654d .content_c2654d, :root .divider_c2654d#---new-messages-bar .unreadPill_c2654d { 146 | background: var(--background-secondary); 147 | width: 100%; 148 | padding: 10px; 149 | text-align: center; 150 | border-radius: 5px; 151 | height: unset; 152 | } 153 | :root .divider_c2654d .unreadPill_c2654d { 154 | position: relative; 155 | color: #f04747; 156 | top: 0; 157 | } 158 | :root .divider_c2654d .unreadPill_c2654d .unreadPillCap_c2654d { 159 | display: none; 160 | } 161 | :root .divider_c2654d#---new-messages-bar .content_c2654d { 162 | border-radius: 5px 0 0 5px; 163 | } 164 | :root .divider_c2654d#---new-messages-bar .content_c2654d + .unreadPill_c2654d { 165 | border-radius: 0 5px 5px 0; 166 | padding-top: 12px; 167 | padding-bottom: 12px; 168 | } 169 | :root .jumpToPresentBar_cf58b5 { 170 | bottom: 15px; 171 | left: unset; 172 | height: 40px; 173 | padding-bottom: 0; 174 | background: var(--background-secondary); 175 | border-radius: 8px; 176 | } 177 | :root .jumpToPresentBar_cf58b5 .barButtonAlt_cf58b5 { 178 | text-indent: -10000px; 179 | font-size: 0; 180 | padding: 0 6px; 181 | } 182 | :root .jumpToPresentBar_cf58b5 .barButtonAlt_cf58b5 .barButtonIcon_cf58b5 { 183 | margin-left: 0; 184 | width: 28px; 185 | height: 28px; 186 | } 187 | :root .jumpToPresentBar_cf58b5 .barButtonMain_cf58b5 { 188 | display: none; 189 | } 190 | :root .jumpToPresentBar_cf58b5 .spinner_cf58b5 { 191 | padding: 0 5px; 192 | } 193 | :root .resizeHandle_af5dbb::before { 194 | content: ""; 195 | position: fixed; 196 | top: 0; 197 | left: 0; 198 | width: 100%; 199 | height: calc(100% + 36px); 200 | background: rgba(0, 0, 0, 0.3333333333); 201 | border-radius: 8px; 202 | opacity: 0; 203 | pointer-events: none; 204 | transition: opacity 0.3s; 205 | } 206 | :root .resizeHandle_af5dbb:active::before { 207 | opacity: 1; 208 | pointer-events: all; 209 | } 210 | :root .navButtonActive_af5dbb { 211 | background: var(--background-primary); 212 | } 213 | :root #emoji-picker-tab-panel { 214 | border-radius: 8px 8px 0 0; 215 | } 216 | :root #emoji-picker-tab-panel .header_c6ee36 { 217 | box-shadow: none; 218 | } 219 | :root #emoji-picker-tab-panel .premiumPromo_ca9b56 { 220 | background: var(--background-secondary); 221 | opacity: 1; 222 | animation: fade 0.3s ease, zoom 0.3s ease; 223 | } 224 | :root #emoji-picker-tab-panel.wrapper_c6ee36 { 225 | margin-bottom: 8px; 226 | } 227 | :root #emoji-picker-tab-panel .container_effbe2, 228 | :root #emoji-picker-tab-panel .emojiItem_fbfedd.emojiItemSelected_fbfedd { 229 | background: var(--background-primary); 230 | } 231 | :root #emoji-picker-tab-panel .imageLoading_b000dd { 232 | background-image: none !important; 233 | background-color: var(--background-primary); 234 | border-radius: 8px; 235 | } 236 | :root #emoji-picker-tab-panel .inspector_c3120f { 237 | position: absolute; 238 | top: -50px; 239 | right: 0; 240 | padding: 0 8px; 241 | justify-content: end; 242 | width: unset; 243 | max-width: 220px; 244 | background: transparent; 245 | } 246 | :root #emoji-picker-tab-panel .diversitySelectorOptions_cce80d { 247 | background: var(--background-primary); 248 | border: none; 249 | } 250 | :root #emoji-picker-tab-panel:not(.emojiPickerInExpressionPicker-2nOwH8) .inspector_c3120f { 251 | position: absolute; 252 | top: unset; 253 | bottom: 0; 254 | right: 0; 255 | left: 48px; 256 | padding: 0 16px; 257 | max-width: unset; 258 | background: linear-gradient(transparent, var(--background-secondary)); 259 | } 260 | :root #emoji-picker-tab-panel .wrapper_dc0b29 { 261 | background: var(--background-secondary); 262 | } 263 | :root #emoji-picker-tab-panel .wrapper_dc0b29 .scroller_d53d65::-webkit-scrollbar { 264 | display: none; 265 | } 266 | :root #emoji-picker-tab-panel .badgeLabel_c3120f { 267 | display: none; 268 | } 269 | :root .positionContainer_af5dbb { 270 | height: 414px; 271 | bottom: calc(100% - 8px); 272 | transform: translateZ(0); 273 | } 274 | :root .contentWrapper_af5dbb .header_b56bbc { 275 | box-shadow: none; 276 | } 277 | :root .contentWrapper_af5dbb .header_b56bbc .inner__999f6 { 278 | height: 34px; 279 | background: var(--background-primary); 280 | } 281 | :root .contentWrapper_af5dbb .header_b56bbc .inner__999f6 .iconLayout__67261 { 282 | width: 30px; 283 | height: 30px; 284 | } 285 | :root #sticker-picker-tab-panel .header_d8cdac { 286 | box-shadow: none; 287 | } 288 | :root #sticker-picker-tab-panel .container_effbe2 { 289 | background-color: var(--background-primary); 290 | } 291 | :root #sticker-picker-tab-panel .wrapper_dc0b29 { 292 | background: var(--background-secondary); 293 | } 294 | :root #sticker-picker-tab-panel .wrapper_dc0b29 .scroller_d53d65::-webkit-scrollbar { 295 | display: none; 296 | } 297 | :root .uploadModal_f82cc7 { 298 | background: var(--background-primary); 299 | box-shadow: unset; 300 | width: 1000px; 301 | height: 400px; 302 | border-radius: 15px; 303 | } 304 | :root .uploadModal_f82cc7 .inner_f82cc7 .comment_f82cc7, 305 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .description_f82cc7 { 306 | margin-left: 55%; 307 | margin-right: 30px; 308 | } 309 | :root .uploadModal_f82cc7 .inner_f82cc7 .comment_f82cc7 .label_f82cc7 { 310 | text-transform: unset; 311 | font-size: 12px; 312 | opacity: 0.8; 313 | } 314 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 { 315 | height: 75px; 316 | } 317 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .description_f82cc7 { 318 | margin-top: 15px; 319 | } 320 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .description_f82cc7 .filename_f82cc7 { 321 | font-weight: 550; 322 | } 323 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .icon_f82cc7 { 324 | background-color: var(--background-secondary); 325 | background-size: 70px; 326 | } 327 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .icon_f82cc7.video_f82cc7 { 328 | background-image: url(https://cdn.discordapp.com/attachments/539180316447997974/705623014334791720/videocam-white-18dp.svg); 329 | } 330 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .icon_f82cc7.acrobat_f82cc7 { 331 | background-image: url(https://cdn.discordapp.com/attachments/539180316447997974/705623972791975936/picture_as_pdf-white-18dp.svg); 332 | } 333 | :root .uploadModal_f82cc7 .footer_f82cc7 { 334 | background-color: transparent; 335 | box-shadow: unset; 336 | position: absolute; 337 | right: 20px; 338 | bottom: 10px; 339 | } 340 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8 .checkbox_f6cde8 { 341 | opacity: 0; 342 | visibility: hidden; 343 | transition: 0.2s; 344 | } 345 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8 .checkbox_f6cde8.checked_f6cde8::before { 346 | color: var(--textcolor); 347 | content: "visibility_off"; 348 | } 349 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8 .checkbox_f6cde8:hover, 350 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8 .checkbox_f6cde8 .checked_f6cde8 { 351 | opacity: 1; 352 | } 353 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8 .checkbox_f6cde8::before { 354 | content: "visibility"; 355 | position: absolute; 356 | top: 0; 357 | left: 0; 358 | width: 100%; 359 | height: 100%; 360 | background: rgba(0, 0, 0, 0.5333333333); 361 | text-align: center; 362 | line-height: 350px; 363 | color: rgba(255, 255, 255, 0.4); 364 | font-size: 72px; 365 | font-family: "Material Icons", sans-serif; 366 | visibility: visible; 367 | border-radius: 19px; 368 | } 369 | :root .uploadModal_f82cc7 .labelForward_f6cde8 { 370 | display: none; 371 | } 372 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .icon_f82cc7.image_f82cc7, 373 | :root .uploadModal_f82cc7 .checkboxWrapper_f6cde8, 374 | :root .uploadModal_f82cc7 .inner_f82cc7 .file_f82cc7 .icon_f82cc7 { 375 | position: fixed; 376 | top: 20px; 377 | left: 10px; 378 | width: 48% !important; 379 | height: 350px !important; 380 | margin-top: 0 !important; 381 | margin-left: 16px !important; 382 | margin-right: 16px !important; 383 | box-shadow: unset; 384 | border-radius: 20px; 385 | } 386 | :root .uploadModal_f82cc7 .scrollableContainer_d0696b.webkit__8d35a { 387 | max-height: 215px; 388 | } 389 | :root .autocomplete_bcc24e { 390 | background: var(--background-secondary); 391 | bottom: calc(100% - 8px); 392 | border-radius: 8px 8px 0 0; 393 | } 394 | :root .autocomplete_bcc24e .categoryHeader_fe2299 { 395 | background-color: var(--background-tertiary); 396 | border-radius: 6px; 397 | } 398 | :root .autocomplete_bcc24e .categoryHeader_fe2299::after { 399 | content: none; 400 | } 401 | :root .autocomplete_bcc24e .contentTitle_bcc24e { 402 | color: var(--textcolor); 403 | } 404 | :root .autocomplete_bcc24e .scroller_d53d65 { 405 | overflow: visible !important; 406 | } 407 | :root .wrapperAudio_f316dd { 408 | background: var(--background-secondary); 409 | border: none; 410 | border-radius: 7px; 411 | padding: 0; 412 | } 413 | :root .wrapperAudio_f316dd .audioMetadata_f316dd { 414 | padding: 10px; 415 | } 416 | :root .wrapperAudio_f316dd .audioControls_f316dd { 417 | background: transparent; 418 | } 419 | :root .wrapperAudio_f316dd .audioControls_f316dd .mediaBarWrapper_f7877e:hover { 420 | box-shadow: none; 421 | } 422 | :root .wrapperAudio_f316dd .audioControls_f316dd .mediaBarWrapper_f7877e .mediaBarProgress_f7877e, 423 | :root .wrapperAudio_f316dd .audioControls_f316dd .mediaBarWrapper_f7877e .mediaBarProgress_f7877e:after, 424 | :root .wrapperAudio_f316dd .audioControls_f316dd .mediaBarWrapper_f7877e .mediaBarProgress_f7877e:before, 425 | :root .wrapperAudio_f316dd .audioControls_f316dd .mediaBarWrapper_f7877e .mediaBarGrabber_f7877e { 426 | background: var(--main-color) !important; 427 | } 428 | :root .embedFull_b0068a { 429 | width: calc(100% + 100px); 430 | max-width: unset !important; 431 | left: -50px; 432 | border-radius: 0; 433 | border-color: var(--background-secondary-alt-alt); 434 | position: relative; 435 | overflow: hidden; 436 | } 437 | :root .embedFull_b0068a .grid_b0068a { 438 | margin-left: 34px; 439 | margin-right: 12px; 440 | } 441 | :root .embedFull_b0068a .grid_b0068a .embedSuppressButton_b0068a { 442 | top: 12px; 443 | right: 12px; 444 | } 445 | :root .theme-light .embedFull_b0068a { 446 | background: var(--background-secondary-alt-alt); 447 | border-color: var(--card); 448 | } 449 | :root .wrapper_a71a1c { 450 | background: var(--background-secondary); 451 | border-radius: 10px; 452 | } 453 | :root .wrapper_a71a1c .header_a71a1c { 454 | display: none; 455 | } 456 | :root .wrapper_a71a1c .count_a71a1c { 457 | font-weight: 500; 458 | color: var(--textcolor); 459 | } 460 | :root .markup_f8f345 code { 461 | border: none; 462 | background: var(--colortransparency); 463 | border-radius: 10px; 464 | } 465 | :root .hljs .powercord-lines:after, 466 | :root .powercord-codeblock-lang { 467 | border: none; 468 | } 469 | :root .powercord-codeblock-lang { 470 | padding: 3px 10px; 471 | } 472 | :root .textContainer_d8e2d0, 473 | :root .footer_d8e2d0 { 474 | border: none; 475 | } 476 | :root .textContainer_d8e2d0 .scrollbar_c858ce::-webkit-scrollbar, 477 | :root .footer_d8e2d0 .scrollbar_c858ce::-webkit-scrollbar { 478 | display: none; 479 | } 480 | :root .textContainer_d8e2d0 { 481 | border-radius: 10px 10px 0 0; 482 | } 483 | :root .footer_d8e2d0 { 484 | border-radius: 0 0 10px 10px; 485 | } 486 | :root .spoilerText-27bIiA.hidden-3B-Rum, 487 | :root .spoilerText-27bIiA.hidden-3B-Rum:hover { 488 | background-color: var(--background-secondary); 489 | } 490 | :root .embedSpotify_b0068a { 491 | border-radius: 5px; 492 | } 493 | :root .invite_f61cb8 { 494 | background: var(--background-secondary); 495 | border: none; 496 | } 497 | :root .tile_ab47a1 { 498 | transform: translateZ(0); 499 | overflow: hidden; 500 | background: var(--background-secondary); 501 | } 502 | :root .tile_ab47a1:hover { 503 | background: var(--background-secondary-alt-alt); 504 | } 505 | :root .tile_ab47a1 .invalidPoop_ff31dd { 506 | background: var(--background-secondary-alt-alt); 507 | position: relative; 508 | } 509 | :root .tile_ab47a1 .invalidPoop_ff31dd::after { 510 | content: ">_<"; 511 | animation: blink 2.5s; 512 | animation-iteration-count: infinite; 513 | font-size: 50px; 514 | color: var(--textcolor); 515 | position: absolute; 516 | top: 50%; 517 | left: 50%; 518 | transform: translate(-50%, -50%); 519 | } 520 | :root .tile_ab47a1 .description_ab47a1 { 521 | color: #fff; 522 | } 523 | :root .tile_ab47a1 .description_ab47a1 .tagline_ab47a1 { 524 | color: #eee; 525 | } 526 | :root .tile_ab47a1 .splash_cbd9b6 { 527 | content: ""; 528 | position: fixed; 529 | top: 0; 530 | left: 0; 531 | width: 100%; 532 | height: 100%; 533 | background-image: inherit; 534 | background-repeat: no-repeat; 535 | background-size: cover; 536 | background-position: 50% 50%; 537 | z-index: -1; 538 | opacity: 0.3; 539 | filter: blur(20px); 540 | mask-image: linear-gradient(rgba(0, 0, 0, 0.7333333333), rgba(0, 0, 0, 0.7333333333)); 541 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.7333333333), rgba(0, 0, 0, 0.7333333333)); 542 | } 543 | :root .popoutTopLeft-3B0mFf.noArrow-2foL9g.noShadow-3pu20z { 544 | margin-bottom: 0; 545 | margin-top: 8px; 546 | } 547 | :root .attachment_b52bef { 548 | background: var(--background-secondary); 549 | border: none; 550 | border-radius: 7px; 551 | } 552 | :root .attachment_b52bef .progressBar-1T6LYX { 553 | border-radius: 0; 554 | background: #419e85 !important; 555 | } 556 | :root .scrollableContainer_d0696b, 557 | :root .wrapper_faf5ab { 558 | background: var(--background-secondary); 559 | } 560 | :root .scrollableContainer_d0696b .lookFilled-yCfaCM.colorPrimary-2AuQVo, 561 | :root .wrapper_faf5ab .lookFilled-yCfaCM.colorPrimary-2AuQVo { 562 | background-color: var(--main-color); 563 | } 564 | :root .attachButtonPlus_f298d4, 565 | :root .attachButton_f298d4:hover .attachButtonPlus_f298d4 { 566 | fill: var(--main-color); 567 | } 568 | :root .form_a7d72e:before { 569 | background: linear-gradient(180deg, transparent 0, var(--background-primary)); 570 | } 571 | :root .typing_d7ebeb { 572 | z-index: 0; 573 | } 574 | :root .button_df39bd { 575 | background-color: var(--background-secondary); 576 | } 577 | :root .contentWrapper_f7506e { 578 | background-color: var(--background-primary); 579 | } 580 | :root .container_e5da8b, :root .clickable_b78bb6 { 581 | background-color: var(--background-secondary); 582 | } 583 | :root .container_c18ec9 { 584 | border-radius: 8px; 585 | } 586 | :root .message_ddcc45 { 587 | background: var(--background-secondary); 588 | box-shadow: none; 589 | } 590 | :root .reaction_f61c73 { 591 | background: var(--colortransparency); 592 | } 593 | :root .container_f2bfbb, 594 | :root .reactors_f2bfbb { 595 | background: var(--background-secondary); 596 | } 597 | :root .container_f2bfbb .scroller_f2bfbb, 598 | :root .reactors_f2bfbb .scroller_f2bfbb { 599 | background: var(--background-primary); 600 | } 601 | :root .container_a6d69a { 602 | background-color: var(--background-primary); 603 | } 604 | :root .container_a6d69a .tagsContainer_a6d69a button, 605 | :root .container_a6d69a .tagsContainer_a6d69a .tag_a6d69a { 606 | background-color: var(--background-secondary-alt-alt); 607 | } 608 | :root .container_a6d69a .mainCard_a6d69a { 609 | background-color: var(--background-secondary); 610 | } 611 | :root .container_a6d69a::-webkit-scrollbar { 612 | display: none; 613 | } 614 | 615 | :root .guilds_a4d4d9 { 616 | width: 90px; 617 | margin-top: -40px; 618 | } 619 | :root .guilds_a4d4d9.hidden_fea3ef { 620 | width: 0 !important; 621 | } 622 | :root .guilds_a4d4d9::before { 623 | content: ""; 624 | position: absolute; 625 | bottom: 135px; 626 | left: 0; 627 | z-index: 1; 628 | width: 90px; 629 | height: 100px; 630 | background: linear-gradient(360deg, var(--background-tertiary), transparent); 631 | pointer-events: none; 632 | } 633 | :root .guilds_a4d4d9 .scroller_fea3ef { 634 | padding: 30px 0; 635 | } 636 | :root .guilds_a4d4d9 .scroller_fea3ef > .tutorialContainer_c96c45:first-child > .listItem_c96c45 .childWrapper_a6ce15 { 637 | background: var(--main-color); 638 | color: #fff; 639 | } 640 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 { 641 | width: 90px; 642 | margin: 0 0 12px; 643 | } 644 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .wrapper_c5f96a, 645 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .svg_c5f96a { 646 | width: 42px; 647 | height: 42px; 648 | } 649 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .upperBadge_c5f96a { 650 | top: 2px; 651 | right: -1px; 652 | } 653 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .lowerBadge_c5f96a { 654 | bottom: 4px; 655 | right: -5px; 656 | } 657 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .lowerBadge_c5f96a .numberBadge_df8943 { 658 | min-width: 25px; 659 | background: var(--main-color) !important; 660 | font-size: 8px; 661 | } 662 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .lowerBadge_c5f96a:last-child .numberBadge_df8943 { 663 | box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5333333333); 664 | } 665 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .wrapper__8436d.selected_ae80f7 .childWrapper_a6ce15, :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .wrapper__8436d:hover .childWrapper_a6ce15 { 666 | background: var(--main-color); 667 | } 668 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 .wrapper__8436d .childWrapper_a6ce15 { 669 | background: var(--background-secondary); 670 | } 671 | :root .guilds_a4d4d9 .scroller_fea3ef .listItem_c96c45 defs g:last-child { 672 | display: none; 673 | } 674 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 { 675 | width: 90px; 676 | } 677 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .expandedFolderBackground_bc7085 { 678 | --custom-folder-item-guild-icon-margin: 12px !important; 679 | left: 21px; 680 | } 681 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .expandedFolderBackground_bc7085 ~ ul .wrapper_c5f96a { 682 | width: 42px; 683 | height: 42px; 684 | border-radius: 50%; 685 | overflow: hidden; 686 | } 687 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .folderIconWrapper_bc7085 { 688 | transition: border-radius 200ms; 689 | } 690 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .folderIconWrapper_bc7085:hover { 691 | border-radius: 12px; 692 | } 693 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .wrapper_c5f96a { 694 | width: 42px; 695 | } 696 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .wrapper_c5f96a > svg > foreignObject { 697 | mask: none; 698 | } 699 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .wrapper_c5f96a > svg > foreignObject .folder_bc7085 { 700 | background: transparent; 701 | } 702 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapper_bc7085 .wrapper_c5f96a > svg > foreignObject.expanded .expandedFolderBackground_bc7085 { 703 | background: var(--background-secondary); 704 | } 705 | :root .guilds_a4d4d9 .scroller_fea3ef .circleIconButton_db6521 { 706 | border-radius: 999px; 707 | border: dashed 2px var(--epicshadow1); 708 | background: transparent; 709 | color: var(--epicshadow1); 710 | transition: all 0.2s; 711 | } 712 | :root .guilds_a4d4d9 .scroller_fea3ef .tutorialContainer_c96c45:hover .circleIconButton_db6521, :root .guilds_a4d4d9 .scroller_fea3ef .tutorialContainer_c96c45 + .listItem_c96c45:hover .circleIconButton_db6521 { 713 | background: transparent; 714 | color: var(--main-color); 715 | border-color: var(--main-color); 716 | } 717 | :root .guilds_a4d4d9 .scroller_fea3ef .tutorialContainer_c96c45 svg > foreignObject, :root .guilds_a4d4d9 .scroller_fea3ef .tutorialContainer_c96c45 + .listItem_c96c45 svg > foreignObject { 718 | mask: none; 719 | } 720 | :root .guilds_a4d4d9 .scroller_fea3ef .wrapperSimple_c5f96a foreignObject { 721 | mask: none; 722 | } 723 | :root .guilds_a4d4d9 .scroller_fea3ef > div:last-child { 724 | margin-bottom: 80px; 725 | } 726 | :root .guilds_a4d4d9 .scroller_fea3ef::-webkit-scrollbar { 727 | display: none; 728 | } 729 | :root .guilds_a4d4d9 .footer_aa1bff { 730 | width: 100%; 731 | padding-bottom: 70px; 732 | } 733 | :root .guilds_a4d4d9 .footer_aa1bff .listItem_c96c45 { 734 | width: 100%; 735 | } 736 | :root .guilds_a4d4d9 .mention_edf32f { 737 | height: 100%; 738 | background: linear-gradient(360deg, transparent, var(--background-tertiary)); 739 | transition: color 0.2s; 740 | opacity: 1; 741 | text-transform: capitalize; 742 | color: var(--textcolor); 743 | animation: fade 0.5s; 744 | border-radius: 0; 745 | } 746 | :root .guilds_a4d4d9 .mention_edf32f:hover { 747 | color: var(--main-color); 748 | } 749 | :root .guilds_a4d4d9 .unreadMentionsIndicatorBottom_fea3ef .mention_edf32f { 750 | background: transparent; 751 | } 752 | :root .guilds_a4d4d9 .unreadMentionsIndicatorTop_fea3ef, 753 | :root .guilds_a4d4d9 .unreadMentionsIndicatorBottom_fea3ef { 754 | width: 100%; 755 | height: 30px; 756 | padding: 0; 757 | } 758 | 759 | :root .header_fd6364 { 760 | box-shadow: none; 761 | padding: 25px; 762 | border-radius: 8px; 763 | background: transparent !important; 764 | } 765 | :root #channels div[style="height: 12px;"], :root #channels div[style="height: 16px;"] { 766 | display: none; 767 | } 768 | :root .channelNotice-tO6Tus, 769 | :root .channelNotice-3DDmsB { 770 | box-shadow: none; 771 | width: 170px; 772 | background: transparent; 773 | margin: 15px; 774 | padding: 20px; 775 | background: var(--background-primary); 776 | border-radius: 10px; 777 | position: absolute; 778 | top: 0; 779 | z-index: 10; 780 | height: 60px; 781 | transition: height 400ms; 782 | } 783 | :root .channelNotice-tO6Tus::before, 784 | :root .channelNotice-3DDmsB::before { 785 | content: "announcement"; 786 | position: absolute; 787 | top: 50%; 788 | left: 50%; 789 | transform: translateX(-50%) translateY(-50%); 790 | opacity: 1; 791 | color: var(--textcolor); 792 | z-index: 1; 793 | font-size: 24px; 794 | font-family: "Material Icons", sans-serif; 795 | transition: opacity 200ms; 796 | } 797 | :root .channelNotice-tO6Tus .message-3KLVy1, 798 | :root .channelNotice-3DDmsB .message-3KLVy1 { 799 | opacity: 0; 800 | pointer-events: none; 801 | transition: opacity 400ms; 802 | position: absolute; 803 | top: 50%; 804 | left: 50%; 805 | transform: translateY(-50%) translateX(-50%); 806 | width: 100%; 807 | margin-bottom: auto; 808 | } 809 | :root .channelNotice-tO6Tus .message-3KLVy1 .btn-38SvSS, 810 | :root .channelNotice-tO6Tus .message-3KLVy1 .btn-38SvSS:hover, 811 | :root .channelNotice-3DDmsB .message-3KLVy1 .btn-38SvSS, 812 | :root .channelNotice-3DDmsB .message-3KLVy1 .btn-38SvSS:hover { 813 | background: var(--background-secondary-alt-alt); 814 | margin: 0 auto; 815 | margin-top: 20px; 816 | z-index: 1; 817 | width: unset; 818 | } 819 | :root .channelNotice-tO6Tus .message-3KLVy1 > div, 820 | :root .channelNotice-3DDmsB .message-3KLVy1 > div { 821 | margin-bottom: auto; 822 | } 823 | :root .channelNotice-tO6Tus .message-39hdqk, 824 | :root .channelNotice-3DDmsB .message-39hdqk { 825 | opacity: 0; 826 | margin-top: 30px; 827 | pointer-events: none; 828 | width: calc(100% + 20px); 829 | transition: opacity 400ms; 830 | } 831 | :root .channelNotice-tO6Tus .button_dd4f85, 832 | :root .channelNotice-3DDmsB .button_dd4f85 { 833 | background: var(--background-secondary-alt-alt); 834 | opacity: 0; 835 | pointer-events: none; 836 | transition: opacity 400ms; 837 | } 838 | :root .channelNotice-tO6Tus:hover, 839 | :root .channelNotice-3DDmsB:hover { 840 | height: 160px; 841 | } 842 | :root .channelNotice-tO6Tus:hover .message-3KLVy1, 843 | :root .channelNotice-tO6Tus:hover .message-39hdqk, 844 | :root .channelNotice-3DDmsB:hover .message-3KLVy1, 845 | :root .channelNotice-3DDmsB:hover .message-39hdqk { 846 | pointer-events: all; 847 | opacity: 1; 848 | } 849 | :root .channelNotice-tO6Tus:hover::before, 850 | :root .channelNotice-3DDmsB:hover::before { 851 | opacity: 0; 852 | } 853 | :root .channelNotice-tO6Tus:hover .button_dd4f85, 854 | :root .channelNotice-3DDmsB:hover .button_dd4f85 { 855 | opacity: 1; 856 | pointer-events: all; 857 | } 858 | :root .wrapper_a08117 { 859 | padding: 0 22px; 860 | } 861 | :root .container_a5ad5c { 862 | color: var(--textcolor); 863 | text-transform: unset; 864 | font-size: 14px; 865 | } 866 | :root .icon_a08117 { 867 | display: none; 868 | } 869 | :root .wrapper_d8bfb3 { 870 | height: 30px; 871 | margin: 0; 872 | } 873 | :root .wrapper_d8bfb3 .link_d8bfb3 { 874 | padding: 6px 20px; 875 | border-radius: 0; 876 | } 877 | :root .unread_d8bfb3 { 878 | left: 0; 879 | } 880 | :root .typeThread_d8bfb3 .name_d8bfb3 { 881 | padding-left: 28px; 882 | } 883 | :root .containerPadding_eba0ba { 884 | padding: 0; 885 | margin: 0 0 4px 0; 886 | } 887 | :root .containerPadding_eba0ba .bar_eba0ba { 888 | padding: 8px; 889 | border-radius: 4px; 890 | background: var(--main-color); 891 | } 892 | :root .containerPadding_eba0ba .bar_eba0ba .barText_eba0ba, :root .containerPadding_eba0ba .bar_eba0ba .unreadIcon_eba0ba { 893 | color: white !important; 894 | } 895 | :root .scroller_c43953::-webkit-scrollbar, 896 | :root .scroller_fea3ef::-webkit-scrollbar, 897 | :root #channels::-webkit-scrollbar { 898 | display: none; 899 | } 900 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 { 901 | background-color: var(--background-primary); 902 | margin: 12px; 903 | padding: 0; 904 | border-radius: 12px; 905 | } 906 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .draggable_ac3629, :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .voiceUser_d80634 { 907 | height: 40px; 908 | } 909 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .content_d80634 { 910 | padding-left: 2px; 911 | height: 100%; 912 | border-radius: 0; 913 | } 914 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .content_d80634 .avatar_d80634 { 915 | border-radius: var(--avatar-radius); 916 | } 917 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .draggable_ac3629:first-child .content_d80634 { 918 | border-radius: 12px 12px 0 0; 919 | } 920 | :root .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 .draggable_ac3629:last-child .content_d80634 { 921 | border-radius: 0 0 12px 12px; 922 | } 923 | 924 | :root .toolbar_fc4f04 > :last-child[href="https://support.discord.com"], 925 | :root .searchLearnMore_b0286e { 926 | display: none; 927 | } 928 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) { 929 | z-index: 1; 930 | background: transparent; 931 | width: calc(100% - 240px); 932 | } 933 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .toolbar_fc4f04, 934 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .topic_bf3bbb { 935 | -webkit-app-region: no-drag; 936 | } 937 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .icon_fc4f04 { 938 | -webkit-app-region: unset; 939 | } 940 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .followButton_a7d72e, 941 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .children_fc4f04:after { 942 | display: none; 943 | } 944 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .search_ff5f90 { 945 | position: fixed; 946 | right: 10px; 947 | } 948 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .search_ff5f90 .searchBar_a46bef { 949 | background: var(--background-primary); 950 | width: 200px; 951 | height: 28px; 952 | padding: 2px 10px; 953 | border-radius: 4px; 954 | } 955 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .search_ff5f90 .searchBar_a46bef .searchFilter_b0fa94, 956 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .search_ff5f90 .searchBar_a46bef .searchAnswer_b0fa94 { 957 | background: transparent; 958 | } 959 | :root .container_fc4f04.title_a7d72e:not(.minimum_d880dc) .search_ff5f90 .searchBar_a46bef .icon_effbe2 { 960 | color: var(--main-color); 961 | } 962 | :root .container_eedf95 { 963 | background: var(--background-secondary-alt-alt); 964 | box-shadow: none; 965 | } 966 | :root .container_eedf95 .resultsGroup_b0286e .option_b0286e { 967 | padding: 0 20px; 968 | margin: 0; 969 | border-radius: 0; 970 | } 971 | :root .container_eedf95 .resultsGroup_b0286e .option_b0286e.selected-rZcOL-, :root .container_eedf95 .resultsGroup_b0286e .option_b0286e[aria-selected=true] { 972 | background: var(--background-secondary); 973 | } 974 | :root .container_eedf95 .resultsGroup_b0286e .option_b0286e:after { 975 | display: none; 976 | } 977 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker { 978 | background: transparent; 979 | border-radius: 0; 980 | } 981 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__header { 982 | background: transparent; 983 | } 984 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__header .react-datepicker__current-month { 985 | border-bottom: none; 986 | } 987 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__navigation--next, :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__navigation--previous { 988 | border: none; 989 | border-radius: 50%; 990 | } 991 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__navigation--next:hover, :root .container_eedf95 .calendarPicker_be05cd .react-datepicker__navigation--previous:hover { 992 | background-color: var(--epicshadow1); 993 | } 994 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker [class^=react-datepicker__day] { 995 | background: transparent; 996 | } 997 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__day { 998 | border-color: var(--background-tertiary); 999 | } 1000 | :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__day--selected:after, :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__day--selected:hover, :root .container_eedf95 .calendarPicker_be05cd .react-datepicker .react-datepicker__day:hover { 1001 | background: var(--main-color); 1002 | } 1003 | :root .container_eedf95 .datePickerHint_b0286e .hintValue_b0286e { 1004 | background: var(--main-color); 1005 | } 1006 | :root .searchResultsWrap_c2b47d { 1007 | background: var(--background-secondary); 1008 | top: -48px; 1009 | padding-top: 48px; 1010 | width: 480px; 1011 | height: 100%; 1012 | } 1013 | :root .searchResultsWrap_c2b47d .searchHeader_b7c924 { 1014 | position: absolute; 1015 | width: 100%; 1016 | background: linear-gradient(180deg, var(--background-secondary), transparent); 1017 | } 1018 | :root .searchResultsWrap_c2b47d .scroller_c2b47d { 1019 | padding: 0; 1020 | padding-top: 48px; 1021 | } 1022 | :root .searchResultsWrap_c2b47d .scroller_c2b47d > div { 1023 | padding: 0 14px 0 20px; 1024 | } 1025 | :root .searchResultsWrap_c2b47d .scroller_c2b47d .channelName-3w2Y3c { 1026 | background: transparent; 1027 | padding: 8px 0; 1028 | } 1029 | :root .searchResultsWrap_c2b47d .scroller_c2b47d .searchResult_ddc613 { 1030 | border: none; 1031 | box-shadow: none; 1032 | border-radius: 10px; 1033 | } 1034 | :root .searchResultsWrap_c2b47d .scroller_c2b47d .pageButton_b48941 { 1035 | background-color: var(--background-primary); 1036 | } 1037 | :root .searchResultsWrap_c2b47d .scroller_c2b47d .pageButton_b48941.activeButton_b48941 { 1038 | background-color: var(--main-color); 1039 | } 1040 | :root .recentMentionsPopout_ddb5b4 { 1041 | position: fixed; 1042 | top: 0; 1043 | right: 0; 1044 | min-height: 100%; 1045 | max-height: 100% !important; 1046 | border-radius: 0; 1047 | background: var(--background-secondary); 1048 | box-shadow: var(--elevation-high); 1049 | } 1050 | :root .recentMentionsPopout_ddb5b4 .header_ac90a2 { 1051 | background-color: var(--background-tertiary); 1052 | } 1053 | :root .recentMentionsPopout_ddb5b4 .item_a0 { 1054 | margin-bottom: 0 !important; 1055 | } 1056 | :root .recentMentionsPopout_ddb5b4 .item_a0.brand_a0.selected_a0.item_a0, :root .recentMentionsPopout_ddb5b4 .item_a0.brand_a0.item_a0:active { 1057 | border-bottom-color: var(--main-color) !important; 1058 | } 1059 | :root .recentMentionsPopout_ddb5b4 .row_fd8ff1 { 1060 | background: var(--background-primary); 1061 | margin: 12px; 1062 | border-radius: 12px; 1063 | } 1064 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) { 1065 | position: fixed; 1066 | top: 84px; 1067 | left: 330px; 1068 | width: calc(100% - 570px); 1069 | max-height: calc(100% - 84px) !important; 1070 | height: 100%; 1071 | box-shadow: unset; 1072 | background: var(--background-primary); 1073 | border-radius: 0; 1074 | } 1075 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .header_ac90a2 { 1076 | background: var(--background-primary); 1077 | text-align: center; 1078 | box-shadow: none; 1079 | } 1080 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .messagesPopout_ac90a2 { 1081 | padding: 12px 0 0 12px; 1082 | } 1083 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .messagesPopout_ac90a2 .messageGroupWrapper_ac90a2 { 1084 | padding: 8px; 1085 | margin-bottom: 12px; 1086 | border: none; 1087 | background: var(--background-secondary); 1088 | border-radius: 12px; 1089 | } 1090 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .messagesPopout_ac90a2::-webkit-scrollbar { 1091 | width: 8px; 1092 | margin-left: 5px; 1093 | } 1094 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .messagesPopout_ac90a2::-webkit-scrollbar-thumb { 1095 | border: none; 1096 | background: var(--background-secondary) !important; 1097 | border-radius: 6px 0 0 6px; 1098 | } 1099 | :root .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) .messagesPopout_ac90a2::-webkit-scrollbar-track-piece { 1100 | display: none; 1101 | } 1102 | 1103 | :root .membersWrap_cbd271 { 1104 | margin-top: -48px; 1105 | max-height: calc(100% + 48px); 1106 | } 1107 | :root .membersWrap_cbd271 .members_cbd271 { 1108 | padding-top: 48px; 1109 | } 1110 | :root .membersWrap_cbd271 .members_cbd271 .member_a31c43 { 1111 | margin: 0; 1112 | } 1113 | :root .membersWrap_cbd271 .members_cbd271 .member_a31c43 .layout_d808b0 { 1114 | padding: 0 22px; 1115 | width: calc(100% - 22px); 1116 | border-radius: 0; 1117 | } 1118 | :root .membersWrap_cbd271 .members_cbd271::-webkit-scrollbar { 1119 | display: none; 1120 | } 1121 | :root .loadingPopout-1feYe_ { 1122 | background: var(--background-secondary); 1123 | } 1124 | :root .userPopoutOuter_c69a7b { 1125 | border-radius: 8px; 1126 | overflow: unset; 1127 | } 1128 | :root .userPopoutOuter_c69a7b .userProfileInner_c69a7b { 1129 | background-color: var(--background-tertiary); 1130 | overflow: unset; 1131 | } 1132 | :root .userPopoutOuter_c69a7b .header_b8cc6d { 1133 | min-height: 210px; 1134 | } 1135 | :root .userPopoutOuter_c69a7b .header_b8cc6d > .mask_d5fdb1 { 1136 | overflow: visible; 1137 | min-height: unset !important; 1138 | contain: unset; 1139 | } 1140 | :root .userPopoutOuter_c69a7b .header_b8cc6d > .mask_d5fdb1 .banner_d5fdb1 { 1141 | position: absolute; 1142 | height: 200px !important; 1143 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.7607843137), rgba(0, 0, 0, 0.7607843137)); 1144 | clip-path: polygon(0 0, 100% 0, 100% calc(100% - 25px), 50% 100%, 0 calc(100% - 25px)); 1145 | } 1146 | :root .userPopoutOuter_c69a7b .header_b8cc6d > .mask_d5fdb1 > foreignObject { 1147 | mask: none; 1148 | } 1149 | :root .userPopoutOuter_c69a7b .wrapper_cb78f1 { 1150 | flex-direction: column; 1151 | } 1152 | :root .userPopoutOuter_c69a7b .addCustomStatusButtonBubble_d22603, :root .userPopoutOuter_c69a7b .statusBubbleOuter_d22603 + .visibleContainer_d22603 { 1153 | position: absolute; 1154 | top: -60px; 1155 | --custom-status-bubble-background: var(--background-tertiary); 1156 | } 1157 | :root .userPopoutOuter_c69a7b .statusBubbleOuter_d22603:before { 1158 | top: 28px; 1159 | } 1160 | :root .userPopoutOuter_c69a7b .statusBubbleOuter_d22603:after { 1161 | top: 50px; 1162 | left: 25px; 1163 | } 1164 | :root .userPopoutOuter_c69a7b .avatar_f94206 { 1165 | top: 15px !important; 1166 | left: calc(50% - 40px); 1167 | } 1168 | :root .userPopoutOuter_c69a7b .avatar_f94206 .overlay_f94206:after { 1169 | border-radius: var(--avatar-radius); 1170 | } 1171 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarPopover_a64b81 { 1172 | top: 0; 1173 | left: 0; 1174 | border-radius: calc(var(--avatar-radius) * 2) !important; 1175 | } 1176 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarPopover_a64b81 foreignObject { 1177 | mask: none !important; 1178 | } 1179 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarPopover_a64b81 foreignObject .avatarHintInner_f89da9 { 1180 | font-size: 0; 1181 | text-transform: none; 1182 | } 1183 | :root .userPopoutOuter_c69a7b .avatar_f94206 .avatarPopover_a64b81 foreignObject .avatarHintInner_f89da9::after { 1184 | white-space: normal; 1185 | text-align: center; 1186 | content: var(--avatar-hint-text); 1187 | color: var(--avatar-hint-color); 1188 | font-size: var(--avatar-hint-size); 1189 | font-family: var(--avatar-hint-font); 1190 | } 1191 | :root .userPopoutOuter_c69a7b .mask_c51b4e foreignObject { 1192 | border-radius: calc(var(--avatar-radius) * 2) !important; 1193 | } 1194 | :root .userPopoutOuter_c69a7b .mask_c51b4e circle, 1195 | :root .userPopoutOuter_c69a7b .mask_c51b4e rect[fill=black] { 1196 | display: none; 1197 | } 1198 | :root .userPopoutOuter_c69a7b .body_b8cc6d { 1199 | position: static; 1200 | } 1201 | :root .userPopoutOuter_c69a7b .container_c32acf { 1202 | position: absolute; 1203 | top: 115px; 1204 | left: 20px; 1205 | width: calc(100% - 38px); 1206 | } 1207 | :root .userPopoutOuter_c69a7b .usernameRow_c32acf .clickableUsername_c32acf { 1208 | width: 100%; 1209 | } 1210 | :root .userPopoutOuter_c69a7b .usernameRow_c32acf .clickableUsername_c32acf h1 { 1211 | display: block; 1212 | text-align: center; 1213 | } 1214 | :root .userPopoutOuter_c69a7b .usernameRow_c32acf .nicknameIcons_c32acf { 1215 | display: none; 1216 | } 1217 | :root .userPopoutOuter_c69a7b .tags_c32acf { 1218 | margin-top: 5px; 1219 | justify-content: center; 1220 | } 1221 | :root .userPopoutOuter_c69a7b .tags_c32acf .container_b64375 { 1222 | border: none; 1223 | background: transparent; 1224 | } 1225 | :root .root_b9fccc.root_f9a4c9.small_f9a4c9 { 1226 | width: 800px; 1227 | height: 400px; 1228 | } 1229 | :root .root_b9fccc.root_f9a4c9.small_f9a4c9 > div, :root .root_b9fccc.root_f9a4c9.small_f9a4c9 .userProfileModalOuter_c69a7b { 1230 | width: 100%; 1231 | height: 100%; 1232 | box-sizing: border-box; 1233 | } 1234 | :root .userProfileModalInner_c69a7b { 1235 | width: 100%; 1236 | height: 100%; 1237 | flex-direction: row; 1238 | overflow: hidden; 1239 | position: relative; 1240 | border-radius: 8px; 1241 | } 1242 | :root .userProfileModalInner_c69a7b::before { 1243 | width: 100%; 1244 | height: 100%; 1245 | } 1246 | :root .userProfileModalInner_c69a7b header { 1247 | width: calc(55% - 16px); 1248 | height: 100%; 1249 | } 1250 | :root .userProfileModalInner_c69a7b header > .mask_d5fdb1 { 1251 | min-width: unset !important; 1252 | min-height: unset !important; 1253 | width: 100%; 1254 | height: 100%; 1255 | } 1256 | :root .userProfileModalInner_c69a7b header > .mask_d5fdb1 .banner_d5fdb1 { 1257 | position: absolute; 1258 | top: 0; 1259 | left: 0; 1260 | width: 100%; 1261 | height: 100% !important; 1262 | z-index: -1; 1263 | opacity: 0.6; 1264 | border-radius: 10px 0 0 10px; 1265 | mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2862745098)); 1266 | -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.2862745098)); 1267 | } 1268 | :root .userProfileModalInner_c69a7b header > .mask_d5fdb1 > foreignObject { 1269 | mask: none; 1270 | } 1271 | :root .userProfileModalInner_c69a7b header > .mask_d5fdb1[viewBox="0 0 600 106"] > foreignObject { 1272 | y: -350px; 1273 | height: 800px; 1274 | } 1275 | :root .userProfileModalInner_c69a7b header > .mask_d5fdb1[viewBox="0 0 600 210"] > foreignObject { 1276 | y: -250px; 1277 | height: 700px; 1278 | } 1279 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc { 1280 | position: static; 1281 | } 1282 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .avatar_f94206 { 1283 | top: 16px; 1284 | left: 16px; 1285 | } 1286 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .avatar_f94206 circle, 1287 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .avatar_f94206 rect[fill=black] { 1288 | display: none; 1289 | } 1290 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 { 1291 | position: absolute; 1292 | top: unset; 1293 | left: unset; 1294 | bottom: 0; 1295 | right: 0; 1296 | z-index: 2; 1297 | width: calc(45% + 16px); 1298 | padding: 20px; 1299 | backdrop-filter: blur(8px); 1300 | box-sizing: border-box; 1301 | border-bottom-right-radius: 5px; 1302 | } 1303 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 > .statusBubbleOuter_d22603, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 > .statusBubbleOuter_d22603 { 1304 | border: none; 1305 | box-shadow: none; 1306 | background: transparent; 1307 | min-width: unset; 1308 | max-width: unset; 1309 | } 1310 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 > .statusBubbleOuter_d22603::before, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 > .statusBubbleOuter_d22603::after, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 > .statusBubbleOuter_d22603::before, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 > .statusBubbleOuter_d22603::after { 1311 | display: none; 1312 | } 1313 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 > .statusBubbleOuter_d22603 > .statusBubble_d22603, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 > .statusBubbleOuter_d22603 > .statusBubble_d22603 { 1314 | padding: 0; 1315 | background: transparent; 1316 | } 1317 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 > .statusBubbleOuter_d22603 > .statusBubble_d22603 > .content_d22603, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 > .statusBubbleOuter_d22603 > .statusBubble_d22603 > .content_d22603 { 1318 | text-align: left; 1319 | } 1320 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603.activityProfile_c1d9fd, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603.activityProfile_c1d9fd { 1321 | right: unset; 1322 | bottom: -140px; 1323 | left: 5px; 1324 | width: 750px; 1325 | padding: 20px; 1326 | } 1327 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 .customStatus_b2ca13, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 .customStatus_b2ca13 { 1328 | margin-top: 0; 1329 | } 1330 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 .assetsLargeImageActivityFeed_c1d9fd, 1331 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 .assetsLargeImageActivityFeedXbox_c1d9fd, 1332 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .addCustomStatusButtonBubble_d22603 .assetsLargeImageProfile_c1d9fd, :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 .assetsLargeImageActivityFeed_c1d9fd, 1333 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 .assetsLargeImageActivityFeedXbox_c1d9fd, 1334 | :root .userProfileModalInner_c69a7b .headerInner_b9fccc .statusBubbleOuter_d22603 + .visibleContainer_d22603 .assetsLargeImageProfile_c1d9fd { 1335 | width: 40px; 1336 | height: 40px; 1337 | } 1338 | :root .userProfileModalInner_c69a7b .headerButtons_b9fccc { 1339 | position: fixed; 1340 | bottom: 15px; 1341 | left: 15px; 1342 | z-index: 1; 1343 | } 1344 | :root .userProfileModalInner_c69a7b .mask_c51b4e foreignObject { 1345 | border-radius: calc(var(--avatar-radius) * 2.1) !important; 1346 | } 1347 | :root .userProfileModalInner_c69a7b .body_b9fccc { 1348 | width: calc(45% + 16px); 1349 | margin: 0; 1350 | overflow: visible; 1351 | background-color: var(--background-primary); 1352 | border-radius: 0; 1353 | } 1354 | :root .userProfileModalInner_c69a7b .body_b9fccc .fullSizeOverlayBackground_c69a7b { 1355 | position: static; 1356 | background: transparent; 1357 | border: none; 1358 | } 1359 | :root .userProfileModalInner_c69a7b .body_b9fccc .fullSizeOverlayBackground_c69a7b .container_ecc04c { 1360 | height: 100%; 1361 | } 1362 | :root .userProfileModalInner_c69a7b .body_b9fccc .container_c32acf { 1363 | position: absolute; 1364 | top: 25px; 1365 | left: 153px; 1366 | z-index: 1; 1367 | max-width: 250px; 1368 | } 1369 | :root .userProfileModalInner_c69a7b .body_b9fccc .container_c32acf .container_b64375 { 1370 | border: none; 1371 | } 1372 | :root .userProfileModalInner_c69a7b .body_b9fccc .tabBar_ecc04c { 1373 | position: absolute; 1374 | bottom: 65px; 1375 | left: 5px; 1376 | z-index: 1; 1377 | border-bottom: unset; 1378 | flex-direction: column; 1379 | gap: 15px; 1380 | } 1381 | :root .userProfileModalInner_c69a7b .body_b9fccc .tabBar_ecc04c .item_a0 { 1382 | height: 20px; 1383 | border-bottom: unset; 1384 | } 1385 | :root .userProfileModalInner_c69a7b .body_b9fccc .tabBar_ecc04c .item_a0 > div { 1386 | transition: font-weight 200ms; 1387 | } 1388 | :root .userProfileModalInner_c69a7b .body_b9fccc .tabBar_ecc04c .item_a0.selected_a0 > div { 1389 | font-weight: bold; 1390 | } 1391 | :root .userProfileModalInner_c69a7b .body_b9fccc .section_ba4d80:nth-last-child(3) { 1392 | margin-bottom: 50px; 1393 | } 1394 | :root .userProfileModalInner_c69a7b .body_b9fccc .connectedAccountContainer_ab12c6 { 1395 | border: none; 1396 | background-color: rgba(255, 255, 255, 0.05); 1397 | } 1398 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb { 1399 | display: grid; 1400 | grid-template-columns: 1fr 1fr; 1401 | grid-template-rows: repeat(20, 0fr); 1402 | gap: 10px; 1403 | padding-left: 8px; 1404 | } 1405 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .listRow_d2d6cb { 1406 | position: relative; 1407 | z-index: 1; 1408 | height: 44px; 1409 | margin: 0; 1410 | padding-left: 10px; 1411 | border-radius: 8px; 1412 | overflow: hidden; 1413 | background-color: rgba(255, 255, 255, 0.0274509804); 1414 | } 1415 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .listRow_d2d6cb .listAvatar_d2d6cb { 1416 | position: absolute; 1417 | right: 0; 1418 | z-index: -1; 1419 | width: 62% !important; 1420 | height: 250% !important; 1421 | margin-right: 0; 1422 | border-radius: 0; 1423 | -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7960784314)); 1424 | } 1425 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .listRow_d2d6cb .listAvatar_d2d6cb svg { 1426 | position: relative; 1427 | width: 100%; 1428 | height: 100%; 1429 | } 1430 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .listRow_d2d6cb .listAvatar_d2d6cb svg foreignObject { 1431 | width: 100%; 1432 | height: 100%; 1433 | } 1434 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .listRow_d2d6cb .listAvatar_d2d6cb svg rect { 1435 | display: none; 1436 | } 1437 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .empty_d2d6cb { 1438 | grid-column: 1/3; 1439 | grid-row: 1/22; 1440 | position: relative; 1441 | z-index: 0; 1442 | overflow: hidden; 1443 | margin: 0; 1444 | padding-left: 10px; 1445 | border-radius: 8px; 1446 | } 1447 | :root .userProfileModalInner_c69a7b .body_b9fccc .listScroller_d2d6cb .empty_d2d6cb .emptyIconFriends_d2d6cb { 1448 | position: absolute; 1449 | z-index: -1; 1450 | width: 80%; 1451 | height: 80%; 1452 | margin-left: -10px; 1453 | opacity: 0.2; 1454 | background-size: 100%; 1455 | } 1456 | :root .userProfileModalInner_c69a7b .body_b9fccc .input-2g-os5 { 1457 | background-color: transparent; 1458 | } 1459 | :root .userProfileModalInner_c69a7b .userProfileModalOverlayBackground_c69a7b { 1460 | background-color: transparent; 1461 | } 1462 | 1463 | :root .layer_d4b6c5 { 1464 | transform: unset !important; 1465 | } 1466 | :root .layer_d4b6c5.baseLayer_d4b6c5 { 1467 | opacity: 1 !important; 1468 | } 1469 | :root .layer_d4b6c5.baseLayer_d4b6c5.stop-animations { 1470 | transform: scale(1) !important; 1471 | } 1472 | :root .layer_d4b6c5:not(.baseLayer_d4b6c5) { 1473 | margin-left: 90px; 1474 | } 1475 | :root .layer_d4b6c5 .sidebarRegion_c25c6d { 1476 | flex: unset; 1477 | background: var(--background-tertiary); 1478 | } 1479 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d { 1480 | justify-content: flex-start; 1481 | border-radius: 8px 0 0; 1482 | } 1483 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d { 1484 | width: 240px; 1485 | } 1486 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .searchBar_e7c031 { 1487 | margin: 0 30px 15px 30px; 1488 | border-radius: 8px; 1489 | } 1490 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .side_a0 .header_a0 { 1491 | color: var(--textcolor); 1492 | } 1493 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .bd-sidebar-header-label { 1494 | color: var(--textcolor); 1495 | padding: 0; 1496 | } 1497 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .side_a0 .header_a0, 1498 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .side_a0 .item_a0, 1499 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .bd-sidebar-header { 1500 | padding: 6px 30px; 1501 | border-radius: 0; 1502 | } 1503 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .socialLinks_c44e94 { 1504 | justify-content: center; 1505 | display: flex; 1506 | flex-direction: row; 1507 | } 1508 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d .info_c5a741 { 1509 | padding-left: 30px; 1510 | } 1511 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .sidebar_c25c6d, 1512 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d .flexChild_dc333f { 1513 | padding-left: 0 !important; 1514 | padding-right: 0 !important; 1515 | } 1516 | :root .layer_d4b6c5 .sidebarRegion_c25c6d .sidebarRegionScroller_c25c6d::-webkit-scrollbar { 1517 | display: none; 1518 | } 1519 | :root .layer_d4b6c5 .contentColumn_c25c6d, 1520 | :root .layer_d4b6c5 .customColumn_c25c6d { 1521 | min-width: unset; 1522 | max-width: 95%; 1523 | } 1524 | :root .layer_d4b6c5 .toolsContainer_c25c6d { 1525 | position: absolute; 1526 | right: 0px; 1527 | } 1528 | :root .layer_d4b6c5 .toolsContainer_c25c6d .closeButton_df5532:active { 1529 | transform: none; 1530 | } 1531 | :root .layer_d4b6c5 .toolsContainer_c25c6d .closeButton_df5532::before { 1532 | content: ""; 1533 | position: fixed; 1534 | top: 0; 1535 | left: 0; 1536 | width: 90px; 1537 | height: 100%; 1538 | z-index: 100; 1539 | } 1540 | :root .noticeRegion_c25c6d { 1541 | right: 0; 1542 | max-width: 100%; 1543 | } 1544 | :root .noticeRegion_c25c6d .container_b6cd66 { 1545 | background-color: var(--background-secondary) !important; 1546 | } 1547 | @media (max-width: 1465px) { 1548 | :root .accountProfileCard_b69b77 { 1549 | flex-direction: column; 1550 | } 1551 | :root .accountProfileCard_b69b77 .mask_d5fdb1 { 1552 | position: absolute; 1553 | min-height: 150px !important; 1554 | max-width: 100% !important; 1555 | } 1556 | :root .accountProfileCard_b69b77 .mask_d5fdb1 mask { 1557 | display: none; 1558 | } 1559 | :root .accountProfileCard_b69b77 .mask_d5fdb1 foreignObject { 1560 | y: -51px !important; 1561 | } 1562 | :root .accountProfileCard_b69b77 .banner_d5fdb1 { 1563 | border-radius: 8px 8px 0 0 !important; 1564 | height: 200px !important; 1565 | flex: unset !important; 1566 | } 1567 | :root .accountProfileCard_b69b77 .userInfo_b69b77 { 1568 | height: 150px !important; 1569 | margin-left: 0 !important; 1570 | justify-content: space-evenly !important; 1571 | } 1572 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .container_b64375 { 1573 | justify-content: center; 1574 | } 1575 | :root .accountProfileCard_b69b77 .background_b69b77 { 1576 | margin-top: 150px !important; 1577 | flex: unset !important; 1578 | } 1579 | } 1580 | :root .accountProfileCard_b69b77 { 1581 | display: flex; 1582 | background-color: var(--background-secondary); 1583 | } 1584 | :root .accountProfileCard_b69b77 .mask_d5fdb1 mask { 1585 | display: none; 1586 | } 1587 | :root .accountProfileCard_b69b77 .mask_d5fdb1 foreignObject { 1588 | y: -110px; 1589 | } 1590 | :root .accountProfileCard_b69b77 .banner_d5fdb1 { 1591 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.7607843137), rgba(0, 0, 0, 0.7607843137)); 1592 | border-radius: 8px 0 0 8px; 1593 | height: 320px !important; 1594 | flex: 1; 1595 | } 1596 | :root .accountProfileCard_b69b77 .userInfo_b69b77 { 1597 | position: absolute; 1598 | display: grid; 1599 | grid-template-areas: "avatar username" "avatar button"; 1600 | gap: 20px; 1601 | overflow: hidden; 1602 | height: 100%; 1603 | padding: 0; 1604 | justify-content: flex-start; 1605 | margin-left: 40px; 1606 | } 1607 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 { 1608 | grid-area: avatar; 1609 | position: static; 1610 | width: 120px !important; 1611 | height: 120px !important; 1612 | border: none; 1613 | background: none; 1614 | align-self: center; 1615 | } 1616 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .avatar_b69b77 .mask_c51b4e { 1617 | width: 120px; 1618 | height: 120px; 1619 | } 1620 | :root .accountProfileCard_b69b77 .userInfo_b69b77 .badgeList_b69b77 { 1621 | background-color: transparent; 1622 | } 1623 | :root .accountProfileCard_b69b77 .userInfo_b69b77 > div:nth-child(2) { 1624 | grid-area: username; 1625 | align-self: flex-end; 1626 | } 1627 | :root .accountProfileCard_b69b77 .userInfo_b69b77 button:last-child { 1628 | grid-area: button; 1629 | } 1630 | :root .accountProfileCard_b69b77 .background_b69b77 { 1631 | margin: 0; 1632 | flex: 1; 1633 | } 1634 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 > :first-child { 1635 | flex: 2 auto; 1636 | } 1637 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .userPopoutInner_c69a7b:before { 1638 | width: calc(100% - 8px) !important; 1639 | } 1640 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .header_f4c122 { 1641 | min-height: 210px; 1642 | } 1643 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .header_f4c122 > .mask_d5fdb1 { 1644 | overflow: visible; 1645 | min-height: unset !important; 1646 | contain: unset; 1647 | } 1648 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .header_f4c122 > .mask_d5fdb1 .banner_d5fdb1 { 1649 | position: absolute; 1650 | height: 200px !important; 1651 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.7607843137), rgba(0, 0, 0, 0.7607843137)); 1652 | clip-path: polygon(0 0, 100% 0, 100% calc(100% - 25px), 50% 100%, 0 calc(100% - 25px)); 1653 | } 1654 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .header_f4c122 > .mask_d5fdb1 > foreignObject { 1655 | mask: none; 1656 | } 1657 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .avatar_f18fcb { 1658 | top: 15px; 1659 | left: 50%; 1660 | margin-left: -40px; 1661 | } 1662 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .avatar_f18fcb .avatarUploaderInner_ab876d { 1663 | border: none; 1664 | border-radius: var(--avatar-radius); 1665 | } 1666 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .avatar_f18fcb .imageUploaderIcon_de76e4 { 1667 | display: none; 1668 | } 1669 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .avatar_f18fcb .status_ab876d { 1670 | background-color: transparent; 1671 | } 1672 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .customStatus__3aa7f { 1673 | padding-top: 12px; 1674 | } 1675 | :root .profileCustomizationSection_bad983 .baseLayout_bad983 .divider-1wtgZ3 { 1676 | display: none; 1677 | } 1678 | :root .bioTextArea_ccf27d { 1679 | border-radius: 8px; 1680 | } 1681 | :root .item-2idW98 { 1682 | background: var(--background-secondary); 1683 | transition: transform 200ms; 1684 | } 1685 | :root .item-2idW98:hover { 1686 | background: var(--background-secondary); 1687 | } 1688 | :root #family-center-tab .max-width_d00e26, :root #family-center-tab .max-width_a2e886, :root #requests-tab .container_f70f48 { 1689 | max-width: unset; 1690 | } 1691 | :root .connectionHeader_e2a436 { 1692 | background: transparent; 1693 | } 1694 | :root .connectionHeader_e2a436 .connectionDelete_e2a436 { 1695 | border-color: transparent; 1696 | border-radius: 50%; 1697 | padding: 8px 8px 5px 8px; 1698 | transition: background 100ms; 1699 | } 1700 | :root .connectionHeader_e2a436 .connectionDelete_e2a436:hover { 1701 | background: rgba(255, 255, 255, 0.1333333333); 1702 | } 1703 | :root .premiumLabel_ae3c77 { 1704 | flex-direction: row-reverse; 1705 | justify-content: flex-end; 1706 | } 1707 | :root .premiumLabel_ae3c77 svg { 1708 | margin-right: 8px; 1709 | } 1710 | :root .premiumLabel_ae3c77 + .selectedBackground_ae3c77 { 1711 | background-color: var(--background-modifier-selected); 1712 | border-radius: 0; 1713 | } 1714 | :root .cardWrapper_f9902b { 1715 | transform: translateZ(0); 1716 | overflow: hidden; 1717 | background: rgba(0, 0, 0, 0.5333333333); 1718 | --header-primary: #fff; 1719 | } 1720 | :root .cardWrapper_f9902b .tierLabel__41356 { 1721 | color: #fff; 1722 | font-weight: 500; 1723 | } 1724 | :root .cardWrapper_f9902b .gemIndicatorContainer_b03ca0 { 1725 | background: transparent; 1726 | backdrop-filter: blur(5px); 1727 | } 1728 | :root .cardWrapper_f9902b .gemIndicatorContainer_b03ca0 .gemWithoutLabel__6225b { 1729 | color: #999; 1730 | } 1731 | :root .cardWrapper_f9902b .icon_a64689 { 1732 | border-radius: 8px; 1733 | } 1734 | :root .cardWrapper_f9902b .icon_a64689::before { 1735 | content: ""; 1736 | position: fixed; 1737 | top: 0; 1738 | left: 0; 1739 | width: 100%; 1740 | height: 100%; 1741 | background-image: inherit; 1742 | background-repeat: no-repeat; 1743 | background-size: cover; 1744 | background-position: 50% 50%; 1745 | z-index: -1; 1746 | opacity: 0.5; 1747 | filter: blur(20px); 1748 | } 1749 | :root .promotionCard_e8af36 { 1750 | border-radius: 8px; 1751 | } 1752 | :root .paymentPane_f66684, 1753 | :root .codeRedemptionRedirect_cb70f4 { 1754 | background: var(--background-secondary); 1755 | border: none; 1756 | } 1757 | :root .paymentPane_f66684 .paginator_f66684, 1758 | :root .paymentPane_f66684 .bottomDivider_f66684, 1759 | :root .codeRedemptionRedirect_cb70f4 .paginator_f66684, 1760 | :root .codeRedemptionRedirect_cb70f4 .bottomDivider_f66684 { 1761 | background: transparent; 1762 | } 1763 | :root .paymentPane_f66684 .paymentRow_f66684, 1764 | :root .codeRedemptionRedirect_cb70f4 .paymentRow_f66684 { 1765 | border: none; 1766 | } 1767 | :root .paymentPane_f66684 .paymentRow_f66684 .expandedInfo_a28a08, 1768 | :root .codeRedemptionRedirect_cb70f4 .paymentRow_f66684 .expandedInfo_a28a08 { 1769 | background: var(--background-primary); 1770 | } 1771 | :root .micTest_ca3055 .notches_e5cdf3.gray_e5cdf3 { 1772 | color: var(--background-primary); 1773 | } 1774 | :root .addGamePopout_fd966d { 1775 | background: var(--background-secondary); 1776 | box-shadow: none; 1777 | } 1778 | :root .addGamePopout_fd966d .divider_b8ab18 { 1779 | display: none; 1780 | } 1781 | :root .gameNameInput_fd966d { 1782 | padding: 8px; 1783 | } 1784 | :root .gameNameInput_fd966d:focus, :root .gameNameInput_fd966d:hover { 1785 | background-color: var(--background-primary); 1786 | border: none; 1787 | } 1788 | :root .notificationSettings-1U0JsJ { 1789 | max-width: unset; 1790 | } 1791 | :root .notificationSettings-1U0JsJ .wrapper_b877fa { 1792 | border: none; 1793 | background: var(--background-secondary); 1794 | border-radius: 20px; 1795 | } 1796 | :root .notificationSettings-1U0JsJ .wrapper_b877fa .option_b877fa { 1797 | margin: 10px; 1798 | border-radius: 16px; 1799 | background: var(--epicshadow1); 1800 | } 1801 | :root .notificationSettings-1U0JsJ .wrapper_b877fa .option_b877fa:hover { 1802 | background: var(--main-color); 1803 | opacity: 0.4; 1804 | } 1805 | :root .notificationSettings-1U0JsJ .wrapper_b877fa .option_b877fa.selected_b877fa { 1806 | background: var(--main-color); 1807 | box-shadow: unset; 1808 | } 1809 | :root .membershipDialog-2wAdpQ { 1810 | border-radius: 10px; 1811 | } 1812 | :root .membershipDialog-2wAdpQ:after { 1813 | left: 5px; 1814 | } 1815 | :root .videoWrapper_b8e00f { 1816 | background: transparent; 1817 | } 1818 | :root .videoWrapper_b8e00f iframe { 1819 | margin: auto; 1820 | border-radius: 10px; 1821 | } 1822 | :root .avatarUploaderInner_f0a9ff { 1823 | border-radius: 16px; 1824 | box-shadow: none; 1825 | } 1826 | :root .imageUploaderIcon_de76e4 { 1827 | display: none; 1828 | } 1829 | :root .customScroller_c25c6d > div, 1830 | :root .contentWidth_bd05f1 { 1831 | max-width: unset; 1832 | } 1833 | :root .customColorPicker_bbc020 { 1834 | background: var(--background-secondary); 1835 | border: none; 1836 | border-radius: 8px; 1837 | } 1838 | :root .customColorPicker_bbc020 .customColorPickerInputContainer_e467bb .input_f8bc55 { 1839 | background-color: var(--background-secondary); 1840 | } 1841 | :root .emojiAliasInput-1y-NBz .emojiInput-1aLNse { 1842 | background: var(--background-primary); 1843 | } 1844 | :root .auditLog_eebd33 { 1845 | border: none; 1846 | border-radius: 8px; 1847 | overflow: hidden; 1848 | } 1849 | :root .auditLog_eebd33 .header_eebd33, 1850 | :root .auditLog_eebd33 .changeDetails_eebd33 { 1851 | background: var(--background-secondary); 1852 | } 1853 | :root .auditLog_eebd33 .divider_eebd33 { 1854 | display: none; 1855 | } 1856 | :root .copyInput_d7e343 { 1857 | border: none; 1858 | border-radius: 8px; 1859 | } 1860 | :root .directoryContainer_da3f59 { 1861 | background-color: var(--background-primary); 1862 | } 1863 | :root .modal-1gWd9S .footer_ffaecb, 1864 | :root .container_a74b6f .footer_ffaecb { 1865 | border-bottom-left-radius: 0 !important; 1866 | } 1867 | :root .editCircle-2uL_D3, 1868 | :root .editCircle-ityklj { 1869 | background: var(--background-primary); 1870 | } 1871 | :root .formFieldWrapper-2LV3S6 { 1872 | border: none; 1873 | } 1874 | :root .sparkles-2XXTZO { 1875 | z-index: unset; 1876 | } 1877 | :root .background_bfac79 { 1878 | color: var(--background-secondary); 1879 | } 1880 | :root .tierInProgress_bfac79, 1881 | :root .tierBody_da77bd, 1882 | :root .tierHeaderLocked_da77bd, 1883 | :root .tierHeaderUnlocked_da77bd { 1884 | background: var(--background-secondary); 1885 | } 1886 | :root .overflowRolesPopout_e4010c, 1887 | :root .overflowRolesPopoutArrow_e4010c { 1888 | background: var(--background-secondary); 1889 | box-shadow: none; 1890 | } 1891 | 1892 | :root .panels_a4d4d9 { 1893 | position: relative; 1894 | z-index: unset; 1895 | } 1896 | :root .panels_a4d4d9 .activityPanel_a4d4d9 { 1897 | position: absolute; 1898 | bottom: 20px; 1899 | right: 105px; 1900 | padding: 0; 1901 | border-radius: 8px; 1902 | } 1903 | :root .panels_a4d4d9 .activityPanel_a4d4d9 .gameWrapper_bf1a22 { 1904 | display: none; 1905 | } 1906 | :root .panels_a4d4d9 .activityPanel_a4d4d9 .actions_bf1a22 { 1907 | margin: 0; 1908 | } 1909 | :root .panels_a4d4d9 .activityPanel_a4d4d9 .actions_bf1a22 .button_dd4f85 { 1910 | color: var(--main-color); 1911 | } 1912 | :root .panels_a4d4d9 .activityPanel_a4d4d9:hover { 1913 | background-color: var(--background-modifier-selected); 1914 | } 1915 | :root .panels_a4d4d9 > .container_b2ca13 { 1916 | padding: 10px 8px; 1917 | } 1918 | :root .panels_a4d4d9 > .container_b2ca13 .avatarWrapper_b2ca13[aria-expanded] .wrapper_c51b4e { 1919 | position: fixed; 1920 | left: 29px; 1921 | bottom: 23px; 1922 | z-index: 1; 1923 | } 1924 | :root .panels_a4d4d9 > .container_b2ca13 .avatarWrapper_b2ca13[aria-expanded]:hover { 1925 | background-color: transparent; 1926 | } 1927 | :root .panels_a4d4d9 > .container_b2ca13 .title-3XlmeX { 1928 | font-weight: 500; 1929 | } 1930 | :root .panels_a4d4d9 > .container_b2ca13 .button_adca65 { 1931 | color: #888; 1932 | } 1933 | :root .panels_a4d4d9 > .container_b2ca13 .button_adca65[aria-checked=false].enabled_adca65 { 1934 | color: var(--main-color); 1935 | } 1936 | :root .noChat_d880dc.wrapper_d880dc { 1937 | background: #000; 1938 | margin: 0; 1939 | border-radius: 0; 1940 | animation: unset; 1941 | } 1942 | :root .noChat_d880dc.wrapper_d880dc .headerWrapper_d880dc .container_fc4f04 { 1943 | width: unset; 1944 | } 1945 | :root .noChat_d880dc.wrapper_d880dc .border_ba4b17.speaking_ba4b17 { 1946 | box-shadow: inset 0 0 0 2.5px #43b581, inset 0 0 0 4.5px var(--background-secondary); 1947 | } 1948 | :root .noChat_d880dc.wrapper_d880dc .wrapper_b6e2f9 .button_dd4f85 { 1949 | border-radius: 50%; 1950 | } 1951 | :root .noChat_d880dc.wrapper_d880dc .colorable_ef18ee.primaryDark_ef18ee, 1952 | :root .noChat_d880dc.wrapper_d880dc .participantsButton_b83b18, 1953 | :root .noChat_d880dc.wrapper_d880dc .participantsButton_b83b18:hover { 1954 | background: var(--background-secondary); 1955 | } 1956 | :root .noChat_d880dc.wrapper_d880dc .css-1k9nrkn { 1957 | background: transparent; 1958 | } 1959 | :root .noChat_d880dc.wrapper_d880dc .controlButton_b6e2f9 foreignObject { 1960 | mask: none; 1961 | } 1962 | 1963 | :root .searchBar_f0963d { 1964 | position: absolute; 1965 | top: 0; 1966 | left: 0; 1967 | width: calc(100% - 20px); 1968 | background: linear-gradient(180deg, var(--background-secondary), transparent); 1969 | box-shadow: none; 1970 | } 1971 | :root .searchBar_f0963d .searchBarComponent_f0963d { 1972 | background: var(--background-primary); 1973 | border-radius: 20px; 1974 | font-size: 10px; 1975 | text-align: center; 1976 | } 1977 | :root .input_f4e139 { 1978 | background: var(--background-primary); 1979 | } 1980 | :root .privateChannels_f0963d > .scroller_c47fa9 { 1981 | padding-top: 48px; 1982 | background: transparent; 1983 | } 1984 | :root .privateChannels_f0963d > .scroller_c47fa9::-webkit-scrollbar { 1985 | display: none; 1986 | } 1987 | :root .channel_c91bad { 1988 | margin: 0; 1989 | max-width: unset; 1990 | border-radius: 0; 1991 | } 1992 | :root .channel_c91bad .layout_ec8679 { 1993 | padding: 0 22px; 1994 | width: calc(100% - 22px); 1995 | border-radius: 0; 1996 | } 1997 | :root .container_c2739c { 1998 | background: var(--background-primary); 1999 | } 2000 | :root .container_c2739c .actionButton_e01b91 { 2001 | background: transparent; 2002 | } 2003 | :root .container_c2739c .actionButton_e01b91:hover { 2004 | background: var(--background-primary); 2005 | } 2006 | :root .container_c2739c .peopleColumn_c2739c ::-webkit-scrollbar { 2007 | display: none; 2008 | } 2009 | :root .container_c2739c .tabBody_c2739c::before, 2010 | :root .container_c2739c .libraryHeader_cb9493::before { 2011 | content: none; 2012 | } 2013 | :root .container_c2739c .header_c6ee36, 2014 | :root .container_c2739c .header_d8cdac, 2015 | :root .container_c2739c .header-JHwfVI { 2016 | display: none; 2017 | } 2018 | :root .container_c2739c .nowPlayingColumn_c2739c { 2019 | background: transparent; 2020 | margin: 3px 0 10px 0; 2021 | } 2022 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a { 2023 | background: var(--background-secondary); 2024 | border-radius: 15px 0 0 15px; 2025 | } 2026 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a { 2027 | border: none; 2028 | padding: 16px 0 !important; 2029 | margin: 0; 2030 | } 2031 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .header_bf550a { 2032 | text-align: center; 2033 | } 2034 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .emptyCard_f02fcf { 2035 | margin: 16px; 2036 | } 2037 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .outer_ac5d22 { 2038 | background: transparent; 2039 | } 2040 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .wrapper_cd82a7 { 2041 | background: var(--background-secondary); 2042 | margin: 16px; 2043 | border-radius: 10px; 2044 | border: none; 2045 | } 2046 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .wrapper_cd82a7 .body_cd82a7 > :nth-last-child(3) { 2047 | border-radius: 8px 8px 0 0; 2048 | } 2049 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .wrapper_cd82a7 .body_cd82a7 .separator_cd82a7 { 2050 | display: none; 2051 | } 2052 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a .wrapper_cd82a7 .body_cd82a7 > :nth-child(3) { 2053 | border-radius: 0 0 8px 8px; 2054 | } 2055 | :root .container_c2739c .nowPlayingColumn_c2739c .container_bf550a .scroller_bf550a::-webkit-scrollbar { 2056 | display: none; 2057 | } 2058 | :root .akaBadge__27cd4 { 2059 | background: var(--main-color); 2060 | color: #fff; 2061 | } 2062 | :root .wrapper_d880dc:not(.video_d880dc) { 2063 | background: var(--background-secondary); 2064 | margin: 15px; 2065 | border-radius: 10px; 2066 | animation: callzoom 2s ease; 2067 | } 2068 | :root .wrapper_d880dc:not(.video_d880dc) .tile_dc5fc4 { 2069 | background: var(--background-primary); 2070 | } 2071 | :root .wrapper_d880dc:not(.video_d880dc) .tile_dc5fc4 .button_e5cc00, 2072 | :root .wrapper_d880dc:not(.video_d880dc) .tile_dc5fc4 .buttonColor_d4af21 { 2073 | background-color: var(--main-color); 2074 | } 2075 | :root .wrapper_d880dc:not(.video_d880dc) .videoWrapper_ba4b17 { 2076 | background: var(--background-primary); 2077 | } 2078 | :root .wrapper_d880dc:not(.video_d880dc) .border_db83a2.speaking_db83a2 { 2079 | box-shadow: inset 0 0 0 2.5px #43b581, inset 0 0 0 6px var(--background-secondary); 2080 | } 2081 | :root .wrapper_d880dc:not(.video_d880dc) .colorable_ef18ee.primaryDark_ef18ee, 2082 | :root .wrapper_d880dc:not(.video_d880dc) .leftTrayIcon_d880dc { 2083 | background: var(--background-primary); 2084 | } 2085 | :root .wrapper_d880dc:not(.video_d880dc) .wrapper_b6e2f9 > .controlButton_b6e2f9 > svg > foreignObject { 2086 | mask: none; 2087 | } 2088 | :root .quickSelectPopout_abbf45 { 2089 | background: var(--background-primary); 2090 | } 2091 | :root .applicationStore_cecc86 .container_fc4f04 { 2092 | width: calc(100% - 240px); 2093 | position: absolute; 2094 | top: 0; 2095 | background: linear-gradient(180deg, var(--background-primary), transparent); 2096 | z-index: 1; 2097 | } 2098 | :root .userPanelOuter_c69a7b .scrollerBase_eed6a8 { 2099 | overflow: unset !important; 2100 | } 2101 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 { 2102 | overflow: visible; 2103 | min-height: 180px !important; 2104 | contain: unset; 2105 | max-width: 340px; 2106 | } 2107 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 .banner_d5fdb1 { 2108 | position: absolute; 2109 | height: 200px; 2110 | -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0.7607843137), rgba(0, 0, 0, 0.7607843137)); 2111 | clip-path: polygon(0 0, 100% 0, 100% calc(100% - 25px), 50% 100%, 0 calc(100% - 25px)); 2112 | } 2113 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2[viewBox="0 0 340 60"] > foreignObject { 2114 | transform: translateY(-60px); 2115 | } 2116 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2[viewBox="0 0 340 120"] > foreignObject { 2117 | transform: translateY(-30px); 2118 | } 2119 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2[viewBox="0 0 340 90"] > foreignObject { 2120 | transform: translateY(-45px); 2121 | } 2122 | :root .userPanelOuter_c69a7b .bannerSVGWrapper_b32cc2 > foreignObject { 2123 | mask: none; 2124 | } 2125 | :root .userPanelOuter_c69a7b .divider_ae36e5 { 2126 | display: none; 2127 | } 2128 | :root .userPanelOuter_c69a7b .badgelistGroup_ab525a { 2129 | min-height: 10px; 2130 | } 2131 | :root .userPanelOuter_c69a7b .badgeList_ab525a { 2132 | position: absolute; 2133 | top: 160px; 2134 | left: 0; 2135 | width: 340px; 2136 | height: unset; 2137 | max-width: unset; 2138 | padding: 0; 2139 | justify-content: center; 2140 | background-color: transparent; 2141 | } 2142 | :root .userPanelOuter_c69a7b .section_d7a21f { 2143 | padding-top: 0; 2144 | padding-bottom: 12px; 2145 | } 2146 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) { 2147 | position: static; 2148 | } 2149 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f .userText_c9ccf6 { 2150 | position: absolute; 2151 | top: 110px; 2152 | left: 0; 2153 | width: 340px; 2154 | box-sizing: border-box; 2155 | text-align: center; 2156 | } 2157 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .section_d7a21f .userText_c9ccf6 .discrimBase_c9ccf6 { 2158 | color: white; 2159 | } 2160 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .pronouns_c9ccf6 { 2161 | position: relative; 2162 | margin-top: 8px; 2163 | } 2164 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .scroller_d2b491::-webkit-scrollbar { 2165 | display: none; 2166 | } 2167 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e { 2168 | z-index: 1; 2169 | } 2170 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .assetsLargeImageSpotify_c1d9fd { 2171 | border-radius: 8px !important; 2172 | margin-left: 6px; 2173 | } 2174 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .null { 2175 | margin-right: 8px; 2176 | } 2177 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .button_da7790 { 2178 | background-color: var(--main-color); 2179 | opacity: 1; 2180 | } 2181 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .platformIcon_c1d9fd { 2182 | display: none; 2183 | } 2184 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .timeBarUserPopoutV2_c1d9fd { 2185 | position: absolute; 2186 | top: 7px; 2187 | left: 0; 2188 | z-index: -1; 2189 | width: 100%; 2190 | height: 70px; 2191 | border-radius: 8px; 2192 | } 2193 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .timeBarUserPopoutV2_c1d9fd .bar_ec2fa7 { 2194 | border-radius: 8px; 2195 | height: 100%; 2196 | } 2197 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .timeBarUserPopoutV2_c1d9fd .barInner_ec2fa7 { 2198 | border-radius: 8px 0 0 8px; 2199 | opacity: 0.2; 2200 | } 2201 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .activity__20c1e .timeBarUserPopoutV2_c1d9fd > :last-child { 2202 | display: none; 2203 | } 2204 | :root .userPanelOuter_c69a7b .userPanelOverlayBackground_a2b6ae:nth-child(2) .input-2g-os5 { 2205 | background-color: transparent !important; 2206 | } 2207 | :root .userPanelOuter_c69a7b.userProfileOuterThemed_c69a7b .usernameSection_d2b491 { 2208 | left: 4px; 2209 | } 2210 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 { 2211 | top: 15px !important; 2212 | left: calc(50% - 40px); 2213 | } 2214 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 { 2215 | top: 0; 2216 | left: 0; 2217 | border-radius: calc(var(--avatar-radius) * 2) !important; 2218 | } 2219 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 foreignObject { 2220 | mask: none !important; 2221 | } 2222 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 foreignObject .avatarHintInner_f89da9 { 2223 | font-size: 0; 2224 | text-transform: none; 2225 | } 2226 | :root .userPanelOuter_c69a7b .avatarWrapper_f89da9 .avatarHint_f89da9 foreignObject .avatarHintInner_f89da9::after { 2227 | white-space: normal; 2228 | text-align: center; 2229 | content: var(--avatar-hint-text); 2230 | color: var(--avatar-hint-color); 2231 | font-size: var(--avatar-hint-size); 2232 | font-family: var(--avatar-hint-font); 2233 | } 2234 | :root .userPanelOuter_c69a7b .mask_c51b4e foreignObject { 2235 | border-radius: calc(var(--avatar-radius) * 2) !important; 2236 | } 2237 | :root .userPanelOuter_c69a7b .mask_c51b4e circle, 2238 | :root .userPanelOuter_c69a7b .mask_c51b4e rect[fill=black] { 2239 | display: none; 2240 | } 2241 | 2242 | body { 2243 | background: transparent; 2244 | } 2245 | 2246 | .withFrame_a934d8 { 2247 | background: var(--background-tertiary); 2248 | padding: 8px 16px; 2249 | height: 24px; 2250 | margin-top: unset; 2251 | position: relative; 2252 | left: 90px; 2253 | width: calc(100% - 122px); 2254 | z-index: 1; 2255 | pointer-events: none; 2256 | } 2257 | .withFrame_a934d8 .wordmark_a934d8 { 2258 | top: unset; 2259 | left: 16px; 2260 | color: transparent; 2261 | } 2262 | .withFrame_a934d8 .winButton_a934d8 { 2263 | color: var(--textcolor); 2264 | top: -8px; 2265 | right: -16px; 2266 | height: 40px; 2267 | width: 56px; 2268 | } 2269 | .withFrame_a934d8 .winButtonClose_a934d8 + .winButtonMinMax_a934d8::before { 2270 | content: ""; 2271 | position: absolute; 2272 | top: 10px; 2273 | left: 18px; 2274 | width: 18px; 2275 | height: 18px; 2276 | background: url("https://cdn.discordapp.com/attachments/539180316447997974/713920529622630411/aaaaaaaaa.svg") no-repeat; 2277 | background-size: contain; 2278 | opacity: 0; 2279 | } 2280 | 2281 | .theme-light .winButtonClose_a934d8 + .winButtonMinMax_a934d8::before { 2282 | background-image: url("https://cdn.discordapp.com/attachments/539180316447997974/713920227582279810/aaaaaaaaa.svg"); 2283 | } 2284 | 2285 | body.maximized .winButtonClose_a934d8 + .winButtonMinMax_a934d8 svg { 2286 | opacity: 0; 2287 | } 2288 | body.maximized .winButtonClose_a934d8 + .winButtonMinMax_a934d8::before { 2289 | opacity: 1; 2290 | } 2291 | 2292 | .platform-win .chat_a7d72e .wrapper_d880dc:not(.minimum_d880dc) .search_ff5f90 { 2293 | top: 50px; 2294 | } 2295 | .platform-win .appMount_ea7e65 .app_bd26cc .scroller_fea3ef { 2296 | padding-top: 20px; 2297 | } 2298 | .platform-win .appMount_ea7e65 .app_bd26cc .content_a4d4d9::after { 2299 | content: ""; 2300 | position: absolute; 2301 | top: -5px; 2302 | left: -5px; 2303 | z-index: 2; 2304 | width: 30px; 2305 | height: 30px; 2306 | border: solid var(--background-tertiary); 2307 | border-width: 5px 0 0 5px; 2308 | border-radius: 15px 0 0 0; 2309 | box-sizing: border-box; 2310 | } 2311 | .platform-win .layers_a01fb1, 2312 | .platform-win .layers_d4b6c5, 2313 | .platform-win .layers_a01fb1 > .layer_d4b6c5, 2314 | .platform-win .container_a4d4d9 { 2315 | overflow: visible; 2316 | } 2317 | .platform-win .recentMentionsPopout_ddb5b4, 2318 | .platform-win .root_fccaa9 { 2319 | top: 40px; 2320 | } 2321 | 2322 | html:not(.platform-linux) body:not(.maximized).transparent .appMount_ea7e65 { 2323 | overflow: hidden; 2324 | border-radius: 8px; 2325 | box-shadow: 0 0 10px 0 var(--background-tertiary); 2326 | top: 10px; 2327 | left: 10px; 2328 | width: calc(100% - 20px); 2329 | height: calc(100% - 20px); 2330 | transform: translateZ(0); 2331 | } 2332 | 2333 | .platform-osx .typeMacOS_a934d8 { 2334 | width: 90px; 2335 | } 2336 | .platform-osx .typeMacOS_a934d8 .macButtons_a934d8 { 2337 | width: 90px; 2338 | padding: 10px 20px 10px 20px; 2339 | } 2340 | .platform-osx .unreadMentionsIndicatorTop_fea3ef { 2341 | top: 20px; 2342 | } 2343 | .platform-osx .unreadMentionsIndicatorTop_fea3ef .mention_edf32f { 2344 | background: transparent; 2345 | } 2346 | .platform-osx .guilds_a4d4d9 { 2347 | margin: 0; 2348 | } 2349 | .platform-osx .guilds_a4d4d9 .scroller_fea3ef { 2350 | padding-top: 40px; 2351 | } 2352 | .platform-osx .guilds_a4d4d9::after { 2353 | content: ""; 2354 | position: absolute; 2355 | width: 100%; 2356 | height: 32px; 2357 | top: 0; 2358 | left: 0; 2359 | background: linear-gradient(180deg, var(--background-tertiary), transparent); 2360 | } 2361 | 2362 | :root *::-webkit-scrollbar { 2363 | width: 8px; 2364 | } 2365 | :root *::-webkit-scrollbar-thumb { 2366 | background: var(--background-secondary); 2367 | border-radius: 20px; 2368 | } 2369 | :root *::-webkit-scrollbar-track-piece { 2370 | display: none; 2371 | } 2372 | :root .info_c5a741 [class^="text-xs/normal_dc00ef"]:last-child::after { 2373 | content: "\a Couve v" var(--version); 2374 | text-transform: none; 2375 | white-space: pre; 2376 | } 2377 | :root .categoryItem_c72b37 { 2378 | margin: 3px 0 3px 8px; 2379 | } 2380 | :root .categoryItem_c72b37.selectedCategoryItem_c72b37 .itemInner_c72b37 { 2381 | background: var(--epicshadow1); 2382 | } 2383 | :root .pageWrapper_a3a4ce { 2384 | background: var(--background-primary); 2385 | } 2386 | :root .pageWrapper_a3a4ce .search-25t1e9 .searchBox-31Zv9h { 2387 | background: var(--background-secondary); 2388 | } 2389 | :root .pageWrapper_a3a4ce .search-25t1e9 .searchBox-31Zv9h .input_f8bc55 { 2390 | color: white; 2391 | } 2392 | :root .pageWrapper_a3a4ce .search-25t1e9 .searchBox-31Zv9h .searchIcon-3X4BYL { 2393 | margin-left: 8px; 2394 | } 2395 | :root .pageWrapper_a3a4ce .card_e90879, 2396 | :root .pageWrapper_a3a4ce .iconMask_e90879 { 2397 | background-color: var(--card); 2398 | } 2399 | :root .pageWrapper_a3a4ce .card_e90879:hover, :root .pageWrapper_a3a4ce .card_e90879:hover .iconMask_e90879, 2400 | :root .pageWrapper_a3a4ce .iconMask_e90879:hover, 2401 | :root .pageWrapper_a3a4ce .iconMask_e90879:hover .iconMask_e90879 { 2402 | background: var(--background-secondary); 2403 | } 2404 | :root .root_fccaa9 { 2405 | top: 40px; 2406 | left: 330px; 2407 | contain: unset; 2408 | } 2409 | :root .root_fccaa9 .perksModal-CLcR1c { 2410 | background-color: var(--background-primary); 2411 | } 2412 | :root .root_fccaa9 .perksModal-CLcR1c .ctaBar-Nhk8yY { 2413 | background: var(--background-secondary); 2414 | border-radius: 10px; 2415 | } 2416 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 { 2417 | z-index: 1; 2418 | } 2419 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 .bar-1g-wqp { 2420 | border-radius: 0; 2421 | } 2422 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 .tierMarkerBackground-G8FoN4 { 2423 | z-index: -10; 2424 | } 2425 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 .tierMarkerBackground-G8FoN4, 2426 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 .barBackground-unEPDT { 2427 | background: var(--background-secondary-alt-alt); 2428 | } 2429 | :root .root_fccaa9 .perksModal-CLcR1c .progressBar-20NUv9 .tierMarkerInProgress-2Tdxjz { 2430 | background: var(--background-primary) !important; 2431 | } 2432 | :root .root_fccaa9 .perksModal-CLcR1c .carouselContainerVisible-bGCrdY { 2433 | left: -15%; 2434 | } 2435 | :root .root_fccaa9 .perksModal-CLcR1c .carouselContainerVisible-bGCrdY .tierHeaderUnlocked-1IvR2R { 2436 | background: #b377f3; 2437 | } 2438 | :root .root_fccaa9 .perksModal-CLcR1c .carouselContainerVisible-bGCrdY .tierHeaderUnlocked-1IvR2R .tierUnlocked-1yG5Ic { 2439 | background: rgba(0, 0, 0, 0.4); 2440 | color: #fff; 2441 | } 2442 | :root .root_fccaa9 .perksModal-CLcR1c .carouselContainerVisible-bGCrdY .tierHeaderLocked-3ItHYn { 2443 | background: var(--background-secondary-alt-alt); 2444 | } 2445 | :root .root_fccaa9 .perksModal-CLcR1c .carouselContainerVisible-bGCrdY .tierBody-3ju-rc { 2446 | background: var(--background-secondary); 2447 | } 2448 | :root .root_fccaa9 .perksModal-CLcR1c .perk-19D_HN { 2449 | background: var(--background-secondary); 2450 | } 2451 | :root .root_fccaa9 .closeWrapper-1aVqeP { 2452 | padding-top: 72px; 2453 | } 2454 | :root .root_fccaa9 .closeWrapper-1aVqeP .closeButton_df5532:active { 2455 | transform: none; 2456 | } 2457 | :root .root_fccaa9 .closeWrapper-1aVqeP .closeButton_df5532::before { 2458 | content: ""; 2459 | position: fixed; 2460 | top: 0; 2461 | left: -330px; 2462 | width: 330px; 2463 | height: 100%; 2464 | z-index: 100; 2465 | } 2466 | :root .role_f9575e, 2467 | :root .sidebar_e87574 .list_e87574 .item_a0, 2468 | :root .container_ac201b .item_eef3ef, 2469 | :root .roleRow-3HnunM { 2470 | position: relative; 2471 | overflow: hidden; 2472 | height: unset; 2473 | z-index: 1; 2474 | border: none; 2475 | padding: 5px; 2476 | border-radius: 20px; 2477 | margin-right: 4px; 2478 | margin-left: 0; 2479 | } 2480 | :root .role_f9575e .roleCircle_a26d7b::before, 2481 | :root .sidebar_e87574 .list_e87574 .item_a0 .roleCircle_a26d7b::before, 2482 | :root .container_ac201b .item_eef3ef .roleCircle_a26d7b::before, 2483 | :root .roleRow-3HnunM .roleCircle_a26d7b::before { 2484 | content: ""; 2485 | position: absolute; 2486 | top: 0; 2487 | left: 0; 2488 | width: 100%; 2489 | height: 100%; 2490 | background: inherit; 2491 | opacity: 0.2; 2492 | z-index: -1; 2493 | pointer-events: none; 2494 | } 2495 | :root .roleRemoveButton_f9575e { 2496 | position: unset; 2497 | } 2498 | :root .roleRemoveButton_f9575e .roleRemoveIcon_e4010c { 2499 | left: 15px; 2500 | } 2501 | :root .container_ac201b { 2502 | border: none; 2503 | } 2504 | :root .container_ac201b .item_eef3ef { 2505 | margin-right: 5px; 2506 | } 2507 | :root .container_ac201b .container_c18ec9 { 2508 | border-radius: 8px; 2509 | } 2510 | :root .sidebar_e87574 { 2511 | border: none; 2512 | } 2513 | :root .sidebar_e87574 .list_e87574 { 2514 | padding-left: 16px; 2515 | } 2516 | :root .sidebar_e87574 .list_e87574 .item_a0 { 2517 | padding: 6px 10px; 2518 | margin-bottom: 6px; 2519 | border-radius: 25px; 2520 | } 2521 | :root #user-context-roles + .layer_cd0de5 .item_d90b3d { 2522 | flex-direction: row-reverse; 2523 | } 2524 | :root #user-context-roles + .layer_cd0de5 .item_d90b3d .iconContainer-1-SsTR { 2525 | margin: 0 8px 0 0; 2526 | } 2527 | :root #user-context-roles + .layer_cd0de5 .item_d90b3d .roleRow-3HnunM { 2528 | border-radius: 25px; 2529 | } 2530 | :root #user-context-roles + .layer_cd0de5 .item_d90b3d .roleRow-3HnunM .roleDot-2gCDg5 { 2531 | filter: none; 2532 | margin-right: 4px; 2533 | } 2534 | :root .root_f9a4c9, 2535 | :root .modal_c97cbd { 2536 | background: var(--background-primary); 2537 | box-shadow: unset; 2538 | border-radius: 10px; 2539 | } 2540 | :root .root_f9a4c9::-webkit-scrollbar, 2541 | :root .modal_c97cbd::-webkit-scrollbar { 2542 | display: none; 2543 | } 2544 | :root .root_f9a4c9 form, 2545 | :root .modal_c97cbd form { 2546 | display: flex; 2547 | flex-direction: column; 2548 | } 2549 | :root .root_f9a4c9.small_f9a4c9, 2550 | :root .modal_c97cbd.small_f9a4c9 { 2551 | min-height: unset; 2552 | } 2553 | :root .root_f9a4c9 .header_f9a4c9, 2554 | :root .modal_c97cbd .header_f9a4c9 { 2555 | text-align: center; 2556 | } 2557 | :root .root_f9a4c9 .separator_f9a4c9, 2558 | :root .modal_c97cbd .separator_f9a4c9 { 2559 | box-shadow: none; 2560 | } 2561 | :root .root_f9a4c9 .footer_f9a4c9, 2562 | :root .modal_c97cbd .footer_f9a4c9 { 2563 | padding: 0; 2564 | text-align: center; 2565 | background: transparent; 2566 | box-shadow: none; 2567 | min-height: 45px; 2568 | overflow: hidden; 2569 | border-radius: 0 0 10px 10px; 2570 | } 2571 | :root .root_f9a4c9 .footer_f9a4c9 button, 2572 | :root .modal_c97cbd .footer_f9a4c9 button { 2573 | flex-grow: 1; 2574 | margin: 0; 2575 | padding: 2px 16px; 2576 | box-shadow: none !important; 2577 | border-radius: 0; 2578 | min-height: 45px; 2579 | } 2580 | :root .root_f9a4c9 .footer_f9a4c9 .lookLink-15mFoz, 2581 | :root .modal_c97cbd .footer_f9a4c9 .lookLink-15mFoz { 2582 | background: rgba(255, 255, 255, 0.0666666667); 2583 | } 2584 | :root .root_f9a4c9 .footer_f9a4c9 > *, 2585 | :root .modal_c97cbd .footer_f9a4c9 > * { 2586 | width: 100%; 2587 | margin: 0; 2588 | } 2589 | :root .root_f9a4c9 .footer_f9a4c9 .cancelButton-kOgwem, 2590 | :root .root_f9a4c9 .footer_f9a4c9 .cancel-1Ph_Z1, 2591 | :root .modal_c97cbd .footer_f9a4c9 .cancelButton-kOgwem, 2592 | :root .modal_c97cbd .footer_f9a4c9 .cancel-1Ph_Z1 { 2593 | margin-right: 0; 2594 | } 2595 | :root .root_f9a4c9 .footer_f9a4c9 .minorContainer_acae5d, 2596 | :root .modal_c97cbd .footer_f9a4c9 .minorContainer_acae5d { 2597 | order: -1; 2598 | margin-bottom: 16px; 2599 | } 2600 | :root .root_f9a4c9 .qualitySettingsContainer-30AsSH, 2601 | :root .modal_c97cbd .qualitySettingsContainer-30AsSH { 2602 | border: none; 2603 | padding: 0; 2604 | } 2605 | :root .root_f9a4c9 .card-1SdQ2-, 2606 | :root .root_f9a4c9 .item-2OyinQ, 2607 | :root .modal_c97cbd .card-1SdQ2-, 2608 | :root .modal_c97cbd .item-2OyinQ { 2609 | border: none; 2610 | background: var(--background-secondary); 2611 | } 2612 | :root .root_f9a4c9 .changeButton-3QdaoH, 2613 | :root .modal_c97cbd .changeButton-3QdaoH { 2614 | border-radius: 3px; 2615 | } 2616 | :root .root_f9a4c9 .art-2OaYX0 + form > :nth-child(3) > :last-child, 2617 | :root .root_f9a4c9 .changeButton-3QdaoH, 2618 | :root .modal_c97cbd .art-2OaYX0 + form > :nth-child(3) > :last-child, 2619 | :root .modal_c97cbd .changeButton-3QdaoH { 2620 | background: rgba(255, 255, 255, 0.0666666667) !important; 2621 | } 2622 | :root .root_f9a4c9 .selectorButtonSelected-3Z0WNU, 2623 | :root .modal_c97cbd .selectorButtonSelected-3Z0WNU { 2624 | background: var(--main-color); 2625 | } 2626 | :root .root_f9a4c9 .primaryActions_ffaecb, 2627 | :root .modal_c97cbd .primaryActions_ffaecb { 2628 | flex-grow: 1; 2629 | } 2630 | :root .root_f9a4c9 .primaryActions_ffaecb .shinyButton_d5e126, 2631 | :root .modal_c97cbd .primaryActions_ffaecb .shinyButton_d5e126 { 2632 | width: 100%; 2633 | height: 100%; 2634 | border-radius: 0; 2635 | } 2636 | :root .root_f9a4c9.carouselModal-1eUFoq, 2637 | :root .modal_c97cbd.carouselModal-1eUFoq { 2638 | background: none; 2639 | } 2640 | :root .popout-1KHNAq { 2641 | border: none; 2642 | } 2643 | :root .popout-1KHNAq .option-2eIyOn { 2644 | background: var(--background-secondary); 2645 | } 2646 | :root .button_dd4f85 { 2647 | border-radius: 8px; 2648 | transition: box-shadow 200ms; 2649 | } 2650 | :root .lookFilled_dd4f85.colorBrand_dd4f85, 2651 | :root .lookFilled_dd4f85.colorBrand_dd4f85:hover { 2652 | background: var(--main-color) !important; 2653 | } 2654 | :root .item-2idW98[style*=background-color] { 2655 | background: var(--main-color) !important; 2656 | } 2657 | :root .checked_cebd1c { 2658 | border: none; 2659 | } 2660 | :root .checkbox-f1HnKB { 2661 | border-radius: 50%; 2662 | } 2663 | :root .bar_c7a159 { 2664 | background: var(--background-secondary-alt-alt); 2665 | } 2666 | :root .bar_c7a159 .barFill_c7a159 { 2667 | background: var(--main-color); 2668 | } 2669 | :root .grabber_c7a159 { 2670 | border: none; 2671 | background: transparent !important; 2672 | box-shadow: none; 2673 | } 2674 | :root .cardPrimary_a298b8, 2675 | :root .cardPrimaryEditable-2mz_3i, 2676 | :root .cardPrimaryOutline-1ofwVz { 2677 | border: none; 2678 | background: var(--background-secondary); 2679 | border-radius: 10px; 2680 | } 2681 | :root .card_ea2a21::before { 2682 | background-color: var(--background-secondary); 2683 | border: none; 2684 | } 2685 | :root .default_a467ac { 2686 | background-color: var(--background-secondary); 2687 | } 2688 | :root .input_f8bc55 { 2689 | border: none; 2690 | border-radius: 8px; 2691 | transition: background 0.4s; 2692 | } 2693 | :root .select_f6639d, 2694 | :root .item_eb92a8 { 2695 | border: none; 2696 | border-radius: 8px; 2697 | } 2698 | :root .popout_f6639d { 2699 | border: none; 2700 | border-radius: 8px; 2701 | margin-top: 5px; 2702 | } 2703 | :root .popout_f6639d.popoutPositionTop_f6639d { 2704 | margin-bottom: 5px; 2705 | } 2706 | :root .popout_f6639d::-webkit-scrollbar { 2707 | display: none; 2708 | } 2709 | :root .input_cebd1c, 2710 | :root .container_cebd1c { 2711 | border-radius: 8px; 2712 | } 2713 | :root .input_cebd1c rect, 2714 | :root .container_cebd1c rect { 2715 | rx: 8px; 2716 | } 2717 | :root .option_f6639d:hover { 2718 | background: rgba(255, 255, 255, 0.05) !important; 2719 | } 2720 | :root .option_f6639d:hover { 2721 | background: rgba(255, 255, 255, 0.05) !important; 2722 | } 2723 | :root .styleFixed-2_NfVL { 2724 | background: var(--background-primary); 2725 | box-shadow: unset; 2726 | } 2727 | :root .styleFlexible-x0_sIC, 2728 | :root .submenu_d90b3d { 2729 | overflow: hidden; 2730 | background: var(--background-secondary-alt); 2731 | box-shadow: unset; 2732 | } 2733 | :root .submenuPaddingContainer_d90b3d { 2734 | margin-left: -8px; 2735 | margin-right: -8px; 2736 | } 2737 | :root .button_a24e84, 2738 | :root .button_a24e84:hover { 2739 | background: var(--background-primary); 2740 | } 2741 | :root .item_d90b3d { 2742 | margin: 0; 2743 | padding: 8px 16px; 2744 | border-radius: 0; 2745 | transition: background 200ms; 2746 | } 2747 | :root .item_d90b3d:hover, :root .item_d90b3d.focused_d90b3d, :root .item_d90b3d:active:not(.hideInteraction_d90b3d) { 2748 | background-color: rgba(255, 255, 255, 0.05); 2749 | } 2750 | :root .accountProfilePopoutWrapper_b2ca13 { 2751 | position: fixed; 2752 | top: 0; 2753 | left: 0; 2754 | height: 100%; 2755 | } 2756 | :root .accountProfilePopoutWrapper_b2ca13 > div, :root .accountProfilePopoutWrapper_b2ca13 .userProfileInner_c69a7b { 2757 | height: 100%; 2758 | max-height: unset; 2759 | } 2760 | :root .accountProfilePopoutWrapper_b2ca13 .popoutContainer_ad5fac { 2761 | display: block; 2762 | height: 100%; 2763 | } 2764 | :root .accountProfilePopoutWrapper_b2ca13 .popoutContainer_ad5fac > div { 2765 | height: 100%; 2766 | } 2767 | :root .accountProfilePopoutWrapper_b2ca13 .container__0ec3c { 2768 | background: var(--background-tertiary); 2769 | } 2770 | :root .accountProfilePopoutWrapper_b2ca13 .container__0ec3c > .ctaContainer__95bd7 { 2771 | background-color: transparent; 2772 | } 2773 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b { 2774 | width: 330px; 2775 | height: 100%; 2776 | max-height: unset; 2777 | animation: sidebarStatusTransalteX 0.5s ease, fade 0.4s ease; 2778 | border-radius: 0; 2779 | background: var(--background-tertiary); 2780 | margin-right: 0; 2781 | padding: 0; 2782 | } 2783 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .userPopoutInner_c69a7b { 2784 | max-height: unset; 2785 | } 2786 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .userPopoutInner_c69a7b::before { 2787 | width: 100% !important; 2788 | height: 100% !important; 2789 | } 2790 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .userProfileInnerThemedNonPremium_c69a7b { 2791 | background: transparent; 2792 | } 2793 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .header_b8cc6d { 2794 | min-height: 230px; 2795 | } 2796 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .avatarWrapper_f89da9 { 2797 | left: calc(50% - 35px); 2798 | } 2799 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .body_ad5fac { 2800 | position: static; 2801 | } 2802 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .addCustomStatusButtonBubble_d0a252 { 2803 | left: 340px; 2804 | --custom-status-bubble-background: var(--background-tertiary); 2805 | } 2806 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .menus_ad5fac .menuOverlay_ad5fac { 2807 | padding: 0; 2808 | } 2809 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .menus_ad5fac .menuOverlay_ad5fac .button_f9d37d { 2810 | height: unset; 2811 | border-radius: 0; 2812 | } 2813 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .menus_ad5fac .menuOverlay_ad5fac .button_f9d37d .menuItemInner_ad5fac { 2814 | padding: 16px; 2815 | } 2816 | :root .accountProfilePopoutWrapper_b2ca13 .userPopoutOuter_c69a7b .menus_ad5fac .menuOverlay_ad5fac .menuDivider_ad5fac { 2817 | display: none; 2818 | } 2819 | :root div[role=group]:not(.profileGroup-1yKk23) .item_d90b3d.colorDefault-CDqZdO.focused_d90b3d, :root div[role=group]:not(.profileGroup-1yKk23) .item_d90b3d.colorDefault-CDqZdO:hover:not(.hideInteraction_d90b3d) { 2820 | background: var(--epicshadow1); 2821 | } 2822 | :root::-webkit-scrollbar-thumb { 2823 | background: var(--epicshadow1); 2824 | } 2825 | :root.full-motion .animatorTop-3ltI52 { 2826 | transition: unset !important; 2827 | } 2828 | :root .scroller_d90b3d { 2829 | overflow-y: auto !important; 2830 | padding-left: 0; 2831 | } 2832 | :root .scroller_d90b3d::-webkit-scrollbar-thumb { 2833 | background: var(--epicshadow1); 2834 | } 2835 | :root .avatarWrapper_b2ca13 .avatarSpeaking_c51b4e { 2836 | border-radius: var(--avatar-radius); 2837 | } 2838 | :root .streamPreview_adbea6 { 2839 | background: var(--background-secondary); 2840 | width: 330px; 2841 | } 2842 | :root .streamPreview_adbea6 .previewContainer_adbea6 { 2843 | background: var(--background-secondary); 2844 | height: 200px; 2845 | } 2846 | :root .tooltip-14MtrL { 2847 | background: var(--background-secondary-alt); 2848 | } 2849 | :root .tooltipPointer_b6c360 { 2850 | border-top-color: var(--background-secondary-alt) !important; 2851 | } 2852 | :root .modal-atz_3z .header_f9a4c9 { 2853 | box-shadow: none; 2854 | } 2855 | :root .modal-atz_3z .container__33507 { 2856 | background-color: var(--background-secondary); 2857 | } 2858 | :root .modal-atz_3z .title-3hptVQ { 2859 | margin: 8px; 2860 | } 2861 | :root .modal-atz_3z .input-2g-os5 { 2862 | border-radius: 0; 2863 | } 2864 | :root .modal-atz_3z .inviteRowButton-3hcOhY { 2865 | width: fit-content; 2866 | border: none; 2867 | } 2868 | :root .modal-atz_3z > .footer-1hTRRZ > .content-3nJg0c .inviteBannerUpsell-1t_LYM { 2869 | order: 3; 2870 | margin-top: 0; 2871 | } 2872 | :root .modal-atz_3z > .footer-1hTRRZ > .content-3nJg0c .footerText-2QLGHU { 2873 | margin: 8px 8px 16px; 2874 | order: 2; 2875 | } 2876 | :root .modal-atz_3z > .footer-1hTRRZ > .content-3nJg0c .input_f8bc55 { 2877 | order: 4; 2878 | } 2879 | :root .modal-atz_3z > .footer-1hTRRZ > .content-3nJg0c .marginBottom8_f7730b { 2880 | margin: 8px; 2881 | order: 1; 2882 | } 2883 | :root .modal-atz_3z .content-3nJg0c:before, 2884 | :root .modal-atz_3z .title-3hptVQ { 2885 | display: none; 2886 | } 2887 | :root .container_a4d79f { 2888 | background-color: var(--background-primary); 2889 | border-radius: 8px; 2890 | --background-primary: #252a3e; 2891 | --background-secondary: #1e2337; 2892 | --background-secondary-alt-alt: #1b1d31; 2893 | --header-primary: #d0d0d0; 2894 | --header-secondary: #fff; 2895 | --text-normal: #dcddde; 2896 | --text-muted: #dcddde; 2897 | --interactive-normal: #fff9f9; 2898 | --primary-400: #fff; 2899 | } 2900 | :root .container_a4d79f .container_a47d49 { 2901 | border: none; 2902 | background-color: var(--background-modifier-hover); 2903 | } 2904 | :root .container_a4d79f .input_f8bc55, 2905 | :root .container_a4d79f .input_e8a9c7 { 2906 | background-color: var(--background-secondary); 2907 | } 2908 | :root .container_a4d79f .footer_f9a4c9 .button_dd4f85.lookBlank_dd4f85 { 2909 | color: var(--header-secondary); 2910 | } 2911 | :root .container_f1fd9c, 2912 | :root .background_e85cee, 2913 | :root .header_f1fd9c, 2914 | :root .emptyPage_c6b11b, 2915 | :root .scrollerContainer_c6b11b, 2916 | :root .container_c2efea, 2917 | :root .container_d20375, 2918 | :root .page_d20375, 2919 | :root .pageBody_c2efea { 2920 | background-color: var(--background-primary) !important; 2921 | } 2922 | :root .row_b53f4f, 2923 | :root .container__33507, 2924 | :root .channelRow_f04d06 { 2925 | background-color: var(--background-secondary); 2926 | } 2927 | :root .container_b6cd66 { 2928 | background-color: var(--background-tertiary) !important; 2929 | } 2930 | :root .inviteButton_d32e26 { 2931 | background-color: var(--main-color); 2932 | } 2933 | :root .mainTableContainer_e23072 { 2934 | background-color: var(--background-secondary); 2935 | } 2936 | :root .tableHeaderRow_e6d0a5:first-child:after { 2937 | box-shadow: none; 2938 | } 2939 | :root .checkbox_f6cde8 { 2940 | background-color: var(--background-primary); 2941 | border: none; 2942 | } 2943 | :root .contentWrapper_ed5743 { 2944 | background: var(--background-primary); 2945 | } 2946 | :root .keyboardShortcutsModal_ad95dc { 2947 | background: var(--background-primary); 2948 | } 2949 | :root .keyboardShortcutsModal_ad95dc .keybindShortcut-3zF1P9 span { 2950 | background: var(--main-color); 2951 | } 2952 | :root .container__13b2a { 2953 | border-radius: 12px; 2954 | overflow: hidden; 2955 | } 2956 | :root .container__13b2a .header-2C89wJ { 2957 | background-color: var(--background-tertiary); 2958 | } 2959 | :root .container__13b2a section { 2960 | background-color: var(--background-primary); 2961 | } 2962 | :root .pictureInPictureWindow_e0c856 { 2963 | z-index: 10000; 2964 | } 2965 | :root .pictureInPictureVideo_cadaa5 .container_fc4f04 { 2966 | width: 100%; 2967 | } 2968 | :root .content_a7d72e:before, 2969 | :root .divider_fc4f04, 2970 | :root .separator_d90b3d { 2971 | display: none; 2972 | } 2973 | :root .attachWrapper_f298d4, 2974 | :root .panel_bf1a22, 2975 | :root .peopleListItem_d51464, 2976 | :root .rowWrapper_f1629a + .rowWrapper_f1629a .row_f1629a, 2977 | :root .header_f1629a, 2978 | :root .headerCell_f1629a, 2979 | :root .containerBackground_ccd3df { 2980 | border: none; 2981 | } 2982 | :root .headerText_c1d9fd, 2983 | :root .bodyTitle-Y0qMQz, 2984 | :root .userInfoSectionHeader-CBvMDh, 2985 | :root .title-3hptVQ, 2986 | :root .contentTitle_bcc24e, 2987 | :root .header-3A13BX, 2988 | :root .calendarPicker_be05cd .react-datepicker__current-month, 2989 | :root :root .react-datepicker__day-name, 2990 | :root .subSectionHeader-1bsAit { 2991 | text-transform: unset; 2992 | } 2993 | :root .mask_c51b4e img { 2994 | border-radius: 0 !important; 2995 | } 2996 | :root .mask_c51b4e foreignObject { 2997 | mask: none !important; 2998 | border-radius: var(--avatar-radius) !important; 2999 | } 3000 | :root .pointerEvents_c51b4e { 3001 | mask: none !important; 3002 | rx: 30; 3003 | } 3004 | :root .pointerEvents_c51b4e[mask="url(#svg-mask-status-typing)"] { 3005 | rx: 6; 3006 | } 3007 | :root .pointerEvents_c51b4e[mask="url(#svg-mask-status-online-mobile)"] { 3008 | rx: 4; 3009 | } 3010 | :root .ready_e40c16 { 3011 | display: none; 3012 | } 3013 | :root .ready_e40c16 + .text_e40c16 { 3014 | top: 82px; 3015 | } 3016 | :root .ready_e40c16 + .text_e40c16::before { 3017 | content: ""; 3018 | position: absolute; 3019 | bottom: 100px; 3020 | left: 50px; 3021 | width: 200px; 3022 | height: 200px; 3023 | background: url("https://i.imgur.com/2XrlegJ.png") center/80% no-repeat; 3024 | animation: jump 1s infinite; 3025 | } 3026 | @keyframes jump { 3027 | 0% { 3028 | transform: translateY(0); 3029 | } 3030 | 20% { 3031 | transform: translateY(-25px); 3032 | } 3033 | 40% { 3034 | transform: translateY(0); 3035 | } 3036 | 60% { 3037 | transform: translateY(-12px); 3038 | } 3039 | 100% { 3040 | transform: translateY(0); 3041 | } 3042 | } 3043 | :root.full-motion .translate-PeW1wK { 3044 | transform: translateZ(0); 3045 | animation: zoom 0.3s ease, fade 0.3s ease; 3046 | } 3047 | @keyframes sidebarStatusTransalteX { 3048 | from { 3049 | transform: translateX(-15%); 3050 | } 3051 | to { 3052 | transform: none; 3053 | } 3054 | } 3055 | @keyframes sidebarStatusTransalteXReverse { 3056 | from { 3057 | transform: translateX(15%); 3058 | } 3059 | to { 3060 | transform: none; 3061 | } 3062 | } 3063 | @keyframes fade { 3064 | 0% { 3065 | opacity: 0; 3066 | } 3067 | 100% { 3068 | opacity: 1; 3069 | } 3070 | } 3071 | @keyframes zoom { 3072 | from { 3073 | transform: scale(1.05); 3074 | } 3075 | to { 3076 | transform: scale(1); 3077 | } 3078 | } 3079 | @keyframes callzoom { 3080 | from { 3081 | background: var(--background-primary); 3082 | margin: 0; 3083 | border-radius: 0; 3084 | opacity: 0; 3085 | } 3086 | to { 3087 | background: var(--background-secondary); 3088 | margin: 15px; 3089 | border-radius: 10px; 3090 | opacity: 1; 3091 | } 3092 | } 3093 | @keyframes blink { 3094 | 79% { 3095 | content: ">_<"; 3096 | } 3097 | 80% { 3098 | content: "-_-"; 3099 | } 3100 | 90% { 3101 | content: ">_<"; 3102 | } 3103 | 100% { 3104 | content: "-_-"; 3105 | } 3106 | } 3107 | 3108 | :root { 3109 | --brand-400: var(--main-color); 3110 | --brand-500: var(--main-color); 3111 | --text-brand: var(--main-color); 3112 | --control-brand-foreground: var(--main-color); 3113 | --card-secondary-bg: var(--background-secondary); 3114 | } 3115 | 3116 | :root .scale-3UGUBw.didRender-2SiRlm { 3117 | transform: scale(1) !important; 3118 | } 3119 | :root #status-picker.menu_d90b3d #status-picker-custom-status .labelContainer-2vJzYL { 3120 | padding: 0 16px; 3121 | } 3122 | :root #status-picker.menu_d90b3d #status-picker-custom-status + .layer_cd0de5 { 3123 | top: 432px !important; 3124 | left: 359px !important; 3125 | } 3126 | :root #status-picker.menu_d90b3d #status-picker-custom-status + .layer_cd0de5 .submenu-1apzyU { 3127 | background: var(--background-tertiary); 3128 | border-radius: 0 8px 8px 0; 3129 | } 3130 | :root .gameActivityToggleAdded-Yd-YxC > div:last-child button:first-child { 3131 | color: var(--main-color); 3132 | } 3133 | :root .activityPanel_a4d4d9 ~ .gameActivityToggleAdded-Yd-YxC > div:last-child button:first-child { 3134 | margin-right: 35px; 3135 | } 3136 | :root #MemberCount { 3137 | top: 48px; 3138 | } 3139 | :root #MemberCount .membersGroup_cbd271 { 3140 | margin-top: 0; 3141 | padding: 18px 8px 0 16px; 3142 | } 3143 | :root #MemberCount + .members_cbd271 { 3144 | margin-top: 0; 3145 | padding-top: 70px; 3146 | } 3147 | :root .mask_c51b4e > svg > mask > :not(:first-child) { 3148 | display: none; 3149 | } 3150 | :root .notice__5fd4c[id] { 3151 | margin: -30px 240px 0px 90px; 3152 | border-radius: 8px 8px 0 0 !important; 3153 | } 3154 | :root .notice__5fd4c[id] ~ .layers_d4b6c5 .sidebar_a4d4d9 { 3155 | border-radius: 0; 3156 | } 3157 | :root .ChannelDms-channelmembers-wrap { 3158 | width: 240px; 3159 | } 3160 | :root .ChannelDms-channelmembers-wrap .ChannelDms-channelmembers-header { 3161 | margin-top: -48px; 3162 | padding-top: 48px; 3163 | max-height: calc(100% + 48px); 3164 | background: var(--background-secondary); 3165 | border-bottom-width: 0px; 3166 | } 3167 | :root .ChannelDms-channelmembers-wrap .ChannelDms-channelmembers-header + div .membersWrap_cbd271 { 3168 | margin-top: 0; 3169 | max-height: unset; 3170 | } 3171 | :root .ChannelDms-channelmembers-wrap .ChannelDms-channelmembers-header + div .membersWrap_cbd271 .members_cbd271 { 3172 | padding-top: 0; 3173 | } 3174 | :root #channelTabs-container { 3175 | position: relative; 3176 | left: 80px; 3177 | width: calc(100% - 96px); 3178 | background-color: var(--background-tertiary); 3179 | } 3180 | :root #channelTabs-container ~ .layers_d4b6c5 .guilds_a4d4d9 { 3181 | margin-top: -85px; 3182 | } 3183 | :root ul[data-list-id=guildfoldersnav] { 3184 | margin-top: 12px; 3185 | } 3186 | :root .vc-addon-name-author { 3187 | white-space: nowrap; 3188 | overflow: hidden; 3189 | text-overflow: ellipsis; 3190 | } 3191 | -------------------------------------------------------------------------------- /betterdiscord/couve.theme.css: -------------------------------------------------------------------------------- 1 | /** 2 | * @name Couve 3 | * @author A user#8169, Nyria#3863 4 | * @description A new look to discord 5 | * @invite rtBQX5D3bD 6 | * @version 2.3.0 7 | */ 8 | 9 | @import url("https://nyri4.github.io/Couve/betterdiscord/app.css"); 10 | 11 | /* Settings */ 12 | :root { 13 | --version: "2.3.0"; 14 | 15 | /* Colors */ 16 | --main-color: #419e85; 17 | 18 | /* Borders */ 19 | --avatar-radius: 8px; 20 | } 21 | 22 | /* Dark/Light vars */ 23 | .theme-dark { 24 | /* BGs */ 25 | --background-primary: #252a3e; 26 | --background-secondary: #1e2337; 27 | --background-secondary-alt: #1c2438; 28 | --background-secondary-alt-alt: #1b1d31; 29 | --background-tertiary: #060c24; 30 | 31 | --deprecated-store-bg: var(--background-primary); 32 | --background-floating: var(--background-secondary); 33 | --background-mobile-primary: var(--background-primary); 34 | --activity-card-background: var(--background-secondary); 35 | --input-background: var(--background-secondary); 36 | --modal-background: var(--background-primary); 37 | 38 | --colortransparency: #0003; 39 | 40 | /* Cards */ 41 | --card: #212332; 42 | 43 | /* Other stuff */ 44 | --textcolor: #fff; 45 | --epicshadow1: #fff3; 46 | 47 | /* Font */ 48 | --font-display: var(--font-primary) !important; 49 | } 50 | 51 | .theme-light { 52 | /* BGs */ 53 | --background-primary: #fafafa; 54 | --background-secondary: #f7f7f7; 55 | --background-secondary-alt: #fff; 56 | --background-secondary-alt-alt: #eee; 57 | --background-tertiary: #fff; 58 | 59 | --deprecated-store-bg: var(--background-primary); 60 | --background-floating: var(--background-secondary); 61 | --background-mobile-primary: var(--background-primary); 62 | --activity-card-background: var(--background-secondary); 63 | --modal-background: var(--background-primary); 64 | 65 | --colortransparency: #0001; 66 | 67 | /* Cards */ 68 | --card: #aaaaaa; 69 | 70 | /* Other stuff */ 71 | --textcolor: #000; 72 | --epicshadow1: #0003; 73 | } 74 | -------------------------------------------------------------------------------- /stuff/_channel-bar.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Removing help buttons 3 | .toolbar_fc4f04 > :last-child[href="https://support.discord.com"], 4 | .searchLearnMore_b0286e { 5 | display: none; 6 | } 7 | 8 | // Top bar 9 | .container_fc4f04.title_a7d72e:not(.minimum_d880dc) { 10 | z-index: 1; 11 | background: transparent; 12 | width: calc(100% - 240px); 13 | 14 | .toolbar_fc4f04, 15 | .topic_bf3bbb { 16 | -webkit-app-region: no-drag; 17 | } 18 | .icon_fc4f04 { 19 | -webkit-app-region: unset; 20 | } 21 | .followButton_a7d72e, 22 | .children_fc4f04:after { 23 | display: none; 24 | } 25 | 26 | // Search bar 27 | .search_ff5f90 { 28 | position: fixed; 29 | right: 10px; 30 | 31 | .searchBar_a46bef { 32 | background: var(--background-primary); 33 | width: 200px; 34 | height: 28px; 35 | padding: 2px 10px; 36 | border-radius: 4px; 37 | 38 | .searchFilter_b0fa94, 39 | .searchAnswer_b0fa94 { 40 | background: transparent; 41 | } 42 | .icon_effbe2 { 43 | color: var(--main-color); 44 | } 45 | } 46 | } 47 | } 48 | 49 | // Search popout 50 | .container_eedf95 { 51 | background: var(--background-secondary-alt-alt); 52 | box-shadow: none; 53 | 54 | .resultsGroup_b0286e { 55 | // Options 56 | .option_b0286e { 57 | padding: 0 20px; 58 | margin: 0; 59 | border-radius: 0; 60 | 61 | &.selected-rZcOL-, 62 | &[aria-selected="true"] { 63 | background: var(--background-secondary); 64 | } 65 | &:after { 66 | display: none; 67 | } 68 | } 69 | } 70 | 71 | // Datepicker (yeah this exist) 72 | .calendarPicker_be05cd .react-datepicker { 73 | background: transparent; 74 | border-radius: 0; 75 | 76 | // Header 77 | .react-datepicker__header { 78 | background: transparent; 79 | 80 | .react-datepicker__current-month { 81 | border-bottom: none; 82 | } 83 | } 84 | 85 | &__navigation--next, 86 | &__navigation--previous { 87 | border: none; 88 | border-radius: 50%; 89 | 90 | &:hover { 91 | background-color: var(--epicshadow1); 92 | } 93 | } 94 | 95 | [class^="react-datepicker__day"] { 96 | background: transparent; 97 | } 98 | .react-datepicker__day { 99 | border-color: var(--background-tertiary); 100 | 101 | &--selected:after, 102 | &--selected:hover, 103 | &:hover { 104 | background: var(--main-color); 105 | } 106 | } 107 | } 108 | .datePickerHint_b0286e .hintValue_b0286e { 109 | background: var(--main-color); 110 | } 111 | } 112 | 113 | // Search results 114 | .searchResultsWrap_c2b47d { 115 | background: var(--background-secondary); 116 | top: -48px; 117 | padding-top: 48px; 118 | width: 480px; 119 | height: 100%; 120 | 121 | .searchHeader_b7c924 { 122 | position: absolute; 123 | width: 100%; 124 | background: linear-gradient( 125 | 180deg, 126 | var(--background-secondary), 127 | transparent 128 | ); 129 | } 130 | 131 | .scroller_c2b47d { 132 | padding: 0; 133 | padding-top: 48px; 134 | 135 | & > div { 136 | padding: 0 14px 0 20px; 137 | } 138 | 139 | .channelName-3w2Y3c { 140 | background: transparent; 141 | padding: 8px 0; 142 | } 143 | 144 | .searchResult_ddc613 { 145 | border: none; 146 | box-shadow: none; 147 | border-radius: 10px; 148 | } 149 | 150 | .pageButton_b48941 { 151 | background-color: var(--background-primary); 152 | 153 | &.activeButton_b48941 { 154 | background-color: var(--main-color); 155 | } 156 | } 157 | } 158 | } 159 | 160 | // Inbox 161 | .recentMentionsPopout_ddb5b4 { 162 | position: fixed; 163 | top: 0; 164 | right: 0; 165 | min-height: 100%; 166 | max-height: 100% !important; 167 | //animation: sidebarStatusTransalteXReverse 0.5s ease, fade 0.4s ease; 168 | border-radius: 0; 169 | background: var(--background-secondary); 170 | box-shadow: var(--elevation-high); 171 | 172 | // Header 173 | .header_ac90a2 { 174 | background-color: var(--background-tertiary); 175 | } 176 | 177 | .item_a0 { 178 | margin-bottom: 0 !important; 179 | 180 | &.brand_a0.selected_a0.item_a0, &.brand_a0.item_a0:active { 181 | border-bottom-color: var(--main-color) !important; 182 | } 183 | } 184 | 185 | // For you tab > Friend requests 186 | .row_fd8ff1 { 187 | background: var(--background-primary); 188 | margin: 12px; 189 | border-radius: 12px; 190 | } 191 | } 192 | 193 | // Pinned messages 194 | .messagesPopoutWrap_ac90a2:not(.recentMentionsPopout_ddb5b4) { 195 | position: fixed; 196 | top: 84px; 197 | left: 330px; 198 | width: calc(100% - 570px); 199 | max-height: calc(100% - 84px) !important; 200 | height: 100%; 201 | box-shadow: unset; 202 | background: var(--background-primary); 203 | border-radius: 0; 204 | 205 | .header_ac90a2 { 206 | background: var(--background-primary); 207 | text-align: center; 208 | box-shadow: none; 209 | } 210 | 211 | .messagesPopout_ac90a2 { 212 | padding: 12px 0 0 12px; 213 | 214 | .messageGroupWrapper_ac90a2 { 215 | padding: 8px; 216 | margin-bottom: 12px; 217 | border: none; 218 | background: var(--background-secondary); 219 | border-radius: 12px; 220 | } 221 | 222 | &::-webkit-scrollbar { 223 | width: 8px; 224 | margin-left: 5px; 225 | 226 | &-thumb { 227 | border: none; 228 | background: var(--background-secondary) !important; 229 | border-radius: 6px 0 0 6px; 230 | } 231 | 232 | &-track-piece { 233 | display: none; 234 | } 235 | } 236 | } 237 | } 238 | } -------------------------------------------------------------------------------- /stuff/_channel-list.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | 3 | // Server name 4 | .header_fd6364 { 5 | box-shadow: none; 6 | padding: 25px; 7 | border-radius: 8px; 8 | background: transparent !important; 9 | } 10 | 11 | // Discord weird way to make space between server name and channels 12 | #channels div[style="height: 12px;"], #channels div[style="height: 16px;"] { 13 | display: none; 14 | } 15 | 16 | // Channel notice 17 | .channelNotice-tO6Tus, 18 | .channelNotice-3DDmsB { 19 | box-shadow: none; 20 | width: 170px; 21 | background: transparent; 22 | margin: 15px; 23 | padding: 20px; 24 | background: var(--background-primary); 25 | border-radius: 10px; 26 | position: absolute; 27 | top: 0; 28 | z-index: 10; 29 | height: 60px; 30 | transition: height 400ms; 31 | 32 | &::before { 33 | content: "announcement"; 34 | position: absolute; 35 | top: 50%; 36 | left: 50%; 37 | transform: translateX(-50%) translateY(-50%); 38 | opacity: 1; 39 | color: var(--textcolor); 40 | z-index: 1; 41 | font-size: 24px; 42 | font-family: "Material Icons", sans-serif; 43 | transition: opacity 200ms; 44 | } 45 | 46 | .message-3KLVy1 { 47 | opacity: 0; 48 | pointer-events: none; 49 | transition: opacity 400ms; 50 | position: absolute; 51 | top: 50%; 52 | left: 50%; 53 | transform: translateY(-50%) translateX(-50%); 54 | width: 100%; 55 | margin-bottom: auto; 56 | 57 | .btn-38SvSS, 58 | .btn-38SvSS:hover { 59 | background: var(--background-secondary-alt-alt); 60 | margin: 0 auto; 61 | margin-top: 20px; 62 | z-index: 1; 63 | width: unset; 64 | } 65 | 66 | & > div { 67 | margin-bottom: auto; 68 | } 69 | } 70 | 71 | .message-39hdqk { 72 | opacity: 0; 73 | margin-top: 30px; 74 | pointer-events: none; 75 | width: calc(100% + 20px); 76 | transition: opacity 400ms; 77 | } 78 | 79 | .button_dd4f85 { 80 | background: var(--background-secondary-alt-alt); 81 | opacity: 0; 82 | pointer-events: none; 83 | transition: opacity 400ms; 84 | } 85 | 86 | &:hover { 87 | height: 160px; 88 | 89 | .message-3KLVy1, 90 | .message-39hdqk { 91 | pointer-events: all; 92 | opacity: 1; 93 | } 94 | &::before { 95 | opacity: 0; 96 | } 97 | .button_dd4f85 { 98 | opacity: 1; 99 | pointer-events: all; 100 | } 101 | } 102 | } 103 | 104 | // Categories 105 | .wrapper_a08117 { 106 | padding: 0 22px; 107 | } 108 | 109 | .container_a5ad5c { 110 | color: var(--textcolor); 111 | text-transform: unset; 112 | font-size: 14px; 113 | } 114 | 115 | // No arrows for categories 116 | .icon_a08117 { 117 | display: none; 118 | } 119 | 120 | // Channels 121 | .wrapper_d8bfb3 { 122 | height: 30px; 123 | margin: 0; 124 | 125 | .link_d8bfb3 { 126 | padding: 6px 20px; 127 | border-radius: 0; 128 | } 129 | } 130 | .unread_d8bfb3 { 131 | left: 0; 132 | } 133 | 134 | // Thread channels 135 | .typeThread_d8bfb3 .name_d8bfb3 { 136 | padding-left: 28px; 137 | } 138 | 139 | // New message bar 140 | .containerPadding_eba0ba { 141 | padding: 0; 142 | margin: 0 0 4px 0; 143 | 144 | .bar_eba0ba { 145 | padding: 8px; 146 | border-radius: 4px; 147 | background: var(--main-color); 148 | 149 | .barText_eba0ba, .unreadIcon_eba0ba { 150 | color: white !important; 151 | } 152 | } 153 | } 154 | 155 | // No scrollbars 156 | .scroller_c43953, 157 | .scroller_fea3ef, 158 | #channels { 159 | &::-webkit-scrollbar { 160 | display: none; 161 | } 162 | } 163 | 164 | // List of people on call channels 165 | .containerDefault_f6f816:has(.linkBottom_d8bfb3) .list_a478e5 { 166 | background-color: var(--background-primary); 167 | margin: 12px; 168 | padding: 0; 169 | border-radius: 12px; 170 | 171 | .draggable_ac3629, .voiceUser_d80634 { 172 | height: 40px; 173 | } 174 | 175 | .content_d80634 { 176 | padding-left: 2px; 177 | height: 100%; 178 | border-radius: 0; 179 | 180 | .avatar_d80634 { 181 | border-radius: var(--avatar-radius); 182 | } 183 | } 184 | 185 | // me when no overflow: hidden 186 | .draggable_ac3629:first-child .content_d80634 { 187 | border-radius: 12px 12px 0 0; 188 | } 189 | .draggable_ac3629:last-child .content_d80634 { 190 | border-radius: 0 0 12px 12px; 191 | } 192 | } 193 | } -------------------------------------------------------------------------------- /stuff/_chat.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Messages 3 | .messagesWrapper_e2e187 { 4 | flex-direction: column; 5 | 6 | .cozy_f9f2ca.wrapper_f9f2ca { 7 | padding-left: 50px; 8 | 9 | &.groupStart_d5deea .contents_f9f2ca::after { 10 | left: 48px; 11 | width: 30px; 12 | height: 30px; 13 | } 14 | 15 | // Avatar 16 | .avatar_f9f2ca { 17 | position: relative; 18 | left: -2px; 19 | width: 30px; 20 | height: 30px; 21 | border-radius: var(--avatar-radius); 22 | } 23 | 24 | .avatarDecoration_f9f2ca { 25 | left: 43px; 26 | width: 40px; 27 | height: 40px; 28 | } 29 | 30 | // Username 31 | .header_f9f2ca { 32 | left: 38px; 33 | margin-top: -30px; 34 | margin-bottom: 10px; 35 | width: 100%; 36 | } 37 | 38 | // Timestamps 39 | .timestamp_f9f2ca.alt_f9f2ca { 40 | position: absolute; 41 | font-size: 0.6875rem !important; 42 | right: 10px; 43 | left: unset; 44 | opacity: 0; 45 | } 46 | &:hover .timestamp_f9f2ca { 47 | opacity: 1; 48 | } 49 | 50 | // Pins 51 | .iconContainer_d76df7 { 52 | position: unset; 53 | width: unset; 54 | margin-right: 10px; 55 | } 56 | 57 | // Replied messages 58 | .repliedMessage_f9f2ca { 59 | margin-left: 48px; 60 | 61 | .replyAvatar_f9f2ca { 62 | border-radius: calc(var(--avatar-radius) - 3px); 63 | } 64 | } 65 | 66 | // Blockquotes 67 | .blockquoteContainer_f8f345 { 68 | .blockquoteDivider_f8f345 { 69 | display: none; 70 | } 71 | 72 | blockquote { 73 | padding: 12px; 74 | background: var(--background-secondary); 75 | border-radius: 4px; 76 | width: 100%; 77 | } 78 | } 79 | 80 | .shiki-container { 81 | background-color: transparent; 82 | 83 | .shiki-root { 84 | background-color: var(--background-secondary) !important; 85 | border-radius: 8px; 86 | overflow: hidden; 87 | } 88 | } 89 | 90 | // Threads 91 | &.hasThread_f9f2ca { 92 | &::after { 93 | top: 2.5rem; 94 | left: 3.5rem; 95 | } 96 | 97 | & > .contents_f9f2ca > [id^="message-content-"] { 98 | 99 | } 100 | 101 | .container_c15230 { 102 | margin-left: 48px; 103 | border-radius: 8px; 104 | } 105 | } 106 | } 107 | 108 | .scroller_e2e187::-webkit-scrollbar { 109 | display: none; 110 | } 111 | } 112 | 113 | // Message buttons 114 | .wrapper_f7e168 { 115 | border: none; 116 | box-shadow: none; 117 | background: var(--background-secondary); 118 | 119 | &:hover { 120 | box-shadow: none; 121 | } 122 | } 123 | 124 | // Bots tag 125 | .botTagRegular_a9e77f { 126 | border-radius: 5px; 127 | background: var(--main-color); 128 | } 129 | 130 | // botTagOP_e48ddb 131 | .botTagOP_e48ddb { 132 | color: white; 133 | } 134 | 135 | // Mentions 136 | .wrapper_d4fa29 { 137 | background: transparent !important; 138 | position: relative; 139 | color: var(--main-color) !important; 140 | 141 | &.mention { 142 | border-radius: 5px; 143 | } 144 | 145 | &:hover::after { 146 | opacity: 0.2; 147 | } 148 | 149 | &::after { 150 | content: ""; 151 | position: absolute; 152 | top: 0; 153 | left: 0; 154 | width: 100%; 155 | height: 100%; 156 | background-color: var(--main-color); 157 | opacity: 0.08; 158 | border-radius: 5px; 159 | transition: opacity 200ms; 160 | pointer-events: none; 161 | } 162 | } 163 | 164 | // New Messages 165 | .newMessagesBar_cf58b5 { 166 | position: static; 167 | margin: 5px 40px 0 40px; 168 | padding: 5px; 169 | background: var(--background-secondary); 170 | border-radius: 7px; 171 | opacity: 1; 172 | 173 | .barButtonMain_cf58b5 { 174 | opacity: 0.6; 175 | } 176 | .barButtonAlt_cf58b5 { 177 | display: none; 178 | } 179 | } 180 | 181 | // Mesage Dividers 182 | .divider_c2654d { 183 | margin: 0 56px; 184 | border: none; 185 | height: unset; 186 | background: transparent; 187 | 188 | &.isUnread_c2654d:not(.hasContent_c2654d) { 189 | margin: 10px 47px; 190 | margin-top: 5px !important; 191 | margin-bottom: 5px !important; 192 | } 193 | 194 | .content_c2654d, 195 | &#---new-messages-bar .unreadPill_c2654d { 196 | background: var(--background-secondary); 197 | width: 100%; 198 | padding: 10px; 199 | text-align: center; 200 | border-radius: 5px; 201 | height: unset; 202 | } 203 | 204 | .unreadPill_c2654d { 205 | position: relative; 206 | color: #f04747; 207 | top: 0; 208 | 209 | .unreadPillCap_c2654d { 210 | display: none; 211 | } 212 | } 213 | 214 | &#---new-messages-bar .content_c2654d { 215 | border-radius: 5px 0 0 5px; 216 | 217 | & + .unreadPill_c2654d { 218 | border-radius: 0 5px 5px 0; 219 | padding-top: 12px; 220 | padding-bottom: 12px; 221 | } 222 | } 223 | } 224 | 225 | // Jump to present 226 | .jumpToPresentBar_cf58b5 { 227 | bottom: 15px; 228 | left: unset; 229 | height: 40px; 230 | padding-bottom: 0; 231 | background: var(--background-secondary); 232 | border-radius: 8px; 233 | 234 | .barButtonAlt_cf58b5 { 235 | text-indent: -10000px; 236 | font-size: 0; 237 | padding: 0 6px; 238 | 239 | .barButtonIcon_cf58b5 { 240 | margin-left: 0; 241 | width: 28px; 242 | height: 28px; 243 | } 244 | } 245 | .barButtonMain_cf58b5 { 246 | display: none; 247 | } 248 | 249 | .spinner_cf58b5 { 250 | padding: 0 5px; 251 | } 252 | } 253 | 254 | // Emoji picker 255 | 256 | // Resizing 257 | .resizeHandle_af5dbb { 258 | &::before { 259 | content: ""; 260 | position: fixed; 261 | top: 0; 262 | left: 0; 263 | width: 100%; 264 | height: calc(100% + 36px); 265 | background: #0005; 266 | border-radius: 8px; 267 | opacity: 0; 268 | pointer-events: none; 269 | transition: opacity 0.3s; 270 | } 271 | 272 | &:active::before { 273 | opacity: 1; 274 | pointer-events: all; 275 | } 276 | } 277 | 278 | .navButtonActive_af5dbb { 279 | background: var(--background-primary); 280 | } 281 | 282 | #emoji-picker-tab-panel { 283 | border-radius: 8px 8px 0 0; 284 | 285 | .header_c6ee36 { 286 | box-shadow: none; 287 | } 288 | 289 | // Discord's capitalism 290 | .premiumPromo_ca9b56 { 291 | background: var(--background-secondary); 292 | opacity: 1; 293 | animation: 294 | fade 0.3s ease, 295 | zoom 0.3s ease; 296 | } 297 | 298 | &.wrapper_c6ee36 { 299 | margin-bottom: 8px; 300 | } 301 | 302 | .container_effbe2, 303 | .emojiItem_fbfedd.emojiItemSelected_fbfedd { 304 | background: var(--background-primary); 305 | } 306 | 307 | .imageLoading_b000dd { 308 | background-image: none !important; 309 | background-color: var(--background-primary); 310 | border-radius: 8px; 311 | } 312 | 313 | .inspector_c3120f { 314 | position: absolute; 315 | top: -50px; 316 | right: 0; 317 | padding: 0 8px; 318 | justify-content: end; 319 | width: unset; 320 | max-width: 220px; 321 | background: transparent; 322 | } 323 | 324 | .diversitySelectorOptions_cce80d { 325 | background: var(--background-primary); 326 | border: none; 327 | } 328 | 329 | &:not(.emojiPickerInExpressionPicker-2nOwH8) { 330 | .inspector_c3120f { 331 | position: absolute; 332 | top: unset; 333 | bottom: 0; 334 | right: 0; 335 | left: 48px; 336 | padding: 0 16px; 337 | max-width: unset; 338 | background: linear-gradient(transparent, var(--background-secondary)); 339 | } 340 | } 341 | 342 | .wrapper_dc0b29 { 343 | background: var(--background-secondary); 344 | 345 | .scroller_d53d65::-webkit-scrollbar { 346 | display: none; 347 | } 348 | } 349 | 350 | .badgeLabel_c3120f { 351 | display: none; 352 | } 353 | } 354 | 355 | .positionContainer_af5dbb { 356 | height: 414px; 357 | bottom: calc(100% - 8px); 358 | transform: translateZ(0); 359 | } 360 | 361 | // GIF 362 | .contentWrapper_af5dbb .header_b56bbc { 363 | box-shadow: none; 364 | 365 | .inner__999f6 { 366 | height: 34px; 367 | background: var(--background-primary); 368 | 369 | .iconLayout__67261 { 370 | width: 30px; 371 | height: 30px; 372 | } 373 | } 374 | } 375 | 376 | // Stickers 377 | #sticker-picker-tab-panel { 378 | .header_d8cdac { 379 | box-shadow: none; 380 | } 381 | 382 | & .container_effbe2 { 383 | background-color: var(--background-primary); 384 | } 385 | 386 | .wrapper_dc0b29 { 387 | background: var(--background-secondary); 388 | 389 | .scroller_d53d65::-webkit-scrollbar { 390 | display: none; 391 | } 392 | } 393 | } 394 | 395 | // -- Upload Modal -- 396 | .uploadModal_f82cc7 { 397 | background: var(--background-primary); 398 | box-shadow: unset; 399 | width: 1000px; 400 | height: 400px; 401 | border-radius: 15px; 402 | 403 | .inner_f82cc7 .comment_f82cc7, 404 | .inner_f82cc7 .file_f82cc7 .description_f82cc7 { 405 | margin-left: 55%; 406 | margin-right: 30px; 407 | } 408 | 409 | .inner_f82cc7 { 410 | .comment_f82cc7 .label_f82cc7 { 411 | text-transform: unset; 412 | font-size: 12px; 413 | opacity: 0.8; 414 | } 415 | 416 | .file_f82cc7 { 417 | height: 75px; 418 | 419 | .description_f82cc7 { 420 | margin-top: 15px; 421 | 422 | .filename_f82cc7 { 423 | font-weight: 550; 424 | } 425 | } 426 | 427 | .icon_f82cc7 { 428 | background-color: var(--background-secondary); 429 | background-size: 70px; 430 | 431 | &.video_f82cc7 { 432 | background-image: url(https://cdn.discordapp.com/attachments/539180316447997974/705623014334791720/videocam-white-18dp.svg); 433 | } 434 | &.acrobat_f82cc7 { 435 | background-image: url(https://cdn.discordapp.com/attachments/539180316447997974/705623972791975936/picture_as_pdf-white-18dp.svg); 436 | } 437 | } 438 | } 439 | } 440 | 441 | .footer_f82cc7 { 442 | background-color: transparent; 443 | box-shadow: unset; 444 | position: absolute; 445 | right: 20px; 446 | bottom: 10px; 447 | } 448 | 449 | .checkboxWrapper_f6cde8 .checkbox_f6cde8 { 450 | opacity: 0; 451 | visibility: hidden; 452 | transition: 0.2s; 453 | 454 | &.checked_f6cde8::before { 455 | color: var(--textcolor); 456 | content: "visibility_off"; 457 | } 458 | 459 | &:hover, 460 | .checked_f6cde8 { 461 | opacity: 1; 462 | } 463 | 464 | &::before { 465 | content: "visibility"; 466 | position: absolute; 467 | top: 0; 468 | left: 0; 469 | width: 100%; 470 | height: 100%; 471 | background: #0008; 472 | text-align: center; 473 | line-height: 350px; 474 | color: #fff6; 475 | font-size: 72px; 476 | font-family: "Material Icons", sans-serif; 477 | visibility: visible; 478 | border-radius: 19px; 479 | } 480 | } 481 | 482 | .labelForward_f6cde8 { 483 | display: none; 484 | } 485 | 486 | .inner_f82cc7 .file_f82cc7 .icon_f82cc7.image_f82cc7, 487 | .checkboxWrapper_f6cde8, 488 | .inner_f82cc7 .file_f82cc7 .icon_f82cc7 { 489 | position: fixed; 490 | top: 20px; 491 | left: 10px; 492 | width: 48% !important; 493 | height: 350px !important; 494 | margin-top: 0 !important; 495 | margin-left: 16px !important; 496 | margin-right: 16px !important; 497 | box-shadow: unset; 498 | border-radius: 20px; 499 | } 500 | 501 | .scrollableContainer_d0696b.webkit__8d35a { 502 | max-height: 215px; 503 | } 504 | } 505 | 506 | // Autocomplete 507 | .autocomplete_bcc24e { 508 | background: var(--background-secondary); 509 | bottom: calc(100% - 8px); 510 | border-radius: 8px 8px 0 0; 511 | 512 | .categoryHeader_fe2299 { 513 | background-color: var(--background-tertiary); 514 | border-radius: 6px; 515 | 516 | &::after { 517 | content: none; 518 | } 519 | } 520 | 521 | .contentTitle_bcc24e { 522 | color: var(--textcolor); 523 | } 524 | 525 | .scroller_d53d65 { 526 | overflow: visible !important; 527 | } 528 | } 529 | 530 | // Audio files 531 | .wrapperAudio_f316dd { 532 | background: var(--background-secondary); 533 | border: none; 534 | border-radius: 7px; 535 | padding: 0; 536 | 537 | .audioMetadata_f316dd { 538 | padding: 10px; 539 | } 540 | .audioControls_f316dd { 541 | background: transparent; 542 | 543 | .mediaBarWrapper_f7877e { 544 | &:hover { 545 | box-shadow: none; 546 | } 547 | 548 | .mediaBarProgress_f7877e, 549 | .mediaBarProgress_f7877e:after, 550 | .mediaBarProgress_f7877e:before, 551 | .mediaBarGrabber_f7877e { 552 | background: var(--main-color) !important; 553 | } 554 | } 555 | } 556 | } 557 | 558 | // Embeds 559 | .embedFull_b0068a { 560 | width: calc(100% + 100px); 561 | max-width: unset !important; 562 | left: -50px; 563 | border-radius: 0; 564 | border-color: var(--background-secondary-alt-alt); 565 | position: relative; 566 | overflow: hidden; 567 | 568 | .grid_b0068a { 569 | margin-left: 34px; 570 | margin-right: 12px; 571 | 572 | .embedSuppressButton_b0068a { 573 | top: 12px; 574 | right: 12px; 575 | } 576 | } 577 | } 578 | 579 | .theme-light .embedFull_b0068a { 580 | background: var(--background-secondary-alt-alt); 581 | border-color: var(--card); 582 | } 583 | 584 | // Server invite 585 | .wrapper_a71a1c { 586 | background: var(--background-secondary); 587 | border-radius: 10px; 588 | 589 | .header_a71a1c { 590 | display: none; 591 | } 592 | 593 | .count_a71a1c { 594 | font-weight: 500; 595 | color: var(--textcolor); 596 | } 597 | } 598 | 599 | // Codeblocks 600 | .markup_f8f345 code { 601 | border: none; 602 | background: var(--colortransparency); 603 | border-radius: 10px; 604 | } 605 | .hljs .powercord-lines:after, 606 | .powercord-codeblock-lang { 607 | border: none; 608 | } 609 | .powercord-codeblock-lang { 610 | padding: 3px 10px; 611 | } 612 | 613 | .textContainer_d8e2d0, 614 | .footer_d8e2d0 { 615 | border: none; 616 | 617 | .scrollbar_c858ce::-webkit-scrollbar { 618 | display: none; 619 | } 620 | } 621 | .textContainer_d8e2d0 { 622 | border-radius: 10px 10px 0 0; 623 | } 624 | .footer_d8e2d0 { 625 | border-radius: 0 0 10px 10px; 626 | } 627 | 628 | // Spoilers 629 | .spoilerText-27bIiA.hidden-3B-Rum, 630 | .spoilerText-27bIiA.hidden-3B-Rum:hover { 631 | background-color: var(--background-secondary); 632 | } 633 | 634 | // Spotify embeds 635 | .embedSpotify_b0068a { 636 | border-radius: 5px; 637 | } 638 | 639 | // Spotify invites 640 | .invite_f61cb8 { 641 | background: var(--background-secondary); 642 | border: none; 643 | } 644 | 645 | // Gifts 646 | .tile_ab47a1 { 647 | transform: translateZ(0); 648 | overflow: hidden; 649 | background: var(--background-secondary); 650 | 651 | &:hover { 652 | background: var(--background-secondary-alt-alt); 653 | } 654 | 655 | .invalidPoop_ff31dd { 656 | background: var(--background-secondary-alt-alt); 657 | position: relative; 658 | 659 | &::after { 660 | content: ">_<"; 661 | animation: blink 2.5s; 662 | animation-iteration-count: infinite; 663 | font-size: 50px; 664 | color: var(--textcolor); 665 | position: absolute; 666 | top: 50%; 667 | left: 50%; 668 | transform: translate(-50%, -50%); 669 | } 670 | } 671 | 672 | .description_ab47a1 { 673 | color: #fff; 674 | 675 | .tagline_ab47a1 { 676 | color: #eee; 677 | } 678 | } 679 | 680 | .splash_cbd9b6 { 681 | content: ""; 682 | position: fixed; 683 | top: 0; 684 | left: 0; 685 | width: 100%; 686 | height: 100%; 687 | background-image: inherit; 688 | background-repeat: no-repeat; 689 | background-size: cover; 690 | background-position: 50% 50%; 691 | z-index: -1; 692 | opacity: 0.3; 693 | filter: blur(20px); 694 | mask-image: linear-gradient(#000b, #000b); // vscode thing 695 | -webkit-mask-image: linear-gradient(#000b, #000b); 696 | } 697 | } 698 | 699 | // Attach or create invite 700 | .popoutTopLeft-3B0mFf.noArrow-2foL9g.noShadow-3pu20z { 701 | margin-bottom: 0; 702 | margin-top: 8px; 703 | } 704 | 705 | // Uploading 706 | .attachment_b52bef { 707 | background: var(--background-secondary); 708 | border: none; 709 | border-radius: 7px; 710 | 711 | .progressBar-1T6LYX { 712 | border-radius: 0; 713 | background: #419e85 !important; 714 | } 715 | } 716 | 717 | // Annoucement channels 718 | .scrollableContainer_d0696b, 719 | .wrapper_faf5ab { 720 | background: var(--background-secondary); 721 | 722 | .lookFilled-yCfaCM.colorPrimary-2AuQVo { 723 | background-color: var(--main-color); 724 | } 725 | } 726 | 727 | // Attach button 728 | .attachButtonPlus_f298d4, 729 | .attachButton_f298d4:hover .attachButtonPlus_f298d4 { 730 | fill: var(--main-color); 731 | } 732 | 733 | .form_a7d72e:before { 734 | background: linear-gradient( 735 | 180deg, 736 | transparent 0, 737 | var(--background-primary) 738 | ); 739 | } 740 | 741 | // Typing 742 | .typing_d7ebeb { 743 | z-index: 0; 744 | } 745 | 746 | // App launcher 747 | .button_df39bd { 748 | background-color: var(--background-secondary); 749 | } 750 | .contentWrapper_f7506e { 751 | background-color: var(--background-primary); 752 | } 753 | .container_e5da8b, .clickable_b78bb6 { 754 | background-color: var(--background-secondary); 755 | } 756 | .container_c18ec9 { 757 | border-radius: 8px; 758 | } 759 | 760 | // Delete message popout 761 | .message_ddcc45 { 762 | background: var(--background-secondary); 763 | box-shadow: none; 764 | } 765 | 766 | // Reaction 767 | .reaction_f61c73 { 768 | background: var(--colortransparency); 769 | } 770 | 771 | .container_f2bfbb, 772 | .reactors_f2bfbb { 773 | background: var(--background-secondary); 774 | 775 | .scroller_f2bfbb { 776 | background: var(--background-primary); 777 | } 778 | } 779 | 780 | // Threads 781 | .container_a6d69a { 782 | background-color: var(--background-primary); 783 | 784 | .tagsContainer_a6d69a button, 785 | .tagsContainer_a6d69a .tag_a6d69a { 786 | background-color: var(--background-secondary-alt-alt); 787 | } 788 | 789 | .mainCard_a6d69a { 790 | background-color: var(--background-secondary); 791 | } 792 | 793 | &::-webkit-scrollbar { 794 | display: none; 795 | } 796 | } 797 | } -------------------------------------------------------------------------------- /stuff/_friends.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // Left bar 3 | .searchBar_f0963d { 4 | position: absolute; 5 | top: 0; 6 | left: 0; 7 | width: calc(100% - 20px); 8 | background: linear-gradient( 9 | 180deg, 10 | var(--background-secondary), 11 | transparent 12 | ); 13 | box-shadow: none; 14 | 15 | .searchBarComponent_f0963d { 16 | background: var(--background-primary); 17 | border-radius: 20px; 18 | font-size: 10px; 19 | text-align: center; 20 | } 21 | } 22 | 23 | .input_f4e139 { 24 | background: var(--background-primary); 25 | } 26 | 27 | .privateChannels_f0963d > .scroller_c47fa9 { 28 | padding-top: 48px; 29 | background: transparent; 30 | 31 | &::-webkit-scrollbar { 32 | display: none; 33 | } 34 | } 35 | 36 | // Channels 37 | .channel_c91bad { 38 | margin: 0; 39 | max-width: unset; 40 | border-radius: 0; 41 | 42 | .layout_ec8679 { 43 | padding: 0 22px; 44 | width: calc(100% - 22px); 45 | border-radius: 0; 46 | } 47 | } 48 | 49 | // Wide friend list 50 | .container_c2739c { 51 | background: var(--background-primary); 52 | 53 | // Buttons 54 | .actionButton_e01b91 { 55 | background: transparent; 56 | 57 | &:hover { 58 | background: var(--background-primary); 59 | } 60 | } 61 | 62 | // Scrollbar 63 | .peopleColumn_c2739c ::-webkit-scrollbar { 64 | display: none; 65 | } 66 | 67 | // Get rid of box-shadow 68 | .tabBody_c2739c::before, 69 | .libraryHeader_cb9493::before { 70 | content: none; 71 | } 72 | .header_c6ee36, 73 | .header_d8cdac, 74 | .header-JHwfVI { 75 | display: none; 76 | } 77 | 78 | // Now playing 79 | .nowPlayingColumn_c2739c { 80 | background: transparent; 81 | margin: 3px 0 10px 0; 82 | 83 | .container_bf550a { 84 | background: var(--background-secondary); 85 | border-radius: 15px 0 0 15px; 86 | 87 | .scroller_bf550a { 88 | border: none; 89 | padding: 16px 0 !important; 90 | margin: 0; 91 | 92 | .header_bf550a { 93 | text-align: center; 94 | } 95 | 96 | .emptyCard_f02fcf { 97 | margin: 16px; 98 | } 99 | .outer_ac5d22 { 100 | background: transparent; 101 | } 102 | 103 | .wrapper_cd82a7 { 104 | background: var(--background-secondary); 105 | margin: 16px; 106 | border-radius: 10px; 107 | border: none; 108 | 109 | .body_cd82a7 { 110 | & > :nth-last-child(3) { 111 | border-radius: 8px 8px 0 0; 112 | } 113 | .separator_cd82a7 { 114 | display: none; 115 | } 116 | & > :nth-child(3) { 117 | border-radius: 0 0 8px 8px; 118 | } 119 | } 120 | } 121 | 122 | &::-webkit-scrollbar { 123 | display: none; 124 | } 125 | } 126 | } 127 | } 128 | } 129 | 130 | // Aka badge 131 | .akaBadge__27cd4 { 132 | background: var(--main-color); 133 | color: #fff; 134 | } 135 | 136 | // Call 137 | .wrapper_d880dc:not(.video_d880dc) { 138 | background: var(--background-secondary); 139 | margin: 15px; 140 | border-radius: 10px; 141 | animation: callzoom 2s ease; 142 | 143 | .tile_dc5fc4 { 144 | background: var(--background-primary); 145 | 146 | .button_e5cc00, 147 | .buttonColor_d4af21 { 148 | background-color: var(--main-color); 149 | } 150 | } 151 | 152 | // Video background 153 | .videoWrapper_ba4b17 { 154 | background: var(--background-primary); 155 | } 156 | 157 | // Speaking ring 158 | .border_db83a2.speaking_db83a2 { 159 | box-shadow: inset 0 0 0 2.5px #43b581, 160 | inset 0 0 0 6px var(--background-secondary); 161 | } 162 | 163 | // Call buttons 164 | .colorable_ef18ee.primaryDark_ef18ee, 165 | .leftTrayIcon_d880dc { 166 | background: var(--background-primary); 167 | } 168 | 169 | .wrapper_b6e2f9 > .controlButton_b6e2f9 > svg > foreignObject { 170 | mask: none; 171 | } 172 | } 173 | 174 | // Call region selector 175 | .quickSelectPopout_abbf45 { 176 | background: var(--background-primary); 177 | } 178 | 179 | // Nitro 180 | .applicationStore_cecc86 .container_fc4f04 { 181 | width: calc(100% - 240px); 182 | position: absolute; 183 | top: 0; 184 | background: linear-gradient(180deg, var(--background-primary), transparent); 185 | z-index: 1; 186 | } 187 | 188 | // User profile 189 | .userPanelOuter_c69a7b { 190 | 191 | .scrollerBase_eed6a8 { 192 | overflow: unset !important 193 | } 194 | 195 | // Banner 196 | .bannerSVGWrapper_b32cc2 { 197 | overflow: visible; 198 | min-height: 180px !important; 199 | contain: unset; 200 | max-width: 340px; 201 | 202 | .banner_d5fdb1 { 203 | position: absolute; 204 | height: 200px; 205 | -webkit-mask-image: linear-gradient(#000000c2, #000000c2); 206 | clip-path: polygon( 207 | 0 0, 208 | 100% 0, 209 | 100% calc(100% - 25px), 210 | 50% 100%, 211 | 0 calc(100% - 25px) 212 | ); 213 | } 214 | 215 | // Normal banners 216 | &[viewBox="0 0 340 60"] > foreignObject { 217 | transform: translateY(-60px); 218 | } 219 | 220 | // Premium banners with image 221 | &[viewBox="0 0 340 120"] > foreignObject { 222 | transform: translateY(-30px); 223 | } 224 | 225 | // Premium banners with colours 226 | &[viewBox="0 0 340 90"] > foreignObject { 227 | transform: translateY(-45px); 228 | } 229 | 230 | & > foreignObject { 231 | mask: none; 232 | } 233 | } 234 | 235 | .divider_ae36e5 { 236 | display: none; 237 | } 238 | 239 | // Badges 240 | .badgelistGroup_ab525a { 241 | min-height: 10px; 242 | } 243 | .badgeList_ab525a { 244 | position: absolute; 245 | top: 160px; 246 | left: 0; 247 | width: 340px; 248 | height: unset; 249 | max-width: unset; 250 | padding: 0; 251 | justify-content: center; 252 | background-color: transparent; 253 | } 254 | 255 | .section_d7a21f { 256 | padding-top: 0; 257 | padding-bottom: 12px; 258 | } 259 | 260 | .userPanelOverlayBackground_a2b6ae:nth-child(2) { 261 | position: static; 262 | 263 | .section_d7a21f .userText_c9ccf6 { 264 | position: absolute; 265 | top: 110px; 266 | left: 0; 267 | width: 340px; 268 | box-sizing: border-box; 269 | text-align: center; 270 | 271 | .discrimBase_c9ccf6 { 272 | color: white; 273 | } 274 | } 275 | 276 | .pronouns_c9ccf6 { 277 | position: relative; 278 | margin-top: 8px; 279 | } 280 | 281 | .scroller_d2b491::-webkit-scrollbar { 282 | display: none; 283 | } 284 | 285 | // Activities 286 | .activity__20c1e { 287 | z-index: 1; 288 | 289 | .assetsLargeImageSpotify_c1d9fd { 290 | border-radius: 8px !important; 291 | margin-left: 6px; 292 | } 293 | 294 | .null { 295 | margin-right: 8px; 296 | } 297 | 298 | // Button 299 | .button_da7790 { 300 | background-color: var(--main-color); 301 | opacity: 1; 302 | } 303 | 304 | // Platform icon 305 | .platformIcon_c1d9fd { 306 | display: none; 307 | } 308 | 309 | // Time bar 310 | .timeBarUserPopoutV2_c1d9fd { 311 | position: absolute; 312 | top: 7px; 313 | left: 0; 314 | z-index: -1; 315 | width: 100%; 316 | height: 70px; 317 | border-radius: 8px; 318 | 319 | .bar_ec2fa7 { 320 | border-radius: 8px; 321 | height: 100%; 322 | } 323 | 324 | .barInner_ec2fa7 { 325 | border-radius: 8px 0 0 8px; 326 | opacity: 0.2; 327 | } 328 | & > :last-child { 329 | display: none; 330 | } 331 | } 332 | } 333 | 334 | .input-2g-os5 { 335 | background-color: transparent !important; 336 | } 337 | } 338 | 339 | // Username adjustements for premium popouts 340 | &.userProfileOuterThemed_c69a7b .usernameSection_d2b491 { 341 | left: 4px; 342 | } 343 | 344 | // Avatar 345 | .avatarWrapper_f89da9 { 346 | top: 15px !important; 347 | left: calc(50% - 40px); 348 | 349 | // View profile mask 350 | .avatarHint_f89da9 { 351 | top: 0; 352 | left: 0; 353 | border-radius: calc(var(--avatar-radius) * 2) !important; 354 | 355 | foreignObject { 356 | mask: none !important; 357 | 358 | // Custom Avatar Hint 359 | .avatarHintInner_f89da9 { 360 | font-size: 0; 361 | text-transform: none; 362 | 363 | &::after { 364 | white-space: normal; 365 | text-align: center; 366 | content: var(--avatar-hint-text); 367 | color: var(--avatar-hint-color); 368 | font-size: var(--avatar-hint-size); 369 | font-family: var(--avatar-hint-font); 370 | } 371 | } 372 | } 373 | } 374 | } 375 | 376 | // Avatar mask 377 | .mask_c51b4e { 378 | foreignObject { 379 | border-radius: calc(var(--avatar-radius) * 2) !important; 380 | } 381 | circle, 382 | rect[fill="black"] { 383 | display: none; 384 | } 385 | } 386 | } 387 | } -------------------------------------------------------------------------------- /stuff/_member-list.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | .membersWrap_cbd271 { 3 | margin-top: -48px; 4 | max-height: calc(100% + 48px); 5 | 6 | .members_cbd271 { 7 | padding-top: 48px; 8 | 9 | // Members 10 | .member_a31c43 { 11 | margin: 0; 12 | 13 | .layout_d808b0 { 14 | padding: 0 22px; 15 | width: calc(100% - 22px); 16 | border-radius: 0; 17 | } 18 | } 19 | 20 | &::-webkit-scrollbar { 21 | display: none; 22 | } 23 | } 24 | } 25 | 26 | // -- User popout -- 27 | .loadingPopout-1feYe_ { 28 | background: var(--background-secondary); 29 | } 30 | 31 | .userPopoutOuter_c69a7b { 32 | border-radius: 8px; 33 | overflow: unset; 34 | 35 | .userProfileInner_c69a7b { 36 | background-color: var(--background-tertiary); 37 | overflow: unset; 38 | } 39 | 40 | // Banner 41 | .header_b8cc6d { 42 | min-height: 210px; 43 | } 44 | 45 | .header_b8cc6d > .mask_d5fdb1 { 46 | overflow: visible; 47 | min-height: unset !important; 48 | contain: unset; 49 | 50 | .banner_d5fdb1 { 51 | position: absolute; 52 | height: 200px !important; 53 | -webkit-mask-image: linear-gradient(#000000c2, #000000c2); 54 | clip-path: polygon( 55 | 0 0, 56 | 100% 0, 57 | 100% calc(100% - 25px), 58 | 50% 100%, 59 | 0 calc(100% - 25px) 60 | ); 61 | } 62 | 63 | & > foreignObject { 64 | mask: none; 65 | } 66 | } 67 | 68 | // Action buttons 69 | .wrapper_cb78f1 { 70 | flex-direction: column; 71 | } 72 | 73 | // Bubble goofy thing 74 | .addCustomStatusButtonBubble_d22603, .statusBubbleOuter_d22603 + .visibleContainer_d22603 { 75 | position: absolute; 76 | top: -60px; 77 | 78 | --custom-status-bubble-background: var(--background-tertiary); 79 | } 80 | .statusBubbleOuter_d22603:before { top: 28px;} 81 | .statusBubbleOuter_d22603:after { 82 | top: 50px; 83 | left: 25px; 84 | } 85 | 86 | // Avatar 87 | .avatar_f94206 { 88 | top: 15px !important; 89 | left: calc(50% - 40px); 90 | 91 | .overlay_f94206:after { 92 | border-radius: var(--avatar-radius); 93 | } 94 | 95 | // View profile mask 96 | .avatarPopover_a64b81 { 97 | top: 0; 98 | left: 0; 99 | border-radius: calc(var(--avatar-radius) * 2) !important; 100 | 101 | foreignObject { 102 | mask: none !important; 103 | 104 | // Custom Avatar Hint 105 | .avatarHintInner_f89da9 { 106 | font-size: 0; 107 | text-transform: none; 108 | 109 | &::after { 110 | white-space: normal; 111 | text-align: center; 112 | content: var(--avatar-hint-text); 113 | color: var(--avatar-hint-color); 114 | font-size: var(--avatar-hint-size); 115 | font-family: var(--avatar-hint-font); 116 | } 117 | } 118 | } 119 | } 120 | } 121 | 122 | // Avatar mask 123 | .mask_c51b4e { 124 | foreignObject { 125 | border-radius: calc(var(--avatar-radius) * 2) !important; 126 | } 127 | circle, 128 | rect[fill="black"] { 129 | display: none; 130 | } 131 | } 132 | 133 | .body_b8cc6d { 134 | position: static; 135 | } 136 | 137 | // Username 138 | .container_c32acf { 139 | position: absolute; 140 | top: 115px; 141 | left: 20px; 142 | width: calc(100% - 38px); 143 | } 144 | .usernameRow_c32acf .clickableUsername_c32acf { 145 | width: 100%; 146 | 147 | h1 { 148 | display: block; 149 | text-align: center; 150 | } 151 | } 152 | .usernameRow_c32acf .nicknameIcons_c32acf { 153 | display: none; 154 | } 155 | 156 | // uuh old name and pronouns and badges and ... 157 | .tags_c32acf { 158 | margin-top: 5px; 159 | justify-content: center; 160 | 161 | // badges 162 | .container_b64375 { 163 | border: none; 164 | background: transparent; 165 | } 166 | } 167 | } 168 | 169 | 170 | 171 | // -- User modal -- 172 | .root_b9fccc.root_f9a4c9.small_f9a4c9 { 173 | width: 800px; 174 | height: 400px; 175 | 176 | & > div, .userProfileModalOuter_c69a7b { 177 | width: 100%; 178 | height: 100%; 179 | box-sizing: border-box; 180 | } 181 | } 182 | 183 | .userProfileModalInner_c69a7b { 184 | width: 100%; 185 | height: 100%; 186 | flex-direction: row; 187 | overflow: hidden; 188 | position: relative; 189 | border-radius: 8px; 190 | 191 | &::before { 192 | width: 100%; 193 | height: 100%; 194 | } 195 | 196 | // Header 197 | header { 198 | width: calc(55% - 16px); 199 | height: 100%; 200 | } 201 | 202 | header > .mask_d5fdb1 { 203 | min-width: unset !important; 204 | min-height: unset !important; 205 | width: 100%; 206 | height: 100%; 207 | 208 | .banner_d5fdb1 { 209 | position: absolute; 210 | top: 0; 211 | left: 0; 212 | width: 100%; 213 | height: 100% !important; 214 | z-index: -1; 215 | opacity: 0.6; 216 | border-radius: 10px 0 0 10px; 217 | mask-image: linear-gradient(90deg, #000c, #00000049); // vscode thing 218 | -webkit-mask-image: linear-gradient(90deg, #000000cc, #00000049); 219 | } 220 | 221 | & > foreignObject { 222 | mask: none; 223 | } 224 | 225 | &[viewBox="0 0 600 106"] > foreignObject { 226 | y: -350px; 227 | height: 800px; 228 | } 229 | 230 | &[viewBox="0 0 600 210"] > foreignObject { 231 | y: -250px; 232 | height: 700px; 233 | } 234 | } 235 | 236 | .headerInner_b9fccc { 237 | position: static; 238 | 239 | // Avatar 240 | .avatar_f94206 { 241 | top: 16px; 242 | left: 16px; 243 | 244 | circle, 245 | rect[fill="black"] { 246 | display: none; 247 | } 248 | } 249 | 250 | .addCustomStatusButtonBubble_d22603, .statusBubbleOuter_d22603 + .visibleContainer_d22603 { 251 | position: absolute; 252 | top: unset; 253 | left: unset; 254 | bottom: 0; 255 | right: 0; 256 | z-index: 2; 257 | width: calc(45% + 16px); 258 | padding: 20px; 259 | backdrop-filter: blur(8px); 260 | box-sizing: border-box; 261 | border-bottom-right-radius: 5px; 262 | 263 | & > .statusBubbleOuter_d22603 { 264 | border: none; 265 | box-shadow: none; 266 | background: transparent; 267 | min-width: unset; 268 | max-width: unset; 269 | 270 | &::before, &::after { 271 | display: none; 272 | } 273 | 274 | & > .statusBubble_d22603 { 275 | padding: 0; 276 | background: transparent; 277 | 278 | & > .content_d22603 { 279 | text-align: left; 280 | } 281 | } 282 | } 283 | 284 | &.activityProfile_c1d9fd { 285 | right: unset; 286 | bottom: -140px; 287 | left: 5px; 288 | width: 750px; 289 | padding: 20px; 290 | } 291 | 292 | .customStatus_b2ca13 { 293 | margin-top: 0; 294 | } 295 | 296 | // Player 297 | .assetsLargeImageActivityFeed_c1d9fd, 298 | .assetsLargeImageActivityFeedXbox_c1d9fd, 299 | .assetsLargeImageProfile_c1d9fd { 300 | width: 40px; 301 | height: 40px; 302 | } 303 | } 304 | } 305 | 306 | .headerButtons_b9fccc { 307 | position: fixed; 308 | bottom: 15px; 309 | left: 15px; 310 | z-index: 1; 311 | } 312 | 313 | // Avatar mask 314 | .mask_c51b4e foreignObject { 315 | border-radius: calc(var(--avatar-radius) * 2.1) !important; 316 | } 317 | 318 | // Body 319 | .body_b9fccc { 320 | width: calc(45% + 16px); 321 | margin: 0; 322 | overflow: visible; 323 | background-color: var(--background-primary); 324 | border-radius: 0; 325 | 326 | .fullSizeOverlayBackground_c69a7b { 327 | position: static; 328 | background: transparent; 329 | border: none; 330 | 331 | .container_ecc04c { 332 | height: 100%; 333 | } 334 | } 335 | 336 | // Username + old username + .... 337 | .container_c32acf { 338 | position: absolute; 339 | top: 25px; 340 | left: 153px; 341 | z-index: 1; 342 | max-width: 250px; 343 | 344 | // Badges 345 | .container_b64375 { 346 | border: none; 347 | } 348 | } 349 | 350 | // Menu 351 | .tabBar_ecc04c { 352 | position: absolute; 353 | bottom: 65px; 354 | left: 5px; 355 | z-index: 1; 356 | border-bottom: unset; 357 | flex-direction: column; 358 | gap: 15px; 359 | 360 | .item_a0 { 361 | height: 20px; 362 | border-bottom: unset; 363 | 364 | & > div { 365 | transition: font-weight 200ms; 366 | } 367 | 368 | &.selected_a0 > div { 369 | font-weight: bold; 370 | } 371 | } 372 | } 373 | 374 | .section_ba4d80:nth-last-child(3) { 375 | margin-bottom: 50px; 376 | } 377 | 378 | // Connected account 379 | .connectedAccountContainer_ab12c6 { 380 | border: none; 381 | background-color: rgba(255, 255, 255, 0.05); 382 | } 383 | 384 | // Mutuals 385 | .listScroller_d2d6cb { 386 | display: grid; 387 | grid-template-columns: 1fr 1fr; 388 | grid-template-rows: repeat(20, 0fr); 389 | gap: 10px; 390 | padding-left: 8px; 391 | 392 | .listRow_d2d6cb { 393 | position: relative; 394 | z-index: 1; 395 | height: 44px; 396 | margin: 0; 397 | padding-left: 10px; 398 | border-radius: 8px; 399 | overflow: hidden; 400 | background-color: #ffffff07; 401 | 402 | .listAvatar_d2d6cb { 403 | position: absolute; 404 | right: 0; 405 | z-index: -1; 406 | width: 62% !important; 407 | height: 250% !important; 408 | margin-right: 0; 409 | border-radius: 0; 410 | -webkit-mask-image: linear-gradient(90deg, #00000000, #000000cb); 411 | 412 | svg { 413 | position: relative; 414 | width: 100%; 415 | height: 100%; 416 | 417 | foreignObject { 418 | width: 100%; 419 | height: 100%; 420 | } 421 | rect { 422 | display: none; 423 | } 424 | } 425 | } 426 | } 427 | 428 | .empty_d2d6cb { 429 | grid-column: 1/3; 430 | grid-row: 1/22; 431 | position: relative; 432 | z-index: 0; 433 | overflow: hidden; 434 | margin: 0; 435 | padding-left: 10px; 436 | border-radius: 8px; 437 | 438 | .emptyIconFriends_d2d6cb { 439 | position: absolute; 440 | z-index: -1; 441 | width: 80%; 442 | height: 80%; 443 | margin-left: -10px; 444 | opacity: 0.2; 445 | background-size: 100%; 446 | } 447 | } 448 | } 449 | 450 | .input-2g-os5 { 451 | background-color: transparent; 452 | } 453 | } 454 | } 455 | 456 | .userProfileModalInner_c69a7b .userProfileModalOverlayBackground_c69a7b { 457 | background-color: transparent; 458 | } 459 | } -------------------------------------------------------------------------------- /stuff/_other.scss: -------------------------------------------------------------------------------- 1 | // -- Ruindows support -- 2 | body { 3 | background: transparent; 4 | } 5 | 6 | .withFrame_a934d8 { 7 | background: var(--background-tertiary); 8 | padding: 8px 16px; 9 | height: 24px; 10 | margin-top: unset; 11 | position: relative; 12 | left: 90px; 13 | width: calc(100% - 122px); 14 | z-index: 1; 15 | pointer-events: none; 16 | 17 | // Discord 18 | .wordmark_a934d8 { 19 | top: unset; 20 | left: 16px; 21 | color: transparent; 22 | } 23 | 24 | // Windows buttons 25 | .winButton_a934d8 { 26 | color: var(--textcolor); 27 | top: -8px; 28 | right: -16px; 29 | height: 40px; 30 | width: 56px; 31 | } 32 | 33 | // Not maximised icon 34 | .winButtonClose_a934d8 + .winButtonMinMax_a934d8::before { 35 | content: ""; 36 | position: absolute; 37 | top: 10px; 38 | left: 18px; 39 | width: 18px; 40 | height: 18px; 41 | background: url("https://cdn.discordapp.com/attachments/539180316447997974/713920529622630411/aaaaaaaaa.svg") 42 | no-repeat; 43 | background-size: contain; 44 | opacity: 0; 45 | } 46 | } 47 | 48 | .theme-light .winButtonClose_a934d8 + .winButtonMinMax_a934d8::before { 49 | background-image: url("https://cdn.discordapp.com/attachments/539180316447997974/713920227582279810/aaaaaaaaa.svg"); 50 | } 51 | 52 | // When maximised 53 | body.maximized .winButtonClose_a934d8 + .winButtonMinMax_a934d8 { 54 | svg { 55 | opacity: 0; 56 | } 57 | &::before { 58 | opacity: 1; 59 | } 60 | } 61 | 62 | // Pushing things lower 63 | .platform-win { 64 | .chat_a7d72e .wrapper_d880dc:not(.minimum_d880dc) .search_ff5f90 { 65 | top: 50px; 66 | } 67 | 68 | .appMount_ea7e65 .app_bd26cc { 69 | .scroller_fea3ef { 70 | padding-top: 20px; 71 | } 72 | .content_a4d4d9::after { 73 | content: ""; 74 | position: absolute; 75 | top: -5px; 76 | left: -5px; 77 | z-index: 2; 78 | width: 30px; 79 | height: 30px; 80 | border: solid var(--background-tertiary); 81 | border-width: 5px 0 0 5px; 82 | border-radius: 15px 0 0 0; 83 | box-sizing: border-box; 84 | } 85 | } 86 | .layers_a01fb1, 87 | .layers_d4b6c5, 88 | .layers_a01fb1 > .layer_d4b6c5, 89 | .container_a4d4d9 { 90 | overflow: visible; 91 | } 92 | 93 | // Recent mentions 94 | .recentMentionsPopout_ddb5b4, 95 | .root_fccaa9 { 96 | top: 40px; 97 | } 98 | } 99 | 100 | // Window effect 101 | html:not(.platform-linux) body:not(.maximized).transparent .appMount_ea7e65 { 102 | overflow: hidden; 103 | border-radius: 8px; 104 | box-shadow: 0 0 10px 0 var(--background-tertiary); 105 | top: 10px; 106 | left: 10px; 107 | width: calc(100% - 20px); 108 | height: calc(100% - 20px); 109 | transform: translateZ(0); 110 | } 111 | 112 | // MacOS Support 113 | .platform-osx { 114 | .typeMacOS_a934d8 { 115 | width: 90px; 116 | 117 | .macButtons_a934d8 { 118 | width: 90px; 119 | padding: 10px 20px 10px 20px; 120 | } 121 | } 122 | 123 | .unreadMentionsIndicatorTop_fea3ef { 124 | top: 20px; 125 | 126 | .mention_edf32f { 127 | background: transparent; 128 | } 129 | } 130 | 131 | .guilds_a4d4d9 { 132 | margin: 0; 133 | 134 | .scroller_fea3ef { 135 | padding-top: 40px; 136 | } 137 | 138 | &::after { 139 | content: ""; 140 | position: absolute; 141 | width: 100%; 142 | height: 32px; 143 | top: 0; 144 | left: 0; 145 | background: linear-gradient( 146 | 180deg, 147 | var(--background-tertiary), 148 | transparent 149 | ); 150 | } 151 | } 152 | } 153 | 154 | :root { 155 | // Scrollbars 156 | *::-webkit-scrollbar { 157 | width: 8px; 158 | 159 | &-thumb { 160 | background: var(--background-secondary); 161 | border-radius: 20px; 162 | } 163 | 164 | &-track-piece { 165 | display: none; 166 | } 167 | } 168 | 169 | // Version 170 | .info_c5a741 [class^="text-xs/normal_dc00ef"]:last-child::after { 171 | content: "\a Couve v" var(--version); 172 | text-transform: none; 173 | white-space: pre; 174 | } 175 | 176 | // Discover 177 | .categoryItem_c72b37 { 178 | margin: 3px 0 3px 8px; 179 | 180 | &.selectedCategoryItem_c72b37 .itemInner_c72b37 { 181 | background: var(--epicshadow1); 182 | } 183 | } 184 | 185 | .pageWrapper_a3a4ce { 186 | background: var(--background-primary); 187 | 188 | .search-25t1e9 .searchBox-31Zv9h { 189 | background: var(--background-secondary); 190 | 191 | .input_f8bc55 { 192 | color: white; 193 | } 194 | 195 | .searchIcon-3X4BYL { 196 | margin-left: 8px; 197 | } 198 | } 199 | 200 | .card_e90879, 201 | .iconMask_e90879 { 202 | background-color: var(--card); 203 | 204 | &:hover, 205 | &:hover .iconMask_e90879 { 206 | background: var(--background-secondary); 207 | } 208 | } 209 | } 210 | 211 | // Server boost 212 | .root_fccaa9 { 213 | top: 40px; 214 | left: calc(90px + 240px); 215 | contain: unset; 216 | 217 | .perksModal-CLcR1c { 218 | background-color: var(--background-primary); 219 | 220 | // Card 221 | .ctaBar-Nhk8yY { 222 | background: var(--background-secondary); 223 | border-radius: 10px; 224 | } 225 | 226 | // Slide 227 | .progressBar-20NUv9 { 228 | z-index: 1; 229 | 230 | .bar-1g-wqp { 231 | border-radius: 0; 232 | } 233 | 234 | .tierMarkerBackground-G8FoN4 { 235 | z-index: -10; 236 | } 237 | .tierMarkerBackground-G8FoN4, 238 | .barBackground-unEPDT { 239 | background: var(--background-secondary-alt-alt); 240 | } 241 | 242 | .tierMarkerInProgress-2Tdxjz { 243 | background: var(--background-primary) !important; 244 | } 245 | } 246 | 247 | // Carousel 248 | .carouselContainerVisible-bGCrdY { 249 | left: -15%; 250 | 251 | .tierHeaderUnlocked-1IvR2R { 252 | background: #b377f3; 253 | 254 | .tierUnlocked-1yG5Ic { 255 | background: #0006; 256 | color: #fff; 257 | } 258 | } 259 | 260 | .tierHeaderLocked-3ItHYn { 261 | background: var(--background-secondary-alt-alt); 262 | } 263 | .tierBody-3ju-rc { 264 | background: var(--background-secondary); 265 | } 266 | } 267 | 268 | // Perks 269 | .perk-19D_HN { 270 | background: var(--background-secondary); 271 | } 272 | } 273 | 274 | .closeWrapper-1aVqeP { 275 | padding-top: 72px; 276 | 277 | .closeButton_df5532 { 278 | &:active { 279 | transform: none; 280 | } 281 | 282 | &::before { 283 | content: ""; 284 | position: fixed; 285 | top: 0; 286 | left: -330px; 287 | width: 330px; 288 | height: 100%; 289 | z-index: 100; 290 | } 291 | } 292 | } 293 | } 294 | 295 | // Roles 296 | .role_f9575e, 297 | .sidebar_e87574 .list_e87574 .item_a0, 298 | .container_ac201b .item_eef3ef, 299 | .roleRow-3HnunM { 300 | position: relative; 301 | overflow: hidden; 302 | height: unset; 303 | z-index: 1; 304 | border: none; 305 | padding: 5px; 306 | border-radius: 20px; 307 | margin-right: 4px; 308 | margin-left: 0; 309 | } 310 | 311 | .role_f9575e .roleCircle_a26d7b::before, 312 | .sidebar_e87574 .list_e87574 .item_a0 .roleCircle_a26d7b::before, 313 | .container_ac201b .item_eef3ef .roleCircle_a26d7b::before, 314 | .roleRow-3HnunM .roleCircle_a26d7b::before { 315 | content: ""; 316 | position: absolute; 317 | top: 0; 318 | left: 0; 319 | width: 100%; 320 | height: 100%; 321 | background: inherit; 322 | opacity: 0.2; 323 | z-index: -1; 324 | pointer-events: none; 325 | } 326 | 327 | .roleRemoveButton_f9575e { 328 | position: unset; 329 | 330 | .roleRemoveIcon_e4010c { 331 | left: 15px; 332 | } 333 | } 334 | 335 | // Role popout 336 | .container_ac201b { 337 | border: none; 338 | 339 | .item_eef3ef { 340 | margin-right: 5px; 341 | } 342 | 343 | .container_c18ec9 { 344 | border-radius: 8px; 345 | } 346 | } 347 | 348 | // Roles in settings 349 | .sidebar_e87574 { 350 | border: none; 351 | 352 | .list_e87574 { 353 | padding-left: 16px; 354 | 355 | .item_a0 { 356 | padding: 6px 10px; 357 | margin-bottom: 6px; 358 | border-radius: 25px; 359 | } 360 | } 361 | } 362 | 363 | // Roles scroller 364 | #user-context-roles + .layer_cd0de5 .item_d90b3d { 365 | flex-direction: row-reverse; 366 | 367 | .iconContainer-1-SsTR { 368 | margin: 0 8px 0 0; 369 | } 370 | 371 | .roleRow-3HnunM { 372 | border-radius: 25px; 373 | 374 | .roleDot-2gCDg5 { 375 | filter: none; 376 | margin-right: 4px; 377 | } 378 | } 379 | } 380 | 381 | // Commom popout modal 382 | .root_f9a4c9, 383 | .modal_c97cbd { 384 | background: var(--background-primary); 385 | box-shadow: unset; 386 | border-radius: 10px; 387 | 388 | &::-webkit-scrollbar { 389 | display: none; 390 | } 391 | 392 | form { 393 | display: flex; 394 | flex-direction: column; 395 | } 396 | 397 | &.small_f9a4c9 { 398 | min-height: unset; 399 | } 400 | 401 | // Header 402 | .header_f9a4c9 { 403 | text-align: center; 404 | } 405 | 406 | .separator_f9a4c9 { 407 | box-shadow: none; 408 | } 409 | 410 | // Footer 411 | .footer_f9a4c9 { 412 | padding: 0; 413 | text-align: center; 414 | background: transparent; 415 | box-shadow: none; 416 | min-height: 45px; 417 | overflow: hidden; 418 | border-radius: 0 0 10px 10px; 419 | 420 | button { 421 | flex-grow: 1; 422 | margin: 0; 423 | padding: 2px 16px; 424 | box-shadow: none !important; 425 | border-radius: 0; 426 | min-height: 45px; 427 | } 428 | 429 | .lookLink-15mFoz { 430 | background: #fff1; 431 | } 432 | 433 | & > * { 434 | width: 100%; 435 | margin: 0; 436 | } 437 | 438 | .cancelButton-kOgwem, 439 | .cancel-1Ph_Z1 { 440 | margin-right: 0; 441 | } 442 | .minorContainer_acae5d { 443 | order: -1; 444 | margin-bottom: 16px; 445 | } 446 | } 447 | 448 | // Stream / Screenshare popout 449 | .qualitySettingsContainer-30AsSH { 450 | border: none; 451 | padding: 0; 452 | } 453 | 454 | .card-1SdQ2-, 455 | .item-2OyinQ { 456 | border: none; 457 | background: var(--background-secondary); 458 | } 459 | 460 | .changeButton-3QdaoH { 461 | border-radius: 3px; 462 | } 463 | .art-2OaYX0 + form > :nth-child(3) > :last-child, 464 | .changeButton-3QdaoH { 465 | background: #fff1 !important; 466 | } 467 | .selectorButtonSelected-3Z0WNU { 468 | background: var(--main-color); 469 | } 470 | 471 | // Change quality nitro popout 472 | .primaryActions_ffaecb { 473 | flex-grow: 1; 474 | 475 | .shinyButton_d5e126 { 476 | width: 100%; 477 | height: 100%; 478 | border-radius: 0; 479 | } 480 | } 481 | 482 | // Remove background for image carrousel 483 | &.carouselModal-1eUFoq { 484 | background: none; 485 | } 486 | } 487 | 488 | .popout-1KHNAq { 489 | border: none; 490 | 491 | .option-2eIyOn { 492 | background: var(--background-secondary); 493 | } 494 | } 495 | 496 | // Buttons and specific elements 497 | .button_dd4f85 { 498 | border-radius: 8px; 499 | transition: box-shadow 200ms; 500 | } 501 | 502 | .lookFilled_dd4f85.colorBrand_dd4f85, 503 | .lookFilled_dd4f85.colorBrand_dd4f85:hover { 504 | background: var(--main-color) !important; 505 | } 506 | 507 | .item-2idW98[style*="background-color"] { 508 | background: var(--main-color) !important; 509 | } 510 | 511 | // Checkbox 512 | .checked_cebd1c { 513 | border: none; 514 | } 515 | .checkbox-f1HnKB { 516 | border-radius: 50%; 517 | } 518 | 519 | // Slider 520 | .bar_c7a159 { 521 | background: var(--background-secondary-alt-alt); 522 | 523 | .barFill_c7a159 { 524 | background: var(--main-color); 525 | } 526 | } 527 | .grabber_c7a159 { 528 | border: none; 529 | background: transparent !important; 530 | box-shadow: none; 531 | } 532 | 533 | // Cards 534 | .cardPrimary_a298b8, 535 | .cardPrimaryEditable-2mz_3i, 536 | .cardPrimaryOutline-1ofwVz { 537 | border: none; 538 | background: var(--background-secondary); 539 | border-radius: 10px; 540 | } 541 | .card_ea2a21::before { 542 | background-color: var(--background-secondary); 543 | border: none; 544 | } 545 | .default_a467ac { 546 | background-color: var(--background-secondary); 547 | } 548 | 549 | // Inputs & selects 550 | .input_f8bc55 { 551 | border: none; 552 | border-radius: 8px; 553 | transition: background 0.4s; 554 | } 555 | 556 | .select_f6639d, 557 | .item_eb92a8 { 558 | border: none; 559 | border-radius: 8px; 560 | } 561 | 562 | .popout_f6639d { 563 | border: none; 564 | border-radius: 8px; 565 | 566 | &.popoutPositionTop_f6639d { 567 | margin-bottom: 5px; 568 | } 569 | margin-top: 5px; 570 | 571 | &::-webkit-scrollbar { 572 | display: none; 573 | } 574 | } 575 | 576 | .input_cebd1c, 577 | .container_cebd1c { 578 | border-radius: 8px; 579 | 580 | rect { 581 | rx: 8px; 582 | } 583 | } 584 | 585 | .option_f6639d:hover { 586 | background: rgba(255, 255, 255, 0.05) !important; 587 | } 588 | .option_f6639d:hover { 589 | background: rgba(255, 255, 255, 0.05) !important; 590 | } 591 | 592 | // Specific menus 593 | .styleFixed-2_NfVL { 594 | background: var(--background-primary); 595 | box-shadow: unset; 596 | } 597 | 598 | .styleFlexible-x0_sIC, 599 | .submenu_d90b3d { 600 | overflow: hidden; 601 | background: var(--background-secondary-alt); 602 | box-shadow: unset; 603 | } 604 | 605 | .submenuPaddingContainer_d90b3d { 606 | margin-left: -8px; 607 | margin-right: -8px; 608 | } 609 | 610 | .button_a24e84, 611 | .button_a24e84:hover { 612 | background: var(--background-primary); 613 | } 614 | 615 | .item_d90b3d { 616 | margin: 0; 617 | padding: 8px 16px; 618 | border-radius: 0; 619 | transition: background 200ms; 620 | 621 | &:hover, 622 | &.focused_d90b3d, 623 | &:active:not(.hideInteraction_d90b3d) { 624 | background-color: rgba(255, 255, 255, 0.05); 625 | } 626 | } 627 | 628 | // Account profile 629 | .accountProfilePopoutWrapper_b2ca13 { 630 | position: fixed; 631 | top: 0; 632 | left: 0; 633 | height: 100%; 634 | 635 | & > div, .userProfileInner_c69a7b { 636 | height: 100%; 637 | max-height: unset; 638 | } 639 | 640 | .popoutContainer_ad5fac { 641 | display: block; 642 | height: 100%; 643 | 644 | & > div { 645 | height: 100%; 646 | } 647 | } 648 | 649 | // New decorations thingy 650 | .container__0ec3c { 651 | background: var(--background-tertiary); 652 | 653 | & > .ctaContainer__95bd7 { 654 | background-color: transparent; 655 | } 656 | } 657 | 658 | .userPopoutOuter_c69a7b { 659 | width: 330px; 660 | height: 100%; 661 | max-height: unset; 662 | animation: 663 | sidebarStatusTransalteX 0.5s ease, 664 | fade 0.4s ease; 665 | border-radius: 0; 666 | background: var(--background-tertiary); 667 | margin-right: 0; 668 | padding: 0; 669 | 670 | .userPopoutInner_c69a7b { 671 | max-height: unset; 672 | 673 | &::before { 674 | width: 100% !important; 675 | height: 100% !important; 676 | } 677 | } 678 | 679 | .userProfileInnerThemedNonPremium_c69a7b { 680 | background: transparent; 681 | } 682 | 683 | // Banner 684 | .header_b8cc6d { 685 | min-height: 230px; 686 | } 687 | 688 | // Avatar 689 | .avatarWrapper_f89da9 { 690 | left: calc(50% - 35px); 691 | } 692 | 693 | // Username section 694 | .body_ad5fac { 695 | position: static; 696 | } 697 | 698 | // Bubble status thingy 699 | .addCustomStatusButtonBubble_d0a252 { 700 | left: 340px; 701 | 702 | --custom-status-bubble-background: var(--background-tertiary); 703 | } 704 | 705 | .menus_ad5fac .menuOverlay_ad5fac { 706 | padding: 0; 707 | 708 | .button_f9d37d { 709 | height: unset; 710 | border-radius: 0; 711 | 712 | .menuItemInner_ad5fac { 713 | padding: 16px; 714 | } 715 | } 716 | 717 | .menuDivider_ad5fac { 718 | display: none; 719 | } 720 | } 721 | } 722 | } 723 | 724 | // Inner container (menu items, dividers, etc) 725 | div[role="group"]:not(.profileGroup-1yKk23) .item_d90b3d { 726 | &.colorDefault-CDqZdO.focused_d90b3d, 727 | &.colorDefault-CDqZdO:hover:not(.hideInteraction_d90b3d) { 728 | background: var(--epicshadow1); 729 | } 730 | } 731 | 732 | &::-webkit-scrollbar-thumb { 733 | background: var(--epicshadow1); 734 | } 735 | 736 | &.full-motion .animatorTop-3ltI52 { 737 | transition: unset !important; 738 | } 739 | 740 | .scroller_d90b3d { 741 | overflow-y: auto !important; 742 | padding-left: 0; 743 | 744 | &::-webkit-scrollbar-thumb { 745 | background: var(--epicshadow1); 746 | } 747 | } 748 | 749 | .avatarWrapper_b2ca13 .avatarSpeaking_c51b4e { 750 | border-radius: var(--avatar-radius); 751 | } 752 | 753 | // Stream previews 754 | .streamPreview_adbea6 { 755 | background: var(--background-secondary); 756 | width: 330px; 757 | 758 | .previewContainer_adbea6 { 759 | background: var(--background-secondary); 760 | height: 200px; 761 | } 762 | } 763 | 764 | // Tooltips 765 | .tooltip-14MtrL { 766 | background: var(--background-secondary-alt); 767 | } 768 | .tooltipPointer_b6c360 { 769 | border-top-color: var(--background-secondary-alt) !important; 770 | } 771 | 772 | // Invite modal 773 | .modal-atz_3z { 774 | .header_f9a4c9 { 775 | box-shadow: none; 776 | } 777 | .container__33507 { 778 | background-color: var(--background-secondary); 779 | } 780 | .title-3hptVQ { 781 | margin: 8px; 782 | } 783 | .input-2g-os5 { 784 | border-radius: 0; 785 | } 786 | .inviteRowButton-3hcOhY { 787 | width: fit-content; 788 | border: none; 789 | } 790 | 791 | & > .footer-1hTRRZ > .content-3nJg0c { 792 | .inviteBannerUpsell-1t_LYM { 793 | order: 3; 794 | margin-top: 0; 795 | } 796 | 797 | .footerText-2QLGHU { 798 | margin: 8px 8px 16px; 799 | order: 2; 800 | } 801 | 802 | .input_f8bc55 { 803 | order: 4; 804 | } 805 | 806 | .marginBottom8_f7730b { 807 | margin: 8px; 808 | order: 1; 809 | } 810 | } 811 | .content-3nJg0c:before, 812 | .title-3hptVQ { 813 | display: none; 814 | } 815 | } 816 | 817 | // Create a server 818 | .container_a4d79f { 819 | background-color: var(--background-primary); 820 | border-radius: 8px; 821 | 822 | --background-primary: #252a3e; 823 | --background-secondary: #1e2337; 824 | --background-secondary-alt-alt: #1b1d31; 825 | --header-primary: #d0d0d0; 826 | --header-secondary: #fff; 827 | --text-normal: #dcddde; 828 | --text-muted: #dcddde; 829 | --interactive-normal: #fff9f9; 830 | --primary-400: #fff; 831 | 832 | .container_a47d49 { 833 | border: none; 834 | background-color: var(--background-modifier-hover); 835 | } 836 | 837 | .input_f8bc55, 838 | .input_e8a9c7 { 839 | background-color: var(--background-secondary); 840 | } 841 | 842 | .footer_f9a4c9 .button_dd4f85.lookBlank_dd4f85 { 843 | color: var(--header-secondary); 844 | } 845 | } 846 | 847 | // New channels and role thing and member thing 848 | .container_f1fd9c, 849 | .background_e85cee, 850 | .header_f1fd9c, 851 | .emptyPage_c6b11b, 852 | .scrollerContainer_c6b11b, 853 | .container_c2efea, 854 | .container_d20375, 855 | .page_d20375, 856 | .pageBody_c2efea { 857 | background-color: var(--background-primary) !important; 858 | } 859 | .row_b53f4f, 860 | .container__33507, 861 | .channelRow_f04d06 { 862 | background-color: var(--background-secondary); 863 | } 864 | 865 | .container_b6cd66 { 866 | background-color: var(--background-tertiary) !important; 867 | } 868 | 869 | .inviteButton_d32e26 { 870 | background-color: var(--main-color); 871 | } 872 | 873 | .mainTableContainer_e23072 { 874 | background-color: var(--background-secondary); 875 | } 876 | 877 | .tableHeaderRow_e6d0a5:first-child:after { 878 | box-shadow: none; 879 | } 880 | 881 | .checkbox_f6cde8 { 882 | background-color: var(--background-primary); 883 | border: none; 884 | } 885 | 886 | // Welcome popout 887 | .contentWrapper_ed5743 { 888 | background: var(--background-primary); 889 | } 890 | 891 | // Keyboard Combos modal 892 | .keyboardShortcutsModal_ad95dc { 893 | background: var(--background-primary); 894 | 895 | .keybindShortcut-3zF1P9 span { 896 | background: var(--main-color); 897 | } 898 | } 899 | 900 | // SCTR connection 901 | .container__13b2a { 902 | border-radius: 12px; 903 | overflow: hidden; 904 | 905 | .header-2C89wJ { 906 | background-color: var(--background-tertiary); 907 | } 908 | section { 909 | background-color: var(--background-primary); 910 | } 911 | } 912 | 913 | // Picture-in-picture 914 | .pictureInPictureWindow_e0c856 { 915 | z-index: 10000; 916 | } 917 | .pictureInPictureVideo_cadaa5 .container_fc4f04 { 918 | width: 100%; 919 | } 920 | 921 | // no dividers thx 922 | .content_a7d72e:before, 923 | .divider_fc4f04, 924 | .separator_d90b3d { 925 | display: none; 926 | } 927 | 928 | // Removing borders 929 | .attachWrapper_f298d4, 930 | .panel_bf1a22, 931 | .peopleListItem_d51464, 932 | .rowWrapper_f1629a + .rowWrapper_f1629a .row_f1629a, 933 | .header_f1629a, 934 | .headerCell_f1629a, 935 | .containerBackground_ccd3df { 936 | border: none; 937 | } 938 | 939 | // UNSET TEXT TRANSFORM SOMETIMES IS BETTER THAN UPPERCASE TEXT TRANSFORM 940 | .headerText_c1d9fd, 941 | .bodyTitle-Y0qMQz, 942 | .userInfoSectionHeader-CBvMDh, 943 | .title-3hptVQ, 944 | .contentTitle_bcc24e, 945 | .header-3A13BX, 946 | .calendarPicker_be05cd .react-datepicker__current-month, 947 | :root .react-datepicker__day-name, 948 | .subSectionHeader-1bsAit { 949 | text-transform: unset; 950 | } 951 | 952 | // masks are wild 953 | .mask_c51b4e { 954 | img { 955 | border-radius: 0 !important; 956 | } 957 | 958 | foreignObject { 959 | mask: none !important; 960 | border-radius: var(--avatar-radius) !important; 961 | } 962 | } 963 | 964 | // Status masks 965 | .pointerEvents_c51b4e { 966 | mask: none !important; 967 | rx: 30; 968 | 969 | &[mask="url(#svg-mask-status-typing)"] { 970 | rx: 6; 971 | } 972 | &[mask="url(#svg-mask-status-online-mobile)"] { 973 | rx: 4; 974 | } 975 | } 976 | 977 | // Loading screen 978 | .ready_e40c16 { 979 | display: none; 980 | 981 | & + .text_e40c16 { 982 | top: 82px; 983 | 984 | &::before { 985 | content: ""; 986 | position: absolute; 987 | bottom: 100px; 988 | left: 50px; 989 | width: 200px; 990 | height: 200px; 991 | background: url("https://i.imgur.com/2XrlegJ.png") center/80% no-repeat; 992 | animation: jump 1s infinite; 993 | 994 | @keyframes jump { 995 | 0% { 996 | transform: translateY(0); 997 | } 998 | 20% { 999 | transform: translateY(-25px); 1000 | } 1001 | 40% { 1002 | transform: translateY(0); 1003 | } 1004 | 60% { 1005 | transform: translateY(-12px); 1006 | } 1007 | 100% { 1008 | transform: translateY(0); 1009 | } 1010 | } 1011 | } 1012 | } 1013 | } 1014 | 1015 | // Animation 1016 | &.full-motion .translate-PeW1wK { 1017 | transform: translateZ(0); 1018 | animation: 1019 | zoom 0.3s ease, 1020 | fade 0.3s ease; 1021 | } 1022 | 1023 | // ==> Keyframes <== 1024 | 1025 | @keyframes sidebarStatusTransalteX { 1026 | from { 1027 | transform: translateX(-15%); 1028 | } 1029 | to { 1030 | transform: none; 1031 | } 1032 | } 1033 | 1034 | @keyframes sidebarStatusTransalteXReverse { 1035 | from { 1036 | transform: translateX(15%); 1037 | } 1038 | to { 1039 | transform: none; 1040 | } 1041 | } 1042 | 1043 | @keyframes fade { 1044 | 0% { 1045 | opacity: 0; 1046 | } 1047 | 100% { 1048 | opacity: 1; 1049 | } 1050 | } 1051 | 1052 | @keyframes zoom { 1053 | from { 1054 | transform: scale(1.05); 1055 | } 1056 | to { 1057 | transform: scale(1); 1058 | } 1059 | } 1060 | 1061 | @keyframes callzoom { 1062 | from { 1063 | background: var(--background-primary); 1064 | margin: 0; 1065 | border-radius: 0; 1066 | opacity: 0; 1067 | } 1068 | to { 1069 | background: var(--background-secondary); 1070 | margin: 15px; 1071 | border-radius: 10px; 1072 | opacity: 1; 1073 | } 1074 | } 1075 | 1076 | @keyframes blink { 1077 | 79% { 1078 | content: ">_<"; 1079 | } 1080 | 80% { 1081 | content: "-_-"; 1082 | } 1083 | 90% { 1084 | content: ">_<"; 1085 | } 1086 | 100% { 1087 | content: "-_-"; 1088 | } 1089 | } 1090 | } 1091 | 1092 | // Replacing the brand colors and adding dumb colors from Discord 1093 | :root { 1094 | --brand-400: var(--main-color); 1095 | --brand-500: var(--main-color); 1096 | --text-brand: var(--main-color); 1097 | --control-brand-foreground: var(--main-color); 1098 | --card-secondary-bg: var(--background-secondary); 1099 | } -------------------------------------------------------------------------------- /stuff/_plugins_support.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | // CustomStatusPresets 3 | .scale-3UGUBw.didRender-2SiRlm { 4 | transform: scale(1) !important; 5 | } 6 | 7 | #status-picker.menu_d90b3d #status-picker-custom-status { 8 | .labelContainer-2vJzYL { 9 | padding: 0 16px; 10 | } 11 | 12 | & + .layer_cd0de5 { 13 | top: 432px !important; 14 | left: 359px !important; 15 | 16 | .submenu-1apzyU { 17 | background: var(--background-tertiary); 18 | border-radius: 0 8px 8px 0; 19 | } 20 | } 21 | } 22 | 23 | // Game Activity Toggle - BetterDiscord - Thanks DevilBro 24 | .gameActivityToggleAdded-Yd-YxC > div:last-child button:first-child { 25 | color: var(--main-color); 26 | } 27 | 28 | .activityPanel_a4d4d9 29 | ~ .gameActivityToggleAdded-Yd-YxC 30 | > div:last-child 31 | button:first-child { 32 | margin-right: 35px; 33 | } 34 | 35 | // MemberCount 36 | #MemberCount { 37 | top: 48px; 38 | 39 | .membersGroup_cbd271 { 40 | margin-top: 0; 41 | padding: 18px 8px 0 16px; 42 | } 43 | 44 | & + .members_cbd271 { 45 | margin-top: 0; 46 | padding-top: 70px; 47 | } 48 | } 49 | 50 | // Status weird behavior with BetterDiscord 51 | .mask_c51b4e > svg > mask > :not(:first-child) { 52 | display: none; 53 | } 54 | 55 | // BDFDB notifications 56 | .notice__5fd4c[id] { 57 | margin: -30px 240px 0px 90px; 58 | border-radius: 8px 8px 0 0 !important; 59 | 60 | & ~ .layers_d4b6c5 .sidebar_a4d4d9 { 61 | border-radius: 0; 62 | } 63 | } 64 | 65 | // ChannelDms 66 | .ChannelDms-channelmembers-wrap { 67 | width: 240px; 68 | 69 | .ChannelDms-channelmembers-header { 70 | margin-top: -48px; 71 | padding-top: 48px; 72 | max-height: calc(100% + 48px); 73 | background: var(--background-secondary); 74 | border-bottom-width: 0px; 75 | 76 | & + div .membersWrap_cbd271 { 77 | margin-top: 0; 78 | max-height: unset; 79 | 80 | .members_cbd271 { 81 | padding-top: 0; 82 | } 83 | } 84 | } 85 | } 86 | 87 | // ChannelsTabs 88 | #channelTabs-container { 89 | position: relative; 90 | left: 80px; 91 | width: calc(100% - 96px); 92 | background-color: var(--background-tertiary); 93 | 94 | & ~ .layers_d4b6c5 .guilds_a4d4d9 { 95 | margin-top: -85px; 96 | } 97 | } 98 | 99 | // ServerFolders 100 | ul[data-list-id="guildfoldersnav"] { 101 | margin-top: 12px; 102 | } 103 | 104 | // Vendetta plugins 105 | .vc-addon-name-author { 106 | white-space: nowrap; 107 | overflow: hidden; 108 | text-overflow: ellipsis; 109 | } 110 | } -------------------------------------------------------------------------------- /stuff/_server-list.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | .guilds_a4d4d9 { 3 | width: 90px; 4 | margin-top: -40px; 5 | 6 | // When full-screen video 7 | &.hidden_fea3ef { 8 | width: 0 !important; 9 | } 10 | 11 | &::before { 12 | content: ""; 13 | position: absolute; 14 | bottom: 135px; 15 | left: 0; 16 | z-index: 1; 17 | width: 90px; 18 | height: 100px; 19 | background: linear-gradient( 20 | 360deg, 21 | var(--background-tertiary), 22 | transparent 23 | ); 24 | pointer-events: none; 25 | } 26 | 27 | .scroller_fea3ef { 28 | padding: 30px 0; 29 | 30 | // Home button 31 | & 32 | > .tutorialContainer_c96c45:first-child 33 | > .listItem_c96c45 34 | .childWrapper_a6ce15 { 35 | background: var(--main-color); 36 | color: #fff; 37 | } 38 | 39 | // Server 40 | .listItem_c96c45 { 41 | width: 90px; 42 | margin: 0 0 12px; 43 | 44 | .wrapper_c5f96a, 45 | .svg_c5f96a { 46 | width: 42px; 47 | height: 42px; 48 | } 49 | 50 | .upperBadge_c5f96a { 51 | top: 2px; 52 | right: -1px; 53 | } 54 | 55 | // Mention badge 56 | .lowerBadge_c5f96a { 57 | bottom: 4px; 58 | right: -5px; 59 | 60 | .numberBadge_df8943 { 61 | min-width: 25px; 62 | background: var(--main-color) !important; 63 | font-size: 8px; 64 | } 65 | &:last-child .numberBadge_df8943 { 66 | box-shadow: 0 0 10px 0 #0008; 67 | } 68 | } 69 | 70 | // Server icon 71 | .wrapper__8436d { 72 | &.selected_ae80f7 .childWrapper_a6ce15, 73 | &:hover .childWrapper_a6ce15 { 74 | background: var(--main-color); 75 | } 76 | 77 | .childWrapper_a6ce15 { 78 | background: var(--background-secondary); 79 | } 80 | } 81 | 82 | defs g:last-child { 83 | display: none; 84 | } 85 | } 86 | 87 | // Server Folders 88 | .wrapper_bc7085 { 89 | width: 90px; 90 | 91 | .expandedFolderBackground_bc7085 { 92 | --custom-folder-item-guild-icon-margin: 12px !important; 93 | 94 | left: 21px; 95 | 96 | & ~ ul { 97 | .wrapper_c5f96a { 98 | width: 42px; 99 | height: 42px; 100 | border-radius: 50%; 101 | overflow: hidden; 102 | } 103 | } 104 | } 105 | 106 | .folderIconWrapper_bc7085 { 107 | transition: border-radius 200ms; 108 | 109 | &:hover { 110 | border-radius: calc(16px - 4px); 111 | } 112 | } 113 | 114 | .wrapper_c5f96a { 115 | width: 42px; 116 | 117 | & > svg > foreignObject { 118 | mask: none; 119 | 120 | .folder_bc7085 { 121 | background: transparent; 122 | } 123 | 124 | &.expanded { 125 | .expandedFolderBackground_bc7085 { 126 | background: var(--background-secondary); 127 | } 128 | } 129 | } 130 | } 131 | } 132 | 133 | // Create server + Discover buttons 134 | .circleIconButton_db6521 { 135 | border-radius: 999px; 136 | border: dashed 2px var(--epicshadow1); 137 | background: transparent; 138 | color: var(--epicshadow1); 139 | transition: all 0.2s; 140 | } 141 | 142 | .tutorialContainer_c96c45 { 143 | &:hover .circleIconButton_db6521, 144 | & + .listItem_c96c45:hover .circleIconButton_db6521 { 145 | background: transparent; 146 | color: var(--main-color); 147 | border-color: var(--main-color); 148 | } 149 | 150 | svg > foreignObject, 151 | & + .listItem_c96c45 svg > foreignObject { 152 | mask: none; 153 | } 154 | } 155 | .wrapperSimple_c5f96a foreignObject { 156 | mask: none; 157 | } 158 | 159 | // Some space for the avatar 160 | & > div:last-child { 161 | margin-bottom: 80px; 162 | } 163 | 164 | &::-webkit-scrollbar { 165 | display: none; 166 | } 167 | } 168 | 169 | .footer_aa1bff { 170 | width: 100%; 171 | padding-bottom: 70px; 172 | 173 | .listItem_c96c45 { 174 | width: 100%; 175 | } 176 | } 177 | 178 | // Mentions & Unread 179 | .mention_edf32f { 180 | height: 100%; 181 | background: linear-gradient( 182 | 360deg, 183 | transparent, 184 | var(--background-tertiary) 185 | ); 186 | transition: color 0.2s; 187 | opacity: 1; 188 | text-transform: capitalize; 189 | color: var(--textcolor); 190 | animation: fade 0.5s; 191 | border-radius: 0; 192 | 193 | &:hover { 194 | color: var(--main-color); 195 | } 196 | } 197 | .unreadMentionsIndicatorBottom_fea3ef .mention_edf32f { 198 | background: transparent; 199 | } 200 | 201 | // In server 202 | .unreadMentionsIndicatorTop_fea3ef, 203 | .unreadMentionsIndicatorBottom_fea3ef { 204 | width: 100%; 205 | height: 30px; 206 | padding: 0; 207 | } 208 | } 209 | } -------------------------------------------------------------------------------- /stuff/_settings.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | .layer_d4b6c5 { 3 | transform: unset !important; 4 | 5 | &.baseLayer_d4b6c5 { 6 | opacity: 1 !important; 7 | 8 | &.stop-animations { 9 | transform: scale(1) !important; 10 | } 11 | } 12 | &:not(.baseLayer_d4b6c5) { 13 | margin-left: 90px; 14 | } 15 | 16 | // Scroller 17 | .sidebarRegion_c25c6d { 18 | flex: unset; 19 | background: var(--background-tertiary); 20 | 21 | .sidebarRegionScroller_c25c6d { 22 | justify-content: flex-start; 23 | border-radius: 8px 0 0; 24 | 25 | .sidebar_c25c6d { 26 | width: 240px; 27 | 28 | // New search bar 29 | .searchBar_e7c031 { 30 | margin: 0 30px 15px 30px; 31 | border-radius: 8px; 32 | } 33 | 34 | .side_a0 .header_a0 { 35 | color: var(--textcolor); 36 | } 37 | 38 | .bd-sidebar-header-label { 39 | color: var(--textcolor); 40 | padding: 0; 41 | } 42 | 43 | .side_a0 .header_a0, 44 | .side_a0 .item_a0, 45 | .bd-sidebar-header { 46 | padding: 6px 30px; 47 | border-radius: 0; 48 | } 49 | 50 | // Discord social stuff 51 | .socialLinks_c44e94 { 52 | justify-content: center; 53 | display: flex; 54 | flex-direction: row; 55 | } 56 | 57 | // Client informations 58 | .info_c5a741 { 59 | padding-left: 30px; 60 | } 61 | } 62 | .sidebar_c25c6d, 63 | .flexChild_dc333f { 64 | padding-left: 0 !important; 65 | padding-right: 0 !important; 66 | } 67 | 68 | &::-webkit-scrollbar { 69 | display: none; 70 | } 71 | } 72 | } 73 | 74 | // Panel 75 | .contentColumn_c25c6d, 76 | .customColumn_c25c6d { 77 | min-width: unset; 78 | max-width: 95%; 79 | } 80 | 81 | // Close button 82 | .toolsContainer_c25c6d { 83 | position: absolute; 84 | right: 0px; 85 | 86 | .closeButton_df5532 { 87 | &:active { 88 | transform: none; 89 | } 90 | 91 | &::before { 92 | content: ""; 93 | position: fixed; 94 | top: 0; 95 | left: 0; 96 | width: 90px; 97 | height: 100%; 98 | z-index: 100; 99 | } 100 | } 101 | } 102 | } 103 | 104 | // Save bar 105 | .noticeRegion_c25c6d { 106 | right: 0; 107 | max-width: 100%; 108 | 109 | .container_b6cd66 { 110 | background-color: var(--background-secondary) !important; 111 | } 112 | } 113 | 114 | // -- User settings -- 115 | 116 | // My account 117 | @media (max-width: 1465px) { 118 | .accountProfileCard_b69b77 { 119 | flex-direction: column; 120 | 121 | .mask_d5fdb1 { 122 | position: absolute; 123 | min-height: 150px !important; 124 | max-width: 100% !important; 125 | 126 | mask { 127 | display: none; 128 | } 129 | foreignObject { 130 | y: -51px !important; 131 | } 132 | } 133 | 134 | // Banner 135 | .banner_d5fdb1 { 136 | border-radius: 8px 8px 0 0 !important; 137 | height: 200px !important; 138 | flex: unset !important; 139 | } 140 | 141 | // User info 142 | .userInfo_b69b77 { 143 | height: 150px !important; 144 | margin-left: 0 !important; 145 | justify-content: space-evenly !important; 146 | 147 | // Badges 148 | .container_b64375 { 149 | justify-content: center; 150 | } 151 | } 152 | 153 | .background_b69b77 { 154 | margin-top: 150px !important; 155 | flex: unset !important; 156 | } 157 | } 158 | } 159 | 160 | .accountProfileCard_b69b77 { 161 | display: flex; 162 | background-color: var(--background-secondary); 163 | 164 | .mask_d5fdb1 { 165 | mask { 166 | display: none; 167 | } 168 | foreignObject { 169 | y: -110px; 170 | } 171 | } 172 | 173 | // Banner 174 | .banner_d5fdb1 { 175 | -webkit-mask-image: linear-gradient( 176 | rgba(0, 0, 0, 0.7607843137), 177 | rgba(0, 0, 0, 0.7607843137) 178 | ); 179 | border-radius: 8px 0 0 8px; 180 | height: 320px !important; 181 | flex: 1; 182 | } 183 | 184 | // User info 185 | .userInfo_b69b77 { 186 | position: absolute; 187 | display: grid; 188 | grid-template-areas: 189 | "avatar username" 190 | "avatar button"; 191 | gap: 20px; 192 | overflow: hidden; 193 | height: 100%; 194 | padding: 0; 195 | justify-content: flex-start; 196 | margin-left: 40px; 197 | 198 | // Avatar 199 | .avatar_b69b77 { 200 | grid-area: avatar; 201 | position: static; 202 | width: 120px !important; 203 | height: 120px !important; 204 | border: none; 205 | background: none; 206 | align-self: center; 207 | 208 | .mask_c51b4e { 209 | width: 120px; 210 | height: 120px; 211 | } 212 | } 213 | 214 | .badgeList_b69b77 { 215 | background-color: transparent; 216 | } 217 | 218 | // Username 219 | & > div:nth-child(2) { 220 | grid-area: username; 221 | align-self: flex-end; 222 | } 223 | 224 | // Edit profile 225 | button:last-child { 226 | grid-area: button; 227 | } 228 | } 229 | 230 | .background_b69b77 { 231 | margin: 0; 232 | flex: 1; 233 | } 234 | } 235 | 236 | // User profile 237 | .profileCustomizationSection_bad983 .baseLayout_bad983 { 238 | & > :first-child { 239 | flex: 2 auto; 240 | } 241 | 242 | .userPopoutInner_c69a7b:before { 243 | width: calc(100% - 8px) !important; 244 | } 245 | 246 | // Banner 247 | .header_f4c122 { 248 | min-height: 210px; 249 | } 250 | .header_f4c122 > .mask_d5fdb1 { 251 | overflow: visible; 252 | min-height: unset !important; 253 | contain: unset; 254 | 255 | .banner_d5fdb1 { 256 | position: absolute; 257 | height: 200px !important; 258 | -webkit-mask-image: linear-gradient(#000000c2, #000000c2); 259 | clip-path: polygon( 260 | 0 0, 261 | 100% 0, 262 | 100% calc(100% - 25px), 263 | 50% 100%, 264 | 0 calc(100% - 25px) 265 | ); 266 | } 267 | 268 | & > foreignObject { 269 | mask: none; 270 | } 271 | } 272 | 273 | // Avatar 274 | .avatar_f18fcb { 275 | top: 15px; 276 | left: 50%; 277 | margin-left: -40px; 278 | 279 | .avatarUploaderInner_ab876d { 280 | border: none; 281 | border-radius: var(--avatar-radius); 282 | } 283 | 284 | .imageUploaderIcon_de76e4 { 285 | display: none; 286 | } 287 | .status_ab876d { 288 | background-color: transparent; 289 | } 290 | } 291 | 292 | // User infos 293 | 294 | 295 | // Status + About Me 296 | .customStatus__3aa7f { 297 | padding-top: 12px; 298 | } 299 | 300 | .divider-1wtgZ3 { 301 | display: none; 302 | } 303 | } 304 | 305 | .bioTextArea_ccf27d { 306 | border-radius: 8px; 307 | } 308 | 309 | // Privacy & Safety 310 | .item-2idW98 { 311 | background: var(--background-secondary); 312 | transition: transform 200ms; 313 | 314 | &:hover { 315 | background: var(--background-secondary); 316 | } 317 | } 318 | 319 | // Family center 320 | #family-center-tab .max-width_d00e26, #family-center-tab .max-width_a2e886, #requests-tab .container_f70f48 { 321 | max-width: unset; 322 | } 323 | 324 | // Connections 325 | .connectionHeader_e2a436 { 326 | background: transparent; 327 | 328 | .connectionDelete_e2a436 { 329 | border-color: transparent; 330 | border-radius: 50%; 331 | padding: 8px 8px 5px 8px; 332 | transition: background 100ms; 333 | 334 | &:hover { 335 | background: #fff2; 336 | } 337 | } 338 | } 339 | 340 | // Nitro 341 | .premiumLabel_ae3c77 { 342 | flex-direction: row-reverse; 343 | justify-content: flex-end; 344 | 345 | svg { 346 | margin-right: 8px; 347 | } 348 | 349 | & + .selectedBackground_ae3c77 { 350 | background-color: var(--background-modifier-selected); 351 | border-radius: 0; 352 | } 353 | } 354 | 355 | // Boost 356 | .cardWrapper_f9902b { 357 | transform: translateZ(0); 358 | overflow: hidden; 359 | background: #0008; 360 | --header-primary: #fff; 361 | 362 | .tierLabel__41356 { 363 | color: #fff; 364 | font-weight: 500; 365 | } 366 | .gemIndicatorContainer_b03ca0 { 367 | background: transparent; 368 | backdrop-filter: blur(5px); 369 | 370 | .gemWithoutLabel__6225b { 371 | color: #999; 372 | } 373 | } 374 | 375 | .icon_a64689 { 376 | border-radius: 8px; 377 | 378 | &::before { 379 | content: ""; 380 | position: fixed; 381 | top: 0; 382 | left: 0; 383 | width: 100%; 384 | height: 100%; 385 | background-image: inherit; 386 | background-repeat: no-repeat; 387 | background-size: cover; 388 | background-position: 50% 50%; 389 | z-index: -1; 390 | opacity: 0.5; 391 | filter: blur(20px); 392 | } 393 | } 394 | } 395 | 396 | // Gift Inventory 397 | .promotionCard_e8af36 { 398 | border-radius: 8px; 399 | } 400 | 401 | // Billing 402 | .paymentPane_f66684, 403 | .codeRedemptionRedirect_cb70f4 { 404 | background: var(--background-secondary); 405 | border: none; 406 | 407 | .paginator_f66684, 408 | .bottomDivider_f66684 { 409 | background: transparent; 410 | } 411 | .paymentRow_f66684 { 412 | border: none; 413 | 414 | .expandedInfo_a28a08 { 415 | background: var(--background-primary); 416 | } 417 | } 418 | } 419 | 420 | // Voice settings 421 | .micTest_ca3055 .notches_e5cdf3.gray_e5cdf3 { 422 | color: var(--background-primary); 423 | } 424 | 425 | // Activity status 426 | .addGamePopout_fd966d { 427 | background: var(--background-secondary); 428 | box-shadow: none; 429 | 430 | .divider_b8ab18 { 431 | display: none; 432 | } 433 | } 434 | .gameNameInput_fd966d { 435 | padding: 8px; 436 | 437 | &:focus, 438 | &:hover { 439 | background-color: var(--background-primary); 440 | border: none; 441 | } 442 | } 443 | 444 | // Game overlay 445 | .notificationSettings-1U0JsJ { 446 | max-width: unset; 447 | 448 | .wrapper_b877fa { 449 | border: none; 450 | background: var(--background-secondary); 451 | border-radius: 20px; 452 | 453 | .option_b877fa { 454 | margin: 10px; 455 | border-radius: 16px; 456 | background: var(--epicshadow1); 457 | 458 | &:hover { 459 | background: var(--main-color); 460 | opacity: 0.4; 461 | } 462 | &.selected_b877fa { 463 | background: var(--main-color); 464 | box-shadow: unset; 465 | } 466 | } 467 | } 468 | } 469 | 470 | // Hypesquad 471 | .membershipDialog-2wAdpQ { 472 | border-radius: 10px; 473 | 474 | &:after { 475 | left: 5px; 476 | } 477 | } 478 | .videoWrapper_b8e00f { 479 | background: transparent; 480 | 481 | iframe { 482 | margin: auto; 483 | border-radius: 10px; 484 | } 485 | } 486 | 487 | // -- Server settings -- 488 | 489 | // Overview 490 | .avatarUploaderInner_f0a9ff { 491 | border-radius: 16px; 492 | box-shadow: none; 493 | } 494 | 495 | .imageUploaderIcon_de76e4 { 496 | display: none; 497 | } 498 | 499 | // Roles 500 | .customScroller_c25c6d > div, 501 | .contentWidth_bd05f1 { 502 | max-width: unset; 503 | } 504 | .customColorPicker_bbc020 { 505 | background: var(--background-secondary); 506 | border: none; 507 | border-radius: 8px; 508 | 509 | .customColorPickerInputContainer_e467bb .input_f8bc55 { 510 | background-color: var(--background-secondary); 511 | } 512 | } 513 | 514 | // Emoji 515 | .emojiAliasInput-1y-NBz .emojiInput-1aLNse { 516 | background: var(--background-primary); 517 | } 518 | 519 | // Audit log 520 | .auditLog_eebd33 { 521 | border: none; 522 | border-radius: 8px; 523 | overflow: hidden; 524 | 525 | .header_eebd33, 526 | .changeDetails_eebd33 { 527 | background: var(--background-secondary); 528 | } 529 | .divider_eebd33 { 530 | display: none; 531 | } 532 | } 533 | 534 | // Widget 535 | .copyInput_d7e343 { 536 | border: none; 537 | border-radius: 8px; 538 | } 539 | 540 | // App directory 541 | .directoryContainer_da3f59 { 542 | background-color: var(--background-primary); 543 | } 544 | 545 | // Discovery 546 | .modal-1gWd9S, 547 | .container_a74b6f { 548 | .footer_ffaecb { 549 | border-bottom-left-radius: 0 !important; 550 | } 551 | } 552 | 553 | // Membership Screening 554 | .editCircle-2uL_D3, 555 | .editCircle-ityklj { 556 | background: var(--background-primary); 557 | } 558 | .formFieldWrapper-2LV3S6 { 559 | border: none; 560 | } 561 | 562 | // Discovery 563 | .sparkles-2XXTZO { 564 | z-index: unset; 565 | } 566 | 567 | // Server Boost Status 568 | .background_bfac79 { 569 | color: var(--background-secondary); 570 | } 571 | .tierInProgress_bfac79, 572 | .tierBody_da77bd, 573 | .tierHeaderLocked_da77bd, 574 | .tierHeaderUnlocked_da77bd { 575 | background: var(--background-secondary); 576 | } 577 | 578 | // Members 579 | .overflowRolesPopout_e4010c, 580 | .overflowRolesPopoutArrow_e4010c { 581 | background: var(--background-secondary); 582 | box-shadow: none; 583 | } 584 | } -------------------------------------------------------------------------------- /stuff/_user-area.scss: -------------------------------------------------------------------------------- 1 | :root { 2 | .panels_a4d4d9 { 3 | position: relative; 4 | z-index: unset; 5 | 6 | // Game part 7 | .activityPanel_a4d4d9 { 8 | position: absolute; 9 | bottom: 20px; 10 | right: 105px; 11 | padding: 0; 12 | border-radius: 8px; 13 | 14 | .gameWrapper_bf1a22 { 15 | display: none; 16 | } 17 | .actions_bf1a22 { 18 | margin: 0; 19 | 20 | .button_dd4f85 { 21 | color: var(--main-color); 22 | } 23 | } 24 | 25 | &:hover { 26 | background-color: var(--background-modifier-selected); 27 | } 28 | } 29 | 30 | & > .container_b2ca13 { 31 | padding: 10px 8px; 32 | 33 | // Avatar 34 | .avatarWrapper_b2ca13[aria-expanded] { 35 | .wrapper_c51b4e { 36 | position: fixed; 37 | left: 29px; 38 | bottom: 23px; 39 | z-index: 1; 40 | } 41 | 42 | &:hover { 43 | background-color: transparent; 44 | } 45 | } 46 | 47 | // Username 48 | .title-3XlmeX { 49 | font-weight: 500; 50 | } 51 | 52 | // Buttons 53 | .button_adca65 { 54 | color: #888; 55 | 56 | &[aria-checked="false"].enabled_adca65 { 57 | color: var(--main-color); 58 | } 59 | } 60 | } 61 | } 62 | 63 | // Server call 64 | .noChat_d880dc { 65 | &.wrapper_d880dc { 66 | background: #000; 67 | margin: 0; 68 | border-radius: 0; 69 | animation: unset; 70 | 71 | // Header top 72 | .headerWrapper_d880dc .container_fc4f04 { 73 | width: unset; 74 | } 75 | 76 | // Speaking ring 77 | .border_ba4b17.speaking_ba4b17 { 78 | box-shadow: inset 0 0 0 2.5px #43b581, 79 | inset 0 0 0 4.5px var(--background-secondary); 80 | } 81 | 82 | // Button 83 | .wrapper_b6e2f9 .button_dd4f85 { 84 | border-radius: 50%; 85 | } 86 | .colorable_ef18ee.primaryDark_ef18ee, 87 | .participantsButton_b83b18, 88 | .participantsButton_b83b18:hover { 89 | background: var(--background-secondary); 90 | } 91 | .css-1k9nrkn { 92 | background: transparent; 93 | } 94 | .controlButton_b6e2f9 foreignObject { 95 | mask: none; 96 | } 97 | } 98 | } 99 | } --------------------------------------------------------------------------------