├── README.md └── quiet.theme.css /README.md: -------------------------------------------------------------------------------- 1 | # Download theme now! 2 | -------------------------------------------------------------------------------- /quiet.theme.css: -------------------------------------------------------------------------------- 1 | //META{"name":"Raided - Quiet","description":"Need some help? Go to our website http://www.raided.cf/quiet.theme/","author":"Andre#6244","version":"0.0.1"}*//{} 2 | @import url('https://fonts.googleapis.com/css?family=Squada+One'); 3 | 4 | /* 5 | MAIN VARS 6 | Change these to modify dark matter's colors. 7 | */ 8 | 9 | :root { 10 | --main-color: rgba(37,172,232,1); 11 | --main-color-faded: rgba(37,172,232,0.2); 12 | --accent-color: rgba(29,101,134,1); 13 | --dark-color: #161921; 14 | 15 | /* Modal Background Color / Opacity */ 16 | --short-gradient: linear-gradient(45deg, rgba(29,101,134,0.5), rgba(37,172,232,0.5)); 17 | --short-gradient-faded: linear-gradient(45deg, rgba(29,101,134,0.1), rgba(37,172,232,0.1)); 18 | } 19 | 20 | /* 21 | _ _ _ 22 | __ _ _ __ _ __ | |__ __ _ ___| | ____ _ _ __ ___ _ _ _ __ __| | 23 | / _` | '_ \| '_ \ | '_ \ / _` |/ __| |/ / _` | '__/ _ \| | | | '_ \ / _` | 24 | | (_| | |_) | |_) | | |_) | (_| | (__| < (_| | | | (_) | |_| | | | | (_| | 25 | \__,_| .__/| .__/ |_.__/ \__,_|\___|_|\_\__, |_| \___/ \__,_|_| |_|\__,_| 26 | |_| |_| |___/ 27 | */ 28 | 29 | body{ 30 | background:rgba(0,0,0, 0.7) !important; 31 | background-color:rgba(0,0,0, 0.7) !important; 32 | font-family: font-family: 'Squada One', cursive !important; 33 | } 34 | 35 | 36 | .app, 37 | .callout-backdrop { 38 | background-image: url(http://i.imgur.com/jLifJPd.jpg); 39 | background-size: cover !important; 40 | } 41 | 42 | 43 | 44 | .message-group-blocked { 45 | display: none; 46 | } 47 | 48 | .wordmark-2iDDfm path { 49 | fill:transparent; 50 | } 51 | 52 | #app-mount .chat-3bRxxu{background:transparent} 53 | #app-mount .content-yTz4x3{background:transparent} 54 | #app-mount .chat-3bRxxu form{background:transparent;color:white;} 55 | #app-mount .channelTextArea-rNsIhG{background:transparent} 56 | #app-mount .inner-zqa7da{background:transparent} 57 | #app-mount .textArea-2Spzkt{background:black} 58 | 59 | 60 | 61 | .guilds-wrapper {background-color:rgba(0,0,0, 0.7) !important;} 62 | .channels-Ie2l6A {background-color:rgba(0,0,0, 0.7) !important;} 63 | .content .flex-spacer {background-color:rgba(0,0,0, 0.7) !important;} 64 | .channel-members {background-color:rgba(0,0,0, 0.7) !important;} 65 | 66 | 67 | 68 | #friends .btn, 69 | .add-friend-popout .btn { 70 | background-color: var(--main-color) !important; 71 | } 72 | 73 | .add-friend-popout .btn:disabled { 74 | background-color: var(--accent-color) !important; 75 | opacity: 0.4; 76 | } 77 | 78 | .private-channels .channel.btn-friends .badge { 79 | margin-right: 10px; 80 | } 81 | 82 | .private-channels .channel .close { 83 | margin-right: 5px; 84 | } 85 | 86 | #friends { 87 | background: transparent !important; 88 | } 89 | 90 | .friends-header { 91 | background: rgba(0,0,0,0.95) !important; 92 | } 93 | 94 | .friends-table { 95 | background:rgba(0,0,0,0.85) !important; 96 | margin-top:0 !important; 97 | } 98 | 99 | .friends-header, 100 | .friends-table .friends-table-header { 101 | border-bottom: 1px solid hsla(0,0%,100%,.1) !important; 102 | } 103 | 104 | .friends-header .tab-bar .tab-bar-separator, 105 | .friends-table .friends-table-header .friends-column-separator { 106 | background-color:hsla(0,0%,100%,.1) !important; 107 | } 108 | 109 | .friends-table .friends-table-body { 110 | padding-top:20px !important; 111 | } 112 | 113 | .friends-table .friends-row:hover { 114 | background: rgba(0,0,0,0.7) !important; 115 | } 116 | 117 | /* 118 | _ _ _ _ _ 119 | _ _ ___ ___ _ __ | (_)___| |_ ___ ___ ___| |_(_) ___ _ __ 120 | | | | / __|/ _ \ '__| | | / __| __| / __|/ _ \/ __| __| |/ _ \| '_ \ 121 | | |_| \__ \ __/ | | | \__ \ |_ \__ \ __/ (__| |_| | (_) | | | | 122 | \__,_|___/\___|_| |_|_|___/\__| |___/\___|\___|\__|_|\___/|_| |_| 123 | 124 | */ 125 | 126 | .channel-members .member.popout-open, 127 | .channel-members .member:hover { 128 | background: rgba(255,255,255,0.07) !important; 129 | } 130 | 131 | .channel-members .invite-btn { 132 | background:var(--accent-color); 133 | } 134 | 135 | .channel-members .invite-btn:hover { 136 | background:var(--main-color); 137 | } 138 | 139 | .channel-members .bot-tag { 140 | padding: 0px8px; 141 | color:black; 142 | } 143 | 144 | 145 | .channel-members .member:hover { 146 | background:rgba(255,255,255,0.07) !important; 147 | } 148 | 149 | .channel-members .member .member-username { 150 | font-size:12px; 151 | } 152 | 153 | .channel-members .member .member-game { 154 | font-size:10px; 155 | } 156 | 157 | .channel-members .avatar-small .status { 158 | border-color:rgba(0,0,0,0.7) !important; 159 | } 160 | 161 | .channel-members h2 { 162 | background: rgba(0,0,0,0); 163 | padding-top: 10px; 164 | padding-bottom: 10px; 165 | } 166 | 167 | .channel-members .member+h2 { 168 | margin-top:12px; 169 | } 170 | 171 | .channel-members h2:first-of-type { 172 | margin-top:0px !important; 173 | } 174 | 175 | .activityFeed-28jde9 176 | { 177 | background-color:rgba(0,0,0, 0.7) !important; 178 | } 179 | [class*=cardBody] 180 | { 181 | background: #202d41 !important; 182 | } 183 | 184 | .activityFeed-28jde9 .header-1RC2Wb 185 | { 186 | background: rgba(0, 62, 134, 0.164) !important; 187 | } 188 | 189 | .dockItem-2kQDqg:hover 190 | { 191 | background: #202d41 !important; 192 | } 193 | 194 | .activityFeed-28jde9 [class*=article], 195 | .activityFeed-28jde9 .carousel-JbsNzL 196 | { 197 | background: transparent !important; 198 | } 199 | 200 | .contentHoveredText-2D9B-x 201 | { 202 | background: rgb(0,0,0, 0.7) !important; 203 | } 204 | 205 | 206 | .messages-wrapper, [class*=chat], .channel-members, .scroller-NXV0-d, .container-3lnMWU, .typing-3eiiL_, 207 | [class*=sidebar-region-scroller], [class*=content-transition-wrap], [id*=bd-settingspane-container], 208 | [class*=scrollerWrap-2uBjct], .topSectionPlaying-3jAH9b, .topSectionNormal-2LlRG1, .members-1bid1J { 209 | background-color:rgba(0,0,0, 0.7) !important 210 | } 211 | 212 | form .container-iksrDt { 213 | color:black; 214 | } 215 | 216 | [class*=channelTextArea]{ 217 | margin-left: 20px; 218 | margin-right: 20px; 219 | } 220 | 221 | 222 | 223 | #app-mount .guildsWrapper-5TJh6A { 224 | background: rgba(0,0,0, 0.7) !important; 225 | } 226 | 227 | 228 | .theme-dark .typing-2GQL18 span { 229 | font-size: 0px; 230 | } 231 | 232 | .theme-dark .typing-2GQL18 strong { 233 | font-size: 13px; 234 | color:white; 235 | } 236 | 237 | .theme-dark .typing-2GQL18::after { 238 | color: lightgrey; 239 | text-indent: 3px; 240 | font-size: 13px; 241 | font-weight: 500; 242 | height: 5px; 243 | line-height: 0; 244 | content: " is Slapping Their Face Against The Keyboard..." 245 | } 246 | 247 | #app-mount { 248 | background:rgba(0,0,0, 0.7) !important; 249 | } 250 | 251 | 252 | 253 | 254 | .contentUnreadText-2vNnZc { 255 | background-color: rgb(0,0,0, 0.7); 256 | } 257 | 258 | .unread-1Dp-OI { 259 | background-color:white; 260 | border-radius: 5px 0px; 261 | height: 32px; 262 | left: 3px; 263 | margin-top: 2px; 264 | position: absolute; 265 | top: -1px; 266 | width: 6px; 267 | } 268 | 269 | .guild-1EfMGQ { 270 | border:solid 1px rgba(0,0,0, 0); 271 | border-radius:50%; 272 | transition:0.2s; 273 | } 274 | .guild-1EfMGQ:hover { 275 | border:solid 1px black; 276 | border-radius:30%; 277 | transition:0.2s; 278 | } 279 | 280 | 281 | 282 | 283 | .image-33JSyf 284 | { 285 | border-radius: 4px !important; 286 | } 287 | [class*=members] [class*=avatar] [class*=image] 288 | { 289 | border-radius: 4px !important; 290 | mask: unset; 291 | -webkit-mask: unset; 292 | } 293 | 294 | .theme-dark #friends { 295 | background-color: transparent; 296 | } 297 | .theme-dark .headerBar-UHpsPw { 298 | background: rgba(0,0,0, 0.7); 299 | } 300 | 301 | .theme-dark .botTagRegular-2HEhHi { 302 | background:rgba(0,0,0, 0.07); 303 | color: white; 304 | padding:2px 7px; 305 | font-size:10px; 306 | } 307 | 308 | .theme-dark .members-1998pB { 309 | background:rgba(0,0,0,0) !important; 310 | } 311 | 312 | 313 | 314 | 315 | 316 | 317 | 318 | 319 | 320 | 321 | 322 | 323 | 324 | .theme-dark .divider-3gKybi:before, .theme-dark .divider-3gKybi span { 325 | font-size:12px; 326 | content:""; 327 | text-transform: lowercase; 328 | } 329 | 330 | 331 | .theme-dark .member-3W1lQa .content-OzHfo4 { 332 | border:solid 5px rgba(0,0,0, 0); 333 | border-radius: 5px 0px; 334 | } 335 | 336 | .theme-dark .member-3W1lQa:hover .content-OzHfo4 { 337 | border:solid 5px white; 338 | border-radius: 5% 0px; 339 | transition:0.2s; 340 | } 341 | 342 | /* Person Info */ 343 | .theme-dark .headerNormal-T_seeN { 344 | background-color: hsla(0,5%,0%,.3); 345 | } 346 | .theme-dark .body-3iLsc4, .theme-dark .footer-1fjuF6 { 347 | background-color: hsla(0,5%,0%,.3); 348 | color: hsla(0,0%,100%,.8); 349 | } 350 | /* Person Info message box Transparency */ 351 | .theme-dark .quickMessage-1yeL4E { 352 | background-color: hsla(0,5%,0%,.3); 353 | border-color: rgb(0,0,0); 354 | color: hsla(0,0%,100%,.7); 355 | } 356 | /* Person Info Border */ 357 | .theme-dark .userPopout-3XzG_A { 358 | border-radius: 15px; 359 | box-shadow: 0 2px 10px 0 rgba(0,0,0,.2), 0 0 0 1px rgb(0,0,0); 360 | } 361 | 362 | /* Person Info While on Spotify color */ 363 | .theme-dark .headerSpotify-zpWxgT { 364 | background: hsla(141, 73%, 42%,.3); 365 | } 366 | 367 | /* Person Info While playing a game color */ 368 | .theme-dark .headerPlaying-j0WQBV { 369 | background: hsla(0,5%,0%,.3); 370 | } 371 | 372 | .theme-dark .chat-3bRxxu, .theme-dark .chat-3bRxxu form, .theme-dark .content-yTz4x3 { 373 | background-color:transparent; 374 | } 375 | 376 | .theme-dark .messagesWrapper-3lZDfY { 377 | background:rgba(0,0,0,0) !important; 378 | } 379 | 380 | 381 | 382 | 383 | 384 | 385 | 386 | 387 | 388 | 389 | 390 | 391 | 392 | 393 | 394 | 395 | 396 | 397 | 398 | 399 | .bda-dark .emoji-picker, .bda-dark .emojiPicker-3m1S-j { 400 | background-color: hsla(0,5%,0%,.3); 401 | border: 3px solid #000; 402 | border-radius: 15px; 403 | } 404 | .bda-dark .emoji-picker .header .search-bar, .bda-dark .emojiPicker-3m1S-j .header-1nkwgG .search-bar { 405 | background-color: hsla(0,5%,0%,.0); 406 | } 407 | .theme-dark .search-bar .search-bar-inner { 408 | background: hsla(0,5%,0%,.3); 409 | border: 1px solid rgb(0,0,0); 410 | border-radius: 15px; 411 | } 412 | .emojiPicker-3m1S-j .stickyHeader-1SS0JU { 413 | background: transparent; 414 | } 415 | .bda-dark .emoji-picker .category, .bda-dark .emojiPicker-3m1S-j .category-2U57w6 { 416 | background-color: transparent; 417 | } 418 | /* Text color at emoji Page */ 419 | .emojiPicker-3m1S-j .category-2U57w6 { 420 | color: #fff; 421 | } 422 | /* Scroll remove background at Emoji Page */ 423 | .theme-dark .bda-dark .emoji-picker .scroller::-webkit-scrollbar, .bda-dark .emoji-picker .scroller::-webkit-scrollbar-track, .bda-dark .emoji-picker .scroller::-webkit-scrollbar-track-piece, .bda-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar, .bda-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar-track, .bda-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar-track-piece { 424 | background-color: transparent !important; 425 | border-color: transparent !important; 426 | } 427 | .theme-dark ::-webkit-scrollbar-thumb:hover, .chat-3bRxxu ::-webkit-scrollbar-thumb:hover { 428 | background-color: hsla(360, 0%, 57%, 0.3)!important; 429 | } 430 | /* border bottom color at Emoji page */ 431 | .theme-dark .emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.selected-39BZ4S { 432 | border-bottom-color: hsla(360, 0%, 57%, 0.3)!important; 433 | } 434 | 435 | 436 | 437 | /* 438 | _ _ 439 | ___ ___ _ __ ___ ___| | ___ _ __ ___ ___ _ __ | |_ ___ 440 | / __/ _ \| '__/ _ \ / _ \ |/ _ \ '_ ` _ \ / _ \ '_ \| __/ __| 441 | | (_| (_) | | | __/ | __/ | __/ | | | | | __/ | | | |_\__ \ 442 | \___\___/|_| \___| \___|_|\___|_| |_| |_|\___|_| |_|\__|___/ 443 | 444 | */ 445 | 446 | div>*:not(code) { 447 | font-family: 'Karla',Whitney,Helvetica Neue,Helvetica,Arial,Lucida Grande,sans-serif !important; 448 | } 449 | 450 | textarea { 451 | background: transparent !important; 452 | } 453 | 454 | .scroller-wrap .scroller::-webkit-scrollbar-thumb { 455 | border: 3px solid rgba(255,255,255,0) !important; 456 | background-color: var(--accent-color) !important; 457 | } 458 | 459 | .scroller-wrap .scroller::-webkit-scrollbar-track-piece { 460 | border: 3px solid rgba(255,255,255,0) !important; 461 | background-color: rgba(0,0,0,0.3) !important; 462 | } 463 | 464 | 465 | /* 466 | _ _ _ 467 | | |__ (_) __| | ___ 468 | | '_ \| |/ _` |/ _ \ 469 | | | | | | (_| | __/ 470 | |_| |_|_|\__,_|\___| 471 | 472 | */ 473 | 474 | .links, 475 | .help-container { 476 | display: none; 477 | } 478 | 479 | .layers, 480 | .container-PNkimc, 481 | .container-2lgZY8, 482 | .theme-dark .layer-3QrUeG, 483 | .theme-dark .layers-3iHuyZ, 484 | .theme-dark .chat form { 485 | background: transparent !important; 486 | } 487 | 488 | /* 489 | _ _ _ _ 490 | _ __ ___ __ _(_)_ __ | |__ __ _ ___| | ____ _ _ __ ___ _ _ _ __ __| |___ 491 | | '_ ` _ \ / _` | | '_ \ | '_ \ / _` |/ __| |/ / _` | '__/ _ \| | | | '_ \ / _` / __| 492 | | | | | | | (_| | | | | | | |_) | (_| | (__| < (_| | | | (_) | |_| | | | | (_| \__ \ 493 | |_| |_| |_|\__,_|_|_| |_| |_.__/ \__,_|\___|_|\_\__, |_| \___/ \__,_|_| |_|\__,_|___/ 494 | |___/ 495 | */ 496 | 497 | .links, 498 | .chat, 499 | .typing-2GQL18, 500 | .content, 501 | .guild-channels, 502 | .private-channels, 503 | .guild-header header, 504 | .divider-red span, 505 | .messages-wrapper, 506 | #rtc-connection, 507 | #voice-connection { 508 | background: transparent !important; 509 | } 510 | 511 | .guilds-wrapper { background:rgba(0,0,0,0.6) !important } 512 | 513 | .channels-Ie2l6A { background:rgba(0,0,0,0.7) } 514 | 515 | .content .flex-spacer { background:rgba(0,0,0,0.8) } 516 | 517 | .channel-members { background:rgba(0,0,0,0.9) !important } 518 | 519 | .tooltip { 520 | background: var(--accent-color); 521 | color: #e0e0e0; 522 | } 523 | 524 | .tooltip.tooltip-right:after { 525 | border-right-color:var(--accent-color); 526 | } 527 | 528 | .tooltip.tooltip-top:after { 529 | border-top-color:var(--accent-color); 530 | } 531 | 532 | .tooltip.tooltip-bottom:after { 533 | border-bottom-color:var(--accent-color); 534 | } 535 | 536 | /* 537 | _ _ _ _ _ 538 | ___ ___ _ ____ _____ _ __ | (_)___| |_ ___ ___ ___| |_(_) ___ _ __ 539 | / __|/ _ \ '__\ \ / / _ \ '__| | | / __| __| / __|/ _ \/ __| __| |/ _ \| '_ \ 540 | \__ \ __/ | \ V / __/ | | | \__ \ |_ \__ \ __/ (__| |_| | (_) | | | | 541 | |___/\___|_| \_/ \___|_| |_|_|___/\__| |___/\___|\___|\__|_|\___/|_| |_| 542 | 543 | */ 544 | 545 | .typeMacOS-3EmCyP { 546 | background: rgba(0,0,0,0.6); 547 | width: 71px; 548 | box-shadow: inset -10px 0px 20px -10px rgba(0,0,0,0.3); 549 | } 550 | 551 | .name-3M0b8v { 552 | font-size: 14px; 553 | } 554 | 555 | .icon-sxakjD { 556 | width: 14px; 557 | height: 14px; 558 | } 559 | 560 | .unread-1Dp-OI { 561 | background-color: var(--main-color); 562 | } 563 | 564 | .container-2Thooq { 565 | height: 75px; 566 | background: rgba(0,0,0,0.8); 567 | padding: 0 10px 0 15px; 568 | } 569 | 570 | .contentSelectedText-3wUhMi { 571 | background: rgba(0,0,0,0.8); 572 | } 573 | 574 | .contentSelectedText-3wUhMi:hover { 575 | background: rgba(0,0,0,0.8); 576 | } 577 | 578 | .contentHoveredText-2D9B-x, 579 | .contentHoveredVoice-3p_NEO:active, 580 | .contentSelectedVoice-1WDIBM:active { 581 | background: rgba(0,0,0,0.5); 582 | } 583 | 584 | .create-guild-container { 585 | background: none !important; 586 | } 587 | 588 | .create-guild-container .action { 589 | background: rgba(0,0,0,0.7); 590 | } 591 | 592 | .create-guild-container .create-or-join .actions .or { 593 | -webkit-filter: opacity(0.9) invert(); 594 | color: #000; 595 | } 596 | 597 | .create-guild-container .action.create .action-icon, 598 | .create-guild-container .action.join .action-icon { 599 | -webkit-filter:invert() hue-rotate(150deg); 600 | } 601 | 602 | .create-guild-container.deprecated .action { 603 | background: transparent !important; 604 | border: none !important; 605 | box-shadow: none !important; 606 | } 607 | 608 | .create-guild-container h5, 609 | .create-guild-container .action.create .action-header { 610 | color:var(--main-color); 611 | } 612 | 613 | .create-guild-container .action.create .btn-primary { 614 | background-color:var(--main-color) !important; 615 | } 616 | 617 | .create-guild-container .action.create:hover .btn-primary { 618 | background-color:var(--accent-color) !important; 619 | } 620 | 621 | .create-guild-container .form-actions .btn-default { 622 | background: rgba(255,255,255,0.1); 623 | border: 0; 624 | } 625 | 626 | .create-guild-container .create-guild .guild-form .region-select { 627 | background: rgba(255,255,255,0.1); 628 | } 629 | 630 | .create-guild-container .create-guild .guild-form .region-select button { 631 | color:#000; 632 | } 633 | 634 | .create-guild-container .create-guild .guild-form .region-select:hover button { 635 | background-color:var(--main-color); 636 | border-color:var(--main-color); 637 | color:#fff; 638 | } 639 | 640 | .create-guild-container .create-guild .guild-form .region-select:hover .region-select-inner { 641 | border-color:var(--main-color); 642 | } 643 | 644 | .create-guild-container .create-guild .guild-form .region-select-name { 645 | color:#fff; 646 | } 647 | 648 | .avatar-uploader .avatar-uploader-inner { 649 | background-color: var(--main-color); 650 | } 651 | 652 | .region-select-modal { 653 | background:rgba(0,0,0,0.8); 654 | } 655 | 656 | .region-select-modal .region-select-modal-header { 657 | color:var(--main-color); 658 | } 659 | 660 | .region-select-modal .region-select-modal-option { 661 | background:rgba(255,255,255,0.1); 662 | border:2px solid rgba(255,255,255,0.1); 663 | } 664 | 665 | .region-select-modal .region-select-modal-option:hover { 666 | border-color: var(--main-color); 667 | } 668 | 669 | .region-select-modal .region-select-modal-option .region-select-name { 670 | color:#fff; 671 | } 672 | 673 | .guild-header { 674 | background: rgba(0,0,0,0.1); 675 | border-bottom: 1px solid rgba(0,0,0,0); 676 | padding-left: 82px; 677 | margin-left: -80px; 678 | } 679 | 680 | .guilds-wrapper .guilds .guild:first-of-type { 681 | /*transform: scale(0.85);*/ 682 | margin-top: 1px; 683 | margin-left: -5px; 684 | border: 5px solid rgba(0,0,0,0); 685 | border-radius: 100% !important; 686 | transition: 200ms all ease-in-out; 687 | } 688 | 689 | .guilds-wrapper .guilds .guild:first-of-type:hover { 690 | border-radius: 100% !important; 691 | } 692 | 693 | .guilds-wrapper .guilds .guild.active { 694 | border-radius: 100% !important; 695 | } 696 | 697 | .guild-header-open ul { 698 | opacity:1 !important; 699 | } 700 | 701 | .guilds-add { 702 | opacity:0.5; 703 | font-size:22px !important; 704 | border: 1px dashed rgba(255,255,255,0.3) !important; 705 | margin-left: 0 !important; 706 | margin-top: 10px !important; 707 | } 708 | 709 | .platform-osx .guilds-wrapper { 710 | padding-top: 15px; 711 | } 712 | 713 | .guilds-wrapper { 714 | border-right:1px solid rgba(0,0,0,0.2); 715 | box-shadow:inset -10px 0px 20px -10px rgba(0,0,0,0.3); 716 | } 717 | 718 | .guilds-wrapper .guild-separator { 719 | margin-top:5px; 720 | margin-bottom:5px; 721 | margin-left:-5px; 722 | display:none; 723 | } 724 | 725 | .guilds-wrapper .guild-separator:after { 726 | background:transparent; 727 | } 728 | 729 | .guild-header header span { 730 | margin-left:-7px; 731 | } 732 | 733 | .guild-header header { 734 | box-shadow:none !important; 735 | color:#ddd; 736 | } 737 | 738 | .guild-channels header h2 { 739 | padding:0 18px; 740 | } 741 | 742 | .guild-channels .channel-text .channel-name, 743 | .guild-channels .channel-voice .channel-name { 744 | font-size:0.9em; 745 | } 746 | 747 | .guild-channels .channel-text a { 748 | padding:8px 6px 10px 18px; 749 | } 750 | 751 | .guild-channels header h2, 752 | .guild-channels .channel a { 753 | color: #fff; 754 | } 755 | 756 | .guilds-wrapper .guilds { 757 | padding: 18px 20px 85px 15px; 758 | } 759 | 760 | .guilds-add { 761 | font-size: 30px; 762 | background: #000; 763 | } 764 | 765 | .guilds-wrapper .guilds .friends-online { 766 | margin-top: 10px !important; 767 | } 768 | 769 | .guilds-wrapper .guilds .guild .guild-inner { 770 | background: #151515 !important; 771 | } 772 | 773 | .guilds-wrapper .guilds .guild.active:first-of-type .guild-inner { 774 | background: var(--main-color) !important; 775 | } 776 | 777 | .guilds-wrapper .guilds .guild .guild-inner a, 778 | .guilds-wrapper .guilds .guild, 779 | .guilds-wrapper .guilds .guild .avatar-small { 780 | width:40px; 781 | height:40px; 782 | } 783 | 784 | .guilds-wrapper .guilds .guild .avatar-small { 785 | width:40px; 786 | height:40px; 787 | background-size: 40px 40px; 788 | } 789 | 790 | .guilds-wrapper .guilds .guild .guild-inner { 791 | line-height:40px; 792 | } 793 | 794 | .guilds-wrapper .guilds .friends-icon { 795 | width:40px; 796 | height:40px; 797 | background-size:25px 19px; 798 | } 799 | 800 | .guilds-wrapper .guilds .friends-icon { 801 | background-color: rgba(0,0,0,0.3) !important; 802 | background-image: none !important; 803 | padding-top:0px; 804 | } 805 | 806 | .guilds-wrapper .guilds .friends-icon:after { 807 | display:block; 808 | width:40px; 809 | height:40px; 810 | content:''; 811 | background-image: url(https://i.imgur.com/233d55Y.gif) !important; 812 | background-size:110%; 813 | background-repeat:no-repeat; 814 | background-position:top center; 815 | } 816 | 817 | .guilds-wrapper .guilds .guild.audio .guild-inner:after { 818 | background-size:12px; 819 | background-color:rgba(0,0,0,0.8); 820 | } 821 | 822 | .guilds-wrapper .guilds .guild:before, 823 | .guilds-wrapper .guilds .guild.unread:before, 824 | .guilds-wrapper .guilds .guild.selected:before { 825 | left:-19px; 826 | transition:0.2s ease-in-out all; 827 | } 828 | 829 | .guilds-wrapper .guilds .guild.unread:not(.selected):before, 830 | .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before { 831 | background:var(--main-color); 832 | } 833 | 834 | .guilds-wrapper .guilds .guild.active .guild-inner:before { 835 | background:#fff !important; 836 | } 837 | 838 | .guilds-wrapper .guilds .friends-online { 839 | color: #ccc; 840 | font-size: 9px; 841 | margin: 15px 0 15px -7px; 842 | line-height: 20px; 843 | width: 55px; 844 | height: 20px; 845 | border-radius: 25px; 846 | overflow: hidden; 847 | background: rgba(0,0,0,0.3); 848 | } 849 | 850 | .guilds-wrapper .guilds-error { 851 | width:40px; 852 | height:40px; 853 | line-height:36px; 854 | } 855 | 856 | .guild-channels header h2, 857 | .private-channels header { 858 | opacity:.6; 859 | } 860 | 861 | .guild-channels .channel:hover { 862 | background:rgba(0,0,0,0.3) !important; 863 | } 864 | 865 | .private-channels { 866 | overflow: visible !important; 867 | } 868 | 869 | .private-channels .search-bar { 870 | background: rgba(0,0,0,0) !important; 871 | box-shadow: none !important; 872 | border-radius: 0 !important; 873 | border-bottom: 1px solid rgba(0,0,0,.1); 874 | } 875 | 876 | .private-channels .search-bar .search-bar-inner { 877 | background: rgba(0,0,0,1) !important; 878 | } 879 | 880 | .private-channels .search-bar input { 881 | background: rgba(0,0,0,0.8) !important; 882 | } 883 | 884 | .guild-channels .channel.selected, 885 | .private-channels .channel.selected a, 886 | .private-channels .search-result.selected, 887 | .private-channels .search-result:hover { 888 | background: rgba(0,0,0,0.6) !important; 889 | } 890 | 891 | .guild-channels ul .channel:not(.selected):hover, 892 | .private-channels .channel:not(.selected) a:hover, 893 | .private-channels .channel:not(.selected):hover a { 894 | background: rgba(0,0,0,0.3) !important; 895 | } 896 | 897 | .guild-channels .channel:not(.selected):before, 898 | .guild-channels .channel.selected:before, 899 | .guild-channels .channel.selected:hover:before, 900 | .private-channels .channel:not(.selected):before, 901 | .private-channels .channel.selected:before, 902 | .private-channels .channel.selected:hover:before, 903 | .private-channels .search-result.selected:before, 904 | .private-channels .search-result:hover:before { 905 | border-left: 2px solid var(--accent-color) !important; 906 | } 907 | 908 | .guild-channels .channel-text.unread:not(.selected):not(.channel-muted):before { 909 | left:-8px; 910 | } 911 | 912 | /* 913 | _ _ _ _ 914 | ___| |__ __ _ _ __ _ __ ___| |___ ___ ___ ___| |_(_) ___ _ __ 915 | / __| '_ \ / _` | '_ \| '_ \ / _ \ / __| / __|/ _ \/ __| __| |/ _ \| '_ \ 916 | | (__| | | | (_| | | | | | | | __/ \__ \ \__ \ __/ (__| |_| | (_) | | | | 917 | \___|_| |_|\__,_|_| |_|_| |_|\___|_|___/ |___/\___|\___|\__|_|\___/|_| |_| 918 | 919 | */ 920 | 921 | .base-3dtUhz { 922 | border-radius: 0 !important; 923 | } 924 | 925 | .menu-Sp6bN1 { 926 | background: var(--dark-color); 927 | } 928 | 929 | .item-1GzJrl:hover { 930 | background: var(--accent-color); 931 | color: #fff; 932 | } 933 | 934 | .item-1GzJrl.invite-271nFU { 935 | color: var(--main-color); 936 | } 937 | 938 | .separator-2zcjq8 { 939 | border-bottom: 1px solid rgba(255,255,255,0.1); 940 | } 941 | 942 | .iconCollapsed-3hFp_8, .iconDefault-3Gr8d2, .nameCollapsed-34uFWo, .nameDefault-2DI02H { 943 | color: #fff; 944 | } 945 | 946 | .nameDefaultText-24KCy5, .nameDefaultVoice-3WUH7s, .nameLockedText-3pqQcL, .nameLockedVoice-26MhB1 { 947 | color: rgba(255, 255, 255, 0.35); 948 | } 949 | 950 | .containerDefault-3GGEv_ { 951 | padding-top: 15px; 952 | } 953 | 954 | .unread-1xRYoj { 955 | background-color: var(--main-color); 956 | } 957 | 958 | .unread-mentions-indicator-bottom .unread-mentions-bar, .unread-mentions-indicator-top .unread-mentions-bar { 959 | box-shadow: none !important; 960 | } 961 | 962 | .icon-2aINcz { 963 | margin-left: 0; 964 | } 965 | 966 | .bar-30k2ka { 967 | width: 70%; 968 | margin: 0 auto; 969 | } 970 | 971 | .channel-notices .channel-notice.quickswitcher-notice { 972 | background-color: rgba(0,0,0,0.7); 973 | } 974 | 975 | .channel-notices .channel-notice .message .btn { 976 | border: none; 977 | background-color: var(--accent-color); 978 | transition: all 100ms ease-in-out; 979 | } 980 | 981 | .channel-notices .channel-notice .message .btn:hover { 982 | color: #000; 983 | font-weight: bold; 984 | background-color: var(--main-color); 985 | } 986 | 987 | .btn-hamburger { 988 | margin-right:-30px; 989 | } 990 | 991 | .btn-hamburger span { 992 | background:#fff; 993 | } 994 | 995 | .account { 996 | z-index:9; 997 | border-top:none !important; 998 | width:320px; 999 | margin-left:-80px; 1000 | padding:0 15px !important; 1001 | background:rgba(0,0,0,0.95); 1002 | height:77px; 1003 | box-sizing:border-box; 1004 | } 1005 | 1006 | .account .status { 1007 | border:2px solid rgba(0,0,0,1); 1008 | } 1009 | 1010 | .account .btn { 1011 | background:transparent;/*#000;*/ 1012 | box-shadow:none !important; 1013 | } 1014 | 1015 | .account .btn:active { 1016 | background:#000; 1017 | } 1018 | 1019 | .account .btn-settings:after { 1020 | opacity:0.3; 1021 | } 1022 | 1023 | .account .btn-deafen, 1024 | .account .btn-mute { 1025 | border-right:none;/*1px solid #101010;*/ 1026 | } 1027 | 1028 | #rtc-connection, 1029 | #voice-connection { 1030 | z-index:9; 1031 | border-top:none !important; 1032 | /*width:285px; 1033 | margin-left:-83px;*/ 1034 | padding:15px 20px 15px 18px !important; 1035 | } 1036 | 1037 | #rtc-connection .btn, 1038 | #voice-connection .btn { 1039 | background:#000; 1040 | box-shadow:none !important; 1041 | } 1042 | 1043 | .account .btn-deafen, .account .btn-settings { 1044 | box-shadow:none !important; 1045 | } 1046 | 1047 | .account .btn-group, 1048 | #rtc-connection .btn-group, 1049 | #voice-connection .btn-group { 1050 | border:none; 1051 | } 1052 | 1053 | .account .avatar-small { 1054 | margin:0 0 0 10px; 1055 | } 1056 | 1057 | .message-group .comment { 1058 | background:transparent !important; 1059 | border:none !important; 1060 | } 1061 | 1062 | /* 1063 | _ _ _ _ 1064 | ___| |__ __ _| |_ ___ ___ ___| |_(_) ___ _ __ 1065 | / __| '_ \ / _` | __| / __|/ _ \/ __| __| |/ _ \| '_ \ 1066 | | (__| | | | (_| | |_ \__ \ __/ (__| |_| | (_) | | | | 1067 | \___|_| |_|\__,_|\__| |___/\___|\___|\__|_|\___/|_| |_| 1068 | 1069 | */ 1070 | 1071 | .channel-text-area-default { 1072 | margin: 10px 0 17px; 1073 | } 1074 | 1075 | .inner-zqa7da { 1076 | background: transparent !important; 1077 | padding: 0 10px; 1078 | } 1079 | 1080 | .search .search-bar { 1081 | background-color: rgba(0, 0, 0, 0.55) !important; 1082 | } 1083 | 1084 | .search-answer, 1085 | .search-filter { 1086 | background-color: var(--accent-color) !important; 1087 | } 1088 | 1089 | .search-popout { 1090 | background-color: var(--dark-color); 1091 | /*position: absolute !important; 1092 | top: 55px !important; 1093 | right: 162px !important; 1094 | left: auto !important;*/ 1095 | } 1096 | 1097 | .search-popout .option:after { 1098 | background: transparent; 1099 | } 1100 | 1101 | .search-popout .option.selected { 1102 | background-color: rgba(5, 5, 6, 0.9) !important; 1103 | box-shadow: 0 0 5px rgba(0,0,0,0.8); 1104 | } 1105 | 1106 | .search-popout .option.selected:after { 1107 | background: transparent !important; 1108 | } 1109 | 1110 | .search-results-wrap { 1111 | background-color: rgba(0, 0, 0, 0.9) !important; 1112 | } 1113 | 1114 | .search-results-wrap .search-header { 1115 | background: transparent !important; 1116 | } 1117 | 1118 | .search-results-wrap .channel-separator:before { 1119 | border: none; 1120 | } 1121 | 1122 | .search-results-wrap .channel-separator .channel-name { 1123 | background-color: transparent !important; 1124 | } 1125 | 1126 | .search-results-wrap .search-result:before { 1127 | background: transparent !important; 1128 | border-top: 1px solid rgba(0,0,0,0.3); 1129 | } 1130 | 1131 | .search-results-wrap .search-result:after { 1132 | background: transparent !important; 1133 | } 1134 | 1135 | .search-results-wrap .search-result:not(.expanded) .search-result-message.hit, 1136 | .search-results-wrap .search-result.expanded { 1137 | border: 2px solid rgba(17, 21, 25, 0.6) !important; 1138 | } 1139 | 1140 | .search-results-wrap .search-result .hit { 1141 | background-color: rgba(0, 0, 0, 0.9) !important; 1142 | box-shadow: 0 0 10px 6px rgba(0, 0, 0, 0.45) !important; 1143 | } 1144 | 1145 | .theme-dark .search-results-wrap .action-buttons .jump-button { 1146 | background-color: rgba(240, 240, 240, 0.07); 1147 | } 1148 | 1149 | .search-popout .date-picker .date-picker-hint .hint-value { 1150 | background: var(--main-color) !important; 1151 | } 1152 | 1153 | .search-popout .date-picker .date-picker-hint { 1154 | border-top: none !important; 1155 | } 1156 | 1157 | .theme-dark .search-results-wrap .scroller-wrap .scroller::-webkit-scrollbar-track-piece { 1158 | border:3px solid rgba(255,255,255,0) !important; 1159 | background-color:rgba(0,0,0,0.3) !important; 1160 | } 1161 | 1162 | .theme-dark .search-results-wrap .scroller-wrap .scroller::-webkit-scrollbar-thumb { 1163 | border:3px solid rgba(255,255,255,0) !important; 1164 | background-color:var(--accent-color) !important; 1165 | } 1166 | 1167 | .search-popout .date-picker { 1168 | border-top: none !important; 1169 | } 1170 | 1171 | .react-datepicker { 1172 | background-color: rgba(0,0,0,0.6) !important; 1173 | color: rgba(255, 255, 255, 0.6) !important; 1174 | } 1175 | 1176 | .react-datepicker .react-datepicker__header { 1177 | background-color: transparent !important; 1178 | } 1179 | 1180 | .react-datepicker .react-datepicker__day--disabled, 1181 | .react-datepicker .react-datepicker__day--outside-month { 1182 | background-color: rgba(255, 255, 255, 0.07) !important; 1183 | color: rgba(167, 167, 167, 0.6) !important; 1184 | } 1185 | 1186 | .react-datepicker .react-datepicker__day { 1187 | color: #fff; 1188 | border-top: 1px solid rgba(255, 255, 255, 0.15) !important; 1189 | border-left: 1px solid rgba(255, 255, 255, 0.15) !important; 1190 | } 1191 | 1192 | .react-datepicker .react-datepicker__month>.react-datepicker__week:last-of-type .react-datepicker__day { 1193 | border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important; 1194 | } 1195 | 1196 | .react-datepicker .react-datepicker__month .react-datepicker__week>.react-datepicker__day:last-of-type { 1197 | border-right: 1px solid rgba(255, 255, 255, 0.15) !important; 1198 | } 1199 | 1200 | .react-datepicker .react-datepicker__day.react-datepicker__day--today:after { 1201 | background-color: var(--main-color) !important; 1202 | } 1203 | 1204 | .react-datepicker .react-datepicker__day.react-datepicker__day--selected:hover, .react-datepicker .react-datepicker__day:hover { 1205 | background-color: var(--main-color) !important; 1206 | } 1207 | 1208 | .header-toolbar button span { 1209 | background-size: 22px; 1210 | } 1211 | 1212 | .header-toolbar button.popout-open { 1213 | background:var(--main-color); 1214 | } 1215 | 1216 | .channel-pins-wrap { 1217 | background: rgba(0,0,0,0.9) !important; 1218 | } 1219 | 1220 | .channel-pins-wrap .header, 1221 | .channel-pins-wrap .footer { 1222 | background-color: rgba(0,0,0,0.95) !important; 1223 | box-shadow: none !important; 1224 | } 1225 | 1226 | .channel-pins .message-group { 1227 | background-color: rgba(0,0,0,0.7) !important; 1228 | } 1229 | 1230 | .channel-pins .message-group:hover { 1231 | box-shadow: 0 0 4px 5px rgba(37, 172, 232, 0.1); 1232 | border-color: rgba(37, 172, 232, 0.47) !important; 1233 | } 1234 | 1235 | .channel-pins .message-group .action-buttons { 1236 | box-shadow: none !important; 1237 | background: none !important; 1238 | } 1239 | 1240 | .channel-pins .message-group .action-buttons .jump-button { 1241 | background-color: rgba(255,255,255,0.15) !important; 1242 | } 1243 | 1244 | .spinner-wandering-cubes .spinner-item { 1245 | background-color:var(--main-color); 1246 | width:15px; 1247 | height:15px; 1248 | border-radius:4px; 1249 | } 1250 | 1251 | .chat .has-more button { 1252 | color:var(--main-color) !important; 1253 | background:rgba(255,255,255,0.1) !important; 1254 | border:none !important; 1255 | box-shadow:none !important; 1256 | } 1257 | 1258 | .highlight { 1259 | color:var(--main-color); 1260 | } 1261 | 1262 | .emoji-picker { 1263 | background:rgba(0,0,0,0.85) !important; 1264 | } 1265 | 1266 | .emoji-picker .search-bar input { 1267 | color:rgba(255,255,255,0.7); 1268 | background:rgba(255,255,255,0.1); 1269 | } 1270 | 1271 | .emoji-picker .search-bar-clear { 1272 | background:rgba(0,0,0,0.7); 1273 | } 1274 | 1275 | .emoji-picker .sticky-header, 1276 | .emoji-picker .search-bar { 1277 | background:rgba(0,0,0,0.95) !important; 1278 | } 1279 | 1280 | .emoji-picker .categories .item.selected { 1281 | border-bottom-color:var(--main-color); 1282 | } 1283 | 1284 | .chat .title-3qD0b- { 1285 | border-bottom: 1px solid rgba(0,0,0,0.3) !important; 1286 | background: rgba(0,0,0,0.95) !important; 1287 | box-shadow: none !important; 1288 | } 1289 | 1290 | .header-2o-2hj { 1291 | border-bottom: 0px solid rgba(0,0,0,0.3) !important; 1292 | background: rgba(0,0,0,0.15) !important; 1293 | box-shadow: none !important; 1294 | height: 49px !important; 1295 | } 1296 | 1297 | .header-toolbar button.active { 1298 | background-color:rgba(255,255,255,0.1); 1299 | } 1300 | 1301 | .botTagRegular-2HEhHi, 1302 | .need-help-modal .header { 1303 | background:var(--main-color); 1304 | padding: 2px 3px; 1305 | font-size: 9px; 1306 | } 1307 | 1308 | .form header { 1309 | color:var(--main-color); 1310 | } 1311 | 1312 | .markdown-modal, 1313 | .form .form-inner, 1314 | .form .form-header, 1315 | .form .form-actions, 1316 | .need-help-modal .footer, 1317 | .markdown-modal .markdown-modal-footer { 1318 | background:rgba(0,0,0,0.85) !important; 1319 | color: #fff; 1320 | } 1321 | 1322 | .alert.form .form-inner .btn { 1323 | padding: 0 !important; 1324 | border: none !important; 1325 | } 1326 | 1327 | .channel-notification-settings .content label, 1328 | .notification-settings-modal .mute-server .checkbox .label span { 1329 | color:#fff; 1330 | } 1331 | 1332 | .notification-settings-modal .notification-settings-modal-channel-settings-list { 1333 | box-shadow:none !important; 1334 | } 1335 | 1336 | .markdown-modal .markdown-modal-header { 1337 | color:#fff; 1338 | } 1339 | 1340 | .form .form-header, 1341 | .form .form-actions, 1342 | .need-help-modal .footer, 1343 | .channel-notification-settings, 1344 | .markdown-modal .markdown-modal-header, 1345 | .markdown-modal .markdown-modal-footer { 1346 | border-color:rgba(255,255,255,0.2); 1347 | } 1348 | 1349 | .modal-content { 1350 | background: transparent !important; 1351 | } 1352 | 1353 | .modal-content .user-name { 1354 | color:#fff; 1355 | } 1356 | 1357 | .modal-content .form-inner p { 1358 | color:rgba(255,255,255,0.7); 1359 | } 1360 | 1361 | .chat .new-messages-bar { 1362 | background-color:rgba(29,101,134,.9); 1363 | } 1364 | 1365 | .chat .new-messages-bar:hover { 1366 | background-color:rgba(29,101,134,1); 1367 | } 1368 | 1369 | .chat .new-messages-bar button:last-child { 1370 | color:rgba(255,255,255,0.5); 1371 | } 1372 | 1373 | .chat .empty-message { 1374 | border: 0 !important; 1375 | background: transparent !important; 1376 | height: 40px; 1377 | } 1378 | 1379 | .chat-empty { 1380 | background:rgba(20,23,27,0.95); 1381 | } 1382 | 1383 | .chat>.title-wrap>.title .channel-name { 1384 | color:rgba(255,255,255,0.8); 1385 | } 1386 | 1387 | .chat>.title-wrap>.topic { 1388 | font-size:12px; 1389 | margin-top:5px; 1390 | color:#656565 !important; 1391 | } 1392 | 1393 | .markdown-modal .highlight, 1394 | .chat .title-wrap .topic .highlight { 1395 | background-color:rgba(255,255,255,.1) !important; 1396 | } 1397 | 1398 | .markdown-modal .highlight:hover, 1399 | .chat .title-wrap .topic .highlight:hover { 1400 | background-color:rgba(255,255,255,.2) !important; 1401 | color:var(--main-color) !important; 1402 | } 1403 | 1404 | .chat .divider { 1405 | height:25px; 1406 | background:none; 1407 | } 1408 | 1409 | .chat .divider>div { 1410 | display:none !important; 1411 | } 1412 | .chat .divider:not(.divider-red)>div { 1413 | background:rgba(255,255,255,0.2) !important; 1414 | } 1415 | 1416 | .chat .divider:before { 1417 | background:rgba(255,255,255,0.06) !important; 1418 | height:25px; 1419 | border-radius: 3px; 1420 | } 1421 | 1422 | .chat .divider.divider-red:before { 1423 | background: rgba(240,71,71,.8) !important; 1424 | } 1425 | 1426 | .chat .divider>span { 1427 | background-color:transparent !important; 1428 | font-size:12px; 1429 | text-transform:uppercase; 1430 | margin:10px 0px; 1431 | border-radius: 0px; 1432 | opacity: 1; 1433 | padding: 8px 15px; 1434 | line-height: 1px; 1435 | width: 100%; 1436 | text-align: center; 1437 | } 1438 | 1439 | .chat .divider.divider-red>span { 1440 | color: rgba(255,255,255,0.9) !important; 1441 | } 1442 | 1443 | .chat .divider:not(.divider-red)>span { 1444 | color:rgba(255,255,255,1) !important; 1445 | } 1446 | 1447 | .chat .divider>div { 1448 | display:none; 1449 | } 1450 | 1451 | .chat form { 1452 | border-top: none !important; 1453 | } 1454 | 1455 | .messages .message-group:not(.has-divider) { 1456 | border-bottom-color:hsla(0,0%,100%,.04) !important; 1457 | } 1458 | 1459 | .messages .message-group { 1460 | border-bottom: none !important; 1461 | } 1462 | 1463 | .friends-table .messages .message-group .message-send-failed .markup, 1464 | .friends-table .messages .message-group .message-send-failed .markup a, 1465 | .messages .message-group .message-send-failed .markup, 1466 | .messages .message-group .message-send-failed .markup a { 1467 | color:rgba(240,71,71,0.5) !important; 1468 | font-style:italic; 1469 | } 1470 | 1471 | .mentioned .message-text { 1472 | border-radius: 0 !important; 1473 | background: rgba(37,172,232,0.2) !important; 1474 | } 1475 | 1476 | .mentioned .message-text:after { 1477 | border-radius: 0 !important; 1478 | border-color:var(--main-color) !important; 1479 | background:rgba(37,172,232,0.2) !important; 1480 | } 1481 | 1482 | .mention { 1483 | color: var(--main-color) !important; 1484 | background-color: var(--main-color-faded) !important; 1485 | padding: 3px 5px; 1486 | border-radius: 5px; 1487 | } 1488 | 1489 | .messages a { 1490 | color:var(--main-color) !important; 1491 | } 1492 | 1493 | .messages h2 .user-name { 1494 | font-size:0.85em; 1495 | color:rgba(255,255,255,0.8); 1496 | } 1497 | 1498 | .messages h2 span { 1499 | color:rgba(255,255,255,0.2) !important; 1500 | } 1501 | 1502 | .messages h2 .bot-tag { 1503 | color:rgba(255,255,255,0.8) !important; 1504 | } 1505 | 1506 | .messages .markup { 1507 | font-size:0.85em !important; 1508 | line-height:1.4em !important; 1509 | } 1510 | 1511 | .messages .markup:not([data-colour="true"]) { 1512 | color:rgba(255,255,255,0.5) !important; 1513 | } 1514 | 1515 | .markup pre { 1516 | border-radius:0 !important; 1517 | background:transparent !important; 1518 | border-color:rgba(255,255,255,0.1) !important; 1519 | } 1520 | 1521 | .markup pre code.hljs { 1522 | background:rgba(255,255,255,0.1) !important; 1523 | color:rgba(255,255,255,0.7) !important; 1524 | padding:1em !important; 1525 | } 1526 | 1527 | .modal-content .markup code.inline, 1528 | .markup code.inline { 1529 | background:rgba(255,255,255,0.1) !important; 1530 | color:rgba(255,255,255,0.7) !important; 1531 | padding:0.3em 0.6em !important; 1532 | border-radius:3px !important; 1533 | } 1534 | 1535 | .messages .markup .highlight { 1536 | background-color:rgba(29,101,134,.5) !important; 1537 | color:#ddd !important; 1538 | padding: 1px 4px; 1539 | border-radius: 0; 1540 | } 1541 | 1542 | .messages .markup .highlight:hover { 1543 | background-color:rgba(29,101,134,1) !important; 1544 | color:#fff !important; 1545 | } 1546 | 1547 | .messages .invite-button { 1548 | background: rgba(255,255,255,0.07) !important; 1549 | border-color: rgba(255,255,255,0.1) !important; 1550 | } 1551 | 1552 | .emotewrapper img { 1553 | position: relative; 1554 | top: 7px; 1555 | } 1556 | 1557 | .textArea-2Spzkt { 1558 | font-size: 0.85rem; 1559 | } 1560 | 1561 | .channel-textarea-upload { 1562 | border-right-color: hsla(0,0%,100%,.1) !important; 1563 | } 1564 | 1565 | .channel-textarea-inner { 1566 | border: 2px solid rgba(255,255,255,0.1) !important; 1567 | background:rgba(0,0,0,0.6) !important; 1568 | } 1569 | 1570 | .channel-textarea-autocomplete-inner { 1571 | border:none !important; 1572 | background:rgba(0,0,0,0.95) !important; 1573 | } 1574 | 1575 | .channel-textarea-autocomplete-inner header { 1576 | border:none !important; 1577 | background: rgba(37,172,232,0.5) !important; 1578 | color: rgba(255,255,255,0.9) !important; 1579 | } 1580 | 1581 | .channel-textarea-autocomplete-inner ul li.active { 1582 | background:rgba(255,255,255,0.1) !important; 1583 | } 1584 | 1585 | .channel-textarea-guard button { 1586 | background:var(--accent-color) !important; 1587 | } 1588 | 1589 | .channel-textarea-guard button:hover { 1590 | background:var(--main-color) !important; 1591 | } 1592 | 1593 | .typing-2GQL18 { 1594 | font-size:11px; 1595 | } 1596 | 1597 | .spoiler span {display:none;} 1598 | .spoiler:before { 1599 | min-height:18px; 1600 | padding-top:2px; 1601 | border-radius:5px; 1602 | background:rgba(25,25,25,0.7); 1603 | } 1604 | 1605 | #twitchcord-button { 1606 | background-size: 24px; 1607 | background-position: 20px; 1608 | background-color: transparent; 1609 | opacity:0.4; 1610 | } 1611 | 1612 | #twitchcord-button:hover, 1613 | #twitchcord-button.twitchcord-button-open { 1614 | opacity:1; 1615 | } 1616 | 1617 | #twitchcord-button-container { 1618 | right:30px !important; 1619 | } 1620 | 1621 | /*** COMPACT MODE ***/ 1622 | 1623 | .message-group.compact { 1624 | margin-left:0; 1625 | } 1626 | 1627 | .message-group.compact .timestamp { 1628 | color:rgba(255,255,255,0.3) !important; 1629 | position:relative; 1630 | top:-1px; 1631 | } 1632 | 1633 | .message-group.compact .message .markup .user-name { 1634 | margin-right:8px; 1635 | font-size:14px; 1636 | } 1637 | 1638 | /* 1639 | __ _ _ _ _ _ 1640 | / _|_ __(_) ___ _ __ __| |___ | (_)___| |_ 1641 | | |_| '__| |/ _ \ '_ \ / _` / __| | | / __| __| 1642 | | _| | | | __/ | | | (_| \__ \ | | \__ \ |_ 1643 | |_| |_| |_|\___|_| |_|\__,_|___/ |_|_|___/\__| 1644 | 1645 | */ 1646 | 1647 | #friends .btn, 1648 | .add-friend-popout .btn { 1649 | background-color: var(--main-color) !important; 1650 | } 1651 | 1652 | .add-friend-popout .btn:disabled { 1653 | background-color: var(--accent-color) !important; 1654 | opacity: 0.4; 1655 | } 1656 | 1657 | .private-channels .channel.btn-friends .badge { 1658 | margin-right: 10px; 1659 | } 1660 | 1661 | .private-channels .channel .close { 1662 | margin-right: 5px; 1663 | } 1664 | 1665 | #friends { 1666 | background: transparent !important; 1667 | } 1668 | 1669 | .friends-header { 1670 | background: rgba(0,0,0,0.95) !important; 1671 | } 1672 | 1673 | .friends-table { 1674 | background:rgba(0,0,0,0.85) !important; 1675 | margin-top:0 !important; 1676 | } 1677 | 1678 | .friends-header, 1679 | .friends-table .friends-table-header { 1680 | border-bottom: 1px solid hsla(0,0%,100%,.1) !important; 1681 | } 1682 | 1683 | .friends-header .tab-bar .tab-bar-separator, 1684 | .friends-table .friends-table-header .friends-column-separator { 1685 | background-color:hsla(0,0%,100%,.1) !important; 1686 | } 1687 | 1688 | .friends-table .friends-table-body { 1689 | padding-top:20px !important; 1690 | } 1691 | 1692 | .friends-table .friends-row:hover { 1693 | background: rgba(0,0,0,0.7) !important; 1694 | } 1695 | 1696 | /* 1697 | _ _ _ _ _ 1698 | _ _ ___ ___ _ __ | (_)___| |_ ___ ___ ___| |_(_) ___ _ __ 1699 | | | | / __|/ _ \ '__| | | / __| __| / __|/ _ \/ __| __| |/ _ \| '_ \ 1700 | | |_| \__ \ __/ | | | \__ \ |_ \__ \ __/ (__| |_| | (_) | | | | 1701 | \__,_|___/\___|_| |_|_|___/\__| |___/\___|\___|\__|_|\___/|_| |_| 1702 | 1703 | */ 1704 | 1705 | .channel-members .member.popout-open, 1706 | .channel-members .member:hover { 1707 | background: rgba(255,255,255,0.07) !important; 1708 | } 1709 | 1710 | .channel-members .invite-btn { 1711 | background:var(--accent-color); 1712 | } 1713 | 1714 | .channel-members .invite-btn:hover { 1715 | background:var(--main-color); 1716 | } 1717 | 1718 | .channel-members .bot-tag { 1719 | padding: 0px 3px; 1720 | } 1721 | 1722 | .channel-members .member { 1723 | border-radius: 0 5px 5px 0; 1724 | } 1725 | 1726 | .channel-members .member:hover { 1727 | background:rgba(255,255,255,0.07) !important; 1728 | } 1729 | 1730 | .channel-members .member .member-username { 1731 | font-size:12px; 1732 | } 1733 | 1734 | .channel-members .member .member-game { 1735 | font-size:10px; 1736 | } 1737 | 1738 | .channel-members .avatar-small .status { 1739 | border-color:rgba(0,0,0,0.7) !important; 1740 | } 1741 | 1742 | .channel-members h2 { 1743 | background: rgba(0,0,0,0); 1744 | padding-top: 10px; 1745 | padding-bottom: 10px; 1746 | } 1747 | 1748 | .channel-members .member+h2 { 1749 | margin-top:12px; 1750 | } 1751 | 1752 | .channel-members h2:first-of-type { 1753 | margin-top:0px !important; 1754 | } 1755 | --------------------------------------------------------------------------------