API tools faq
paste
Advertisement
bad_dev

Untitled

bad_dev
May 9th, 2024 (edited)
709
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 18.83 KB | Source Code | 0 0
raw download clone embed print report
  1. /*
  2.  * Yes, this codebase is near unreadable. Why?
  3.  * I designed this mainly as a test to see how viable avoidance of straight out class selectors would be.
  4.  * The codebase was never designed to be pretty, it was designed to require as little maintenance as possible.
  5.  */
  6.  
  7. @import url('https://fonts.googleapis.com/css2?family=Karla:wght@400;500;600;700&display=swap');
  8. @import url('https://mwittrien.github.io/BetterDiscordAddons/Themes/BlurpleRecolor/BlurpleRecolor.css');
  9. @import url('https://discord-custom-covers.github.io/usrbg/dist/usrbg.css');
  10.  
  11. button {
  12.     --accentcolor: var(--accent-alt);
  13. }
  14.  
  15.  
  16. /* Root Variables */
  17.  
  18. :root {
  19.     --font-primary: 'Segoe UI', sans-serif;
  20.     --font-display: var(--font-primary) !important;
  21.     /* Dark Matter Variables */
  22.     --avatar-size: 32px;
  23.     --background-image: url('https://i.imgur.com/7SbtKvw.png');
  24.     --home-image: url('https://i.imgur.com/233d55Y.gif');
  25.     --background-solid: #161921;
  26.     --background-solid-dark: #101218;
  27.     --background-solid-darker: #0c0e12;
  28.     --accent: 37, 172, 232;
  29.     --accent-alt: 29, 101, 134;
  30.     --md-black: 0, 0, 0;
  31.     --dm-white: 255, 255, 255;
  32.     /* BlurpleRecolor */
  33.     --accentcolor: var(--accent);
  34.     --vaccentcolor-hover: rgb(var(--accent));
  35.     --vaccentcolor-active: rgb(var(--accent));
  36. }
  37.  
  38. :not(div[class*="userProfile"][class*="unThemed"]).theme-dark,
  39. :not(div[class*="userProfile"]).theme-light,
  40. div[class*="userProfile"][class*="unThemed"].theme-light {
  41.     /* Discord vars */
  42.     --background-primary: var(--background-solid);
  43.     --background-mobile-primary: var(--background-primary);
  44.     --background-secondary: var(--background-solid);
  45.     --background-mobile-secondary: var(--background-secondary);
  46.     --background-secondary-alt: var(--background-solid);
  47.     --background-tertiary: var(--background-solid);
  48.     --background-floating: var(--background-solid);
  49.     --background-secondary: var(--background-solid);
  50.     --background-accent: var(--background-solid);
  51.     --background-message-hover: rgba(var(--md-black), 0.4);
  52.     --channeltextarea-background: transparent;
  53.     --activity-card-background: rgba(var(--dm-white), 0.05);
  54.     --deprecated-store-bg: transparent;
  55.     --background-modifier-hover: rgba(var(--md-black), 0.3);
  56.     --background-modifier-active: rgba(var(--md-black), 0.3);
  57.     --background-modifier-selected: rgba(var(--md-black), 0.6);
  58.     --elevation-low: inset 0 -1px 0 0 rgba(var(--md-black), 0.3);
  59.     --channels-default: rgba(var(--dm-white), 0.3);
  60.     --deprecated-quickswitcher-input-background: var(--background-solid);
  61.     --header-primary: rgba(var(--dm-white), 1);
  62.     --header-secondary: rgba(var(--dm-white), 0.6);
  63.     --text-normal: rgba(var(--dm-white), 0.6);
  64.     --text-muted: #8a8e94;
  65.     --interactive-muted: rgba(var(--dm-white), 0.15);
  66.     --interactive-normal: rgba(var(--dm-white), 0.5);
  67.     --interactive-hover: rgba(var(--dm-white), 0.75);
  68.     --interactive-active: rgba(var(--dm-white), 1);
  69.     --deprecated-card-bg: rgba(var(--dm-white), 0.05);
  70.     --text-link: rgba(var(--accent), 1);
  71.     --focus-primary: rgba(var(--accent), 1);
  72.     --modal-background: var(--background-solid);
  73.     --modal-footer-background: var(--background-solid-darker);
  74. }
  75.  
  76. ::selection {
  77.     background-color: rgba(var(--accent-alt), 0.5);
  78. }
  79.  
  80.  
  81. /* Scrollbars */
  82.  
  83. ::-webkit-scrollbar {
  84.     width: 14px !important;
  85. }
  86.  
  87.  ::-webkit-scrollbar-thumb {
  88.     border-radius: 8px !important;
  89.     border: 3px solid transparent !important;
  90.     background-color: rgba(var(--accent-alt), 1) !important;
  91. }
  92.  
  93.  ::-webkit-scrollbar-track {
  94.     visibility: visible !important;
  95.     border-radius: 8px !important;
  96.     border: 3px solid transparent !important;
  97.     background-color: rgba(0, 0, 0, 0.3) !important;
  98.     background-clip: padding-box !important;
  99. }
  100.  
  101. .none-2Eo-qx::-webkit-scrollbar {
  102.     display: none !important;
  103. }
  104.  
  105.  
  106. /* Titlebar */
  107.  
  108. div[class*="typeWindows-"] {
  109.     --background-modifier-hover: rgba(var(--dm-white), 0.05);
  110.     --background-modifier-active: rgba(var(--dm-white), 0.075);
  111.     height: 26px;
  112. }
  113.  
  114. div[class*="typeWindows-"]>div:first-child {
  115.     display: none;
  116. }
  117.  
  118. div[class*="typeWindows-"]>div[role="button"] {
  119.     height: 30px;
  120.     width: 36px;
  121. }
  122.  
  123. div[class*="typeWindows-"]::after {
  124.     content: 'Discord';
  125.     font-weight: 7500;
  126.     line-height: 31px;
  127.     color: var(--text-muted);
  128.     font-size: 14px;
  129.     position: absolute;
  130.     padding: 0 12px;
  131.     top: 0;
  132.     left: 0;
  133.     width: 100%;
  134.     height: 30px;
  135.     background: rgba(var(--md-black), 0.85);
  136.     z-index: -1;
  137. }
  138.  
  139.  
  140. /* Guilds */
  141.  
  142. nav[class*="guilds-"] {
  143.     background: transparent;
  144. }
  145. ul[data-list-id='guildsnav'] {
  146.     --background-secondary: var(--background-solid);
  147.         --background-primary: rgba(var(--dm-white), 0.1);
  148.     margin-bottom: 70px;
  149.     background-color: rgba(var(--md-black), 0.6);
  150.     border-right: 1px solid rgba(var(--md-black), 0.2);
  151.     box-shadow: inset -10px 0px 20px -10px rgba(var(--md-black), 0.3);
  152. }
  153.  
  154. ul[data-list-id='guildsnav'] ::-webkit-scrollbar {
  155.     display: none;
  156. }
  157.  
  158. ul[data-list-id='guildsnav']>div[dir] {
  159.     padding-top: 18px;
  160. }
  161.  
  162. ul[data-list-id='guildsnav'] [class^="pill-"],
  163. ul[data-list-id='guildsnav'] [class^="pill-"]>div {
  164.     height: 40px !important;
  165. }
  166.  
  167. ul[data-list-id='guildsnav'] div[style*="height: 56"],
  168. ul[id^="folder-items-"] {
  169.     height: auto !important;
  170. }
  171.  
  172. ul[data-list-id='guildsnav'] [class^="pill-"] span {
  173.     width: 10px;
  174.     margin-left: -5px;
  175.     border-radius: 20px;
  176. }
  177.  
  178. [data-list-id='guildsnav'] [class^="pill-"] span[style^="opacity: 1; height: 40"] {
  179.     --header-primary: rgba(var(--accent), 1);
  180. }
  181.  
  182. span[class^="expandedFolderBackground-"] {
  183.     --background-secondary: rgba(var(--md-black), 0.25);
  184.     border-radius: 14px;
  185.     width: 40px;
  186.     left: 16px;
  187. }
  188.  
  189. .wrapper-28eC3z,
  190. [data-list-id='guildsnav'] [data-dnd-name] > div,
  191. [data-list-id='guildsnav'] svg[width="48"] {
  192.     width: 40px;
  193.     height: 40px;
  194. }
  195.  
  196. div[data-list-item-id="guildsnav___home"] {
  197.     background: var(--home-image) top center/110% no-repeat;
  198. }
  199.  
  200. div[class^="unreadMentionsIndicatorBottom-"] {
  201.     bottom: 70px;
  202. }
  203.  
  204. #app-mount [data-list-item-id="guildsnav___home"]>div {
  205.     color: transparent;
  206.     background-color: transparent;
  207. }
  208.  
  209. div[data-list-item-id="guildsnav___create-join-button"],
  210. div[data-list-item-id="guildsnav___guild-discover-button"] {
  211.     transition: 150ms ease;
  212.     opacity: 0.5;
  213.     background-color: var(--background-solid) !important;
  214.     color: rgba(var(--dm-white), 0.3) !important;
  215.     border: 1px dashed rgba(var(--dm-white), 0.3);
  216.     border-radius: 50px;
  217. }
  218.  
  219. div[data-list-item-id="guildsnav___create-join-button"]:hover,
  220. div[data-list-item-id="guildsnav___guild-discover-button"]:hover {
  221.     opacity: 1;
  222. }
  223.  
  224.  
  225. /* Sidebar */
  226.  
  227. .platform-win [class^="sidebar-"] {
  228.     border-radius: 0;
  229.     background-color: transparent;
  230. }
  231.  
  232. div[class^="sidebar-"] nav,
  233. #private-channels {
  234.     background: var(--background-secondary) !important;
  235.     --background-tertiary: rgba(var(--md-black), 0.35);
  236. }
  237.  
  238. div[class^="sidebar-"]>nav>div[class^="searchBar"] {
  239.     height: 54px;
  240. }
  241.  
  242. /* members wrapper */
  243. .container-2o3qEW {
  244.     --background-secondary: rgba(var(--md-black), 0.4);
  245.     --background-modifier-hover: rgba(var(--dm-white), 0.07);
  246.     --background-modifier-active: var(--background-modifier-hover);
  247.     --background-modifier-selected: rgba(var(--dm-white), 0.07);
  248.     background: rgb(var(--md-black), 0.9);
  249. }
  250.  
  251. div[data-list-id^="members-"][class*="scrollerBase-"] {
  252.     background: transparent;
  253. }
  254.  
  255. div[data-list-id^="members-"] [class*="placeholder"] {
  256.     --backgorund-primary: var(--text-normal);
  257. }
  258.  
  259. div[class^='nowPlayingColumn'] {
  260.     --background-secondary: transparent;
  261.     --background-primary: rgba(var(--md-black), 0.5);
  262.     --background-modifier-hover: rgba(var(--dm-white), 0.075);
  263. }
  264. div[class^="members-"] div[class^="member-"] {
  265.     background-color: transparent;
  266. }
  267.  
  268. #channels div[class^="unread-"] {
  269.     --interactive-active: rgba(var(--accent), 1);
  270. }
  271.  
  272.  
  273. /* Sidebar Header */
  274.  
  275. nav[aria-label]>div>header {
  276.     display: flex;
  277.     flex-direction: column;
  278.     justify-content: center;
  279.     height: 54px;
  280.     --background-accent: rgba(var(--accent), 1);
  281.     --background-modifier-hover: rgba(var(--md-black), 0.25);
  282. }
  283.  
  284.  
  285. /* Outer containers */
  286.  
  287. body {
  288.     background: var(--background-image) center/cover no-repeat;
  289. }
  290.  
  291. #app-mount {
  292.     background-color: transparent;
  293.     --background-tertiary: transparent;
  294.     --background-secondary: transparent;
  295. }
  296.  
  297. #app-mount>div[class^="appDevToolsWrapper-"] {
  298.     --background-primary: transparent;
  299.     --background-tertiary: transparent;
  300.     --background-secondary: rgba(var(--md-black), 0.7);
  301.     background-color: rgba(var(--md-black), 0.4);
  302. }
  303. div[class^="notAppAsidePanel-"]>div[class^="app-"]>div[class^="app-"],
  304. div[class^="app-"]>div[class^="bg-"] {
  305.     background-color: transparent;
  306. }
  307. div[class*="baseLayer-"]>div[class^="container-"] {
  308.     background-color: rgb(var(--md-black), 0.4);
  309. }
  310.  
  311. nav+div [class^='sidebar-'],
  312. nav+div[class^='base-'] {
  313.     overflow: visible !important;
  314.     position: relative;
  315.     max-width: calc(100% - 72px);
  316. }
  317.  
  318. nav+div[class^='base-'] > div[class^="notice"] {
  319.     border-radius: 0;
  320. }
  321.  
  322. div[class^='base-']>div,
  323. section[class*="themed-"] {
  324.     --background-secondary: rgba(var(--md-black), 0.7);
  325.     --background-tertiary: rgba(var(--dm-white), 0.05);
  326.     --background-primary: rgba(var(--md-black), 0.8);
  327. }
  328.  
  329. #app-mount>div:not([class^="appDevToolsWrapper-"]),
  330. .autocomplete-1vrmpx {
  331.     --background-primary: var(--background-solid);
  332.     --background-secondary: var(--background-solid-dark);
  333.     --background-secondary-alt: var(--background-solid-darker);
  334.     --background-tertiary: var(--background-solid-darker);
  335. }
  336.  
  337.  
  338. /* Header */
  339.  
  340. section[class*="themed-"] {
  341.     height: 54px;
  342.     box-shadow: var(--elevation-low);
  343.     background-color: rgb(var(--md-black), 0.925) !important;
  344.     --background-secondary: rgba(var(--dm-white), 0.1);
  345. }
  346.  
  347. section>div>a[href*="support.discord.com"] {
  348.     display: none;
  349. }
  350.  
  351. section[class*="themed-"]::before,
  352. section[class*="themed-"] ::after {
  353.     content: none;
  354. }
  355.  
  356. section div[class^="toolbar"]>div[role] {
  357.     margin: 0 4px;
  358.     transition: 150ms ease;
  359.     display: flex;
  360.     align-items: center;
  361.     justify-content: center;
  362.     border-radius: 3px;
  363.     width: 28px;
  364.     height: 28px;
  365. }
  366.  
  367. section div[class^="toolbar"]>div[role] svg {
  368.     width: 22px;
  369. }
  370.  
  371. section div[class^="toolbar"]>div[role][class*="selected-"] {
  372.     background-color: rgba(var(--dm-white), 0.1);
  373. }
  374.  
  375.  
  376. /* Panels */
  377.  
  378. div[class^='sidebar-']>section {
  379.     --background-primary: rgba(var(--dm-white), 0.07);
  380.     --background-secondary: rgba(var(--dm-white), 0.1);
  381.     --background-secondary-alt: rgba(var(--md-black), 0.95);
  382.     margin-bottom: 70px;
  383. }
  384.  
  385. div[class^='sidebar-']>section>div:last-child {
  386.     background-color: var(--background-secondary-alt);
  387.     box-sizing: border-box;
  388.     height: 70px;
  389.     padding: 0 18px;
  390.     width: calc(100% + 72px);
  391.     position: absolute;
  392.     left: -72px;
  393.     bottom: 0;
  394. }
  395. div[class^="sidebar-"]>section>div:last-child [class^="avatarWrapper-"] {
  396.     flex: 1;
  397. }
  398.  
  399.  
  400. /* Content */
  401.  
  402. div[class^='chat'] {
  403.     --background-floating: rgba(var(--md-black), 0.5);
  404.     background: transparent;
  405. }
  406.  
  407. div[class^="container-"][id^="chat-messages-"] {
  408.     --background-modifier-hover: var(--background-solid-dark);
  409. }
  410.  
  411. div[class^='chat'] main form {
  412.     margin-top: 0;
  413. }
  414.  
  415. div[class^='chat'] main form::before {
  416.     content: none;
  417. }
  418.  
  419. div[data-list-id="chat-messages"] {
  420.     --background-primary: transparent;
  421.     --background-secondary: rgba(var(--dm-white), 0.05);
  422.     --background-accent: rgba(var(--dm-white), 0.1);
  423. }
  424.  
  425. div[class^="channelTextArea-"] {
  426.     --background-secondary: transparent;
  427.     box-shadow: inset 0 0 0 2px rgba(var(--dm-white), 0.1);
  428.     transition: 250ms ease;
  429.     margin-bottom: 24px;
  430.     margin-top: 12px;
  431.     border-radius: 5px;
  432. }
  433.  
  434. div[id^="chat-messages-"]+div:not([id]):last-child {
  435.     height: 8px;
  436. }
  437.  
  438. div[id^="chat-messages-"][class*="cozy-"] {
  439.     padding-left: calc(var(--avatar-size) * 2);
  440. }
  441.  
  442. div[id^="chat-messages-"] {
  443.     margin-left: 8px;
  444.     margin-right: 8px;
  445.     border-radius: 4px;
  446. }
  447.  
  448. div[id^="chat-messages-"]>div[class^="buttonContainer-"] {
  449.     transform: scale(.85);
  450.     top: 1px;
  451. }
  452.  
  453. div[id^="chat-messages-"] {
  454.     --background-primary: rgba(var(--md-black), 0.5);
  455. }
  456.  
  457. div[id^="chat-messages-"]>div>[class^="avatar-"] {
  458.     margin-top: 6px;
  459.     width: var(--avatar-size);
  460.     height: var(--avatar-size);
  461. }
  462.  
  463. div[id^="chat-messages-"][class*="cozy-"] div::before {
  464.     --gutter: 13px;
  465. }
  466.  
  467. .mention {
  468.     transition: 150ms ease;
  469.     color: rgba(var(--accent), 1) !important;
  470.     background-color: rgba(var(--accent), 0.3);
  471.     padding: 3px 5px;
  472.     border-radius: 5px;
  473. }
  474.  
  475. .mention:hover {
  476.     background-color: rgba(var(--accent), 0.3) !important;
  477. }
  478.  
  479. #app-mount .container-2cd8Mz {
  480.     background: var(--background-primary);
  481. }
  482.  
  483. div[class*="barBase-"] {
  484.     padding-bottom: 0;
  485.     background-color: rgba(var(--accent-alt), 0.9);
  486. }
  487.  
  488.  
  489. /* Codeblocks */
  490.  
  491. html pre {
  492.     border-radius: 0;
  493.     background: transparent;
  494.     border-color: rgba(255, 255, 255, 0.1);
  495. }
  496.  
  497. pre code.hljs {
  498.     border: none;
  499.     background-color: rgba(var(--dm-white), 0.1);
  500.     color: rgba(var(--dm-white), 0.7);
  501.     padding: 1em;
  502. }
  503.  
  504. html code.inline,
  505. html code.inline {
  506.     background: rgba(var(--dm-white), 0.1);
  507.     color: rgba(var(--dm-white), 0.7);
  508.     padding: 0.3em 0.6em;
  509.     border-radius: 3px;
  510. }
  511.  
  512.  
  513. /* Settings */
  514.  
  515. div[aria-label*="_SETTINGS"],
  516. div[aria-label*="_DEBUG"] {
  517.     --background-primary: transparent;
  518.     --background-secondary: rgba(var(--md-black), 0.7);
  519. }
  520.  
  521. div[class^="sidebarRegionScroller-"]>nav {
  522.     --background-secondary: transparent;
  523. }
  524.  
  525. div[class^="contentRegion-"] {
  526.     --background-primary: rgba(var(--md-black), 0.8);
  527. }
  528.  
  529. div[class^="contentRegion-"] div[style^="overflow: hidden scroll"] {
  530.     background-color: transparent;
  531.     --background-primary: rgba(var(--md-black), 0.1);
  532.     --background-secondary: rgba(var(--md-black), 0.2);
  533.     --background-secondary-alt: rgba(var(--md-black), 0.25);
  534.     --background-tertiary: rgba(var(--dm-white), 0.1);
  535. }
  536.  
  537. div[aria-label*="_SETTINGS"] aside>div {
  538.     --background-primary: transparent;
  539. }
  540.  
  541. div[aria-label*="_SETTINGS"] aside>div::-webkit-scrollbar-track {
  542.     visibility: hidden !important;
  543. }
  544.  
  545. .bd-addon-list {
  546.     --background-secondary: var(--background-solid);
  547.     --background-secondary-alt: var(--background-solid-dark);
  548. }
  549.  
  550.  
  551. /* Tab Bar */
  552.  
  553. div[class*="topPill"],
  554. nav>div[role="tablist"],
  555. .bd-tab-bar {
  556.     --background-accent: rgba(var(--accent));
  557.     --background-modifier-hover: rgba(var(--dm-white), 0.05);
  558.     --background-modifier-active: rgba(var(--dm-white), 0.075);
  559.     --background-modifier-selected: rgba(var(--accent), 0.25);
  560. }
  561.  
  562.  
  563. /* Server Discovery */
  564.  
  565. div[class^="sidebar"]+[class^="pageWrapper"] {
  566.     --background-secondary: rgba(var(--md-black), 0.8);
  567.     background-color: var(--background-secondary);
  568. }
  569.  
  570.  
  571. /* Crash Page */
  572.  
  573. div[class*="errorPage"] {
  574.     --background-secondary: rgba(var(--md-black), 0.7) !important;
  575. }
  576.  
  577.  
  578. /* Tooltips */
  579.  
  580. div[class^="tooltip-"] {
  581.     --background-floating: rgba(var(--accent-alt), 1);
  582.     --text-normal: #e0e0e0;
  583. }
  584.  
  585.  
  586. /* Buttons */
  587.  
  588. button[class*="button-"][class*="color"],
  589. .bd-button {
  590.     --vaccentcolor: var(--accent-alt);
  591. }
  592.  
  593. .bd-button {
  594.     --bd-blue: rgba(var(--accent-alt), 1);
  595. }
  596.  
  597.  
  598. /* Context Menu */
  599.  
  600. div[role="menuitem"] {
  601.     --vaccentcolor: var(--accent-alt);
  602. }
  603.  
  604. div[role="menuitem"]:active {
  605.     --vaccentcolor: var(--accent);
  606. }
  607.  
  608.  
  609. /* Depreceated Components */
  610.  
  611.  
  612. /* These use hardcoded colors, no need to bother with strange selectors */
  613.  
  614. #app-mount .footer-2gL1pp,
  615. #app-mount .footer-3mqk7D {
  616.     background-color: var(--background-secondary);
  617.     box-shadow: none;
  618. }
  619.  
  620. #app-mount .root-1gCeng,
  621. #app-mount .addGamePopout-2RY8Ju,
  622. #app-mount .keyboardShortcutsModal-3piNz7,
  623. #app-mount .emojiAliasInput-1y-NBz .emojiInput-1aLNse,
  624. .perksModal-fSYqOq .perk-2WeBWW,
  625. #app-mount .uploadModal-2ifh8j,
  626. #app-mount .contentWrapper-3WC1ID,
  627. #app-mount .contentWarningPopout-n5JsIs {
  628.     background-color: var(--background-primary);
  629. }
  630.  
  631. #app-mount .codeRedemptionRedirect-1wVR4b,
  632. #app-mount .userSettingsVoice-iwdUCU .previewOverlay-2O7_KC,
  633. #app-mount .inset-3sAvek {
  634.     background-color: var(--background-tertiary);
  635.     border: none;
  636. }
  637.  
  638. #app-mount .paymentPane-3bwJ6A,
  639. #app-mount .tierBody-x9kBBp,
  640. #app-mount .tierBody-16Chc9,
  641. #app-mount .barBackground-2EEiLw,
  642. #app-mount .body-3iLsc4,
  643. #app-mount .footer-1fjuF6,
  644. #app-mount .container-3ayLPN,
  645. #app-mount .colorPickerCustom-2CWBn2,
  646. #app-mount .tierMarkerBackground-3q29am,
  647. .css-3vaxre-menu,
  648. .css-dwar6a-menu,
  649. #app-mount .autocomplete-1vrmpx,
  650. .categoryHeader-O1zU94,
  651. #app-mount .popoutList-T9CKZQ,
  652. #app-mount .quickSelectPopout-X1hvgV,
  653. .colorable-1bkp8v.primaryDark-3mSFDl,
  654. .tile-2naSqK,
  655. .videoWrapper-2v09vt,
  656. #app-mount .spoilerText-3p6IlD.hidden-HHr2R9 {
  657.     background-color: var(--background-solid);
  658. }
  659.  
  660. #app-mount .expandedInfo-3kfShd,
  661. #app-mount .tierHeaderLocked-1a2opw,
  662. #app-mount .tierHeaderLocked-1s2JJz,
  663. #app-mount .headerNormal-T_seeN,
  664. #app-mount .focused-2bY0OD,
  665. .colorable-1bkp8v.primaryDark-3mSFDl:hover {
  666.     background-color: var(--background-solid-dark);
  667. }
  668.  
  669. #app-mount .payment-xT17Mq {
  670.     background-color: transparent;
  671.     border-bottom-color: rgba(var(--dm-white), 0.025);
  672. }
  673.  
  674. #app-mount .bottomDivider-1K9Gao,
  675. #app-mount .focused-2bY0OD {
  676.     border-bottom-color: var(--background-solid-dark);
  677. }
  678.  
  679. #app-mount div[data-list-id="billing-history"],
  680. #app-mount div[data-list-id^="private-channels-"],
  681. #app-mount .media-engine-video,
  682. .react-datepicker,
  683. .react-datepicker__header,
  684. .react-datepicker__day--outside-month,
  685. .react-datepicker__day--disabled,
  686. div[data-list-id^="members-"],
  687. div[data-list-id^="members-"]>div {
  688.     background-color: transparent !important;
  689. }
  690.  
  691. .react-datepicker__day--disabled {
  692.     opacity: .6;
  693. }
  694.  
  695. #app-mount .react-datepicker__day {
  696.     border-top-color: var(--background-secondary);
  697.     border-left-color: var(--background-secondary);
  698. }
  699.  
  700. #app-mount .background-3xPPFc,
  701. #app-mount .tierInProgress-3mBoXq {
  702.     color: var(--background-solid);
  703. }
  704.  
  705. .option-96V44q:after {
  706.     content: none;
  707. }
  708.  
  709. #app-mount .option-96V44q.selected-rZcOL-,
  710. #app-mount .selected-1Tbx07,
  711. #app-mount .quickSelectPopoutOption-opKBx9:hover,
  712. #app-mount .outer-1AjyKL.active-1xchHY,
  713. #app-mount .outer-1AjyKL.interactive-3B9GmY:hover {
  714.     background-color: var(--background-modifier-hover);
  715. }
  716.  
  717. .css-3vaxre-menu,
  718. .tierMarker-5HkGJ_[style] {
  719.     border-color: rgba(var(--dm-white), 0.025) !important;
  720. }
  721.  
  722. #app-mount .searchAnswer-3Dz2-q,
  723. #app-mount .searchFilter-2ESiM3,
  724. #app-mount .option-1B5ZV8,
  725. #app-mount .pill-2pQByF {
  726.     background-color: rgba(var(--accent-alt), 1);
  727.     color: #fff;
  728. }
  729.  
  730. #app-mount .keybindShortcut-1BD6Z1 span {
  731.     background: var(--background-solid-dark);
  732.     box-shadow: inset 0 -4px 0 var(--background-solid-darker);
  733. }
  734.  
  735. #app-mount .perksModal-fSYqOq {
  736.     background: rgba(var(--md-black), 0.7);
  737. }
  738.  
  739. #app-mount .card-FDVird:before {
  740.     background: var(--background-modifier-hover);
  741.     border: none;
  742. }
  743.  
  744.  
  745. /* Login Page */
  746.  
  747. div[class^="splashBackground"] canvas,
  748. div[class^="splashBackground"] img {
  749.     display: none;
  750. }
  751.  
  752. /* Modals */
  753.  
  754. div[class*="footerSeparator"] {
  755.     box-shadow: none !important;
  756. }
  757.  
  758. /* Forums */
  759. .container-3wLKDe {
  760.     background: var(--background-primary);
  761. }
  762. li[class^="card-"]>div[class^="container-"] {
  763.     background: var(--background-floating)
  764. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!