API tools faq
paste
Advertisement
lluanbs

Untitled

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