├── .github ├── emojis.webp ├── oldcontext.webp ├── preview.webp ├── previewLight.webp └── showeffects.webp ├── OldCord.theme.css ├── README.md └── src ├── assets ├── DiscordWordmark.svg ├── battle.webp ├── bold.woff2 ├── cursive.woff2 ├── cursiveBold.woff2 ├── employee.svg ├── epic.svg ├── facebook.webp ├── gif_tag.svg ├── github.svg ├── kindaBold.woff2 ├── league.webp ├── mod.svg ├── normal.woff2 ├── normal600.woff2 ├── normal700.woff2 ├── oldHoldingBack.svg ├── oldPlead.svg ├── partner.svg ├── playstation.svg ├── reddit.webp ├── riot.svg ├── shapes.jpg ├── skype.webp ├── spotify.svg ├── steam.svg ├── system.svg ├── thin.woff2 ├── twitch.webp ├── twitter.webp ├── veryBold.woff2 ├── xbox.svg └── youtube.webp ├── components ├── color.css ├── imgs.css ├── miyamoto.css ├── oldContext.css ├── oldEmojis.css ├── other.css ├── profile.css ├── profileV2.css ├── redesign.css ├── showEffects.css └── vars.css └── main.css /.github/emojis.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/.github/emojis.webp -------------------------------------------------------------------------------- /.github/oldcontext.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/.github/oldcontext.webp -------------------------------------------------------------------------------- /.github/preview.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/.github/preview.webp -------------------------------------------------------------------------------- /.github/previewLight.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/.github/previewLight.webp -------------------------------------------------------------------------------- /.github/showeffects.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/.github/showeffects.webp -------------------------------------------------------------------------------- /OldCord.theme.css: -------------------------------------------------------------------------------- 1 | /** 2 | * @name OldCord 3 | * @version 2.0 4 | * @author milbit, kinggamingyt 5 | * @source https://github.com/milbits/oldcord 6 | * @website https://github.com/milbits/oldcord 7 | * @description Restores discord's 2020 UI 8 | */ 9 | 10 | /*Main theme components*/ 11 | @import url("https://milbits.github.io/oldcord/src/main.css"); 12 | 13 | /*If you want to enable/disable each part (like disable profile theming), remove the above line 14 | and a [slash]* below. Always enable vars.css though please please pelasse plealslelle*/ 15 | 16 | /* @import url("https://milbits.github.io/oldcord/src/components/vars.css"); */ /* !IMPORTANT! */ 17 | /* @import url("https://milbits.github.io/oldcord/src/components/color.css"); */ 18 | /* @import url("https://milbits.github.io/oldcord/src/components/imgs.css"); */ 19 | /* @import url("https://milbits.github.io/oldcord/src/components/other.css"); */ 20 | /* @import url("https://milbits.github.io/oldcord/src/components/profile.css"); */ 21 | /* @import url("https://milbits.github.io/oldcord/src/components/redesign.css"); */ /*Changes the overall layout*/ 22 | 23 | 24 | /* 25 | * Addons 26 | * remove a "/*" below to enable one 27 | */ 28 | 29 | /*@import url("https://milbits.github.io/oldcord/src/components/oldEmojis.css");*/ 30 | /*@import url("https://milbits.github.io/oldcord/src/components/oldContext.css");*/ 31 | /*@import url("https://milbits.github.io/oldcord/src/components/showEffects.css");*/ 32 | 33 | 34 | /*this one sucks dont use it*/ 35 | /*@import url("https://milbits.github.io/oldcord/src/components/miyamoto.css");*/ 36 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # OldCord 2 | 3 | A theme for Discord that brings the **2020** (NOT pre-2025 refresh) UI back without removing features 4 | 5 | By default, it completely removes profile effects (like banners). See addons below to get them back! 6 | 7 | ![Preview](https://raw.githubusercontent.com/milbits/oldcord/master/.github/preview.webp) 8 | 9 | > [!IMPORTANT] 10 | > - Enable "Sync Profile Themes" in `Settings > Accessibility` to fix broken profile colors 11 | > - UI Density should be on default, i wont support the other 2 options (they still kinda work though) 12 | > - To have the old gray colors, use the "Ash" theme in appearance settings 13 | 14 |
Light mode (shit) 15 | 16 | Light mode is currently not properly supported, please give me a trillion euros so i work on it :3 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 |

Addons

 25 | 26 | ## By OldCord 27 | 28 | These are usually included in oldcord.theme.css, so all you need to do is remove `/*` in the file for each addon you want to use 29 | 30 | | Name | Preview | CSS | 31 | | ---------------------- | ------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------- | 32 | | Old Plead Emoji | ![Image](https://raw.githubusercontent.com/milbits/oldcord/master/.github/emojis.webp) | `@import url("https://milbits.github.io/oldcord/src/components/oldEmojis.css");` | 33 | | Context Menu hover bg. | | `@import url("https://milbits.github.io/oldcord/src/components/oldContext.css");` | 34 | | Show Profile Cosmetics (Light theme not supported for now) | ![Image](https://raw.githubusercontent.com/milbits/oldcord/master/.github/showeffects.webp) | `@import url("https://milbits.github.io/oldcord/src/components/showEffects.css");` | 35 | | HeaderPresence | ![Image](https://github.com/user-attachments/assets/1a809f81-0d76-4146-ad25-941b4332bcbd) | https://betterdiscord.app/plugin/HeaderPresence | 36 | | [Tanza3D & KingGamingYT's NoMosaic plugin (BetterDiscord)](https://github.com/KingGamingYT/discord-no-mosaic) | Restores the old image layout | 37 | 38 | If you use custom/quickcss, paste the CSS at the very top! 39 | 40 | ## 3rd party 41 | 42 | | Name | Description | 43 | | ------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------- | 44 | | [Vencord's NoMosaic plugin](https://vencord.dev/plugins/NoMosaic) | Restores the old image layout | 45 | | [NoSuperReactions](https://github.com/xenrelle/Xens-BD-Dump/tree/main/plugins/NoSuperReactions) | Removes super reactions | 46 | | [OldFileUpload](https://github.com/xenrelle/Xens-BD-Dump/tree/main/plugins/OldFileUpload) | Open the file picker with just one click | 47 | | [hide-nitro-upselling](https://github.com/D3SOX/complementary-discord-theme/blob/master/hide-nitro-upselling.betterdiscord.theme.css) | Hides nitro ads, could cause lag | 48 | | [Icon Revert](https://github.com/davart154/Icon-Revert-2023/blob/main/2023%20Icon%20Revert.theme.css) | Reverts all icons to pre-2023. Can cause huge lag (see #37) | 49 | 50 | --- 51 | 52 |
53 | 54 | # Installation 55 | 56 | ## 🚮[BetterDiscord](https://betterdiscord.app/) 57 | 58 | 1. Download [OldCord.theme.css](https://raw.githubusercontent.com/milbits/oldcord/main/OldCord.theme.css) (right-click > "Save As") 59 | 2. Save the file to the BetterDiscord theme folder: 60 | 61 | - Windows: `%appdata%/BetterDiscord/themes` 62 | - Linux: `~/.config/BetterDiscord/themes` 63 | 64 | ## 😺[Vencord](https://github.com/Vendicated/Vencord) 65 | 66 | #### Local method 67 | 68 | 1. Download [OldCord.theme.css](https://raw.githubusercontent.com/milbits/oldcord/main/OldCord.theme.css) (right-click > "Save As") 69 | 2. Move the file to the Vencord theme folder: 70 | 71 | - `Settings > Themes > Open theme folder` 72 | 73 | #### Online method 74 | 75 | Paste the following in `Settings > Themes`: 76 | 77 | - `https://milbits.github.io/oldcord/src/main.css` 78 | 79 | ## 🎛️ Other 80 | 81 | 1. Paste the following at **the top** of the CSS file/window: 82 | 83 | ```css 84 | @import url("https://milbits.github.io/oldcord/src/main.css"); 85 | ``` 86 | 87 | 88 | -------------------------------------------------------------------------------- /src/assets/DiscordWordmark.svg: -------------------------------------------------------------------------------- 1 | 2 | 4 | -------------------------------------------------------------------------------- /src/assets/battle.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/battle.webp -------------------------------------------------------------------------------- /src/assets/bold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/bold.woff2 -------------------------------------------------------------------------------- /src/assets/cursive.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/cursive.woff2 -------------------------------------------------------------------------------- /src/assets/cursiveBold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/cursiveBold.woff2 -------------------------------------------------------------------------------- /src/assets/employee.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/epic.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /src/assets/facebook.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/facebook.webp -------------------------------------------------------------------------------- /src/assets/gif_tag.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/github.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/kindaBold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/kindaBold.woff2 -------------------------------------------------------------------------------- /src/assets/league.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/league.webp -------------------------------------------------------------------------------- /src/assets/mod.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/normal.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/normal.woff2 -------------------------------------------------------------------------------- /src/assets/normal600.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/normal600.woff2 -------------------------------------------------------------------------------- /src/assets/normal700.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/normal700.woff2 -------------------------------------------------------------------------------- /src/assets/oldHoldingBack.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/oldPlead.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/partner.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/playstation.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/reddit.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/reddit.webp -------------------------------------------------------------------------------- /src/assets/riot.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/shapes.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/shapes.jpg -------------------------------------------------------------------------------- /src/assets/skype.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/skype.webp -------------------------------------------------------------------------------- /src/assets/spotify.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/steam.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/system.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/thin.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/thin.woff2 -------------------------------------------------------------------------------- /src/assets/twitch.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/twitch.webp -------------------------------------------------------------------------------- /src/assets/twitter.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/twitter.webp -------------------------------------------------------------------------------- /src/assets/veryBold.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/veryBold.woff2 -------------------------------------------------------------------------------- /src/assets/xbox.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/assets/youtube.webp: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/milbits/oldcord/ebd41a8dabe32f83e5486989e02881067e36ed06/src/assets/youtube.webp -------------------------------------------------------------------------------- /src/components/color.css: -------------------------------------------------------------------------------- 1 | /*WIP: clean that shit up jesus christtdfgnbijsdfbgbdfsguoibsd*/ 2 | /* 3 | [fill="#3ba55c"], 4 | [fill="#3BA55C"], 5 | [fill="rgba(59, 165, 92, 1)"], 6 | [fill="#23a55a"], 7 | [fill="hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%)"], 8 | [fill="rgba(35, 165, 90, 1)"] { 9 | fill: var(--green) !important; 10 | } 11 | [style*="background-color: hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%);"], 12 | [style*="background-color: rgb(59, 165, 92);"], 13 | [style="background: rgb(35 165 90);"] { 14 | background-color: var(--green) !important; 15 | } 16 | [style*="color: hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%);"]:not(.themed-2-lozF) { 17 | color: var(--green) !important; 18 | } 19 | 20 | [fill="#3ba55c"], 21 | [style="background-color: rgb(237, 66, 69);"], 22 | .red_f1ceac { 23 | background-color: var(--red) !important; 24 | } 25 | .topGuildEmojiBadge_aeaaeb { 26 | background: var(--red); 27 | } 28 | [fill="#ed4245"] { 29 | fill: var(--red); 30 | } 31 | 32 | [fill="#6370f4"] { 33 | fill: var(--brand-experiment-530); 34 | } 35 | [fill="#5865f2"], 36 | [fill="#5865F2"], 37 | [fill="hsl(234.94,85.56%,64.71%)"], 38 | [fill="hsl(235, calc(var(--saturation-factor, 1) * 85.6%), 64.7%)"] { 39 | fill: var(--brand-experiment); 40 | } 41 | [style^="color: rgb(88, 101, 242);"] { 42 | color: var(--brand-experiment) !important; 43 | } 44 | 45 | [style*="background-color: rgb(88, 101, 242);"], 46 | .lookFilled__201d5.colorBrand__201d5:disabled, 47 | [style*="background-color: hsl(235, calc(var(--saturation-factor, 1) * 85.6%), 64.7%);"], 48 | .barFill_a562c8 { 49 | background-color: var(--brand-experiment) !important; 50 | } 51 | 52 | [fill="#23a55a"] { 53 | fill: var(--green) !important; 54 | } 55 | */ 56 | /*discovery and add button*/ 57 | .circleIcon__5bc7e{ 58 | color: var(--green); 59 | .selected__5bc7e &{ 60 | color:#fff 61 | } 62 | } 63 | .circleIconButton__5bc7e.selected__5bc7e{ 64 | color: #fff; 65 | background-color: var(--green) 66 | } 67 | 68 | 69 | :is(.lookFilled__201d5.colorBrand__201d5, .lookFilled__201d5.colorBrand__201d5:disabled) { 70 | background-color: var(--blurple); 71 | &:hover { 72 | background-color: var(--blurple-hover) !important; 73 | } 74 | &:active { 75 | background-color: var(--blurple-active) !important; 76 | } 77 | } 78 | 79 | /*context menu*/ 80 | .colorDefault_c1e9c4.focused_c1e9c4 { 81 | background: var(--brand-experiment-560); 82 | &:active { 83 | background: var(--brand-experiment-600) !important; 84 | } 85 | } 86 | /** Dropdown*/ 87 | .popout__3f413{ 88 | background: var(--background-secondary); 89 | margin-top: 0 !important; 90 | border: none; 91 | border-radius: 0 0px 4px 4px !important; 92 | box-shadow:var(--legacy-elevation-border), var(--legacy-elevation-high); 93 | } 94 | .option__3f413 { 95 | color: var(--interactive-active) !important; 96 | &:is(:hover, :focus) { 97 | background-color: var(--background-secondary-alt) !important; 98 | } 99 | &[aria-selected="true"] { 100 | background-color: var(--background-tertiary) !important; 101 | } 102 | } 103 | 104 | .lookFilled__201d5.colorRed__201d5, 105 | .colorDanger_c1e9c4.focused_c1e9c4 { 106 | background-color: var(--red); 107 | &:hover { 108 | background-color: var(--red-hover); 109 | } 110 | &:active { 111 | background-color: var(--red-active) !important; 112 | } 113 | } 114 | 115 | .buttonColor_e131a9 { 116 | background-color: var(--background-primary) !important; 117 | color: var(--interactive-active); 118 | &:hover { 119 | background-color: var(--background-secondary) !important; 120 | } 121 | } 122 | 123 | .tipTitle_a2f514 { 124 | color: var(--brand-experiment) !important; 125 | } 126 | 127 | /*.lookOutlined__201d5.colorGreen__201d5:not(:hover):not(:active) { 128 | border-color: hsla(153, calc(var(--saturation-factor, 1) * 46%), 49%, 0.302); 129 | }*/ 130 | 131 | .lookFilled__201d5.colorGreen__201d5 { 132 | background-color: var(--green); 133 | &:hover { 134 | background-color: var(--green-hover); 135 | } 136 | &:active { 137 | background-color: var(--green-active); 138 | } 139 | } 140 | 141 | /* Green Speaking Border in Maximized Voice Chats */ 142 | .border__2f4f7.speaking__2f4f7 { 143 | box-shadow: inset 0 0 0 2px var(--green-360); 144 | } 145 | 146 | .newlyAddedBadge_aeaaeb { 147 | background: var(--green); 148 | } 149 | 150 | .button_e131a9 .buttonColor_e131a9:disabled { 151 | background-color: var(--background-primary); 152 | color: var(--interactive-active); 153 | opacity: 0.3; 154 | } 155 | 156 | .lookOutlined__201d5.colorPrimary__201d5 { 157 | color: var(--interactive-active) !important; 158 | border-color: var(--interactive-active) !important; 159 | } 160 | .lookOutlined__201d5.colorPrimary__201d5:hover { 161 | background: none; 162 | } 163 | .lookOutlined__201d5.colorPrimary__201d5:active { 164 | background-color: var(--primary-transparent); 165 | } 166 | 167 | /*.folderIconWrapper__48112[style="background-color: rgba(88, 101, 242, 0.4);"] { 168 | background-color: var(--brand-experiment-40a) !important; 169 | }*/ 170 | 171 | .mentionButton__841c8 { 172 | --text-link: var(--brand-experiment); 173 | } 174 | 175 | /** Add Friend Chip*/ 176 | .addFriend__133bf.selected_b3f026 { 177 | color: var(--green) !important; 178 | background-color: var(--green-transparent) !important; 179 | } 180 | .addFriend__133bf { 181 | background-color: var(--green) !important; 182 | } 183 | 184 | .barFill-2Bh7CX { 185 | background: var(--brand-experiment); 186 | height: 100%; 187 | } 188 | 189 | .partnered__09691:not(.disableColor-2z9rkr) { 190 | color: var(--brand-experiment); 191 | } 192 | 193 | /**Search page*/ 194 | /*search menu thing*/ 195 | .container__55c99 { 196 | background: var(--bg-overlay-3, var(--background-primary)); 197 | } 198 | .container__55c99 .option__56fec:hover { 199 | background: var(--bg-overlay-1, var(--background-tertiary)); 200 | } 201 | /*search results*/ 202 | .searchHeader_f3b986 { 203 | background: var(--bg-overlay-chat); 204 | box-shadow: var(--elevation-low); 205 | height: 48px; 206 | padding: 0 20px; 207 | } 208 | .searchHeaderTabList_f3b986 [aria-selected="true"] { 209 | box-shadow: inset 0 -2px var(--interactive-active); 210 | } 211 | .searchHeaderTabList_f3b986 .item_b3f026 { 212 | padding: 15px 8px; 213 | border-radius: 0; 214 | background-color: transparent !important; 215 | font-size: 14px; 216 | border-radius: 0 !important; 217 | } 218 | 219 | .searchResultGroup_c68065:before { 220 | content: ""; 221 | width: 100%; 222 | height: 1px; 223 | display: block; 224 | background: var(--background-modifier-accent); 225 | position: relative; 226 | top: 12px; 227 | } 228 | 229 | .searchResult__02a39 { 230 | border: solid 1px var(--background-tertiary); 231 | border-radius: 4px; 232 | } 233 | 234 | /** Mentions/Pings*/ 235 | .wrapper_f61d60 { 236 | font-weight: 500; 237 | color: var(--brand-experiment-460); 238 | background: var(--brand-experiment-10a); 239 | padding: 0 2px; 240 | } 241 | .wrapper_f61d60:hover { 242 | background: var(--brand-experiment); 243 | color: var(--brand-experiment-100); 244 | } 245 | 246 | .interactive { 247 | transition: background-color 50ms ease-out, color 50ms ease-out; 248 | cursor: pointer; 249 | text-decoration: none !important; 250 | } 251 | .mentioned__5126c .interactive { 252 | /* make background transparent when mentioned*/ 253 | background: transparent; 254 | } 255 | .interactive:hover { 256 | color: var(--white-500); 257 | background-color: var(--brand-experiment); 258 | } 259 | 260 | .icon_b75563:has( 261 | [d="M10.99 3.16A1 1 0 1 0 9 2.84L8.15 8H4a1 1 0 0 0 0 2h3.82l-.67 4H3a1 1 0 1 0 0 2h3.82l-.8 4.84a1 1 0 0 0 1.97.32L8.85 16h4.97l-.8 4.84a1 1 0 0 0 1.97.32l.86-5.16H20a1 1 0 1 0 0-2h-3.82l.67-4H21a1 1 0 1 0 0-2h-3.82l.8-4.84a1 1 0 1 0-1.97-.32L15.15 8h-4.97l.8-4.84ZM14.15 14l.67-4H9.85l-.67 4h4.97Z"] 262 | ) { 263 | display: none; 264 | } 265 | .channelWithIcon:has( 266 | [d="M10.99 3.16A1 1 0 1 0 9 2.84L8.15 8H4a1 1 0 0 0 0 2h3.82l-.67 4H3a1 1 0 1 0 0 2h3.82l-.8 4.84a1 1 0 0 0 1.97.32L8.85 16h4.97l-.8 4.84a1 1 0 0 0 1.97.32l.86-5.16H20a1 1 0 1 0 0-2h-3.82l.67-4H21a1 1 0 1 0 0-2h-3.82l.8-4.84a1 1 0 1 0-1.97-.32L15.15 8h-4.97l.8-4.84ZM14.15 14l.67-4H9.85l-.67 4h4.97Z"] 267 | ) 268 | > .name_b75563:before { 269 | content: "#"; 270 | } 271 | 272 | /** Log Out, Server Boost, Delete Server Buttons*/ 273 | .side_b3f026 .item_b3f026 { 274 | border-radius: 3px; 275 | } 276 | .side_b3f026 277 | .themed_b3f026.item_b3f026:has( 278 | [d="M15.3 16.7a1 1 0 0 1 1.4-1.4l4.3 4.29V16a1 1 0 1 1 2 0v6a1 1 0 0 1-1 1h-6a1 1 0 1 1 0-2h3.59l-4.3-4.3Z"], 279 | [d="M14.25 1c.41 0 .75.34.75.75V3h5.25c.41 0 .75.34.75.75v.5c0 .41-.34.75-.75.75H3.75A.75.75 0 0 1 3 4.25v-.5c0-.41.34-.75.75-.75H9V1.75c0-.41.34-.75.75-.75h4.5Z"] 280 | ) { 281 | color: var(--red) !important; 282 | } 283 | .side_b3f026 284 | .themed_b3f026.item_b3f026:has( 285 | [d="M15.3 16.7a1 1 0 0 1 1.4-1.4l4.3 4.29V16a1 1 0 1 1 2 0v6a1 1 0 0 1-1 1h-6a1 1 0 1 1 0-2h3.59l-4.3-4.3Z"], 286 | [d="M14.25 1c.41 0 .75.34.75.75V3h5.25c.41 0 .75.34.75.75v.5c0 .41-.34.75-.75.75H3.75A.75.75 0 0 1 3 4.25v-.5c0-.41.34-.75.75-.75H9V1.75c0-.41.34-.75.75-.75h4.5Z"] 287 | ):hover { 288 | background-color: var(--red-transparent) !important; 289 | } 290 | .side_b3f026 291 | .themed_b3f026.item_b3f026:has( 292 | [d="M15.3 16.7a1 1 0 0 1 1.4-1.4l4.3 4.29V16a1 1 0 1 1 2 0v6a1 1 0 0 1-1 1h-6a1 1 0 1 1 0-2h3.59l-4.3-4.3Z"], 293 | [d="M14.25 1c.41 0 .75.34.75.75V3h5.25c.41 0 .75.34.75.75v.5c0 .41-.34.75-.75.75H3.75A.75.75 0 0 1 3 4.25v-.5c0-.41.34-.75.75-.75H9V1.75c0-.41.34-.75.75-.75h4.5Z"] 294 | ):active { 295 | background-color: var(--red) !important; 296 | color: var(--white-500) !important; 297 | } 298 | 299 | .side_b3f026 .themed_b3f026.item_b3f026:has([d="M5 0.5L0 5.5V10.5L5 15.5L10 10.5V5.5L5 0.5ZM8.75 9.9875L5 13.7375L1.25 9.9875V6.0125L5 2.2625L8.75 6.0125V9.9875Z"]) { 300 | color: var(--blurple) !important; 301 | } 302 | .side_b3f026 .themed_b3f026.item_b3f026:has([d="M5 0.5L0 5.5V10.5L5 15.5L10 10.5V5.5L5 0.5ZM8.75 9.9875L5 13.7375L1.25 9.9875V6.0125L5 2.2625L8.75 6.0125V9.9875Z"]):hover { 303 | background-color: var(--brand-experiment-10a) !important; 304 | } 305 | .side_b3f026 306 | .themed_b3f026.item_b3f026:has([d="M5 0.5L0 5.5V10.5L5 15.5L10 10.5V5.5L5 0.5ZM8.75 9.9875L5 13.7375L1.25 9.9875V6.0125L5 2.2625L8.75 6.0125V9.9875Z"]):active { 307 | color: var(--white-500) !important; 308 | background-color: var(--blurple) !important; 309 | } 310 | 311 | /*! Reactions*/ 312 | /*selectors for forums and normal messages*/ 313 | 314 | @keyframes reactionAnim { 315 | 0% { 316 | transform: scale(0); 317 | } 318 | 100% { 319 | transform: scale(1); 320 | } 321 | } 322 | .reactions__23977 { 323 | padding-top: 0; 324 | margin-top: -0.125rem; 325 | } 326 | .reaction_f8896c, 327 | .reaction__23977, 328 | .reactionBtn__23977 { 329 | animation: cubic-bezier(0.1, 1, 0.9, 1.1) reactionAnim 0.1s; 330 | animation-iteration-count: var(--reaction-animation, 0); 331 | } 332 | .theme-dark .reactionBtn__23977 { 333 | border-radius: 2px; 334 | margin-bottom: 1px; 335 | background: none; 336 | border: none; 337 | } 338 | .reactionBtn__23977.forceShowLook_ec6b19:hover { 339 | background-color: unset; 340 | } 341 | 342 | .reaction_f8896c, 343 | .reaction__23977 { 344 | border-radius: 0.25rem; 345 | border: none; 346 | margin-bottom: 0.125rem; 347 | transition: background-color 0.1s ease; 348 | background: var(--background-modifier-accent) !important; 349 | &:hover { 350 | background-color: var(--background-modifier-selected) !important; 351 | } 352 | } 353 | .reaction_f8896c:hover, 354 | .reaction__23977:hover { 355 | background-color: var(--background-modifier-selected) !important; 356 | } 357 | .mentioned__5126c .reaction_f8896c, 358 | .mentioned__5126c .reaction_f8896c:hover { 359 | background-color: var(--background-modifier-accent); 360 | } 361 | 362 | .reaction__23977:hover .reactionCount__23977, 363 | .reaction_f8896c:hover .reactionCount_f8896c { 364 | color: var(--interactive-active) !important; 365 | } 366 | 367 | .mentioned__5126c .reaction_f8896c.reactionMe_f8896c, 368 | .mentioned__5126c .reactionMe_f8896c.reaction_f8896c:hover, 369 | .reaction_f8896c.reactionMe_f8896c, 370 | .reaction__23977.reactionMe__23977 { 371 | background-color: var(--brand-experiment-30a) !important; 372 | } 373 | 374 | .reactionInner__23977, 375 | .reaction_f8896c.reactionInner_f8896c { 376 | padding: 0 0.375rem !important; 377 | } 378 | .reaction_f8896c.reactionMe_f8896c .reactionCount_f8896c, 379 | .reaction__23977.reactionMe__23977 .reactionCount__23977 { 380 | color: var(--brand-experiment) !important; 381 | } 382 | 383 | .reactionCount__23977, 384 | .reactionCount_f8896c { 385 | font-weight: 500; 386 | color: var(--text-muted); 387 | } 388 | 389 | /** Select Menus*/ 390 | .select__3f413, 391 | .copyInput_fffc15 { 392 | background-color: var(--background-secondary) !important; 393 | border-radius: 3px; 394 | transition: border 0.2s ease-in-out; 395 | cursor: default; 396 | } 397 | .open__3f413 { 398 | border-color: var(--deprecated-text-input-border-hover) !important; 399 | } 400 | /* icon*/ 401 | .select__3f413 [d="M7.41 16.0001L12 11.4201L16.59 16.0001L18 14.5901L12 8.59006L6 14.5901L7.41 16.0001Z"] { 402 | d: path("M16.59 8.59003L12 13.17L7.41 8.59003L6 10L12 16L18 10L16.59 8.59003Z"); 403 | } 404 | .icons__3f413 { 405 | color: var(--text-muted); 406 | } 407 | .select__3f413.open__3f413 .icons__3f413 { 408 | color: var(--interactive-active); 409 | } 410 | 411 | /** Close Button*/ 412 | .closeButton_c2b141 [d="M18.4 4L12 10.4L5.6 4L4 5.6L10.4 12L4 18.4L5.6 20L12 13.6L18.4 20L20 18.4L13.6 12L20 5.6L18.4 4Z"] { 413 | d: path("M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12"); 414 | } 415 | .theme-light .closeButton_c2b141 { 416 | color: #dcddde !important; 417 | background: #0000 !important; 418 | &:hover { 419 | background: #f6f6f7 !important; 420 | color: #dcddde !important; 421 | } 422 | & svg { 423 | color: #72767d !important; 424 | } 425 | } 426 | .theme-dark .closeButton_c2b141 { 427 | color: #72767d !important; 428 | background: #0000 !important; 429 | & svg { 430 | color: #dcddde !important; 431 | transform: scale(1.15); 432 | } 433 | &:hover { 434 | background: #72767e4d !important; 435 | color: #72767d !important; 436 | } 437 | } 438 | .keybind_c2b141 { 439 | color: #72767d !important; 440 | } 441 | 442 | .lookOutlined__201d5.colorBrand__201d5 { 443 | color: var(--brand-experiment) !important; 444 | border-color: var(--brand-experiment) !important; 445 | background: transparent !important; 446 | } 447 | .lookOutlined__201d5.colorBrand__201d5:active { 448 | background: var(--brand-experiment-10a) !important; 449 | } 450 | 451 | .lookOutlined__201d5.colorRed__201d5 { 452 | background: transparent !important; 453 | color: var(--red) !important; 454 | border-color: var(--text-danger) !important; 455 | } 456 | .lookOutlined__201d5.colorRed__201d5:active { 457 | background: var(--red-transparent) !important; 458 | } 459 | 460 | html:not(.custom-theme-background) .icon__2ea32:not(.modeMuted__2ea32 .icon__2ea32) { 461 | color: var(--text-muted); 462 | } 463 | 464 | /* revert new unread bar*/ 465 | .bar__7aaec { 466 | padding-left: 71px; 467 | margin-top: 8px; 468 | width: 146px !important; 469 | background-color: var(--background-accent); 470 | opacity: 0.9; 471 | font-family: var(--font-display); 472 | box-shadow: 0 2px 6px hsl(var(--black-500-hsl) / 0.24); 473 | &:active { 474 | top: 1px; 475 | } 476 | } 477 | 478 | .unread__3b95d { 479 | background-color: var(--background-accent); 480 | opacity: 0.9; 481 | } 482 | .barText__7aaec { 483 | color: var(--white-500) !important; 484 | } 485 | /* unread bar in channels*/ 486 | .newMessagesBar__0f481 { 487 | height: 0; 488 | } 489 | 490 | /* revert tab focus color*/ 491 | .focus-rings-ring { 492 | box-shadow: 0 0 0 4px var(--brand-experiment); 493 | } 494 | 495 | /*channels and roles*/ 496 | .container__0b563, 497 | .header__0b563 { 498 | background-color: var(--background-primary) !important; 499 | } 500 | .channelRow_e4503a:hover { 501 | background-color: var(--background-modifier-hover) !important; 502 | } 503 | 504 | .optionButtonWrapper__270d7 { 505 | transition: 0.1s ease-in-out; 506 | border-radius: 4px; 507 | } 508 | 509 | /** active now in friends tab*/ 510 | .nowPlayingColumn__133bf .container__7d20c, 511 | .profileCard__5d7c9, 512 | .prompt__5d7c9 { 513 | background-color: var(--background-secondary); 514 | } 515 | .scroller__7d20c { 516 | border: none; 517 | } 518 | .nowPlayingColumn__133bf .header__7d20c { 519 | color: var(--header-secondary); 520 | text-transform: uppercase; 521 | font-size: 12px; 522 | margin: 0; 523 | margin-bottom: var(--space-16); 524 | font-weight: 600; 525 | } 526 | .wrapper__00943 { 527 | border: none; 528 | background: var(--background-tertiary); 529 | border-radius: 4px; 530 | } 531 | 532 | /*GIF Selector*/ 533 | .result__2dc39:hover:after { 534 | box-shadow: inset 0 0 0 2px var(--brand-experiment), inset 0 0 0 3px var(--primary-630); 535 | } 536 | .result__2dc39:after { 537 | background: none !important; 538 | z-index: 10; 539 | } 540 | 541 | .categoryFade_d02962 { 542 | background: hsl(var(--black-500-hsl) / 0.4); 543 | transition: background-color.15s ease-out; 544 | &:hover { 545 | backdrop-filter: none; 546 | background: rgba(0, 0, 0, 0.7); 547 | } 548 | } 549 | .categoryFadeBlurple_d02962 { 550 | transition: background-color.15s ease-out; 551 | &:hover { 552 | background: var(--brand-experiment-95a); 553 | backdrop-filter: none; 554 | } 555 | } 556 | -------------------------------------------------------------------------------- /src/components/miyamoto.css: -------------------------------------------------------------------------------- 1 | .theme-dark { 2 | --background-primary: url("https://cdn.discordapp.com/attachments/1056211378882498641/1373479248517660703/1200px-Shigeru_Miyamoto_2019-137347526.jpg?ex=682a8fba&is=68293e3a&hm=d2676459a43abc64e361255c86bb54d45ad45a7c752f6107b5c034459375dcd3&") !important; 3 | --background-secondary: url("https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fimages6.alphacoders.com%2F445%2F445791.jpg&f=1&ipt=3bab04ff81c2291346ac3af3b23f2246360bfce67e047985cf2582dc0eed2d8d") !important; 4 | --background-secondary-alt:url(https://nationaltoday.com/wp-content/uploads/2022/09/Shigeru-Miyamoto.jpg.webp) !important; 5 | --background-tertiary:url("https://cdn.discordapp.com/attachments/1056211378882498641/1373483703233151016/shigeru_miyamoto_cloud-2419184245.jpg?ex=682a93e0&is=68294260&hm=b707e1782f66c68ea57a04ef25713dd84dafbecd7f1146b7839eaeb592665d08&") !important; 6 | --text-normal: red !important; 7 | } 8 | .guilds_c48ade{ 9 | background: url(https://cdn.discordapp.com/attachments/1056211378882498641/1373485850771587113/unknown.png?ex=682a95e0&is=68294460&hm=26b06ab046ec8821d1678637f6f8fa3caaf2111a44b2182fb5799a36961cafec&) 10 | } 11 | .childWrapperNoHoverBg__6e9f8 { 12 | content: url("https://preview.redd.it/official-nintendo-switch-2-logo-with-and-without-background-v0-db06bgkbbfde1.png?width=640&crop=smart&auto=webp&s=43517c3d91972d27bcc50f7d2234e09cf6638834") 13 | } 14 | -------------------------------------------------------------------------------- /src/components/oldContext.css: -------------------------------------------------------------------------------- 1 | .focused_c1e9c4{background-color: var(--background-modifier-hover) !important;} 2 | .focused_c1e9c4.colorDanger_c1e9c4{color: var(--red) !important;background-color: var(--background-modifier-hover) !important;} 3 | -------------------------------------------------------------------------------- /src/components/oldEmojis.css: -------------------------------------------------------------------------------- 1 | /*plead 🥺*/ 2 | [src="/assets/059679850d492e83.svg"]{content: url("https://milbits.github.io/oldcord/src/assets/oldPlead.svg");} 3 | /*holding back 🥹*/ 4 | [src="/assets/5df2da052fc1ddc6.svg"]{content: url("https://milbits.github.io/oldcord/src/assets/oldHoldingBack.svg");} 5 | -------------------------------------------------------------------------------- /src/components/other.css: -------------------------------------------------------------------------------- 1 | /** Fonts*/ 2 | @font-face { 3 | font-family: "Whitney"; 4 | font-weight: 300; 5 | src: url(https://milbits.github.io/oldcord/src/assets/thin.woff2) format("woff2"); 6 | } 7 | @font-face { 8 | font-family: "Whitney"; 9 | src: url(https://milbits.github.io/oldcord/src/assets/normal.woff2); 10 | } 11 | @font-face { 12 | font-family: "Whitney"; 13 | font-style: italic; 14 | src: url(https://milbits.github.io/oldcord/src/assets/cursive.woff2); 15 | } 16 | @font-face { 17 | font-weight: 500; 18 | font-family: "Whitney"; 19 | src: url(https://milbits.github.io/oldcord/src/assets/kindaBold.woff2); 20 | } 21 | @font-face { 22 | font-family: "Whitney"; 23 | font-weight: 600; 24 | src: url(https://milbits.github.io/oldcord/src/assets/bold.woff2) format("woff2"); 25 | } 26 | @font-face { 27 | font-weight: 700; 28 | font-family: "Whitney"; 29 | src: url(https://milbits.github.io/oldcord/src/assets/veryBold.woff2); 30 | } 31 | @font-face { 32 | font-weight: 700; 33 | font-style: italic; 34 | font-family: "Whitney"; 35 | src: url(https://milbits.github.io/oldcord/src/assets/cursiveBold.woff2); 36 | } 37 | code { 38 | font-family: "Source Code Pro"; 39 | } 40 | .eyebrow /*rare NORMAL class??!?!??!?!!*/ { 41 | font-weight: 600; 42 | text-transform: uppercase; 43 | font-size: 12px; 44 | } 45 | 46 | .activityText__5d473 { 47 | color: var(--channels-default) !important; 48 | } 49 | .peopleListItem_cc6179 .text__19b6d.text-sm\/medium_cf4812 { 50 | color: var(--header-secondary) !important; 51 | } 52 | 53 | /* style dms correctly */ 54 | .channel__972a0 { 55 | .interactiveSelected__972a0 .subText__20a53 [data-text-variant="text-xs\/medium"] { 56 | color: var(--interactive-active) !important; 57 | } 58 | &:hover:not(:has(.interactiveSelected__972a0)) .subText__20a53 [data-text-variant="text-xs\/medium"] { 59 | color: var(--interactive-hover) !important; 60 | } 61 | &:hover .interactiveSelected__972a0 .name__20a53 { 62 | color: var(--interactive-active) !important; 63 | } 64 | & .subText__20a53 [data-text-variant="text-xs\/medium"] { 65 | color: var(--channels-default) !important; 66 | } 67 | &:hover:has(.interactiveSelected__972a0) .interactive_bf202d { 68 | background: var(--background-modifier-selected) !important; 69 | } 70 | &:hover .muted__20a53 { 71 | color: var(--interactive-hover) !important; 72 | & .avatar__20a53 { 73 | opacity: 1; 74 | } 75 | } 76 | } 77 | 78 | /*bot tag*/ 79 | :not(.botTagOP__82f07, .botTagRemix__82f07) > .botText__82f07 { 80 | visibility: hidden; 81 | font-size: 0 !important; 82 | &:before { 83 | content: "BOT"; 84 | font-size: 10px; 85 | line-height: 20px; 86 | visibility: visible; 87 | } 88 | } 89 | .botTag__82f07 { 90 | border-radius: 3px !important; 91 | } 92 | .botTagRemix__82f07 { 93 | border: 1px solid var(--blurple); 94 | background: transparent; 95 | color: var(--blurple); 96 | } 97 | 98 | /** revert reactions modal*/ 99 | .theme-dark .reactionSelected_cc2dff { 100 | background-color: rgba(79, 84, 92, 0.3); 101 | border-radius: 2px; 102 | margin-bottom: 1px; 103 | } 104 | .reactionLarge.emoji { 105 | width: 1rem; 106 | height: 1rem; 107 | } 108 | .reactionDefault_cc2dff { 109 | border-radius: 2px; 110 | margin-bottom: 1px; 111 | } 112 | 113 | /** revert switches*/ 114 | .container__87bf1 .input__87bf1 { 115 | &:before { 116 | content: ""; 117 | box-shadow: inset 0 1px 1px #00000026; 118 | width: 42px; 119 | height: 24px; 120 | background: #72767d; 121 | display: block; 122 | border-radius: 50px; 123 | margin-top: -3px; 124 | margin-left: -6px; 125 | } 126 | 127 | &:after { 128 | content: ""; 129 | display: block; 130 | width: 18px; 131 | height: 18px; 132 | position: absolute; 133 | top: 0; 134 | left: -3px; 135 | background: var(--white-500); 136 | border-radius: 50px; 137 | box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); 138 | } 139 | 140 | &:checked:before { 141 | background: var(--brand-experiment); 142 | } 143 | 144 | &:checked:after { 145 | transform: translate3d(18px, 0, 0); 146 | } 147 | } 148 | 149 | /* change color to green just for the role permissions form */ 150 | .permissionsForm__16663 .container__87bf1 .input__87bf1 { 151 | &:checked:before { 152 | background: #43b581; 153 | } 154 | 155 | &:checked:active:before { 156 | background: var(--green-hover); 157 | } 158 | } 159 | 160 | /* revert channel role permissions (beta), looks kinda bad when zoomed in but i'll try to fix that */ 161 | .group__344e6 { 162 | background-color: var(--background-tertiary); 163 | width: 108px; 164 | grid-gap: 1px; 165 | } 166 | .passthrough__344e6 { 167 | &.selected__344e6 { 168 | background-color: #787e8a; 169 | } 170 | 171 | &svg { 172 | display: none; 173 | } 174 | 175 | &:not(.selected__344e6)::after { 176 | content: url("data:image/svg+xml,"); 177 | height: 16px; 178 | width: 16px; 179 | rotate: 45deg; 180 | } 181 | 182 | &.selected__344e6::after { 183 | content: url("data:image/svg+xml,"); 184 | height: 16px; 185 | width: 16px; 186 | rotate: 45deg; 187 | } 188 | } 189 | .item__344e6 { 190 | cursor: pointer; 191 | } 192 | .container__87bf1 .input__87bf1 { 193 | opacity: 1; 194 | width: 0; 195 | &:active:before { 196 | background: #676a71; 197 | } 198 | 199 | &:active:after { 200 | width: 26px; 201 | } 202 | 203 | &:checked:active:before { 204 | background: var(--blurple-hover); 205 | } 206 | 207 | &:checked:active:after { 208 | left: -11px; 209 | width: 26px; 210 | } 211 | 212 | &:before, 213 | &:after { 214 | transition: 0.1s; 215 | } 216 | } 217 | .container__87bf1 { 218 | background: #0000 !important; 219 | } 220 | 221 | /* checkboxes*/ 222 | .checkbox_f525d3 { 223 | &:not(.round_f525d3) { 224 | border-color: #72767d !important ; 225 | border-radius: 3px; 226 | border-width: 1px !important; 227 | } 228 | 229 | &.checked_f525d3 { 230 | border: none !important; 231 | } 232 | } 233 | 234 | .channelTextAreaInner_fb64c9.channelTextAreaInnerFocused__42399 .scrollableContainer_d0696b .webkit__8d35a { 235 | border-color: var(--brand-experiment); 236 | } 237 | 238 | /** display:none graveyard*/ 239 | .sessionMoreButton__803f2 svg, .newMemberBadge_f80704, .option__56fec:after, .premiumLabel_e681d1 > svg, .banner_ec75b3, .unreadIcon__7aaec /* new unread bar icon*/ 240 | , .container__87bf1 svg, .communityInfoPill_f37cb1, .item_b3f026 svg { 241 | display: none; 242 | } 243 | 244 | .characterBackground_eb4069 .logoWithText_eb4069 { 245 | top: 24px; 246 | left: 24px; 247 | margin: 0; 248 | } 249 | 250 | /** Mute/Account switch notification */ 251 | .toast__3fde7 { 252 | background: var(--green) !important; 253 | transform: translateY(10px); 254 | padding: 6px 10px !important; 255 | border-radius: 5px !important; 256 | box-shadow: var(--elevation-medium), var(--elevation-stroke) !important; 257 | font-weight: 500; 258 | color: var(--header-primary) !important; 259 | margin-top: 10px; 260 | border: none !important; 261 | } 262 | .toast__3fde7 .icon__3fde7 > path { 263 | d: none !important; 264 | } 265 | .toast__3fde7 .icon__3fde7 { 266 | height: 20px !important; 267 | width: 20px !important; 268 | margin-top: 0 !important; 269 | background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRkZGRkZGIiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPiAgICA8cGF0aCBkPSJNMTIgMkM2LjQ4IDIgMiA2LjQ4IDIgMTJzNC40OCAxMCAxMCAxMCAxMC00LjQ4IDEwLTEwUzE3LjUyIDIgMTIgMnptLTIgMTVsLTUtNSAxLjQxLTEuNDFMMTAgMTQuMTdsNy41OS03LjU5TDE5IDhsLTkgOXoiLz48L3N2Zz4=); 270 | background-size: 20px 20px; 271 | } 272 | 273 | /** radiobars (like channel type)*/ 274 | /*event creation double check thing*/ 275 | .item__001a7.itemFilled__001a7 .icon__001a7 { 276 | display: none; 277 | } 278 | .item__001a7 { 279 | border-radius: 5px; 280 | background: #0000 !important; 281 | } 282 | .item__001a7[aria-checked="false"] .text-md\/medium_cf4812 { 283 | color: var(--radio-bar-accent-color) !important; 284 | } 285 | .item__001a7 .radioBar__001a7 { 286 | border: solid 1px var(--background-tertiary); 287 | background: var(--deprecated-card-editable-bg); 288 | grid-gap: 10px; 289 | --radio-bar-accent-color: var(--interactive-active); 290 | & > .radioIndicatorGroup__001a7 { 291 | justify-content: flex-start; 292 | align-self: flex-start; 293 | height: 24px; 294 | } 295 | } 296 | 297 | .radioLabelDescription_ac72c6 { 298 | /*Only applies to channel creation*/ 299 | display: none; 300 | } 301 | .radioLabelName_ac72c6 { 302 | color: var(--header-primary); 303 | } 304 | [aria-checked="false"] .text-sm\/normal_cf4812 { 305 | color: var(--interactive-normal); 306 | } 307 | 308 | .theme-dark .item__001a7[aria-checked="false"] .radioBar__001a7:hover { 309 | border-color: #000; 310 | background: rgba(0, 0, 0, 0.2); 311 | } 312 | .theme-light .item__001a7[aria-checked="false"] .radioBar__001a7:hover { 313 | border-color: #b9bbbe; 314 | background: rgba(247, 248, 248, 0.6); 315 | } 316 | .item__001a7[aria-checked="true"] .radioBar__001a7 { 317 | --radio-bar-accent-color: var(--blurple); 318 | background-color: var(--radio-bar-accent-color); 319 | border-color: var(--radio-bar-accent-color); 320 | } 321 | 322 | /* Replace "dont scan" text with how it was before. only for german and english*/ 323 | /*i love lag (i thinb) 324 | html:is([lang="DE"], [lang="en-us"], [lang="en-gb"]) .radioBar__001a7[style="--radio-bar-accent-color: var(--red-400); padding: 10px;"] { 325 | 326 | &.text-md\/medium_cf4812:before { 327 | font-size: 16px; 328 | line-height: 20px; 329 | } 330 | 331 | &.text-sm\/normal_cf4812:before { 332 | font-size: 14px; 333 | line-height: 18px; 334 | } 335 | } 336 | 337 | html[lang="DE"] .radioBar__001a7[style="--radio-bar-accent-color: var(--red-400); padding: 10px;"] { 338 | &.text-md\/medium_dc00ef:before { 339 | content: "Ich lebe am Limit"; 340 | } 341 | 342 | &.text-sm\/normal_cf4812:before { 343 | content: "Schalte diese Option aus. Durchsuche nichts. Geh direkt zur dunklen Seite."; 344 | } 345 | } 346 | 347 | html:is([lang="en-us"], [lang="en-gb"]) .radioBar__001a7[style="--radio-bar-accent-color: var(--red-400); padding: 10px;"] { 348 | &.text-md\/medium_cf4812:before { 349 | content: "I live on the edge"; 350 | } 351 | 352 | &.text-sm\/normal_cf4812:before { 353 | content: "Turn this off. Don't scan anything. Go straight to the dark side."; 354 | } 355 | } 356 | */ 357 | /** revert text fields*/ 358 | /*add friends weird font fix*/ 359 | .inputText__72ba7 { 360 | letter-spacing: unset; 361 | } 362 | 363 | .input__0f084:not( 364 | .textarea_dde0a8, 365 | .searchBoxInput__56498, 366 | .addFriendInput__72ba7 > .input__72ba7, 367 | .note_fcb628 textarea, 368 | .profileNote__9c3be textarea 369 | ), 370 | .bioTextArea__6a919 { 371 | border-radius: 3px; 372 | color: var(--text-normal) !important; 373 | background-color: var(--deprecated-text-input-bg); 374 | border: 1px solid var(--deprecated-text-input-border); 375 | transition: border-color 0.2s ease-in-out; 376 | &:focus { 377 | border-color: var(--blurple) !important; 378 | } 379 | } 380 | .select__3f413:hover:not([aria-disabled="true"]), 381 | .input__0f084:hover, 382 | .bioTextArea__6a919:hover { 383 | border-color: var(--deprecated-text-input-border-hover) !important; 384 | } 385 | .input__0f084::-webkit-input-placeholder:not(.textarea_dde0a8) { 386 | color: var(--text-muted); 387 | } 388 | 389 | .emojiInput_e7d73e { 390 | padding: 0 !important; 391 | background-color: #303339 !important; 392 | } 393 | 394 | /* revert text files*/ 395 | .nonVisualMediaItem_f4758a .mosaicItemMediaMosaic__6c706 { 396 | max-width: 100% !important; 397 | } 398 | 399 | .newMosaicStyle_cf09d8 .codeView__4d95d { 400 | margin: 0 0 0; 401 | padding: 7px; 402 | } 403 | 404 | .newMosaicStyle_cf09d8 .footer__4d95d { 405 | border-radius: 0 0 4px 4px; 406 | padding: 0 10px; 407 | } 408 | 409 | .newMosaicStyle_cf09d8 .textContainer__4d95d { 410 | border-radius: 4px 4px 0 0; 411 | } 412 | 413 | .codeIcon__4d95d { 414 | cursor: pointer; 415 | } 416 | 417 | /* tweak hover buttons*/ 418 | .hoverButtonGroup__06ab4 { 419 | border-radius: 0px 0px 0px 4px; 420 | background-color: transparent; 421 | transition: 0.12s ease-in-out; 422 | outline: none; 423 | opacity: 1; 424 | right: 0px; 425 | 426 | } 427 | /*fuck ai!! rahhh*/ 428 | .hoverButton__06ab4:has(.lottieIcon__5eb9b) { 429 | display: none; 430 | } 431 | .removeMosaicItemHoverButton__6c706 { 432 | color: var(--red) !important; 433 | opacity: 0.8; 434 | &:hover { 435 | opacity: 1; 436 | } 437 | &:active { 438 | color: #fff !important; 439 | background: var(--red-active) !important; 440 | } 441 | } 442 | /* keep the translucent background for stuff like images and videos bc it looks better */ 443 | .visualMediaItemContainer_f4758a .hoverButtonGroup__06ab4 { 444 | background-color: rgb(0 0 0 / 0.5); 445 | transform: translateY(-40px); 446 | .mosaicItem__6c706:hover &{ 447 | transform: translateY(-4px); 448 | 449 | } 450 | } 451 | /* make download button bigger */ 452 | .downloadHoverButtonIcon__6c706 { 453 | width: 24px !important; 454 | height: 24px !important; 455 | } 456 | /* remove background hover */ 457 | .hoverButton__06ab4{ 458 | &:hover { 459 | background: none; 460 | } 461 | } 462 | 463 | /* center the download button for audio files and make it permanently visible*/ 464 | .wrapperAudio_cf09d8 + .hoverButtonGroup__06ab4 { 465 | top: 25%; 466 | right: 8px; 467 | transform: translateY(-50%); 468 | opacity: 1; 469 | background: none; 470 | } 471 | /* same as above but for file attachments */ 472 | .file__0ccae + .hoverButtonGroup__06ab4 { 473 | top: 50%; 474 | transform: translateY(-60%); 475 | opacity: 1; 476 | background: none; 477 | } 478 | 479 | /* shorten the margin by a bit so it doesnt look so separated */ 480 | .nonVisualMediaItem_f4758a + .nonVisualMediaItem_f4758a, 481 | .nonVisualMediaItemContainer_f4758a { 482 | margin-top: 4px; 483 | } 484 | 485 | /* revert the bloating of the audio attachments */ 486 | .wrapperAudio_cf09d8.newMosaicStyle_cf09d8 { 487 | padding: 10px; 488 | border-radius: 4px; 489 | padding-right: 41px; 490 | } 491 | 492 | /* stretch play bar */ 493 | .audioControls_cf09d8 { 494 | width: 108%; 495 | border-radius: 3px !important; 496 | } 497 | 498 | /* revert the bloating of attachments in general */ 499 | .file__0ccae { 500 | padding: 10px; 501 | border-radius: 3px; 502 | width: 100%; 503 | padding-right: 71px; 504 | max-width: 520px; 505 | } 506 | 507 | /** forum channel*/ 508 | /* tags in create post*/ 509 | #app-mount .pill_a2c9e8.selected_a2c9e8 { 510 | background-color: var(--brand-experiment-35a); 511 | border-color: transparent; 512 | transition: 0.1s ease; 513 | color: #fff !important; 514 | } 515 | 516 | #app-mount .pill_a2c9e8.selected_a2c9e8:hover { 517 | background-color: var(--brand-experiment-50a); 518 | transition: 0.1s ease; 519 | } 520 | 521 | .pill_a2c9e8.selected_a2c9e8 .defaultColor__77578 { 522 | color: var(--interactive-active); 523 | transition: 0.1s ease; 524 | } 525 | 526 | .theme-light .pill_a2c9e8 { 527 | background: var(--background-secondary); 528 | } 529 | 530 | /* make the button gray when following*/ 531 | .buttonInner__34c2c, 532 | .buttonInner__34c2c.active__34c2c { 533 | transition: 0.17s ease; 534 | color: #fff !important; 535 | background-color: var(--button-secondary-background) !important; 536 | border-radius: 3px; 537 | &:hover { 538 | background-color: var(--button-secondary-background-hover) !important; 539 | } 540 | &:active { 541 | background-color: var(--button-secondary-background-active) !important; 542 | } 543 | } 544 | /*make follow button green*/ 545 | .buttonInner__34c2c:has( 546 | [d="M9.7 2.89c.18-.07.32-.24.37-.43a2 2 0 0 1 3.86 0c.05.2.19.36.38.43A7 7 0 0 1 19 9.5v2.09c0 .12.05.24.13.33l1.1 1.22a3 3 0 0 1 .77 2.01v.28c0 .67-.34 1.29-.95 1.56-1.31.6-4 1.51-8.05 1.51-4.05 0-6.74-.91-8.05-1.5-.61-.28-.95-.9-.95-1.57v-.28a3 3 0 0 1 .77-2l1.1-1.23a.5.5 0 0 0 .13-.33V9.5a7 7 0 0 1 4.7-6.61ZM9.18 19.84A.16.16 0 0 0 9 20a3 3 0 1 0 6 0c0-.1-.09-.17-.18-.16a24.86 24.86 0 0 1-5.64 0Z"] 547 | ) { 548 | background-color: var(--green) !important; 549 | color: var(--white); 550 | border-radius: 3px; 551 | border: none; 552 | transition: 0.17s ease; 553 | &:hover { 554 | background-color: var(--green-hover) !important; 555 | } 556 | &:active { 557 | background-color: var(--green-active) !important; 558 | } 559 | } 560 | 561 | .addReactButton__34c2c { 562 | background-color: transparent !important; 563 | border: none; 564 | font-size: 0px; 565 | padding: 0px; 566 | min-width: 1.5rem; 567 | } 568 | 569 | .submitButton-3B-dZd { 570 | border-radius: 3px !important; 571 | } 572 | 573 | /* change tag backgrounds*/ 574 | .container-2qVG6q .pill_a2c9e8 { 575 | background-color: var(--background-tertiary); 576 | } 577 | 578 | .botTagOP__82f07 { 579 | color: var(--blurple); 580 | background-color: transparent; 581 | border: 1px solid var(--blurple); 582 | font-weight: 500; 583 | } 584 | 585 | .theme-dark .children__9293f:after { 586 | display: none; 587 | } 588 | 589 | /* make "search/create post" background the same as the textarea*/ 590 | .headerRow_f369db .mainCard_f369db { 591 | background: var(--bg-overlay-3, var(--chat-background-default)); 592 | border: none !important; 593 | box-shadow: none !important; 594 | border-radius: 5px; 595 | } 596 | 597 | /* so "revert textfields" wont apply there */ 598 | .headerRow_f369db .mainCard_f369db :is(.scrollableContainer_d0696b, .input__0f084) { 599 | background: none !important; 600 | border: none; 601 | } 602 | 603 | /* posts*/ 604 | .container__9a337, 605 | .container_faa96b { 606 | transition: 0.17s ease !important; 607 | transform: none !important; 608 | border-radius: 5px; 609 | box-shadow: none !important; 610 | background: var(--deprecated-card-editable-bg); 611 | border: none; 612 | } 613 | 614 | .content__99f8c .container__9a337:hover, 615 | .content__99f8c .container_faa96b:hover { 616 | background-color: var(--background-modifier-hover) !important; 617 | border: none; 618 | } 619 | 620 | .container__9a337:active, 621 | .container_faa96b:active { 622 | background-color: var(--background-modifier-active) !important; 623 | } 624 | 625 | /** Devices Tab*/ 626 | /* make description a card*/ 627 | .description__803f2 { 628 | background: var(--background-secondary); 629 | border: 1px solid var(--background-tertiary); 630 | border-radius: 5px; 631 | color: var(--text-normal); 632 | font-weight: 400; 633 | font-size: 15px; 634 | padding: 20px; 635 | } 636 | .sessionIcon__803f2 { 637 | width: 50px; 638 | height: 50px; 639 | background: none !important; 640 | } 641 | .sessionIcon__803f2 path { 642 | fill: var(--interactive-normal); 643 | } 644 | .currentSession__803f2 .sessionIcon__803f2 path { 645 | fill: var(--green); 646 | } 647 | .session__803f2 { 648 | gap: 8px; 649 | } 650 | /* Stylize remove button*/ 651 | .session__803f2 { 652 | position: relative; 653 | } 654 | .sessionMoreButton__803f2 { 655 | opacity: 0; 656 | position: absolute; 657 | top: -12px; 658 | right: -12px; 659 | width: 24px; 660 | height: 24px; 661 | box-shadow: var(--legacy-elevation-border), var(--legacy-elevation-low); 662 | background-color: var(--background-primary); 663 | background-image: url(https://discord.com/assets/b5ad3c52d0699af9b6987839875450d4.svg); 664 | background-position: 50% 50%; 665 | background-repeat: no-repeat; 666 | border-radius: 50%; 667 | transition: opacity 0.1s ease-in-out, box-shadow 0.1s ease-in-out, transform 0.2s ease; 668 | } 669 | .session__803f2:hover .sessionMoreButton__803f2, 670 | .sessionMoreButton__803f2:hover { 671 | opacity: 1; 672 | } 673 | .sessionMoreButton__803f2:active { 674 | transform: translateY(1px); 675 | } 676 | .eyebrow_e5a66c.sessionInfoRow__803f2, 677 | .headerHeading_d80a13.eyebrow_e5a66c, 678 | .sessionInfoRow__803f2 span:last-child { 679 | color: var(--header-secondary); 680 | } 681 | .heading-md-bold__17daa { 682 | font-weight: 600; 683 | } 684 | 685 | /** Connections (in settings > connections)*/ 686 | .connectContainer_c7f964 { 687 | border: 1px solid var(--deprecated-text-input-border); 688 | border-radius: 6px; 689 | } 690 | .accountButtonInner_c7f964 { 691 | background-color: var(--background-modifier-hover); 692 | background-size: 32px; 693 | } 694 | .connectHeader_c7f964 { 695 | color: #7b7c80 !important; 696 | font-size: 13px; 697 | font-weight: 600; 698 | text-transform: uppercase; 699 | } 700 | .connectContainer_c7f964 .text-xs-normal_ccc5fb { 701 | color: var(--interactive-hover) !important; 702 | font-size: 13px; 703 | } 704 | .connection_c7f964 { 705 | overflow: hidden; 706 | background: none; 707 | border-radius: 5px; 708 | box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.3); 709 | } 710 | .connectionAccountLabel_c7f964 { 711 | color: #fff8 !important; 712 | } 713 | .connectionAccountValue_c7f964 .connectionAccountLabelContainer_c7f964 { 714 | font-size: 16px; 715 | margin-top: 4px; 716 | color: var(--white-500); 717 | font-weight: 400; 718 | } 719 | .metadataContainer_c7f964 { 720 | position: relative; 721 | z-index: 10; 722 | background: #0004; 723 | border: solid 1px #0004; 724 | border-radius: 3px; 725 | } 726 | .metadataContainer_c7f964 .connectedAccountVanityMetadataTag_fffe42 { 727 | border-radius: 3px; 728 | background: none; 729 | border: solid 1px #fff3; 730 | } 731 | .metadataContainer_c7f964 .text-xs-normal_ccc5fb { 732 | color: #fff !important; 733 | } 734 | .metadataContainer_c7f964 .metadataRefreshButton_c7f964 { 735 | background-color: var(--blurple-inverted) !important; 736 | &:hover { 737 | background-color: var(--blurple-inverted-hover) !important; 738 | } 739 | &:active { 740 | background-color: var(--blurple-inverted-active) !important; 741 | } 742 | color: var(--blurple) !important; 743 | transition: 0.17s ease; 744 | } 745 | 746 | .connectionHeader_c7f964:after { 747 | content: ""; 748 | position: absolute; 749 | width: 660px; 750 | height: 73px; 751 | background: rgba(0, 0, 0, 0.1); 752 | border-bottom: solid 1px rgba(0, 0, 0, 0.15); 753 | } 754 | .connectionOptionsWrapper_c7f964 .container__0d850, 755 | .connectionDelete_c7f964, 756 | .integrationsWrapper-3a2pGd { 757 | z-index: 50; 758 | } 759 | .connectionOptionSwitch_c7f964 { 760 | margin-top: 2px; 761 | } 762 | .labelRow__0d850 .title__0d850 .text-sm-semibold_a5824d { 763 | font-weight: 500 !important; 764 | color: var(--white-500); 765 | } 766 | 767 | .integration_c7f964 { 768 | z-index: 999; 769 | width: calc(50% - 8px); 770 | position: relative; 771 | background: #0000001a; 772 | border: 1px solid #0000004d; 773 | border-radius: 3px; 774 | padding: 10px; 775 | } 776 | .integration_c7f964 .lookFilled__201d5 { 777 | border: solid 1px #0000004d; 778 | background: #593695; 779 | padding: 5px 16px; 780 | min-height: 0px; 781 | height: auto; 782 | min-width: 0px; 783 | } 784 | .connectionDelete_c7f964 { 785 | width: 32px; 786 | height: 32px; 787 | border: solid 1px rgba(255, 255, 255, 0.3); 788 | border-radius: 3px; 789 | } 790 | .connectionDelete_c7f964 svg { 791 | position: relative; 792 | top: 6px; 793 | left: 6px; 794 | } 795 | .connectionDelete_c7f964 path { 796 | fill: var(--white-500); 797 | transform: scale(1.1); 798 | } 799 | .connectionOptionSwitch_c7f964 .container__87bf1 .input__87bf1:before { 800 | background: #0000; 801 | box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.2); 802 | } 803 | .connectionOptionSwitch_c7f964 .container__87bf1 .input__87bf1:checked:before { 804 | background: rgba(255, 255, 255, 0.3); 805 | box-shadow: none; 806 | } 807 | .connectionHeader_c7f964 [alt] { 808 | margin: -572px -610px -4500px -16px; 809 | padding: 2000px 330px; 810 | background-color: var(--blurple); 811 | background-repeat: no-repeat; 812 | background-size: 32px 32px; 813 | background-position: 20px 20px; 814 | border-radius: 5px; 815 | pointer-events: none; 816 | } 817 | .connectionHeader_c7f964 { 818 | & [alt="Battle.net"] { 819 | background-color: hsl(200, calc(var(--saturation-factor, 1) * 100%), 45%); 820 | background-image: url(https://milbits.github.io/oldcord/src/assets/battle.webp); 821 | } 822 | 823 | & [alt="GitHub"] { 824 | background-color: hsl(0, calc(var(--saturation-factor, 1) * 4%), 9%); 825 | background-image: url(https://milbits.github.io/oldcord/src/assets/github.svg); 826 | } 827 | 828 | & [alt="Reddit"] { 829 | background-color: hsl(16, calc(var(--saturation-factor, 1) * 100%), 50%); 830 | background-image: url(https://milbits.github.io/oldcord/src/assets/reddit.webp); 831 | } 832 | 833 | & [alt="Spotify"] { 834 | background-color: var(--spotify); 835 | background-image: url(https://milbits.github.io/oldcord/src/assets/spotify.svg); 836 | } 837 | 838 | & [alt="Steam"] { 839 | background-color: hsl(215, calc(var(--saturation-factor, 1) * 35%), 15%); 840 | background-image: url(https://milbits.github.io/oldcord/src/assets/steam.svg); 841 | } 842 | 843 | & [alt="Twitch"] { 844 | background-color: var(--twitch); 845 | background-image: url(https://milbits.github.io/oldcord/src/assets/twitch.webp); 846 | } 847 | 848 | & :is([alt="Twitter"], [alt="X"]) { 849 | background-color: hsl(203, calc(var(--saturation-factor, 1) * 89%), 53%); 850 | background-image: url(https://milbits.github.io/oldcord/src/assets/twitter.webp); 851 | } 852 | 853 | & [alt="Xbox"] { 854 | background-color: var(--xbox); 855 | background-image: url(https://milbits.github.io/oldcord/src/assets/xbox.svg); 856 | } 857 | 858 | & [alt="YouTube"] { 859 | background-color: var(--youtube); 860 | background-image: url(https://milbits.github.io/oldcord/src/assets/youtube.webp); 861 | } 862 | 863 | & [alt="Skype"] { 864 | background-color: hsl(196, calc(var(--saturation-factor, 1) * 100%), 42%); 865 | background-image: url(https://milbits.github.io/oldcord/src/assets/skype.webp); 866 | } 867 | 868 | & [alt="League of Legends"] { 869 | background-color: hsl(42, calc(var(--saturation-factor, 1) * 40%), 49%); 870 | background-image: url(https://milbits.github.io/oldcord/src/assets/league.webp); 871 | } 872 | 873 | & [alt="Facebook"] { 874 | background-color: hsl(226, calc(var(--saturation-factor, 1) * 37%), 38%); 875 | background-image: url(https://milbits.github.io/oldcord/src/assets/facebook.webp); 876 | } 877 | 878 | & [alt="PlayStation Network"] { 879 | background-color: var(--playstation); 880 | background-image: url(https://milbits.github.io/oldcord/src/assets/playstation.svg); 881 | } 882 | 883 | & [alt="Epic Games"] { 884 | background-color: hsl(34, calc(var(--saturation-factor, 1) * 6%), 22%); 885 | background-image: url(https://milbits.github.io/oldcord/src/assets/epic.svg); 886 | } 887 | 888 | & [alt="Riot Games"] { 889 | background-color: hsl(356, calc(var(--saturation-factor, 1) * 75%), 39%); 890 | background-image: url(https://milbits.github.io/oldcord/src/assets/riot.svg); 891 | } 892 | 893 | & [alt="Roblox"] { 894 | background-color: hsl(4, calc(var(--saturation-factor, 1) * 75%), 44%); 895 | background-image: url(https://discord.com/assets/a4d8e9b0404a2d00.svg); 896 | } 897 | 898 | & [alt="Bluesky"] { 899 | background-color: hsl(210.63, calc(var(--saturation-factor, 1) * 99.16%), 53.14%); 900 | background-image: url("data:image/svg+xml,%3Csvg width='600' height='600' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m135.72 44.03c66.496 49.921 138.02 151.14 164.28 205.46 26.262-54.316 97.782-155.54 164.28-205.46 47.98-36.021 125.72-63.892 125.72 24.795 0 17.712-10.155 148.79-16.111 170.07-20.703 73.984-96.144 92.854-163.25 81.433 117.3 19.964 147.14 86.092 82.697 152.22-122.39 125.59-175.91-31.511-189.63-71.766-2.514-7.3797-3.6904-10.832-3.7077-7.8964-0.0174-2.9357-1.1937 0.51669-3.7077 7.8964-13.714 40.255-67.233 197.36-189.63 71.766-64.444-66.128-34.605-132.26 82.697-152.22-67.108 11.421-142.55-7.4491-163.25-81.433-5.9562-21.282-16.111-152.36-16.111-170.07 0-88.687 77.742-60.816 125.72-24.795z' fill='%23fff'/%3E%3C/svg%3E"); 901 | } 902 | } 903 | 904 | .imageAccessory__9614b { 905 | left: unset; 906 | right: 6px; 907 | } 908 | 909 | /** Voice Messages*/ 910 | .playButtonContainer_a8e786 { 911 | background: none !important; 912 | } 913 | .playButtonContainer_a8e786:active { 914 | transform: translateY(1px) !important; 915 | } 916 | .rippleContainer_a8e786 { 917 | display: none; 918 | } 919 | .playIcon_a8e786 { 920 | color: var(--interactive-normal) !important; 921 | width: 25px; 922 | height: 25px; 923 | } 924 | .playIcon_a8e786:hover { 925 | color: var(--interactive-active) !important; 926 | } 927 | 928 | /* notification settings*/ 929 | .notificationSound__6d8e5 { 930 | transform: translateX(-24px); 931 | transition: 0.2s ease-out; 932 | } 933 | .notificationSound__6d8e5:hover { 934 | transform: translateX(-0px); 935 | } 936 | .soundIcon__6d8e5 { 937 | order: -1; 938 | transition: 0.2s ease-out; 939 | } 940 | .notificationSound__6d8e5 .soundIcon__6d8e5 { 941 | opacity: 0 !important; 942 | } 943 | .notificationSound__6d8e5:hover .soundIcon__6d8e5 { 944 | opacity: 0.6 !important; 945 | } 946 | 947 | /* Capitalize titles in settings*/ 948 | h2.title_b717a1, 949 | .modalHeader_db81c6 :is([data-text-variant="heading-lg/semibold"]) { 950 | text-transform: uppercase; 951 | font-size: 16px; 952 | } 953 | .header__49fc1 [data-text-variant="heading-lg/semibold"] { 954 | text-transform: uppercase !important; 955 | font-size: 16px; 956 | } 957 | .description__6b700.text-sm\/normal_cf4812 { 958 | color: var(--text-secondary) !important; 959 | font-size: 14px; 960 | line-height: 20px !important; 961 | } 962 | 963 | /* fix headings of all shapes and sizes */ 964 | .settingsPage_f131e9 :is(.heading-xl\/semibold_cf4812) { 965 | font-size: 16px; 966 | text-transform: uppercase; 967 | } 968 | .settingsPage_f131e9 :is(.defaultColor__5345c.heading-lg\/semibold_cf4812, .title_b717a1.h3_b717a1, .heading-lg\/semibold_cf4812) { 969 | text-transform: uppercase; 970 | font-size: 12px !important; 971 | font-weight: 600 !important; 972 | color: var(--channels-default) !important; 973 | } 974 | 975 | /* can't this app style modals consistantly EVER */ 976 | .modal_ac72c6 { 977 | .header__49fc1 { 978 | .title_ac72c6 { 979 | font-weight: 600; 980 | } 981 | } 982 | .modalContent_ac72c6 { 983 | .sectionTitle_ac72c6 { 984 | color: var(--header-secondary); 985 | } 986 | } 987 | 988 | border-radius: 4px; 989 | } 990 | .root__49fc1 { 991 | .headerContainer_c38e9f > .defaultColor__5345c.heading-md\/semibold_cf4812 { 992 | text-transform: uppercase; 993 | } 994 | .mainContainer_c38e9f > .pauseContainer_c38e9f { 995 | border: none; 996 | padding: unset; 997 | .pauseText_c38e9f { 998 | margin-top: 20px; 999 | [data-text-variant="text-md/semibold"] { 1000 | color: var(--header-primary) !important; 1001 | font-weight: 500; 1002 | } 1003 | [data-text-variant="text-sm/normal"] { 1004 | color: var(--header-secondary) !important; 1005 | } 1006 | } 1007 | .pauseText_c38e9f, 1008 | .input__87bf1 { 1009 | margin-top: 20px; 1010 | } 1011 | } 1012 | .modalHeader_db81c6 { 1013 | .guildName_db81c6 { 1014 | font-size: 12px; 1015 | font-weight: 600; 1016 | } 1017 | 1018 | box-shadow: unset !important; 1019 | } 1020 | .h5_b717a1 { 1021 | color: var(--channels-default); 1022 | } 1023 | .container__9d263 { 1024 | .input__87bf1 { 1025 | margin-top: 20px; 1026 | } 1027 | } 1028 | } 1029 | 1030 | /*Fix favorite button and delete overlap*/ 1031 | .imageAccessory_af017a { 1032 | left: unset; 1033 | right: 6px; 1034 | } 1035 | 1036 | /*nitro emoji paywall*/ 1037 | .emojiLockIcon_d982c2, 1038 | .categoryItemLockIconContainer__0fa6d { 1039 | display: none; 1040 | } 1041 | .lockedEmoji_d982c2:has(+ .emojiLockIconContainer_d982c2) { 1042 | filter: grayscale(1) !important; 1043 | } 1044 | 1045 | /* pinned messages popout header */ 1046 | .titleContainer__45690 { 1047 | .text-lg\/semibold_cf4812 { 1048 | font-size: 15px; 1049 | } 1050 | 1051 | & svg { 1052 | display: none; 1053 | } 1054 | } 1055 | 1056 | /* fix pinned message padding */ 1057 | .messageGroupWrapper__45690 .messageGroupCozy__45690 { 1058 | padding-top: 12px !important; 1059 | padding-bottom: 12px !important; 1060 | } 1061 | .header__45690 { 1062 | background: var(--background-tertiary); 1063 | } 1064 | .messagesPopoutWrap__45690 { 1065 | border-radius: 4px; 1066 | } 1067 | 1068 | /* polls */ 1069 | .normalStylesDefault_a1443c { 1070 | --custom-poll-style-vote-background: var(--background-secpndary); 1071 | --custom-poll-style-vote-percentage: var(--background-modifier-accent); 1072 | --polls-victor-fill: var(--green-transparent); 1073 | --polls-voted-fill: var(--brand-experiment-25a); 1074 | } 1075 | .answerInner__4c520 { 1076 | background-color: var(--button-secondary-background); 1077 | border-radius: 3px; 1078 | & .label__4c520 { 1079 | color: var(--interactive-active); 1080 | } 1081 | } 1082 | .secondaryButtonPresentation__0be77 { 1083 | background-color: var(--button-secondary-background); 1084 | &:hover { 1085 | background-color: var(--button-secondary-background-hover); 1086 | } 1087 | } 1088 | 1089 | /* polls modal */ 1090 | .voteSelected__01c8c { 1091 | background-color: rgba(79, 84, 92, 0.3); 1092 | } 1093 | .side_b3f026 .item_b3f026:is(.voteDefault__01c8c, .voteSelected__01c8c) { 1094 | padding-top: 0px; 1095 | padding-bottom: 0px; 1096 | } 1097 | .header__49fc1 .text-md\/medium_cf4812 { 1098 | font-size: 12px; 1099 | } 1100 | 1101 | /* message buttons */ 1102 | .popover_f84418 { 1103 | transform: none !important; 1104 | height: 32px; 1105 | background: var(--background-primary); 1106 | border-radius: 4px; 1107 | padding: 0px; 1108 | box-shadow: var(--elevation-stroke); 1109 | border: none; 1110 | &:hover { 1111 | box-shadow: var(--elevation-stroke), var(--elevation-medium) !important; 1112 | border: none; 1113 | } 1114 | 1115 | /*& .separator_f84418 { // hides emoji separator 1116 | display: none; 1117 | }*/ 1118 | } 1119 | 1120 | .hoverBarButton_f84418 { 1121 | border-radius: 0; 1122 | height: 24px; 1123 | padding: 4px; 1124 | &:last-child { 1125 | border-top-right-radius: 4px; 1126 | border-bottom-right-radius: 4px; 1127 | } 1128 | &:first-child { 1129 | border-top-left-radius: 4px; 1130 | border-bottom-left-radius: 4px; 1131 | } 1132 | 1133 | /*&:has(.emoji__040f0) { // hides recommended emojis 1134 | display: none; 1135 | }*/ 1136 | } 1137 | 1138 | .buttonContent_f84418, 1139 | .icon_f84418 { 1140 | transform: none !important; 1141 | } 1142 | .hoverBarButton_f84418:active { 1143 | padding-bottom: 3px; 1144 | padding-top: 5px; 1145 | padding-left: 4px; 1146 | padding-right: 4px; 1147 | } 1148 | 1149 | /* forwarding modal */ 1150 | :is(.footerButtons__62280, .channelTextArea_d0696b) .messageInput__62280, 1151 | .sendWithMessage__62280 { 1152 | border-radius: 3px; 1153 | height: 38px; 1154 | overflow: hidden; 1155 | & .slateTextArea_ec4baf, 1156 | .placeholder__1b31f { 1157 | line-height: 15px; 1158 | } 1159 | & .expression-picker-chat-input-button { 1160 | margin-right: 5px; 1161 | margin-bottom: 5px; 1162 | } 1163 | } 1164 | 1165 | /*forwarded message*/ 1166 | .container__122e4 .quote__122e4 { 1167 | display: none; 1168 | } 1169 | .container__122e4 .content__122e4 { 1170 | padding: 4px 8px; 1171 | border-radius: 3px; 1172 | border: solid 1px var(--background-modifier-accent); 1173 | max-width: 500px; 1174 | overflow: hidden; 1175 | flex-grow: 0; 1176 | } 1177 | .container__122e4 .headerText__122e4 { 1178 | font-size: 12px; 1179 | font-weight: bold; 1180 | font-style: normal; 1181 | text-transform: uppercase; 1182 | } 1183 | 1184 | /* fix emoji picker sizing */ 1185 | .emojiItem_fc7141 { 1186 | width: 40px !important; 1187 | height: 40px !important; 1188 | padding: 0; 1189 | margin-left: 4px; 1190 | } 1191 | .emojiItem_fc7141 > :is(.image__1859b, .emojiSpriteImage_d982c2) { 1192 | transform: scale(0.8); 1193 | } 1194 | .emojiListRow_fc7141 { 1195 | height: unset; 1196 | grid-template-columns: repeat(auto-fill, 48px); 1197 | } 1198 | .drawerSizingWrapper__08434 { 1199 | height: 90%; 1200 | bottom: 0; 1201 | } 1202 | .emojiPickerListWrapper_c0e32c .list_c656ac { 1203 | height: 110%; 1204 | } 1205 | 1206 | /* remove emoji nitro upsell */ 1207 | .categorySectionNitroLocked_c656ac { 1208 | background-color: transparent; 1209 | } 1210 | .nitroTopDividerContainer_b3fb5f { 1211 | visibility: hidden; 1212 | padding: unset; 1213 | } 1214 | .upsellContainerFloating__0b69f { 1215 | display: none; 1216 | } 1217 | 1218 | /** Game profile */ 1219 | /* 1220 | .gameProfileModal__8e830 [data-text-variant="heading-md\/bold"] { 1221 | visibility: hidden; 1222 | } 1223 | 1224 | .gameProfileModal__8e830 .heading-xl\/bold_cf4812 { 1225 | font-weight: 600; 1226 | font-size: 20px; 1227 | margin-left: 55px; 1228 | } 1229 | 1230 | .gameProfileModal__8e830 .sectionHeader__8e830:is(.text-xs\/semibold_cf4812, .text-md\/semibold_cf4812, .text-sm\/semibold_cf4812) { 1231 | text-transform: uppercase !important; 1232 | } 1233 | 1234 | .gameProfileModal__8e830 .text-md\/semibold_cf4812 { 1235 | color: var(--header-secondary) !important; 1236 | font-size: 13px; 1237 | font-weight: 500; 1238 | display: flex; 1239 | align-items: center; 1240 | gap: 8px; 1241 | &:after { 1242 | content: ""; 1243 | background: var(--background-modifier-accent); 1244 | flex: 1; 1245 | height: 1px; 1246 | display: block; 1247 | } 1248 | } 1249 | 1250 | .gameProfileModal__8e830 .gapSm__8e830.row__8e830 > .text-sm\/semibold_cf4812 { 1251 | color: var(--header-secondary) !important; 1252 | font-weight: 500; 1253 | margin-left: 55px; 1254 | } 1255 | 1256 | .gameProfileModal__8e830 .lineClamp2Plus__4bd52 { 1257 | max-height: unset; 1258 | } 1259 | 1260 | .gameProfileModal__8e830 .overflowMenu__8e830 { 1261 | background: none; 1262 | backdrop-filter: none; 1263 | } 1264 | 1265 | .gameProfileModal__8e830 .sidebar__8e830 { 1266 | border-left: solid 1px var(--background-modifier-accent); 1267 | } 1268 | 1269 | .gameProfileModal__8e830 .logoWrapper__8e830 { 1270 | background-color: unset; 1271 | border-radius: 4px; 1272 | } 1273 | 1274 | .gameProfileModal__8e830 .friends_b37a75.text-xs\/semibold_cf4812 { 1275 | background: none; 1276 | font-weight: 400; 1277 | font-size: 14px; 1278 | } 1279 | */ 1280 | /* move game icon 1281 | .gameProfileModal__8e830 .gameIcon__8e830 { 1282 | position: absolute; 1283 | margin-top: -32px; 1284 | width: 48px; 1285 | height: 48px; 1286 | } 1287 | 1288 | .gameProfileModal__8e830 .platforms__93ebb { 1289 | transform: scale(1.5); 1290 | margin-left: 45px; 1291 | } 1292 | */ 1293 | /*change x to twitter (bluesky better [follow me @milbit.bsky.social])*/ 1294 | .gameProfileModal__8e830 1295 | .anchor_edefb8 1296 | path[d="M13.86 10.47 21.15 2h-1.73l-6.33 7.35L8.04 2H2.22l7.64 11.12L2.22 22h1.72l6.68-7.77L15.96 22h5.82l-7.92-11.53Zm-2.36 2.75-.78-1.11L4.57 3.3h2.65l4.97 7.11.77 1.1 6.46 9.25h-2.65l-5.27-7.54Z"] { 1297 | d: path( 1298 | "M221.95 51.29c.15 2.17.15 4.34.15 6.53 0 66.73-50.8 143.69-143.69 143.69v-.04c-27.44.04-54.31-7.82-77.41-22.64 3.99.48 8 .72 12.02.73 22.74.02 44.83-7.61 62.72-21.66-21.61-.41-40.56-14.5-47.18-35.07 7.57 1.46 15.37 1.16 22.8-.87-23.56-4.76-40.51-25.46-40.51-49.5v-.64c7.02 3.91 14.88 6.08 22.92 6.32C11.58 63.31 4.74 33.79 18.14 10.71c25.64 31.55 63.47 50.73 104.08 52.76-4.07-17.54 1.49-35.92 14.61-48.25 20.34-19.12 52.33-18.14 71.45 2.19 11.31-2.23 22.15-6.38 32.07-12.26-3.77 11.69-11.66 21.62-22.2 27.93 10.01-1.18 19.79-3.86 29-7.95-6.78 10.16-15.32 19.01-25.2 26.16z" 1299 | ); 1300 | transform: scale(0.1); 1301 | } 1302 | 1303 | /* linked roles */ 1304 | .verifiedRole_e59759 { 1305 | padding: 8px; 1306 | border-radius: 999px; 1307 | background: none; 1308 | border: 2.5px solid var(--background-secondary-alt); 1309 | .container__183c2 { 1310 | order: -1; 1311 | } 1312 | .roleCheckmark_e59759 { 1313 | right: 10px; 1314 | top: 10px; 1315 | } 1316 | } 1317 | .connectionsChecksGroup_a470b4 { 1318 | background: none; 1319 | border-radius: 3px; 1320 | padding: 8px; 1321 | } 1322 | .headerText_a470b4 .heading-xl\/extrabold_cf4812 { 1323 | font-size: 16px; 1324 | letter-spacing: 0.3; 1325 | font-weight: 600; 1326 | text-transform: uppercase; 1327 | } 1328 | 1329 | .scrollerBase_d125d2.thin_d125d2.container_e59759.content__49fc1 > .defaultColor__5345c.heading-md\/semibold_cf4812 { 1330 | font-weight: 500; 1331 | } 1332 | 1333 | /* Today at */ 1334 | :is(.timestampInline_c19a55) time[aria-label^="Today at"] { 1335 | visibility: hidden; 1336 | } 1337 | :is(.timestampInline_c19a55) time[aria-label^="Today at"]:before { 1338 | content: attr(aria-label); 1339 | visibility: visible; 1340 | } 1341 | 1342 | /* custom status modal */ 1343 | .header_dbc4b7 { 1344 | background-image: url("https://discord.com/assets/7d67842f58b6d155.svg"); 1345 | background-size: 200px 120px; 1346 | background-position: center bottom; 1347 | background-repeat: no-repeat; 1348 | top: 0; 1349 | left: 50%; 1350 | transform: translateX(-50%); 1351 | padding-top: 120px !important; 1352 | margin-top: -93px; 1353 | } 1354 | .headerTitle_dbc4b7 .heading-xl\/semibold_cf4812 { 1355 | display: none; 1356 | } 1357 | .scrollerBase_d125d2.thin_d125d2:has(.profilePreview_dbc4b7).content__49fc1:before { 1358 | content: "Set a custom status"; 1359 | font-size: 20px; 1360 | line-height: 24px; 1361 | font-weight: 600; 1362 | color: var(--interactive-active); 1363 | margin-left: 28%; 1364 | } 1365 | .profilePreview_dbc4b7 { 1366 | display: none; 1367 | } 1368 | .statusText__19b6d { 1369 | color: var(--header-secondary); 1370 | } 1371 | 1372 | /* clan tags */ 1373 | .guildTagContainer__63ed3, 1374 | .clanTagChiplet_c19a55, 1375 | .chipletContainerInline__4a25c, 1376 | .chipletContainerInline__10651, 1377 | .chipletContainerInner__10651, 1378 | .clanTag__5d473 { 1379 | display: none !important; 1380 | } 1381 | 1382 | /* status formatting */ 1383 | :is(.subText__20a53, .subText__91a9d, .subtext__0a06e) { 1384 | .container_c9d15c { 1385 | display: flex; 1386 | .icon_c9d15c { 1387 | order: 1; 1388 | } 1389 | .emoji_c9d15c { 1390 | order: -1; 1391 | } 1392 | .dot_c9d15c { 1393 | display: none; 1394 | } 1395 | } 1396 | .container_c9d15c:has(.statusText__19b6d:not(.dot_c9d15c):nth-of-type(3)) .statusText__19b6d:nth-of-type(1) { 1397 | display: none; 1398 | } 1399 | } 1400 | /* new experimental image viewer - this sucks, don't use it 1401 | 1402 | .carouselModal_d3a6f0 { 1403 | align-items: start; 1404 | justify-content: center; 1405 | width: fit-content; 1406 | z-index: 0; 1407 | } 1408 | 1409 | .topBar__6088c { 1410 | z-index: -1; 1411 | } 1412 | 1413 | .closeButton__6088c { 1414 | position: fixed; 1415 | top: 0; 1416 | left: 0; 1417 | right: 0; 1418 | bottom: 0; 1419 | padding: 0; 1420 | opacity: 0; 1421 | cursor: unset; 1422 | } 1423 | 1424 | .messageContents__6088c { 1425 | display: none; 1426 | } 1427 | 1428 | .wrapper_b2eddf { 1429 | flex-grow: unset; 1430 | pointer-events: none; 1431 | } 1432 | 1433 | .mediaWrapper_b2eddf { 1434 | position: unset; 1435 | width: fit-content; 1436 | } 1437 | 1438 | .imageWrapper_af017a { 1439 | pointer-events: all; 1440 | } 1441 | 1442 | .actionButtonContainer_c319f9 { 1443 | margin-top: -10px; 1444 | pointer-events: none; 1445 | } 1446 | 1447 | .actionButtons_cc1819 { 1448 | background-color: transparent; 1449 | border-radius: 0; 1450 | gap: 1; 1451 | padding: 0; 1452 | } 1453 | .actionButtons_cc1819 button { 1454 | background: transparent !important; 1455 | margin: 0; 1456 | padding: 1; 1457 | width: fit-content; 1458 | pointer-events: all; 1459 | svg { 1460 | display: none; 1461 | } 1462 | 1463 | &:after { 1464 | content: attr(aria-label); 1465 | color: var(--white-500) !important; 1466 | font-size: 14px; 1467 | font-weight: 500; 1468 | line-height: 18px; 1469 | transition: opacity 0.15s ease; 1470 | opacity: 0.5; 1471 | } 1472 | 1473 | &:hover:after { 1474 | opacity: 1; 1475 | -webkit-text-decoration: underline; 1476 | text-decoration: underline; 1477 | } 1478 | } 1479 | */ 1480 | /*themes in appearance 1481 | stolen and modified from 11pixels' dtm16 1482 | https://github.com/XYZenix/DTM-16 1483 | */ 1484 | .themeTitleContainer__3e443 .title__3e443, 1485 | .header__67a11 .titleText__67a11 { 1486 | color: var(--header-secondary); 1487 | font-size: 12px; 1488 | font-weight: 900; 1489 | } 1490 | 1491 | .layers__960e4.layers__160d8 1492 | .layer__960e4:not(.baseLayer__960e4) 1493 | .contentRegion__23e6b 1494 | .contentColumn__23e6b#appearance-tab 1495 | .presets__67a11 { 1496 | & .themeSelectionContainer__36dee { 1497 | width: 132px; 1498 | height: 81px; 1499 | margin-bottom: 15px; 1500 | } 1501 | & .themeSelection__36dee { 1502 | border-radius: 4px; 1503 | box-shadow: none; 1504 | &:after, 1505 | &:before { 1506 | content: ""; 1507 | display: block; 1508 | } 1509 | &:before { 1510 | width: 130px; 1511 | height: 60px; 1512 | background-size: 130px 100px; 1513 | border: solid 1px var(--background-secondary-alt); 1514 | border-bottom: none; 1515 | border-radius: 4px 4px 0 0; 1516 | } 1517 | &:after { 1518 | content: attr(aria-label); 1519 | font-weight: 600; 1520 | font-size: 14px; 1521 | background: var(--background-secondary); 1522 | border: solid 1px var(--background-secondary-alt); 1523 | border-radius: 0 0 4px 4px; 1524 | width: 130px; 1525 | height: auto; 1526 | padding: 10px 0; 1527 | color: var(--interactive-active); 1528 | text-align: center; 1529 | } 1530 | &.selected__36dee:before { 1531 | border-color: var(--blurple); 1532 | } 1533 | &.selected__36dee:after { 1534 | background: var(--blurple); 1535 | border-color: var(--blurple); 1536 | } 1537 | } 1538 | } 1539 | 1540 | .themeSelectionContainer__36dee .selectionCircle__36dee, 1541 | .nitroWheel_c5f0dc { 1542 | display: none; 1543 | } 1544 | .themeSelection__36dee .iconWrapper__36dee { 1545 | top: -4.5px; 1546 | left: 35px; 1547 | & svg { 1548 | width: 35px; 1549 | height: 35px; 1550 | } 1551 | } 1552 | /*custom theme*/ 1553 | .container__8fea4 { 1554 | display: unset; 1555 | border: none; 1556 | } 1557 | .presets__67a11 :is(.newRing__8fea4, .newBadge__8fea4) { 1558 | display: none; 1559 | } 1560 | .paletteIcon__8fea4 { 1561 | position: absolute; 1562 | top: 13px; 1563 | left: 49px; 1564 | width: 35px; 1565 | height: 35px; 1566 | } 1567 | /*idiots!!!!!!!!!*/ 1568 | :is(#equicordthemes-tab, #vencordthemes-tab) .sectionTitle__7bffb:before { 1569 | content: "OldCord note: Using it with other themes may break stuff. Please don't report issues (this is not from vencord)"; 1570 | color: #fff; 1571 | padding: 10px; 1572 | background: var(--red-transparent); 1573 | border: 1px solid var(--red); 1574 | border-radius: 3px; 1575 | } 1576 | :is(#themes-tab) .bd-addon-controls:after { 1577 | content: "OldCord note: Using it with other themes may break stuff. Please don't report issues (this is not from betterdiscord)"; 1578 | color: #fff; 1579 | margin-top: 10px; 1580 | padding: 10px; 1581 | background: var(--red-transparent); 1582 | border: 1px solid var(--red); 1583 | border-radius: 3px; 1584 | flex: 1 1 100%; 1585 | } 1586 | /*vc/call buttons*/ 1587 | .buttonSection__1405b{ 1588 | background: var(--background-floating); 1589 | border: none; 1590 | border-radius: 6px; 1591 | & +:not(.redGlow_f1ceac) path{ 1592 | fill: var(--interactive-hover) !important; 1593 | } 1594 | } 1595 | -------------------------------------------------------------------------------- /src/components/redesign.css: -------------------------------------------------------------------------------- 1 | 2 | .theme-light:not(html.custom-theme-background, :has(#clientThemeVars)){ 3 | --bg-brand: var(--blurple); 4 | --background-base-low: var(--background-primary); 5 | --background-base-lower: var(--background-primary); 6 | --background-base-lowest: var(--background-secondary); 7 | --background-surface-highest: var(--background-primary); 8 | --background-surface-higher: var(--background-floating); 9 | --bg-base-tertiary: var(--background-tertiary); 10 | --custom-channel-members-bg: var(--background-secondary); 11 | --background-mod-subtle: var(--background-modifier-hover); 12 | 13 | 14 | }.theme-dark:not(html.custom-theme-background, :has(#clientThemeVars)) { 15 | --background-base-low: var(--background-primary); 16 | --background-base-lower: var(--background-primary); 17 | --background-base-lowest: var(--background-secondary); 18 | --background-surface-highest: var(--background-primary); 19 | --background-surface-higher: var(--background-floating); 20 | --bg-base-tertiary: var(--background-tertiary); 21 | --custom-channel-members-bg: var(--background-secondary); 22 | --background-mod-subtle: var(--background-modifier-hover); 23 | --bg-brand: var(--blurple); 24 | --modal-footer-background: color-mix(in oklab, var(--primary-630) 100%, var(--theme-base-color, #000) var(--theme-base-color-amount, 0%)); 25 | --checkbox-background-checked: var(--blurple); 26 | --text-normal: color-mix(in oklab, var(--primary-230) 100%, var(--theme-text-color, #000) var(--theme-text-color-amount, 0%)); 27 | --__spoiler-background-color--hidden: var(--primary-700); 28 | --__spoiler-background-color--hidden--hover: hsl(var(--primary-700-hsl) / 0.8); 29 | --__spoiler-background-color--revealed: hsl(var(--white-500-hsl) / 0.1); 30 | --__spoiler-text-color--hidden: transparent; 31 | --__spoiler-warning-text-color: var(--primary-200); 32 | --__spoiler-warning-text-color--hover: var(--white-500); 33 | --__spoiler-warning-background-color: hsl(var(--black-500-hsl) / 0.6); 34 | --__spoiler-warning-background-color--hover: hsl(var(--black-500-hsl) / 0.9); 35 | --__spoiler-container-box-shadow-color: hsl(var(--black-500-hsl) / 0.1); 36 | } 37 | 38 | .theme-darker { 39 | --header-secondary: color-mix(in oklab,var(--neutral-5) 70%,var(--theme-text-color,#000) var(--theme-text-color-amount,0%)) !important; 40 | --background-secondary-alt: color-mix(in oklab, var(--neutral-86) 30%, var(--theme-base-color, #000) var(--theme-base-color-amount, 0%)); 41 | --chat-background-default: hsl(218 4% 18% / 1) !important; 42 | } 43 | .theme-midnight { 44 | --chat-background-default: hsl(0 0% 11% / 1) !important; 45 | --background-secondary-alt: color-mix(in oklab, var(--neutral-86) 60%, var(--theme-base-color, #000) var(--theme-base-color-amount, 0%)); 46 | } 47 | html.theme-dark:not(.theme-darker, .theme-midnight, .custom-theme-background) .interactive__972a0 { 48 | color: var(--channels-default); 49 | } 50 | .chat_f75fb0,.container__133bf, 51 | html:is(.theme-darker, .theme-midnight, .custom-theme-background) 52 | :is(.content_f75fb0, .subtitleContainer_f75fb0, .sidebarList_c48ade, .container_c8ffbb) { 53 | border: none !important; 54 | } 55 | 56 | .sidebarRegionScroller__23e6b{ 57 | background: none !important 58 | } 59 | /* remove the title bar on web & linux */ 60 | .platform-web, 61 | .platform-linux { 62 | .base_c48ade { 63 | grid-template-areas: "titleBar titleBar titleBar" "notice notice notice" "guildsList channelsList page"; 64 | grid-template-rows: [top] 0px [titlebarEnd] min-content [page] 0px [end] !important; 65 | } 66 | .bar_c38106 .title_c38106 { 67 | display: none; 68 | } 69 | .bar_c38106 .trailing_c38106 { 70 | top: 33px !important; 71 | } 72 | .scroller_ef3116 { 73 | padding-top: 12px !important; 74 | } 75 | .notice__6e2b9, 76 | #bd-notices { 77 | margin-top: 0px !important; 78 | } 79 | .base_c48ade:has(.notice__6e2b9, .bd-notice) .bar_c38106 .trailing_c38106 { 80 | top: 69px !important; 81 | } 82 | } 83 | /* platform-specific fixes */ 84 | .platform-osx .base_c48ade { 85 | grid-template-areas: 86 | "titleBar titleBar titleBar" 87 | "notice notice notice" 88 | "guildsList channelsList page"; 89 | grid-template-rows: [top] 0px [titlebarEnd] min-content [page] 0px [end] !important; 90 | .sidebar_c48ade > .guilds_c48ade { 91 | margin-top: 32px; 92 | } 93 | .bar_c38106 .trailing_c38106 { 94 | top: 67px; 95 | } 96 | .notice__6e2b9, 97 | #bd-notices { 98 | margin-top: 22px; 99 | margin-bottom: -27px; 100 | } 101 | &:has(.notice__6e2b9, .bd-notice) .trailing_c38106 { 102 | top: 94px !important; 103 | } 104 | &:has(.notice__6e2b9, .bd-notice) :is(.sidebarList_c48ade, .page_c48ade) { 105 | margin-top: 27px !important; 106 | } 107 | } 108 | .platform-osx .systemBar_c38106 { 109 | background: none; 110 | } 111 | html.platform-win .sidebarListRounded_c48ade { 112 | border-top-left-radius: 8px !important; 113 | } 114 | html.platform-win .trailing_c38106 :is(.recentsIcon_c99c29, .anchor_edefb8) { 115 | transform: translateY(3px); 116 | } 117 | html.platform-osx .title_c38106 { 118 | display: none !important; 119 | } 120 | #app-mount .h5_b717a1.eyebrow_b717a1 { 121 | text-transform: uppercase !important; 122 | } 123 | /*codeblock*/ 124 | 125 | .theme-dark .hljs-addition { 126 | background-color: #033a16; 127 | color: #aff5b4; 128 | } 129 | .theme-dark .hljs-deletion { 130 | background-color: #67060c; 131 | color: #ffdcd7; 132 | } 133 | .theme-dark 134 | :is( 135 | .hljs-attr, 136 | .hljs-attribute, 137 | .hljs-literal, 138 | .hljs-meta, 139 | .hljs-number, 140 | .hljs-operator, 141 | .hljs-selector-attr, 142 | .hljs-selector-class, 143 | .hljs-selector-id, 144 | .hljs-variable 145 | ) { 146 | color: #79c0ff; 147 | } 148 | .theme-light 149 | :is( 150 | .hljs-attr, 151 | .hljs-attribute, 152 | .hljs-literal, 153 | .hljs-meta, 154 | .hljs-number, 155 | .hljs-operator, 156 | .hljs-selector-attr, 157 | .hljs-selector-class, 158 | .hljs-selector-id, 159 | .hljs-variable 160 | ) { 161 | color: #005cc5; 162 | } 163 | .theme-dark :is(.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_) { 164 | color: #d2a8ff; 165 | } 166 | .theme-light :is(.hljs-title, .hljs-title.class_, .hljs-title.class_.inherited__, .hljs-title.function_) { 167 | color: #6f42c1; 168 | } 169 | .theme-dark :is(.hljs-code, .hljs-comment, .hljs-formula) { 170 | color: #8b949e; 171 | } 172 | .theme-light :is(.hljs-code, .hljs-comment, .hljs-formula) { 173 | color: #6a737d; 174 | } 175 | .theme-dark :is(.hljs-built_in, .hljs-symbol) { 176 | color: #ffa657; 177 | } 178 | .theme-light :is(.hljs-built_in, .hljs-symbol) { 179 | color: #e36209; 180 | } 181 | .theme-dark :is(.hljs-name, .hljs-quote, .hljs-selector-pseudo, .hljs-selector-tag) { 182 | color: #7ee787; 183 | } 184 | .theme-light :is(.hljs-name, .hljs-quote, .hljs-selector-pseudo, .hljs-selector-tag) { 185 | color: #22863a; 186 | } 187 | .theme-dark :is(.hljs-meta .hljs-string, .hljs-regexp, .hljs-string) { 188 | color: #a5d6ff; 189 | } 190 | .theme-light :is(.hljs-meta .hljs-string, .hljs-regexp, .hljs-string) { 191 | color: #032f62; 192 | } 193 | 194 | .visual-refresh { 195 | /*servers and channels*/ 196 | .childWrapperNoHoverBg__6e9f8 { 197 | background-color: var(--background-primary); 198 | } 199 | .sidebarListRounded_c48ade { 200 | border-top-left-radius: unset; 201 | } 202 | /*weird line on the bottom*/ 203 | .sidebar_c48ade:after { 204 | display: none; 205 | } 206 | 207 | .panels_c48ade { 208 | display: flex; 209 | width: 242px; 210 | flex-direction: column; 211 | border: none; 212 | border-radius: 0; 213 | background: var(--bg-overlay-2, var(--background-secondary-alt)); 214 | } 215 | 216 | .menu_c1e9c4 { 217 | box-shadow: var(--shadow-high); 218 | border-radius: 4px; 219 | border: none; 220 | } 221 | 222 | &:not(html:is(.density-cozy,.density-compact)) :is(.scroller_c1e9c4, 223 | .labelContainer_c1e9c4) { 224 | padding: 6px 8px; 225 | } 226 | .wrapper_f563df { 227 | gap: unset; 228 | padding: 4px 0 6px 2px; 229 | .button_f563df { 230 | border-radius: 50%; 231 | width: 32px; 232 | height: 32px; 233 | padding: 4px; 234 | } 235 | } 236 | html:not(.density-cozy,.density-compact) .item_c1e9c4 { 237 | margin: 2px 0; 238 | } 239 | .sidebar__23e6b:not(.selected_b3f026, :hover) { 240 | color: var(--interactive-normal); 241 | } 242 | .colorDefault_c1e9c4 .label_c1e9c4 { 243 | color: unset; 244 | } 245 | .colorDefault_c1e9c4:active:not(.hideInteraction_c1e9c4) { 246 | background-color: var(--menu-item-default-active-bg); 247 | } 248 | .colorDefault_c1e9c4.focused_c1e9c4 { 249 | border-radius: 2px; 250 | } 251 | .colorDanger_c1e9c4, 252 | .colorDanger_c1e9c4 .checkbox_c1e9c4, 253 | .colorDanger_c1e9c4 .radioSelection_c1e9c4 { 254 | color: var(--status-danger); 255 | } 256 | .colorDanger_c1e9c4.focused_c1e9c4 { 257 | color: var(--white); 258 | } 259 | .colorDefault_c1e9c4.focused_c1e9c4:not(.checkboxContainer_c1e9c4) path { 260 | fill: var(--white); 261 | } 262 | .iconContainer_c1e9c4 { 263 | width: 18px; 264 | height: 18px; 265 | } 266 | .separator_c1e9c4 { 267 | margin: 4px; 268 | } 269 | .iconContainer_c1e9c4 { 270 | svg.radioIcon_c1e9c4 { 271 | width: 16px; 272 | height: 16px; 273 | margin-top: 2px; 274 | } 275 | .refreshIconFill__001a7 { 276 | fill: transparent; 277 | stroke: white; 278 | stroke-width: 2; 279 | r: 10; 280 | } 281 | .refreshIconStroke__001a7 { 282 | stroke-width: 0; 283 | } 284 | .refreshIcon__001a7 { 285 | fill: var(--blurple); 286 | r: 6; 287 | } 288 | } 289 | .icon__9293f { 290 | height: 24px; 291 | width: 24px; 292 | } 293 | .caret_c1e9c4 { 294 | width: 16px; 295 | height: 16px; 296 | } 297 | .buttons__37e49 { 298 | gap: 1px; 299 | } 300 | 301 | .wrapper_cc5dd2, 302 | .childWrapper__6e9f8, 303 | .icon__6e9f8 { 304 | width: 50px !important; 305 | height: 50px !important; 306 | } 307 | .wrapper_cc5dd2 > .svg_cc5dd2 { 308 | inset: auto; 309 | contain: none; 310 | } 311 | .wrapper_cc5dd2 > .svg_cc5dd2 foreignObject { 312 | mask: none; 313 | overflow: visible; 314 | x: -4; 315 | y: -4; 316 | } 317 | .wrapper_cc5dd2 > .svg_cc5dd2 foreignObject[width="48"] { 318 | x: 0; 319 | y: 0; 320 | } 321 | .wrapper_cc5dd2 .wrapper__6e9f8 { 322 | width: 48px; 323 | height: 48px; 324 | border-radius: 25px; 325 | overflow: hidden; 326 | transition: border-radius 0.2s ease; 327 | } 328 | .wrapper__6e9f8.selected__6e9f8 { 329 | border-radius: 15px !important; 330 | } 331 | .outer_bf1984 { 332 | background: var(--background-tertiary); 333 | } 334 | .outer_bf1984.interactive_bf1984:hover { 335 | background-color: var(--background-floating); 336 | } 337 | .container_f37cb1:not(.hasBanner_f37cb1) .header_f37cb1 { 338 | border: unset; 339 | box-shadow: var(--shadow-ledge); 340 | } 341 | .bannerVisible_f37cb1 .header_f37cb1 { 342 | border-bottom-color: transparent; 343 | } 344 | .headerGlass_f37cb1 { 345 | display: none; 346 | } 347 | .container__9293f { 348 | border: unset; 349 | box-shadow: var(--shadow-ledge); 350 | } 351 | .title_f75fb0 { 352 | padding-left: 8px; 353 | } 354 | .lookLink__201d5.colorPrimary__201d5 { 355 | color: var(--text-normal); 356 | } 357 | /* Emojis/GIF Picker */ 358 | .drawerSizingWrapper__08434 { 359 | right: 0px !important; 360 | } 361 | .contentWrapper__08434 { 362 | background-color: var(--background-secondary); 363 | border-radius: 8px; 364 | box-shadow: var(--shadow-border), var(--shadow-high); 365 | border: unset; 366 | } 367 | .header_fed6d3, 368 | .soundboardHeader__08434 { 369 | background-color: var(--background-secondary); 370 | box-shadow: var(--shadow-ledge); 371 | border-bottom: unset; 372 | } 373 | .emojiPicker_c0e32c { 374 | background-color: var(--background-secondary); 375 | box-shadow: var(--shadow-border), var(--shadow-high); 376 | border-bottom-right-radius: var(--custom-emoji-picker-border-radius); 377 | border-bottom-left-radius: var(--custom-emoji-picker-border-radius); 378 | grid-template-columns: 48px auto; 379 | grid-template-rows: auto 1fr auto; 380 | height: var(--custom-emoji-picker-constants-emoji-picker-height); 381 | width: var(--custom-emoji-picker-constants-min-emoji-picker-width); 382 | } 383 | .emojiPickerHasTabWrapper_c0e32c .emojiPicker_c0e32c { 384 | background-color: transparent; 385 | border-bottom-right-radius: 0; 386 | border-bottom-left-radius: 0; 387 | box-shadow: none; 388 | flex: 1 1 auto; 389 | grid-template-rows: auto 1fr auto; 390 | height: 100%; 391 | width: auto; 392 | } 393 | .categoryList_c0e32c { 394 | top: 58px; 395 | } 396 | .expressionPickerCategoryList_a1e0e0 { 397 | top: 50px; 398 | } 399 | .inspector_aeaaeb { 400 | background-color: var(--background-secondary-alt); 401 | border-top: unset; 402 | } 403 | .emojiPickerHasTabWrapper_c0e32c .categoryList_c0e32c { 404 | top: 50px; 405 | } 406 | .unicodeShortcut_b9ee0c { 407 | box-sizing: unset; 408 | border-top: unset; 409 | } 410 | .wrapper__14245 { 411 | background-color: var(--background-secondary); 412 | } 413 | .wrapper__4e6ce { 414 | background-color: var(--background-tertiary); 415 | } 416 | .header_c0e32c { 417 | background-color: var(--background-secondary); 418 | box-shadow: var(--shadow-low); 419 | margin: 0 -1px; 420 | padding: 12px; 421 | border-bottom: unset; 422 | } 423 | .childContainer__91a9d { 424 | padding: 2px 0; 425 | } 426 | .clickable__9293f .icon__9293f { 427 | color: var(--interactive-normal); 428 | } 429 | .popoutContainer__0f481 { 430 | background-color: var(--background-floating); 431 | box-shadow: var(--elevation-low); 432 | -webkit-backdrop-filter: unset; 433 | backdrop-filter: unset; 434 | } 435 | /* channel menus */ 436 | .header__45690 { 437 | background: var(--background-tertiary); 438 | border-bottom: 2px solid var(--background-modifier-accent); 439 | } 440 | .messagesPopoutWrap__45690 { 441 | background-color: var(--background-secondary); 442 | border-radius: 8px; 443 | max-height: 91vh !important; 444 | } 445 | .messageGroupWrapper__45690 { 446 | border: 1px solid var(--background-tertiary); 447 | border-radius: 4px; 448 | -webkit-user-select: none; 449 | background: var(--background-primary); 450 | margin-right: unset; 451 | } 452 | .searchHeader_f3b986 { 453 | background: var(--bg-overlay-chat); 454 | height: 48px; 455 | padding: 0 20px; 456 | border: unset; 457 | } 458 | .content__49fc1 { 459 | padding-top: unset; 460 | } 461 | .root__49fc1 { 462 | border: none; 463 | outline: none; 464 | } 465 | .rootWithShadow__49fc1 { 466 | box-shadow: var(--legacy-elevation-border), var(--legacy-elevation-high); 467 | } 468 | .channelName__754bd div, 469 | .channelName__754bd input { 470 | font-weight: 600; 471 | } 472 | .input__4f074 { 473 | border-radius: 3px; 474 | } 475 | .outer__4f074:hover .input__4f074 { 476 | background-color: unset; 477 | outline: unset; 478 | box-shadow: inset 0 0 0 1px var(--background-tertiary); 479 | } 480 | .input__4f074:focus, 481 | .outer__4f074:hover .input__4f074:focus { 482 | background-color: var(--input-background); 483 | box-shadow: inset 0 0 0 1px var(--background-tertiary); 484 | outline: none; 485 | } 486 | 487 | /* tab bars */ 488 | .item_b3f026 { 489 | position: relative; 490 | font-size: 16px; 491 | line-height: 20px; 492 | cursor: pointer; 493 | font-weight: 500; 494 | } 495 | .tab_f8303a { 496 | display: flex; 497 | flex-shrink: 1; 498 | align-items: center; 499 | gap: var(--spacing-8); 500 | padding-bottom: var(--spacing-12); 501 | } 502 | .brand_b3f026.item_b3f026:hover, 503 | .themed_b3f026.item_b3f026:hover { 504 | color: var(--interactive-hover); 505 | } 506 | .top_b3f026 .item_b3f026 { 507 | margin-bottom: unset; 508 | } 509 | .top_b3f026 .item_b3f026.selected_b3f026 { 510 | cursor: default; 511 | color: var(--interactive-active); 512 | } 513 | .top_b3f026 .item_b3f026.selected_b3f026:after, 514 | .top_b3f026 .item_b3f026:hover:after { 515 | border-top-left-radius: unset; 516 | border-top-right-radius: unset; 517 | margin-top: -3px; 518 | } 519 | .topPill_b3f026 .themed_b3f026.selected_b3f026.item_b3f026 { 520 | background-color: var(--background-modifier-selected); 521 | } 522 | .side_b3f026 .themed_b3f026.selected_b3f026.item_b3f026:hover:not(.disabled_b3f026), 523 | .topPill_b3f026 .themed_b3f026.selected_b3f026.item_b3f026:hover:not(.disabled_b3f026) { 524 | background-color: var(--background-modifier-selected); 525 | color: var(--text-primary); 526 | } 527 | .side_b3f026 .themed_b3f026.item_b3f026:hover:not(.disabled_b3f026), 528 | .topPill_b3f026 .themed_b3f026.item_b3f026:hover:not(.disabled_b3f026) { 529 | background-color: var(--background-modifier-hover); 530 | } 531 | 532 | /* header text in DMs */ 533 | .titleWrapper__9293f > .defaultColor__5345c.text-md\/medium_cf4812 { 534 | text-transform: unset !important; 535 | } 536 | .topic__6ec1a { 537 | color: var(--header-secondary); 538 | } 539 | /* call background */ 540 | .root_bfe55a { 541 | background: unset; 542 | } 543 | 544 | /*buttons*/ 545 | .button__201d5:is(.bannerColor_fb7f94) { 546 | border: unset; 547 | } 548 | .item_b3f026 { 549 | transition: none !important; 550 | } 551 | :is(.sidebar__23e6b) .selected_b3f026.item_b3f026 { 552 | background: var(--background-modifier-selected) !important; 553 | } 554 | :is(.sidebar__23e6b) .side_b3f026 .themed_b3f026.item_b3f026:hover:not(.disabled_b3f026) { 555 | background-color: var(--background-modifier-hover); 556 | } 557 | :is(.sidebar__23e6b) .side_b3f026 .themed_b3f026.item_b3f026:active:not(.disabled_b3f026) { 558 | background-color: var(--background-modifier-active); 559 | color: var(--text-primary); 560 | } 561 | :is(.sidebar__23e6b) .selected_b3f026.item_b3f026:hover { 562 | color: var(--text-primary); 563 | } 564 | .topPill_b3f026 .item_b3f026 { 565 | border-radius: 4px; 566 | margin: 0 8px; 567 | padding: 2px 8px; 568 | min-height: unset; 569 | } 570 | .searchBar__35e86 { 571 | border-bottom: unset; 572 | box-shadow: var(--elevation-low); 573 | } 574 | .searchBar__35e86 .grow__201d5.fullWidth__201d5.sizeSmall__201d5.colorPrimary__201d5.lookFilled__201d5.button__201d5 { 575 | width: 100%; 576 | height: 28px; 577 | min-height: unset; 578 | overflow: hidden; 579 | border-radius: 4px; 580 | background-color: var(--background-tertiary); 581 | box-shadow: none; 582 | .contents__201d5 { 583 | width: 100%; 584 | color: var(--text-muted); 585 | text-align: left; 586 | text-overflow: ellipsis; 587 | font-size: 14px; 588 | font-weight: 500; 589 | line-height: 24px; 590 | white-space: nowrap; 591 | margin-left: -10px; 592 | } 593 | } 594 | .wrapper_f7ecac:not(.popover_c97e55) { 595 | box-shadow: var(--elevation-stroke); 596 | } 597 | .toolbar__9293f { 598 | gap: unset; 599 | padding-left: unset; 600 | } 601 | .iconBadgeBottom__9293f { 602 | right: 2px; 603 | bottom: 0; 604 | --custom-icon-offset: unset; 605 | } 606 | .navButton__08434 { 607 | border-radius: 4px; 608 | color: var(--interactive-normal); 609 | font-size: 16px; 610 | font-weight: 600; 611 | line-height: 20px; 612 | padding: 2px 8px; 613 | transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; 614 | } 615 | .navButtonActive__08434 { 616 | color: var(--interactive-active); 617 | background-color: var(--background-modifier-selected); 618 | } 619 | .navButton__08434:hover { 620 | color: var(--interactive-hover); 621 | background-color: var(--background-modifier-hover); 622 | } 623 | button.button__67645.enabled__67645:hover { 624 | background-color: var(--background-modifier-selected); 625 | } 626 | .container__87bf1.checked__87bf1 { 627 | border: none; 628 | } 629 | button.button__67645, 630 | .visual-refresh span.button__67645 { 631 | transition: none; 632 | } 633 | /* mic button */ 634 | .micButtonParent__37e49:hover > button { 635 | background-color: rgba(0, 0, 0, 0); 636 | } 637 | 638 | /* search bar(s) */ 639 | .medium_a45028 { 640 | height: unset; 641 | .inner_a45028 { 642 | padding: 1px; 643 | .input_a45028 { 644 | padding: 0 8px; 645 | line-height: 32px; 646 | margin: 1px; 647 | } 648 | .iconLayout_a45028 { 649 | width: 32px; 650 | height: 32px; 651 | } 652 | } 653 | } 654 | .container_a45028 { 655 | border: none; 656 | background-color: var(--background-tertiary); 657 | } 658 | .search__49676 { 659 | margin: 0 8px; 660 | } 661 | .searchBar__97492 { 662 | background: var(--bg-overlay-3, var(--background-tertiary)); 663 | padding: 0 2px; 664 | height: 24px; 665 | width: 144px; 666 | border-radius: 4px; 667 | border: none; 668 | margin-right: 80px; 669 | .DraftEditor-root { 670 | padding: 2px 0; 671 | line-height: 20px; 672 | } 673 | } 674 | .container__55c99 { 675 | box-shadow: var(--shadow-border), var(--shadow-high); 676 | border-radius: 3px; 677 | border: none; 678 | background: var(--bg-overlay-3, var(--background-primary)); 679 | } 680 | .container_fea832 { 681 | background-color: var(--background-tertiary); 682 | border-radius: 4px; 683 | border: none; 684 | } 685 | .searchResult__02a39 { 686 | border: solid 1px var(--background-tertiary); 687 | } 688 | /* dropdowns */ 689 | .lookFilled__3f413.select__3f413 { 690 | background-color: var(--input-background); 691 | border-color: var(--input-background); 692 | } 693 | /* border radius 9 list of offenders */ 694 | .root__49fc1, 695 | .container_e45859, 696 | .searchBar__5ec2f, 697 | .tooltip__382e7, 698 | .link__2ea32, 699 | .container_a45028, 700 | .container__91a9d, 701 | .option__56fec, 702 | .wrapper_d5f3cd, 703 | .section__00943, 704 | .container__0be77, 705 | .content__07f91 { 706 | border-radius: 4px; 707 | } 708 | .button__201d5:not(.cta_a3a802) { 709 | border-radius: 3px; 710 | &:not(.lookOutlined__201d5, .card__39ec2 .button_fb7f94, .button_fb7f94) { 711 | border: none; 712 | } 713 | .panels_c48ade & { 714 | background: none; 715 | } 716 | } 717 | .button__7d7f7 { 718 | border-radius: 999% !important; 719 | } 720 | .select__3f413 { 721 | border: 1px solid transparent; 722 | cursor: pointer; 723 | box-sizing: border-box; 724 | grid-gap: 8px; 725 | border-radius: 4px; 726 | min-height: unset; 727 | } 728 | .container_f89b2c { 729 | background-color: var(--opacity-black-8); 730 | border-color: var(--opacity-black-28); 731 | min-height: unset; 732 | border-radius: 3px; 733 | } 734 | /* modal footers */ 735 | .footer__49fc1 { 736 | border-radius: 0 0 5px 5px; 737 | background-color: var(--modal-footer-background); 738 | } 739 | .footerSeparator__49fc1 { 740 | box-shadow: inset 0 1px 0 hsl(220 calc(1 * 6.522%) 18.039% /0.6); 741 | } 742 | .footer__5be3e { 743 | .channelTextArea__74017 { 744 | box-sizing: border-box; 745 | width: 100%; 746 | height: 40px; 747 | border-radius: 3px; 748 | background-color: var(--deprecated-text-input-bg); 749 | border: 1px solid var(--deprecated-text-input-border); 750 | -webkit-transition: border-color 0.2s ease-in-out; 751 | transition: border-color 0.2s ease-in-out; 752 | } 753 | } 754 | 755 | .member__5d473 { 756 | max-width: 224px; 757 | } 758 | .barButtonAlt__0f481 { 759 | background: none; 760 | &:hover { 761 | background: none; 762 | } 763 | } 764 | .custom-theme-background .container_a99829 { 765 | border: unset; 766 | } 767 | .inlineContainer__74017 { 768 | box-shadow: inherit; 769 | background: unset; 770 | border-color: transparent; 771 | } 772 | .inner_a99829 { 773 | border-radius: 3px; 774 | } 775 | .buttons__74017 { 776 | margin-right: -6px !important; 777 | } 778 | .button__74017 { 779 | padding: 4px; 780 | margin-left: 4px; 781 | margin-right: 4px; 782 | } 783 | 784 | .base_c48ade { 785 | grid-template-areas: 786 | "titleBar titleBar titleBar" 787 | "notice notice notice" 788 | "guildsList channelsList page"; 789 | grid-template-rows: [top] 0px [titlebarEnd] min-content [page] 22px [end]; 790 | } 791 | .base_c48ade .sidebar_c48ade { 792 | display: grid; 793 | grid-template-areas: "guilds sidebar" "guilds panels"; 794 | grid-template-columns: [start] min-content [sidebarStart] unset [end]; 795 | grid-template-rows: [start] 1fr [panelsStart] min-content [end]; 796 | border-radius: 0; 797 | } 798 | .base_c48ade .sidebar_c48ade > .guilds_c48ade { 799 | grid-area: guilds; 800 | margin-bottom: 0; 801 | } 802 | .base_c48ade .sidebar_c48ade > .sidebarList_c48ade { 803 | grid-area: sidebar; 804 | width: 241px; 805 | --custom-app-panels-height: 0; 806 | } 807 | .base_c48ade .sidebar_c48ade > .sidebarResizeHandle_c48ade, 808 | :root .base_c48ade .sidebar_c48ade:after { 809 | display: none; 810 | } 811 | /*Betterfolders (vencord)*/ 812 | .base_c48ade.vc-betterFolders-sidebar-grid { 813 | grid-template-columns: [start] 80px [guilds-end] min-content [betterFoldersSidebar-end] 240px [channelsEnd] 1fr [end]; 814 | grid-template-areas: "titleBar titleBar titleBar titleBar" "guildsList betterFoldersSidebar notice notice" "guildsList betterFoldersSidebar channelsList page"; 815 | } 816 | .base_c48ade.vc-betterFolders-sidebar-grid .sidebar_c48ade { 817 | grid-template-columns: [start] 80px [guilds-end] min-content [betterFoldersSidebar-end] 240px [end]; 818 | grid-template-areas: "guilds betterFoldersSidebar sidebar" "guilds betterFoldersSidebar panels"; 819 | width: auto !important; 820 | } 821 | /* ServerFolders (betterdiscord) */ 822 | .folderContentIsOpen_ac0584 .base_c48ade { 823 | grid-template-areas: 824 | "titleBar titleBar titleBar titleBar" 825 | "notice notice notice notice" 826 | "guildsList guildsList channelsList page"; 827 | grid-template-columns: [start] min-content [guildsEnd] min-content [guildsEnd] min-content [channelsEnd] 1fr [end]; 828 | } 829 | .folderContentIsOpen_ac0584 .base_c48ade .sidebar_c48ade { 830 | grid-template-areas: 831 | "guilds guildsFolderList sidebar" 832 | "guilds guildsFolderList panels"; 833 | } 834 | /* user panel */ 835 | .base_c48ade .sidebar_c48ade > .panels_c48ade { 836 | grid-area: panels; 837 | position: static; 838 | inset: auto; 839 | .avatar__37e49.wrapper__44b0c { 840 | width: 32px !important; 841 | height: 32px !important; 842 | svg { 843 | width: 40px; 844 | height: 40px; 845 | } 846 | } 847 | } 848 | .toolbar__9293f > .iconWrapper__9293f { 849 | height: 24px !important; 850 | width: auto !important; 851 | margin: 0 8px; 852 | svg { 853 | width: 24px; 854 | height: 24px; 855 | } 856 | } 857 | .avatarWrapper__37e49 { 858 | padding-left: 2px; 859 | border-radius: 4px; 860 | transition: none; 861 | &:hover { 862 | background-color: var(--background-modifier-selected); 863 | color: var(--interactive-hover); 864 | } 865 | } 866 | .avatarWrapper__37e49 .nameTag__37e49 { 867 | padding-bottom: 4px; 868 | padding-top: 4px; 869 | } 870 | .nameTag__37e49 { 871 | margin-right: 4px; 872 | } 873 | 874 | /* style dms correctly (refresh edition) */ 875 | .channel__972a0 { 876 | .interactive__972a0:active, 877 | .interactiveSelected__972a0 { 878 | background: var(--bg-overlay-selected, var(--background-modifier-selected)); 879 | } 880 | .interactiveSelected__972a0 :is(.name__20a53,.subtext__972a0) { 881 | color: var(--interactive-active) !important; 882 | } 883 | .highlighted__20a53 .subtext__972a0 { 884 | color: var(--interactive-active); 885 | } 886 | .interactive_bf202d:hover { 887 | color: var(--interactive-hover) !important; 888 | } 889 | .interactiveSelected__972a0 .subText__20a53 [data-text-variant="text-xs\/medium"] { 890 | color: var(--interactive-active) !important; 891 | } 892 | 893 | &:hover:not(:has(.interactiveSelected__972a0)) .subText__20a53 [data-text-variant="text-xs\/medium"] { 894 | color: var(--interactive-hover) !important; 895 | } 896 | 897 | &:hover .interactiveSelected__972a0 .name__20a53 { 898 | color: var(--interactive-active) !important; 899 | } 900 | 901 | & .subText__20a53 [data-text-variant="text-xs\/medium"] { 902 | color: var(--channels-default) !important; 903 | } 904 | 905 | &:hover:has(.interactiveSelected__972a0) .interactive_bf202d { 906 | background: var(--background-modifier-selected) !important; 907 | } 908 | .interactive__972a0:focus-within { 909 | background: var(--bg-overlay-selected, var(--background-modifier-selected)); 910 | } 911 | } 912 | 913 | /* style member list correctly */ 914 | .clickable__91a9d.container__91a9d:hover .text_c9d15c, 915 | .clickable__91a9d.container__91a9d:hover .muted__91a9d .text_c9d15c, 916 | .clickable__91a9d.container__91a9d:active .text_c9d15c, 917 | .clickable__91a9d.container__91a9d:active .text_c9d15c, 918 | .highlighted__91a9d.container__91a9d .text_c9d15c, 919 | .selected__91a9d.container__91a9d .text_c9d15c { 920 | color: var(--channels-default); 921 | } 922 | 923 | /* style friends list correctly */ 924 | .peopleListItem_cc6179 { 925 | transition: unset !important; 926 | } 927 | .peopleListItem_cc6179.active_cc6179 { 928 | background-color: var(--background-modifier-hover); 929 | } 930 | 931 | .base_c48ade 932 | .text-sm\/medium__13cf1:not( 933 | .title_b6c092, 934 | .text_c9d15c, 935 | .applicationSublabel_e1ecd3 .text-sm\/medium__13cf1, 936 | .lineClamp1__4bd52, 937 | .searchFilter_bd8186, 938 | .searchAnswer_bd8186 939 | ) { 940 | text-transform: uppercase; 941 | font-size: 12px; 942 | line-height: 16px; 943 | letter-spacing: 0.02em; 944 | font-family: var(--font-display); 945 | font-weight: 600; 946 | } 947 | .header__56fec { 948 | text-transform: uppercase; 949 | font-size: 12px; 950 | line-height: 16px; 951 | letter-spacing: 0.02em; 952 | font-family: var(--font-display); 953 | font-weight: 800; 954 | } 955 | .h5_b717a1:not(.isEnabled__2666b) { 956 | color: var(--header-secondary); 957 | } 958 | .eyebrow_b717a1 { 959 | font-family: var(--font-display); 960 | font-size: 12px; 961 | line-height: 1.3333333333333333; 962 | font-weight: 700; 963 | text-transform: uppercase; 964 | letter-spacing: 0.02em; 965 | } 966 | /* turn a dot into a divider */ 967 | .dot__9293f { 968 | width: 1px; 969 | height: 24px; 970 | margin: 0 8px; 971 | flex: 0 0 auto; 972 | background: var(--background-modifier-accent); 973 | } 974 | 975 | .sectionDivider__35e86 { 976 | display: none; 977 | } 978 | .privateChannelsHeaderContainer__99e7c { 979 | display: flex; 980 | padding: 18px 8px 4px 18px !important; 981 | height: 40px !important; 982 | } 983 | 984 | /* markdown things */ 985 | .markup__75297 code { 986 | line-height: 1.125rem; 987 | text-indent: 0; 988 | background: var(--background-secondary) !important; 989 | border: 1px solid var(--background-tertiary) !important; 990 | } 991 | .markup__75297 code.inline { 992 | font-family: var(--font-code) !important; 993 | } 994 | .embedFull__623de code.inline { 995 | background: var(--background-tertiary) !important; 996 | } 997 | 998 | /* discord logo */ 999 | .childWrapper__6e9f8 svg { 1000 | height: 30px !important; 1001 | width: 30px !important; 1002 | } 1003 | 1004 | /* sliders & bars */ 1005 | .slider_a562c8 { 1006 | --grabber-size: 16px !important; 1007 | --bar-size: 4px !important; 1008 | } 1009 | .slider_a562c8 .barFill_a562c8 { 1010 | background-color: var(--bg-brand); 1011 | } 1012 | .grabber_a562c8 { 1013 | top: 9px; 1014 | width: 10px; 1015 | height: 24px; 1016 | margin-left: -5px; 1017 | border-radius: 3px; 1018 | background-color: var(--white); 1019 | border: 1px solid var(--border-strong); 1020 | box-shadow: var(--shadow-border), var(--shadow-ledge), var(--shadow-low); 1021 | } 1022 | .slider_a562c8:is(.hasMarks_a562c8) .grabber_a562c8 { 1023 | margin-top: 16px; 1024 | } 1025 | :is(#user-context-user-volume, .column__7072d, .categorySubGroup__9f327) .slider_a562c8 .grabber_a562c8 { 1026 | margin-top: -7px; 1027 | } 1028 | .sliderBar_ac7648.speaking_ac7648 { 1029 | background-color: rgb(105, 196, 154); 1030 | } 1031 | .bar_a562c8 { 1032 | height: 8px; 1033 | } 1034 | 1035 | .radioBar__001a7 { 1036 | padding: 10px !important; 1037 | --checkbox-border-checked: var(--brand-experiment-130); 1038 | --redesign-input-control-selected: none; 1039 | } 1040 | /* 1041 | .radioBar__001a7 .radioIndicatorGroup__001a7:before { 1042 | content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -2 28 28'%3E%3Cpath d='M3 0C1.34326 0 0 1.34277 0 3V21C0 22.6572 1.34326 24 3 24H21C22.6567 24 24 22.6572 24 21V3C24 1.34277 22.6567 0 21 0H3ZM3 1C1.89551 1 1 1.89551 1 3V21C1 22.1045 1.89551 23 3 23H21C22.1045 23 23 22.1045 23 21V3C23 1.89551 22.1045 1 21 1H3Z' stroke='' stroke-width='' fill='%2372767d' fill-rule='evenodd' clip-rule='evenodd'/%3E%3C/svg%3E"); 1043 | position: relative 1044 | } 1045 | */ 1046 | /* chat box */ 1047 | .scrollerSpacer__36d07 { 1048 | height: 30px; 1049 | } 1050 | .formWithLoadedChatInput_f75fb0 { 1051 | padding-left: 16px !important; 1052 | padding-right: 16px !important; 1053 | .channelTextArea__74017 { 1054 | border: none; 1055 | } 1056 | .buttons__74017 { 1057 | margin-right: -6px !important; 1058 | gap: unset; 1059 | } 1060 | .button__74017 { 1061 | padding: 4px; 1062 | margin-left: 4px; 1063 | margin-right: 4px; 1064 | } 1065 | .spriteContainer__04eed { 1066 | --custom-emoji-sprite-size: 24px !important; 1067 | } 1068 | .lottieIcon__5eb9b { 1069 | height: unset !important; 1070 | width: unset !important; 1071 | .channelAppLauncher_e6e74f & { 1072 | width: 24px !important; 1073 | } 1074 | } 1075 | .stackedBars__74017 { 1076 | background: var(--background-secondary); 1077 | &:first-child, 1078 | &.floatingBars__74017:empty + .stackedBars__74017:nth-child(2) { 1079 | border-top-left-radius: 8px; 1080 | border-top-right-radius: 8px; 1081 | } 1082 | &:not(:last-child) { 1083 | border: none; 1084 | } 1085 | } 1086 | .channelAttachmentArea_b77158 { 1087 | background-color: unset; 1088 | } 1089 | .upload_aa605f { 1090 | background-color: unset; 1091 | background: var(--bg-overlay-5, var(--background-secondary)); 1092 | border: unset; 1093 | border-radius: 4px; 1094 | box-shadow: unset; 1095 | } 1096 | .spoilerContainer__54ab5.attachmentContainer__54ab5 .media__41ea0 { 1097 | border-radius: 3px; 1098 | } 1099 | .slateTextArea_ec4baf { 1100 | margin-left: unset; 1101 | } 1102 | .attachButton__0923f { 1103 | height: 40px; 1104 | padding: 10px 16px; 1105 | } 1106 | .attachButtonInner__0923f { 1107 | svg { 1108 | width: 24px; 1109 | height: 24px; 1110 | } 1111 | } 1112 | } 1113 | .channelTextArea__74017 { 1114 | border: unset; 1115 | border-radius: 4px; 1116 | } 1117 | .separator__49fc1 { 1118 | box-shadow: 0 1px 0 0 hsl(240 calc(1 * 5.263%) 7.451% /0.3), 0 1px 2px 0 hsl(240 calc(1 * 5.263%) 7.451% /0.3); 1119 | } 1120 | .header__49fc1 { 1121 | padding: var(--modal-vertical-padding) var(--modal-horizontal-padding); 1122 | } 1123 | .autocompleteAttached__6b0e0 { 1124 | left: 0; 1125 | right: 0; 1126 | } 1127 | .cooldownText_b21699 { 1128 | color: var(--font-primary) !important; 1129 | } 1130 | .base_b88801 { 1131 | left: 16px; 1132 | font-size: 14px; 1133 | font-weight: 500; 1134 | line-height: 24px; 1135 | resize: none; 1136 | align-items: center; 1137 | color: var(--text-normal); 1138 | } 1139 | 1140 | /* jump to present bar */ 1141 | .jumpToPresentBar__0f481 { 1142 | bottom: 0; 1143 | border-radius: 8px 8px 0 0; 1144 | background-color: var(--background-accent); 1145 | opacity: 0.95 !important; 1146 | padding-bottom: 4px !important; 1147 | color: var(--white-500); 1148 | .barButtonBase__0f481 { 1149 | padding-left: unset; 1150 | padding: 0 12px; 1151 | } 1152 | .button__201d5 { 1153 | flex: 0 0 auto; 1154 | font-weight: 600; 1155 | position: relative; 1156 | background: unset; 1157 | padding-bottom: 6px; 1158 | &:hover { 1159 | background-color: unset !important; 1160 | } 1161 | .contents__201d5:after { 1162 | content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' viewBox='0 0 24 16'%3E%3Cpath d='M7 10L12 15 17 10'%3E%3C/path%3E%3C/svg%3E"); 1163 | margin-left: 8px; 1164 | } 1165 | } 1166 | } 1167 | .bottomBar__0f481 { 1168 | border: unset; 1169 | padding: unset; 1170 | left: unset; 1171 | right: unset; 1172 | margin: unset; 1173 | width: unset; 1174 | min-width: unset; 1175 | box-shadow: unset; 1176 | min-height: unset; 1177 | box-sizing: unset; 1178 | } 1179 | 1180 | .barBase__0f481 { 1181 | left: 16px; 1182 | right: 16px; 1183 | min-height: 24px; 1184 | opacity: 0.95; 1185 | border: unset; 1186 | } 1187 | 1188 | .embedFull__623de { 1189 | background: var(--background-secondary); 1190 | border-top: unset; 1191 | border-right: unset; 1192 | border-bottom: unset; 1193 | } 1194 | 1195 | .cardPrimary__73069, 1196 | .cardPrimary__73069.editable__73069 { 1197 | background: var(--__card-accent-color); 1198 | } 1199 | .sensitivity_ac7648 { 1200 | min-height: 0px; 1201 | } 1202 | 1203 | /* add emoji button */ 1204 | .largeReactionBtn__23977.forceShow__23977 { 1205 | padding: unset; 1206 | } 1207 | .reactionBtn__23977 { 1208 | opacity: 0; 1209 | } 1210 | .reactionBtn__23977:hover { 1211 | background: none; 1212 | } 1213 | 1214 | /* channel category arrow */ 1215 | .mainContent__29444 { 1216 | margin-left: -10px; 1217 | } 1218 | .mainContent__29444 .icon__29444 { 1219 | order: -1; 1220 | } 1221 | 1222 | .box_f8c98c { 1223 | background-color: var(--background-secondary); 1224 | box-shadow: var(--elevation-low); 1225 | border-radius: 5px; 1226 | } 1227 | .lookLink__201d5.colorLink__201d5 { 1228 | color: var(--text-link); 1229 | } 1230 | 1231 | /* file embeds */ 1232 | .wrapperAudio_cf09d8, 1233 | .file__0ccae, 1234 | .container_a8e786 { 1235 | background-color: var(--background-secondary); 1236 | border: 1px solid var(--background-secondary-alt); 1237 | box-shadow: unset; 1238 | } 1239 | .textContainer__4d95d { 1240 | background-color: var(--background-secondary); 1241 | border: 1px solid var(--background-secondary-alt); 1242 | } 1243 | .footer__4d95d { 1244 | background-color: var(--background-secondary); 1245 | border: 1px solid var(--background-secondary-alt); 1246 | } 1247 | .hljs { 1248 | display: block; 1249 | overflow-x: auto; 1250 | padding: 0.5em; 1251 | border-radius: 4px; 1252 | -webkit-text-size-adjust: none; 1253 | text-size-adjust: none; 1254 | color: var(--text-normal); 1255 | } 1256 | .audioControls_cf09d8 { 1257 | border-radius: 3px; 1258 | background-color: var(--opacity-black-60); 1259 | } 1260 | .colorDefault_c1e9c4.focused_c1e9c4 .caret_c1e9c4, 1261 | .colorDefault_c1e9c4.focused_c1e9c4 .checkbox_c1e9c4, 1262 | .colorDefault_c1e9c4.focused_c1e9c4 .radioSelection_c1e9c4, 1263 | .colorDefault_c1e9c4.focused_c1e9c4 .subtext_c1e9c4, 1264 | .colorDefault_c1e9c4.focused_c1e9c4 .refreshIcon__001a7 { 1265 | color: var(--white); 1266 | fill: var(--white); 1267 | } 1268 | 1269 | /* ping icon */ 1270 | .lowerBadge_cc5dd2 { 1271 | border: 5px solid var(--background-tertiary); 1272 | border-radius: 50%; 1273 | margin-bottom: -5px; 1274 | margin-right: -5px; 1275 | } 1276 | .upperBadge_cc5dd2{ 1277 | background: var(--background-tertiary); width: 24px; height: 24px; 1278 | position: relative; 1279 | border-radius: 50%; 1280 | left: 28px; 1281 | &>.iconBadge__650eb{ 1282 | top: 4px; left: 4px; position: absolute 1283 | } 1284 | } 1285 | 1286 | 1287 | /* voice channel user count */ 1288 | .wrapper__260e1 { 1289 | display: flex; 1290 | align-items: stretch; 1291 | line-height: 20px; 1292 | border-radius: 10px; 1293 | color: var(--channels-default); 1294 | border: none; 1295 | } 1296 | .total__260e1 { 1297 | padding: 0 6px 0 0; 1298 | background-color: var(--background-tertiary); 1299 | &:after { 1300 | left: -8px; 1301 | border-right: 8px solid transparent; 1302 | border-right-color: var(--background-tertiary); 1303 | } 1304 | } 1305 | .users__260e1 { 1306 | padding: 0 8px 0 6px; 1307 | background-color: var(--background-primary); 1308 | } 1309 | .total__260e1, 1310 | .users__260e1 { 1311 | font-feature-settings: normal; 1312 | font-variant-numeric: normal; 1313 | } 1314 | 1315 | /* placeholder gray square when moving a server icon */ 1316 | .dragInner__87847 { 1317 | background-color: var(--background-primary) !important; 1318 | border: none !important; 1319 | } 1320 | svg.placeholderMask__87847 { 1321 | width: 50px; 1322 | height: 50px; 1323 | } 1324 | 1325 | /* unreads bars */ 1326 | .bar__7aaec, 1327 | .voiceBar__7aaec { 1328 | border: unset; 1329 | margin-bottom: 4px; 1330 | background-color: var(--background-accent); 1331 | opacity: 0.9; 1332 | } 1333 | .top__7aaec, 1334 | .unreadTop__629e4 { 1335 | top: 0; 1336 | } 1337 | .bottom__7aaec, 1338 | .unreadBottom__629e4 { 1339 | bottom: 0; 1340 | } 1341 | 1342 | /* invites */ 1343 | .wrapper_d5f3cd { 1344 | background-color: var(--background-secondary); 1345 | border: unset; 1346 | } 1347 | 1348 | /* forums */ 1349 | .container__01ae2 { 1350 | border-top: unset; 1351 | background: var(--bg-overlay-app-frame, var(--background-base-lowest)); 1352 | box-sizing: unset; 1353 | } 1354 | .floating__01ae2 { 1355 | border-left: 1px solid var(--background-secondary); 1356 | width: 400px !important; 1357 | z-index: 103; 1358 | } 1359 | .card_f369db { 1360 | padding-bottom: 8px; 1361 | } 1362 | .grid_f369db > div:first-child, 1363 | .headerRow_f369db, 1364 | .list_f369db > div:first-child { 1365 | min-width: 400px; 1366 | padding-right: var(--spacing-16); 1367 | } 1368 | .list_f369db .header_f369db { 1369 | margin-top: 24px; 1370 | } 1371 | .tagsContainer_f369db { 1372 | padding-top: 24px; 1373 | } 1374 | .mainCard_f369db { 1375 | background: var(--bg-mod-faint); 1376 | border: 1px solid transparent; 1377 | } 1378 | .container_faa96b { 1379 | padding: 12px; 1380 | } 1381 | .container_faa96b:hover { 1382 | background-color: var(--background-modifier-active) !important; 1383 | box-shadow: var(--elevation-high) !important; 1384 | transform: translateY(-2px) !important; 1385 | } 1386 | .container_faa96b.isOpen_faa96b { 1387 | background-color: var(--background-modifier-selected); 1388 | border: unset; 1389 | box-shadow: var(--shadow-low) !important; 1390 | } 1391 | .container__5808f { 1392 | background-color: var(--background-floating); 1393 | border-radius: var(--radius-xs); 1394 | box-shadow: var(--elevation-high); 1395 | padding: 8px; 1396 | } 1397 | .pill_a2c9e8 { 1398 | background-color: var(--background-secondary-alt); 1399 | border: 1px solid transparent; 1400 | color: var(--text-normal); 1401 | } 1402 | .pill_a2c9e8.clickable_a2c9e8:not(.disabled_a2c9e8):hover { 1403 | background-color: var(--background-tertiary); 1404 | cursor: pointer; 1405 | } 1406 | .sortDropdown_f369db, 1407 | .tagsButton_f369db { 1408 | background-color: var(--background-secondary-alt); 1409 | } 1410 | :is(.sortDropdown_f369db, .tagsButton_f369db):hover { 1411 | background-color: var(--background-tertiary); 1412 | } 1413 | 1414 | /* message flash */ 1415 | .flash__03436, 1416 | .message__5126c { 1417 | border-bottom-right-radius: unset; 1418 | border-top-right-radius: unset; 1419 | } 1420 | .flash__03436[data-flash="true"], 1421 | .highlighted__5126c, 1422 | .replying__5126c { 1423 | background-color: rgba(114, 137, 218, 0.05); 1424 | } 1425 | :is(.highlighted__5126c, .replying__5126c):hover { 1426 | background-color: rgba(114, 137, 218, 0.1) !important; 1427 | } 1428 | 1429 | /* go live modal */ 1430 | .container_a55fdc { 1431 | background: unset; 1432 | box-shadow: unset; 1433 | display: flex; 1434 | flex-direction: column; 1435 | overflow: visible; 1436 | .horizontal__7c0ba > .flex__7c0ba:last-child, 1437 | .horizontal__7c0ba > .flexChild__7c0ba:last-child { 1438 | margin-top: -5px; 1439 | } 1440 | .headerDescription_a55fdc { 1441 | color: var(--text-normal) !important; 1442 | margin-top: -1px; 1443 | } 1444 | } 1445 | .modalSize_a55fdc { 1446 | margin-top: -0.5px; 1447 | width: 410px; 1448 | .sizeSmall__201d5 { 1449 | width: 90px; 1450 | height: 36px; 1451 | } 1452 | .cancelButton_a55fdc { 1453 | margin-right: 180px; 1454 | background: var(--button-secondary-background); 1455 | } 1456 | .modalFooter_a55fdc .button__201d5:not([type="submit"], .lookLink__201d5) { 1457 | display: none; 1458 | } 1459 | } 1460 | .segmentContainer_a2de16 { 1461 | margin: unset; 1462 | padding: unset; 1463 | } 1464 | .segmentControl_a2de16 { 1465 | padding: 0 16px; 1466 | } 1467 | .segmentControlOption_a2de16 { 1468 | align-items: unset; 1469 | display: unset; 1470 | flex: unset; 1471 | justify-content: unset; 1472 | margin-left: unset; 1473 | margin-right: 20px; 1474 | padding-bottom: 8px; 1475 | padding-top: 0; 1476 | } 1477 | .sourceScroller_a2de16 { 1478 | height: 300px; 1479 | } 1480 | .sourceContainer_a2de16 { 1481 | padding: 0px; 1482 | } 1483 | .tile_a2de16 { 1484 | padding: unset; 1485 | margin-top: 12px; 1486 | .sourceThumbnail_a2de16 { 1487 | height: 96px; 1488 | width: 170px; 1489 | border-radius: 4px; 1490 | } 1491 | } 1492 | .qualitySettingsContainer_c6d3dc { 1493 | border-radius: 4px; 1494 | border: 1px solid var(--background-tertiary); 1495 | } 1496 | .refreshedArt_a55fdc { 1497 | content: url(https://static.discord.com/assets/3d0b430b1bae9f90.svg) !important; 1498 | display: inline-block; 1499 | height: var(--custom-go-live-modal-art-height); 1500 | margin: -60px auto 0; 1501 | width: 200px; 1502 | transform: scale(1.4) translateX(-9px); 1503 | } 1504 | 1505 | /* voice panel */ 1506 | .container_e131a9 { 1507 | .labelWrapper__06d62 .text-md\/medium_cf4812 { 1508 | font-size: 14px !important; 1509 | font-weight: 600; 1510 | } 1511 | } 1512 | .rtcConnectionStatusWrapper__06d62 .text-sm\/medium_cf4812.lineClamp1__4bd52 { 1513 | font-size: 12px !important; 1514 | color: var(--header-secondary) !important; 1515 | } 1516 | .rtcConnectionStatusConnected__06d62 { 1517 | color: var(--text-positive); 1518 | } 1519 | 1520 | .wrapper_cb9592:has(.idle__2f4f7), 1521 | .wrapper_cb9592:is(.video_cb9592) { 1522 | z-index: 102; 1523 | } 1524 | 1525 | /* hide idle call background */ 1526 | .gradientBackground__11664, 1527 | .gradientBackground__41626 { 1528 | display: none; 1529 | } 1530 | 1531 | /* fix notice positioning */ 1532 | .notice__6e2b9, 1533 | #bd-notices { 1534 | box-shadow: var(--elevation-low); 1535 | margin-top: 22px; 1536 | margin-bottom: -38px; 1537 | grid-area: channelsList / channelsList / channelsList / page; 1538 | } 1539 | .base_c48ade:has(.notice__6e2b9, .bd-notice) .trailing_c38106 { 1540 | top: 89px; 1541 | .winButtons_c38106 { 1542 | bottom: 73px; 1543 | } 1544 | } 1545 | .base_c48ade:has(.notice__6e2b9, .bd-notice) :is(.sidebarList_c48ade, .page_c48ade) { 1546 | margin-top: 37px; 1547 | } 1548 | .page_c48ade { 1549 | height: auto; 1550 | } 1551 | 1552 | .section__00943 { 1553 | background: #2f3136; 1554 | } 1555 | 1556 | /* polls */ 1557 | .container__0be77 { 1558 | background-color: var(--deprecated-card-editable-bg); 1559 | border: unset; 1560 | .buttonPresentation__0be77 { 1561 | border: unset; 1562 | } 1563 | } 1564 | .container_f69538 { 1565 | background-color: var(--background-secondary); 1566 | border-radius: 3px; 1567 | border: unset; 1568 | } 1569 | 1570 | /* call background */ 1571 | .wrapper_cb9592.minimum_cb9592 .callContainer_cb9592 { 1572 | background: #202225; 1573 | } 1574 | 1575 | /* friends tab wumpus */ 1576 | .addFriendWumpusWrapper__72ba7 { 1577 | display: none; 1578 | } 1579 | .addFriendInputWrapper__72ba7:focus-within { 1580 | border: 1px solid var(--deprecated-text-input-border); 1581 | } 1582 | 1583 | /* inbox */ 1584 | .container__2692d, 1585 | .container_fc561d, 1586 | .recentMentionsPopout__95796 { 1587 | background-color: var(--background-secondary); 1588 | .header__45690 { 1589 | border-bottom: unset; 1590 | } 1591 | .header_ab6641 { 1592 | padding: 0 var(--space-md) 0; 1593 | } 1594 | .inboxTitle_ab6641, 1595 | .inboxIcon_ab6641 { 1596 | display: none; 1597 | } 1598 | .controls_ab6641 { 1599 | margin-bottom: -65px; 1600 | .friendRequestsButton__523aa { 1601 | background-color: var(--background-tertiary); 1602 | color: var(--interactive-normal); 1603 | } 1604 | } 1605 | .top_b3f026 .item_b3f026.brand_b3f026 { 1606 | --selected-tab-item-color: unset; 1607 | } 1608 | .tabBar_ab6641 { 1609 | margin-left: 16px; 1610 | .tab_ab6641 { 1611 | padding: 8px 8px; 1612 | margin: 0 8px; 1613 | height: 10px; 1614 | margin-top: 4px; 1615 | margin-bottom: 20px; 1616 | border-radius: 4px; 1617 | background-color: var(--background-primary); 1618 | } 1619 | .tab_ab6641:is(.selected_b3f026) { 1620 | background-color: var(--background-accent); 1621 | } 1622 | .tab_ab6641:nth-of-type(3) { 1623 | order: -2; 1624 | } 1625 | .tab_ab6641:nth-of-type(2) { 1626 | order: -1; 1627 | } 1628 | } 1629 | .channelHeader__35a7e { 1630 | background-color: var(--background-secondary); 1631 | } 1632 | .primary__06eda { 1633 | background-color: var(--background-primary); 1634 | color: var(--interactive-normal); 1635 | } 1636 | .secondary__06eda { 1637 | background-color: var(--background-secondary); 1638 | color: var(--interactive-normal); 1639 | } 1640 | .tertiary__06eda { 1641 | background-color: var(--background-tertiary); 1642 | color: var(--interactive-normal); 1643 | } 1644 | .messages__1ccd1 { 1645 | background-color: var(--background-primary); 1646 | border: unset; 1647 | } 1648 | .messageContainer__95796 { 1649 | background-color: var(--background-primary); 1650 | border: unset; 1651 | } 1652 | .container__0f711 { 1653 | background-color: var(--background-secondary); 1654 | } 1655 | } 1656 | 1657 | /* stupid header bars */ 1658 | .container_d08938, 1659 | .outerContainer_e1147e, 1660 | .applicationStore_f07d62, 1661 | .libraryHeader__5a895, 1662 | .chat_f75fb0:has(.pageBody__41ed7) { 1663 | z-index: 102; 1664 | } 1665 | 1666 | .changelog_eae0ef, 1667 | .safetyChecklist_eae0ef { 1668 | background-color: var(--background-secondary); 1669 | } 1670 | .auditLog__43dab { 1671 | background-color: rgba(32, 34, 37, 0.3); 1672 | padding: unset; 1673 | border-radius: 3px; 1674 | border-color: #202225; 1675 | .headerClickable__43dab { 1676 | padding: 10px 20px 10px 10px; 1677 | } 1678 | .headerExpanded__43dab { 1679 | background-color: rgba(32, 34, 37, 0.3); 1680 | } 1681 | .divider__43dab { 1682 | background-color: var(--background-nested-floating); 1683 | } 1684 | } 1685 | .footerPlaceholder__98b95 { 1686 | .card_dc2e44 { 1687 | border-color: var(--background-secondary-alt); 1688 | border-radius: 5px; 1689 | } 1690 | } 1691 | 1692 | /* the pin broke */ 1693 | .primaryButton__468a6, 1694 | .secondaryButton__468a6 { 1695 | flex: 1 1 45%; 1696 | } 1697 | .title__468a6, 1698 | .body__468a6 { 1699 | text-align: center; 1700 | } 1701 | .modalContent__468a6 { 1702 | padding-bottom: 20px; 1703 | } 1704 | .form__468a6:has(.alignCenter_abf706) .separator__49fc1 { 1705 | box-shadow: unset; 1706 | align-self: center; 1707 | } 1708 | .form__468a6:has(.alignCenter_abf706) .footer__49fc1 .primaryButton__468a6.sizeMedium__201d5 { 1709 | height: 50px; 1710 | } 1711 | .title__468a6.defaultColor__5345c.heading-lg\/semibold_cf4812.defaultColor__4bd52 { 1712 | align-self: center; 1713 | } 1714 | 1715 | /* quick switcher */ 1716 | .quickswitcher_ac6cb0 { 1717 | background-color: var(--background-secondary); 1718 | box-shadow: 0 2px 10px var(--opacity-black-20), 0 0 0 1px #1c242b99; 1719 | border: unset; 1720 | .input_ac6cb0 { 1721 | background-color: var(--deprecated-quickswitcher-input-background); 1722 | border: none; 1723 | border-radius: 5px; 1724 | box-shadow: var(--elevation-high); 1725 | } 1726 | .input_ac6cb0::placeholder { 1727 | font-weight: 600; 1728 | color: #dcddde; 1729 | opacity: 0.5; 1730 | } 1731 | } 1732 | 1733 | /* server banner images */ 1734 | .bannerImage_f37cb1, .bannerImg_f37cb1 { 1735 | width: 240px; 1736 | aspect-ratio: unset; 1737 | } 1738 | } 1739 | 1740 | :where(.visual-refresh) .item__001a7, 1741 | :where(.visual-refresh) .item__001a7[aria-checked="true"], 1742 | :where(.visual-refresh) .itemFilled__001a7[aria-checked="true"], 1743 | :where(.visual-refresh) .radioBar__001a7 { 1744 | border-radius: 5px; 1745 | } 1746 | /*ttitle bar. and stufuff. i guess*/ 1747 | .bar_c38106:not(.systemBar_c38106):not(:has(.channelTabs-trailing)) { 1748 | padding: 0 12px 0 !important; 1749 | height: 50px; 1750 | margin-top: -33px; 1751 | } 1752 | .bar_c38106 .title_c38106 { 1753 | text-align: start; 1754 | display: block; 1755 | position: absolute; 1756 | margin-bottom: 30px; 1757 | background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 -2.38419e-7 52.99 10'%3E%3Cpath d=' M3.57642276,0.141304348 L0,0.141304348 L0,4.22826087 L2.38069106,6.40217391 L2.38069106,2.43478261 L3.66260163,2.43478261 C4.47052846,2.43478261 4.86910569,2.83695652 4.86910569,3.4673913 L4.86910569,6.5 C4.86910569,7.13043478 4.49207317,7.55434783 3.66260163,7.55434783 L0,7.55434783 L0,9.85869565 L3.57642276,9.85869565 C5.49390244,9.86956522 7.29288618,8.90217391 7.29288618,6.66304348 L7.29288618,3.39130435 C7.29288618,1.13043478 5.49390244,0.141304348 3.57642276,0.141304348 Z M22.3310976,6.67391304 L22.3310976,3.32608696 C22.3310976,2.11956522 24.4640244,1.83695652 25.1103659,3.05434783 L27.0817073,2.23913043 C26.3168699,0.510869565 24.8949187,0 23.7207317,0 C21.803252,0 19.9073171,1.13043478 19.9073171,3.32608696 L19.9073171,6.67391304 C19.9073171,8.88043478 21.803252,10 23.6776423,10 C24.8841463,10 26.3276423,9.39130435 27.1247967,7.81521739 L25.0134146,6.82608696 C24.4963415,8.17391304 22.3310976,7.84782609 22.3310976,6.67391304 Z M15.8030488,3.7826087 C15.0597561,3.61956522 14.5642276,3.34782609 14.5319106,2.88043478 C14.575,1.75 16.2878049,1.7173913 17.2896341,2.79347826 L18.8731707,1.55434783 C17.8821138,0.326086957 16.7617886,0 15.598374,0 C13.8424797,0 12.1404472,1 12.1404472,2.91304348 C12.1404472,4.77173913 13.5408537,5.76086957 15.0813008,6 C15.8676829,6.10869565 16.7402439,6.42391304 16.7186992,6.97826087 C16.654065,8.02173913 14.5426829,7.9673913 13.5839431,6.7826087 L12.0650407,8.23913043 C12.9591463,9.40217391 14.1764228,10 15.3182927,10 C17.074187,10 19.0239837,8.9673913 19.0993902,7.08695652 C19.2071138,4.69565217 17.5050813,4.09782609 15.8030488,3.7826087 Z M8.59634146,9.85869565 L11.0093496,9.85869565 L11.0093496,0.141304348 L8.59634146,0.141304348 L8.59634146,9.85869565 Z M49.2835366,0.141304348 L45.7071138,0.141304348 L45.7071138,4.22826087 L48.0878049,6.40217391 L48.0878049,2.43478261 L49.3589431,2.43478261 C50.1668699,2.43478261 50.5654472,2.83695652 50.5654472,3.4673913 L50.5654472,6.5 C50.5654472,7.13043478 50.1884146,7.55434783 49.3589431,7.55434783 L45.6963415,7.55434783 L45.6963415,9.85869565 L49.2727642,9.85869565 C51.1902439,9.86956522 52.9892276,8.90217391 52.9892276,6.66304348 L52.9892276,3.39130435 C53,1.13043478 51.2010163,0.141304348 49.2835366,0.141304348 Z M31.7353659,0 C29.753252,0 27.7819106,1.09782609 27.7819106,3.33695652 L27.7819106,6.66304348 C27.7819106,8.89130435 29.7640244,10 31.7569106,10 C33.7390244,10 35.7103659,8.89130435 35.7103659,6.66304348 L35.7103659,3.33695652 C35.7103659,1.10869565 33.7174797,0 31.7353659,0 Z M33.2865854,6.66304348 C33.2865854,7.35869565 32.5109756,7.7173913 31.7461382,7.7173913 C30.9705285,7.7173913 30.1949187,7.36956522 30.1949187,6.66304348 L30.1949187,3.33695652 C30.1949187,2.61956522 30.9489837,2.23913043 31.7030488,2.23913043 C32.4894309,2.23913043 33.2865854,2.58695652 33.2865854,3.33695652 L33.2865854,6.66304348 Z M44.3605691,3.33695652 C44.3067073,1.05434783 42.7770325,0.141304348 40.8056911,0.141304348 L36.9815041,0.141304348 L36.9815041,9.86956522 L39.4268293,9.86956522 L39.4268293,6.77173913 L39.8577236,6.77173913 L42.0768293,9.85869565 L45.0930894,9.85869565 L42.4861789,6.52173913 C43.6495935,6.15217391 44.3605691,5.14130435 44.3605691,3.33695652 Z M40.8487805,4.65217391 L39.4268293,4.65217391 L39.4268293,2.43478261 L40.8487805,2.43478261 C42.3784553,2.43478261 42.3784553,4.65217391 40.8487805,4.65217391 Z%0A' fill='%2372767d'/%3E%3C/svg%3E"); 1758 | background-repeat: no-repeat; 1759 | transform: translateY(40px) translateX(12px) scale(1.01); 1760 | width: 52px; 1761 | .text-sm\/medium_cf4812 { 1762 | display: none; 1763 | } 1764 | svg { 1765 | display: none; 1766 | } 1767 | .guildIcon__85643 { 1768 | display: none; 1769 | } 1770 | } 1771 | .bar_c38106 .trailing_c38106 { 1772 | top: 51px; 1773 | gap: 8px; 1774 | z-index: 102; 1775 | } 1776 | .bar_c38106 .channelTabs-trailing .trailing_c38106 { 1777 | top: 44px; 1778 | right: 10px; 1779 | } 1780 | .channelTabs-trailing .winButtons_c38106 { 1781 | position: absolute; 1782 | top: -53px; 1783 | right: 6px; 1784 | & .winButton_c38106 { 1785 | width: var(--custom-app-top-bar-height); 1786 | height: var(--custom-app-top-bar-height); 1787 | padding-left: 10px; 1788 | padding-right: 10px; 1789 | } 1790 | } 1791 | #channelTabs-settingsMenu { 1792 | position: relative; 1793 | right: 20px; 1794 | } 1795 | .container__01ae2 > .container__9293f { 1796 | z-index: 102; 1797 | } 1798 | .bar_c38106 .trailing_c38106 .iconWrapper__9293f { 1799 | width: 30px; 1800 | height: 30px; 1801 | border-radius: 4px; 1802 | } 1803 | .bar_c38106 .trailing_c38106 .iconWrapper__9293f .icon__9293f { 1804 | width: 24px; 1805 | height: 24px; 1806 | } 1807 | 1808 | .bar_c38106 .trailing_c38106 .iconWrapper__9293f.selected__9293f .icon__9293f { 1809 | opacity: 1; 1810 | } 1811 | .bar_c38106 .trailing_c38106 .iconWrapper__9293f > svg > foreignObject { 1812 | x: -2px; 1813 | y: -2px; 1814 | mask: none !important; 1815 | } 1816 | 1817 | html .bar_c38106 { 1818 | top: 0; 1819 | right: 0; 1820 | z-index: 102; 1821 | } 1822 | .inviteToolbar__133bf > .clickable__9293f.iconWrapper__9293f { 1823 | right: 90px; 1824 | flex-wrap: wrap; 1825 | } 1826 | .inviteToolbar__133bf .iconWrapper__9293f:after { 1827 | border-left: 1px solid var(--border-subtle); 1828 | content: ""; 1829 | margin-left: 55px; 1830 | margin-top: -29px; 1831 | height: calc(var(--custom-app-top-bar-height) - var(--space-12)); 1832 | } 1833 | .winButtons_c38106 { 1834 | position: absolute; 1835 | gap: unset; 1836 | justify-content: center; 1837 | bottom: 35px; 1838 | left: -12px; 1839 | z-index: 3001; 1840 | -webkit-app-region: no-drag !important; 1841 | .winButton_c38106 { 1842 | align-items: center; 1843 | width: 28px; 1844 | height: 23px; 1845 | } 1846 | } 1847 | .winButtonsWithDivider_c38106:before { 1848 | border: unset; 1849 | } 1850 | .systemBar_c38106 { 1851 | background-color: var(--background-tertiary); 1852 | min-height: 22px; 1853 | .winButtons_c38106 { 1854 | bottom: 39px; 1855 | left: -84px; 1856 | } 1857 | .platform-linux & { 1858 | display: none; 1859 | } 1860 | } 1861 | .channelTabs-tabContainer div { 1862 | margin-bottom: 0 !important; 1863 | } 1864 | /* server list */ 1865 | .base_c48ade .sidebar_c48ade > .guilds_c48ade { 1866 | width: 72px; 1867 | .scroller_ef3116 { 1868 | padding-top: 2px; 1869 | gap: 0px !important; 1870 | ul.stack_dbd263 { 1871 | height: auto !important; 1872 | } 1873 | } 1874 | .listItem__650eb:has(.guildSeparator__252b6) { 1875 | margin: 6px 0 8px 0; 1876 | } 1877 | .listItem__650eb { 1878 | margin: 0 0 0px; 1879 | } 1880 | .guildSeparator__252b6 { 1881 | height: 2px; 1882 | } 1883 | .folderIcon__48112 { 1884 | margin-top: 0px; 1885 | margin-left: -1px; 1886 | & svg { 1887 | width: 24px; 1888 | height: 24px; 1889 | } 1890 | } 1891 | } 1892 | .folderGroup__48112 { 1893 | --custom-folder-preview-padding: 6px; 1894 | --custom-folder-color: #7289da; 1895 | } 1896 | .folderGroup__48112:not(.isExpanded__48112) .folderIcon__48112 svg { 1897 | display: none; 1898 | } 1899 | .folderGroupBackground__48112 { 1900 | left: 11px; 1901 | width: 48px; 1902 | bottom: 4px; 1903 | border-radius: 16px 16px 25px 25px; 1904 | background: var(--background-modifier-accent); 1905 | border: none; 1906 | } 1907 | .folderIconWrapper__48112 { 1908 | width: 48px; 1909 | height: 48px; 1910 | overflow: hidden; 1911 | border-radius: 16px; 1912 | --bg-mod-subtle: rgba(114, 137, 218, 0.4) !important; 1913 | } 1914 | .expandedFolderIconWrapper__48112 { 1915 | margin: 0; 1916 | width: 48px; 1917 | height: 48px; 1918 | } 1919 | .folderGroup__48112:is(.isExpanded__48112) .folderPreviewWrapper__48112 { 1920 | display: none; 1921 | } 1922 | .folderPreviewGuildIcon__48112 { 1923 | border-radius: 32px !important; 1924 | } 1925 | 1926 | .listItem__650eb:has(.circleIcon__5bc7e) { 1927 | margin: 6px 0 0 !important; 1928 | .circleIconButton__5bc7e { 1929 | border-radius: 50%; 1930 | width: 48px; 1931 | height: 48px; 1932 | } 1933 | } 1934 | .guildsError_e8d03f { 1935 | width: 48px; 1936 | height: 48px; 1937 | background: (rgba(240, 71, 71, 0.1)); 1938 | border-color: var(--red); 1939 | &:hover { 1940 | background: var(--red); 1941 | } 1942 | } 1943 | .mention__3b95d { 1944 | box-sizing: border-box; 1945 | opacity: 0.9; 1946 | border: unset; 1947 | box-shadow: unset; 1948 | right: 1px; 1949 | } 1950 | 1951 | .sidebar_c48ade:after { 1952 | display: none; 1953 | } 1954 | 1955 | /* fix unread dm gap */ 1956 | .stack_dbd263#guild-list-unread-dms { 1957 | gap: 16px !important; 1958 | padding-bottom: 10px !important; 1959 | } 1960 | 1961 | /* hides left sidebar when fullscreen mode */ 1962 | .base_c48ade[data-fullscreen="true"] { 1963 | .sidebar_c48ade { 1964 | display: none; 1965 | } 1966 | } 1967 | 1968 | .spriteContainer__04eed { 1969 | --custom-emoji-sprite-size: 24px !important; 1970 | } 1971 | -------------------------------------------------------------------------------- /src/components/showEffects.css: -------------------------------------------------------------------------------- 1 | /*make cosmetics show again*/ 2 | .avatarDecoration__44b0c,.avatarDecoration_c19a55,.profileEffects__01370,.mask__68edb,.nameplated__91a9d{ 3 | display: unset !important; 4 | } 5 | .animatorTop_faf9c0 .mask__68edb{ 6 | display: none !important 7 | } 8 | /*adjust profile effect opacity*/ 9 | .profileEffects__01370{ 10 | opacity: 0.2 11 | } 12 | .bannerColor_fb7f94{ 13 | background: #00000085 !important 14 | } 15 | 16 | /*move that weird circle to the middle*/ 17 | .mask__68edb mask circle{ 18 | transform: translateX(69.5px); 19 | } 20 | :has(.custom-theme-background) .mask__68edb mask circle{ 21 | transform: translateX(73px) translateY(5px); 22 | } 23 | .user-profile-modal .mask__68edb mask circle{ 24 | display: none !important 25 | } 26 | .user-profile-modal-v2 .mask__68edb mask circle{ 27 | display: none !important 28 | } 29 | /*fix some overlaying stuff*/ 30 | .header__5be3e{ 31 | z-index: 2 32 | } 33 | /*make banners not so zoomed-in*/ 34 | .userPopoutOuter_c69a7b .banner__68edb{ 35 | max-width: 250px; 36 | } 37 | 38 | /*fix for reaction stuff*/ 39 | .avatar__75742{ 40 | position: absolute !important; 41 | top: 53px !important; 42 | } 43 | /*move usernames etc. a bit down*/ 44 | .outer_c0bea0:is(.user-profile-popout.outer_c0bea0) .container__63ed3{ 45 | padding-top: 44px; 46 | } 47 | .user-profile-popout .container_ab8609 { 48 | top: 140px 49 | } 50 | .user-profile-popout.outer_c0bea0:has(.pronouns__63ed3) .container_ab8609 { 51 | top: 157px !important; 52 | } 53 | 54 | /*add colors back (but without that annoying border ew)*/ 55 | .custom-profile-theme .user-profile-popout .inner_c0bea0{ 56 | --profile-gradient-overlay-color: rgb(0 0 0 / 40%); 57 | background: linear-gradient(color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-primary-color)),color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-primary-color)),color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-secondary-color))) !important; 58 | & .container__63ed3,.mutuals__530ce { 59 | background: var(--play, linear-gradient(color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-primary-color)),color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-primary-color)),color-mix(in oklab,var(--profile-gradient-overlay-color)100%,var(--profile-gradient-secondary-color)))) !important 60 | } 61 | } 62 | 63 | 64 | .custom-profile-theme .footer__5be3e .themedBackground__74017{ 65 | background: var(--profile-gradient-overlay-color) !important 66 | } 67 | 68 | 69 | /* banners behind headers */ 70 | .user-profile-modal .inner_c0bea0 .mask__68edb { 71 | position: absolute; 72 | z-index: 0; 73 | opacity: 25%; 74 | mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); 75 | } 76 | .user-profile-modal .inner_c0bea0 .headerInner__24502 { 77 | background: transparent !important; 78 | } 79 | 80 | .user-profile-modal.inner_c0bea0:has(.mask__68edb) .body__24502 { 81 | & .fullSizeOverlayBackground_c69a7b { 82 | z-index: 2; 83 | } 84 | & .container__63ed3 { 85 | background: transparent !important; 86 | } 87 | } 88 | /* banners behind headers (profilesv2) */ 89 | .user-profile-modal-v2 .inner_c0bea0 .mask__68edb { 90 | position: absolute; 91 | z-index: 0; 92 | opacity: 25%; 93 | mask-image: linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,0)); 94 | } 95 | .user-profile-modal-v2 .inner_c0bea0 .headerInner__24502 { 96 | background: transparent !important; 97 | } 98 | 99 | .user-profile-modal-v2:has(.mask__68edb) { 100 | :is(.profileButtons__9c3be, .tabBar__37bfc) { 101 | z-index: 2; 102 | } 103 | :where(.banner__68edb) { 104 | border-radius: 0px; 105 | } 106 | } 107 | 108 | /* tinted text & profile */ 109 | .inner_c0bea0:is(.user-profile-popout, .user-profile-modal) 110 | .outer_c0bea0.user-profile-modal, 111 | .custom-profile-theme { 112 | --theme-base-color-amount: 50% !important; 113 | --theme-text-color-amount: 25% !important; 114 | } 115 | 116 | /* apply ONLY if they have an avatar deco*/ 117 | .user-profile-popout div:has(.avatarDecoration__44b0c) .avatar__75742 { 118 | position: absolute !important; 119 | top: 31px !important; 120 | } 121 | 122 | .accountProfileCard__1fed1 :is(.banner__68edb, .mask__68edb) { 123 | display: none !important; 124 | } 125 | 126 | /* clan tags */ 127 | .guildTagContainer__63ed3, 128 | .clanTagChiplet_c19a55, 129 | .chipletContainerInline__4a25c, 130 | .chipletContainerInline__10651, 131 | .chipletContainerInner__10651, 132 | .clanTag__5d473 { 133 | display: unset !important; 134 | } 135 | -------------------------------------------------------------------------------- /src/components/vars.css: -------------------------------------------------------------------------------- 1 | .theme-dark:not(html.custom-theme-background, :has(#clientThemeVars),.theme-darker,.theme-midnight) { 2 | --autocomplete-bg: color-mix(in oklab, var(--primary-630) 100%, var(--theme-base-color, #000) var(--theme-base-color-amount, 0%)); 3 | --chat-background-default: hsl(218, calc(var(--saturation-factor, 1) * 8%), 27%); 4 | --header-primary: var(--white-500); 5 | --header-secondary: #b9bbbe; 6 | --channels-default: #8e9297; 7 | --interactive-normal: #b9bbbe; 8 | --interactive-hover: #dcddde; 9 | --interactive-active: var(--white-500); 10 | --interactive-muted: hsl(217, calc(var(--saturation-factor, 1) * 8%), 34%); 11 | --background-primary: hsl(220, calc(var(--saturation-factor, 1) * 8%), 23%); 12 | --modal-background: var(--background-primary); 13 | --primary-600: var(--background-primary); 14 | --primary-630: var(--background-secondary); 15 | --background-secondary: hsl(223, calc(var(--saturation-factor, 1) * 7%), 20%); 16 | --background-secondary-alt: hsl(220, calc(var(--saturation-factor, 1) * 7%), 17%); 17 | --background-tertiary: hsl(216, calc(var(--saturation-factor, 1) * 7%), 14%); 18 | --background-accent: hsl(217, calc(var(--saturation-factor, 1) * 8%), 34%); 19 | --background-floating: #18191c; 20 | --background-modifier-hover: #4f545c29; 21 | --background-modifier-active: #4f545c3d; 22 | --background-modifier-selected: #4f545c52; 23 | --background-modifier-accent: #ffffff0f; 24 | --background-mentioned: hsla(38, calc(var(--saturation-factor, 1) * 96%), 54%, 0.051); 25 | --background-mentioned-hover: hsla(38, calc(var(--saturation-factor, 1) * 96%), 54%, 0.078); 26 | --background-message-hover: #04040512; 27 | --background-help-warning: hsla(38, calc(var(--saturation-factor, 1) * 96%), 54%, 0.102); 28 | --background-help-info: #00b0f41a; 29 | --scrollbar-thin-thumb: #202225; 30 | --scrollbar-thin-track: transparent; 31 | --scrollbar-auto-thumb: #202225; 32 | --scrollbar-auto-track: #2e3338; 33 | --scrollbar-auto-scrollbar-color-thumb: #202225; 34 | --scrollbar-auto-scrollbar-color-track: #2f3136; 35 | --elevation-stroke: 0 0 0 1px #04040526; 36 | --elevation-low: 0 1px 0 #04040533, 0 1.5px 0 #0606070d, 0 2px 0 #0404050d; 37 | --elevation-medium: 0 4px 4px #00000029; 38 | --elevation-high: 0 8px 16px #0000003d; 39 | 40 | --legacy-elevation-low: 0 1px 5px 0 hsl(var(--black-500-hsl) / 0.3); 41 | --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.2); 42 | --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-700-hsl) / 0.6); 43 | 44 | --logo-primary: var(--white-500); 45 | --focus-primary: var(--brand-experiment); 46 | --deprecated-card-bg: hsla(216, calc(var(--saturation-factor, 1) * 7%), 14%, 0.6); 47 | --deprecated-card-editable-bg: #2022254d; 48 | --deprecated-store-bg: var(--background-primary); 49 | --deprecated-quickswitcher-input-background: #72767d; 50 | --deprecated-quickswitcher-input-placeholder: #ffffff4d; 51 | --deprecated-text-input-bg: #0000001a; 52 | --deprecated-text-input-border: #0000004d; 53 | --deprecated-text-input-border-hover: #040405; 54 | --deprecated-text-input-border-disabled: #202225; 55 | --deprecated-text-input-prefix: #dcddde; 56 | --button-secondary-background: #4f545c; 57 | --button-secondary-background-hover: #72767d; 58 | --button-secondary-background-active: #72767d; 59 | --primary-transparent: #ffffff1a; 60 | 61 | --search-popout-option-user-nickname: var(--text-normal); 62 | --search-popout-option-user-username: var(--text-muted); 63 | --search-popout-option-filter-text: var(--primary-400); 64 | --search-popout-option-non-text-color: #caccce; 65 | --search-popout-option-filter-color: #caccce; 66 | --search-popout-option-answer-color: #caccce; 67 | --search-popout-date-picker-border: 1px solid hsl(228 calc(1*6.667%) 14.706% /0.3); 68 | --search-popout-date-picker-hint-text: #caccce; 69 | --search-popout-date-picker-hint-value-text: #fff; 70 | --search-popout-date-picker-hint-value-background: var(--brand-500); 71 | --search-popout-date-picker-hint-value-background-hover: var(--brand-430); 72 | 73 | --shadow-border: 0 0 0 1px hsl(none 0% 100%/0.08); 74 | --shadow-border-filter: drop-shadow(0 0 1px hsl(none 0% 100%/0.08)); 75 | --shadow-button-overlay: 0 12px 24px 0 hsl(none 0% 0%/0.24); 76 | --shadow-button-overlay-filter: drop-shadow(0 12px 24px hsl(none 0% 0%/0.24)); 77 | --shadow-high: 0 12px 24px 0 hsl(none 0% 0%/0.24); 78 | --shadow-high-filter: drop-shadow(0 12px 24px hsl(none 0% 0%/0.24)); 79 | --shadow-ledge: 0 2px 0 0 hsl(none 0% 0%/0.05), 0 1.5px 0 0 hsl(none 0% 0%/0.05), 0 1px 0 0 hsl(none 0% 0%/0.16); 80 | --shadow-ledge-filter: drop-shadow(0 1.5px 0 hsl(none 0% 0%/0.24)); 81 | --shadow-low: 0 1px 4px 0 hsl(none 0% 0%/0.14); 82 | --shadow-low-filter: drop-shadow(0 1px 4px hsl(none 0% 0%/0.14)); 83 | --shadow-low-active: 0 0 4px 0 hsl(none 0% 0%/0.14); 84 | --shadow-low-active-filter: drop-shadow(0 0 4px hsl(none 0% 0%/0.14)); 85 | --shadow-low-hover: 0 4px 10px 0 hsl(none 0% 0%/0.14); 86 | --shadow-low-hover-filter: drop-shadow(0 4px 10px hsl(none 0% 0%/0.14)); 87 | --shadow-medium: 0 4px 8px 0 hsl(none 0% 0%/0.16); 88 | --shadow-medium-filter: drop-shadow(0 4px 8px hsl(none 0% 0%/0.16)); 89 | --shadow-mobile-navigator-x: 0 0 10px 0 hsl(none 0% 0%/0.22); 90 | --shadow-mobile-navigator-x-filter: drop-shadow(0 0 10px hsl(none 0% 0%/0.22)); 91 | --shadow-top-high: 0 -12px 32px 0 hsl(none 0% 0%/0.24); 92 | --shadow-top-high-filter: drop-shadow(0 -12px 32px hsl(none 0% 0%/0.24)); 93 | --shadow-top-ledge: 0 -2px 0 0 hsl(none 0% 0%/0.05), 0 -1.5px 0 0 hsl(none 0% 0%/0.05), 0 -1px 0 0 hsl(none 0% 0%/0.16); 94 | --shadow-top-ledge-filter: drop-shadow(0 -1.5px 0 hsl(none 0% 0%/0.24)); 95 | --shadow-top-low: 0 -1px 4px 0 hsl(none 0% 0%/0.14); 96 | --shadow-top-low-filter: drop-shadow(0 -1px 4px hsl(none 0% 0%/0.14)); 97 | --text-muted: #72767d; 98 | } 99 | 100 | .theme-light:not(html.custom-theme-background, :has(#clientThemeVars)) { 101 | --chat-background-default: #ebedef; 102 | --background-modifier-accent: #06060714; 103 | --background-mentioned: hsla(38, calc(var(--saturation-factor, 1) * 96%), 54%, 0.1); 104 | --background-mentioned-hover: hsla(38, calc(var(--saturation-factor, 1) * 96%), 54%, 0.2); 105 | --background-message-hover: rgba(6, 6, 7, 0.02); 106 | --elevation-stroke: 0 0 0 1px rgba(6, 6, 7, 0.08); 107 | --elevation-low: 0 1px 0 rgba(6, 6, 7, 0.1), 0 1.5px 0 rgba(6, 6, 7, 0.025), 0 2px 0 rgba(6, 6, 7, 0.025); 108 | --elevation-medium: 0 4px 4px rgba(0, 0, 0, 0.08); 109 | --elevation-high: 0 8px 16px rgba(0, 0, 0, 0.16); 110 | 111 | --legacy-elevation-low: 0 1px 5px hsl(var(--black-500-hsl) / 0.2); 112 | --legacy-elevation-high: 0 2px 10px 0 hsl(var(--black-500-hsl) / 0.1); 113 | --legacy-elevation-border: 0 0 0 1px hsl(var(--primary-300-hsl) / 0.3); 114 | 115 | --logo-primary: var(--brand-experiment); 116 | --focus-primary: var(--brand-experiment); 117 | --radio-group-dot-foreground: hsl(227, calc(var(--saturation-factor, 1) * 31%), 44%); 118 | --primary-transparent: hsla(214, calc(var(--saturation-factor, 1) * 10%), 50%, 0.102); 119 | } 120 | body { 121 | --text-muted: #72767d; 122 | --font-primary: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif; 123 | --font-display: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif !important; 124 | --font-headline: Whitney, "Helvetica Neue", Helvetica, Arial, sans-serif; 125 | --blurple: var(--brand-experiment); 126 | --blurple-hover: hsl(227, calc(var(--saturation-factor, 1) * 44%), 59%); 127 | --blurple-active: hsl(226, calc(var(--saturation-factor, 1) * 34%), 52%); 128 | --blurple-inverted: #fff; 129 | --blurple-inverted-hover: hsl(228, calc(var(--saturation-factor, 1) * 56%), 98%); 130 | --blurple-inverted-active: hsl(229, calc(var(--saturation-factor, 1) * 60%), 93%); 131 | --text-brand: var(--blurple); 132 | --bg-brand: var(--blurple); 133 | --brand-260: var(--brand-experiment-260); 134 | --brand-360: var(--brand-experiment-360); 135 | --brand-460: var(--brand-experiment-460); 136 | --brand-500: var(--brand-experiment); 137 | --brand-new-500: var(--blurple); 138 | --brand-530: var(--brand-experiment-530); 139 | --brand-560: var(--brand-experiment-560); 140 | --brand-new-560: var(--brand-560); 141 | --brand-600: var(--brand-experiment-600); 142 | --brand-experiment-100: hsl(228, calc(var(--saturation-factor, 1) * 56%), 98%); 143 | --brand-experiment-130: hsl(228, calc(var(--saturation-factor, 1) * 63%), 97%); 144 | --brand-experiment-160: hsl(228, calc(var(--saturation-factor, 1) * 60%), 95%); 145 | --brand-experiment-200: hsl(229, calc(var(--saturation-factor, 1) * 60%), 93%); 146 | --brand-experiment-230: hsl(227, calc(var(--saturation-factor, 1) * 57%), 91%); 147 | --brand-experiment-260: hsl(226, calc(var(--saturation-factor, 1) * 59%), 89%); 148 | --brand-experiment-300: hsl(227, calc(var(--saturation-factor, 1) * 58%), 86%); 149 | --brand-experiment-330: hsl(227, calc(var(--saturation-factor, 1) * 59%), 82%); 150 | --brand-experiment-360: hsl(227, calc(var(--saturation-factor, 1) * 58%), 78%); 151 | --brand-experiment-400: hsl(226, calc(var(--saturation-factor, 1) * 58%), 72%); 152 | --brand-experiment-430: hsl(227, calc(var(--saturation-factor, 1) * 58%), 70%); 153 | --brand-experiment-460: hsl(227, calc(var(--saturation-factor, 1) * 59%), 68%); 154 | --brand-experiment: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%); 155 | --brand-experiment-500: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%); 156 | --brand-experiment-530: hsl(227, calc(var(--saturation-factor, 1) * 45%), 59%); 157 | --brand-experiment-560: hsl(227, calc(var(--saturation-factor, 1) * 35%), 53%); 158 | --brand-experiment-600: hsl(227, calc(var(--saturation-factor, 1) * 31%), 44%); 159 | --brand-experiment-630: hsl(226, calc(var(--saturation-factor, 1) * 31%), 38%); 160 | --brand-experiment-660: hsl(226, calc(var(--saturation-factor, 1) * 31%), 34%); 161 | --brand-experiment-700: hsl(227, calc(var(--saturation-factor, 1) * 31%), 26%); 162 | --brand-experiment-730: hsl(228, calc(var(--saturation-factor, 1) * 31%), 25%); 163 | --brand-experiment-760: hsl(227, calc(var(--saturation-factor, 1) * 32%), 22%); 164 | --brand-experiment-800: hsl(226, calc(var(--saturation-factor, 1) * 31%), 19%); 165 | --brand-experiment-830: hsl(225, calc(var(--saturation-factor, 1) * 32%), 15%); 166 | --brand-experiment-860: hsl(225, calc(var(--saturation-factor, 1) * 32%), 10%); 167 | --brand-experiment-900: hsl(228, calc(var(--saturation-factor, 1) * 29%), 3%); 168 | --brand-experiment-05a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 5%); 169 | --brand-experiment-10a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 10%); 170 | --brand-experiment-15a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 15%); 171 | --brand-experiment-20a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 20%); 172 | --brand-experiment-25a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 25%); 173 | --brand-experiment-30a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 30%); 174 | --brand-experiment-35a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 35%); 175 | --brand-experiment-40a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 40%); 176 | --brand-experiment-45a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 45%); 177 | --brand-experiment-50a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 50%); 178 | --brand-experiment-55a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 55%); 179 | --brand-experiment-60a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 60%); 180 | --brand-experiment-65a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 65%); 181 | --brand-experiment-70a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 70%); 182 | --brand-experiment-75a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 75%); 183 | --brand-experiment-80a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 80%); 184 | --brand-experiment-85a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 85%); 185 | --brand-experiment-90a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 90%); 186 | --brand-experiment-95a: hsl(227, calc(var(--saturation-factor, 1) * 58%), 65%, 95%); 187 | --red-inverted: hsl(0, calc(var(--saturation-factor, 1) * 80%), 98%); 188 | --red-inverted-active: hsl(0, calc(var(--saturation-factor, 1) * 85%), 92%); 189 | --yellow: hsl(38, calc(var(--saturation-factor, 1) * 96%), 54%); 190 | --yellow-360: var(--yellow); 191 | --status-yellow-560: var(--yellow); 192 | --yellow-hover: #e19517; 193 | --yellow-inverted: #fffbf4; 194 | --yellow-inverted-active: #feedd1; 195 | --green-inverted: #f6fbf9; 196 | --green-inverted-active: #d9f0e6; 197 | --green: hsl(153, calc(var(--saturation-factor, 1) * 46%), 49%); 198 | --status-green-600: var(--green); 199 | --green-360: var(--green); 200 | --green-hover: hsl(153, calc(var(--saturation-factor, 1) * 46%), 44%); 201 | --green-active: hsl(152, calc(var(--saturation-factor, 1) * 46%), 39%); 202 | --green-transparent: hsl(153, calc(var(--saturation-factor, 1) * 46%), 49%, 20%); 203 | --blue-345: hsl(199.524 calc(1*100%) 49.412% /1); 204 | --info-positive-foreground: var(--green); 205 | --text-positive: var(--green); 206 | --status-positive-background: var(--green); 207 | --red: hsl(0deg, calc(var(--saturation-factor, 1) * 85%), 61%); 208 | --red-hover: hsl(0deg, calc(var(--saturation-factor, 1) * 66%), 55%); 209 | --red-active: hsl(0deg, calc(var(--saturation-factor, 1) * 54%), 49%); 210 | --red-transparent: hsl(0, calc(var(--saturation-factor, 1) * 85%), 61%, 10%); 211 | --button-danger-background-active: var(--red-active); 212 | --button-danger-background: var(--red); 213 | --text-danger: var(--red); 214 | --info-danger-foreground: var(--red); 215 | --status-danger-background: var(--red); 216 | --font-display: var(--font-primary); 217 | --control-brand-foreground: var(--brand-experiment); 218 | --bdfdb-green: var(--green); 219 | /* activity colors*/ 220 | --twitch-dark: hsl(262, calc(var(--saturation-factor, 1) * 47%), 36%); 221 | --twitch: hsl(262, calc(var(--saturation-factor, 1) * 47%), 40%); 222 | --youtube-dark: hsl(0, calc(var(--saturation-factor, 1) * 73%), 41%); 223 | --youtube: hsl(0deg, calc(var(--saturation-factor, 1) * 73%), 46%); 224 | --spotify: hsl(141, calc(var(--saturation-factor, 1) * 72%), 42%); 225 | --spotify-dark: hsl(141, calc(var(--saturation-factor, 1) * 72%), 40%); 226 | --xbox-dark: hsl(120, calc(var(--saturation-factor, 1) * 77%), 26%); 227 | --xbox2: hsl(120, calc(var(--saturation-factor, 1) * 77%), 27%); 228 | --playstation-dark: hsl(220, calc(var(--saturation-factor, 1) * 96%), 27%); 229 | --playstation2: hsl(220, calc(var(--saturation-factor, 1) * 96%), 31%); 230 | --crunchyroll-dark: hsl(29, calc(var(--saturation-factor, 1) * 93%), 55%); 231 | --crunchyroll: hsl(29, calc(var(--saturation-factor, 1) * 93%), 60%); 232 | --text-link: color-mix(in oklab, var(--blue-345) 100%, var(--theme-text-color, #000) var(--theme-text-color-amount, 0%)); 233 | --text-warning: #faa61a; 234 | --notice-background-warning: #f26522; 235 | --notice-text-warning: #fff; 236 | --notice-background-critical: #f23f42; 237 | --notice-text-critical: #fff; 238 | --background-surface-high: var(--background-secondary); 239 | --bg-base-secondary: var(--background-secondary); 240 | --bg-base-tertiary: var(--background-tertiary); 241 | } 242 | 243 | .cardPrimary__73069 { 244 | --__card-accent-color: var(--background-secondary) !important; 245 | } 246 | 247 | .colorDanger__6e2b9 { 248 | --custom-notice-background: var(--status-danger-background) !important; 249 | --custom-notice-text: var(--status-danger-text) !important; 250 | --custom-notice-button-hover: var(--text-danger) !important; 251 | } 252 | 253 | :root { 254 | --custom-channel-header-height: 48px; 255 | --custom-member-list-width: 240px; 256 | --custom-guild-list-width: 72px; 257 | --custom-guild-sidebar-width: 375px; 258 | --custom-app-panels-height: 52.984375px; 259 | --custom-add-permissions-modal-focus-ring-width: 4px; 260 | --custom-custom-role-icon-form-item-role-icon-preview-size: 32px; 261 | --custom-guild-settings-roles-edit-shared-sidebar-width: 232px; 262 | --custom-guild-settings-roles-intro-roles-transition: 250ms; 263 | --custom-guild-settings-roles-intro-pause-transition: 166ms; 264 | --custom-guild-settings-roles-intro-background-transition: 500ms; 265 | --custom-guild-settings-roles-intro-banner-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + var(--custom-guild-settings-roles-intro-pause-transition)); 266 | --custom-guild-settings-roles-intro-roles-transition-delay: calc(var(--custom-guild-settings-roles-intro-roles-transition) + var(--custom-guild-settings-roles-intro-pause-transition)* 2 + var(--custom-guild-settings-roles-intro-background-transition)); 267 | --custom-guild-settings-community-intro-content-spacing: 32px; 268 | --custom-guild-settings-community-intro-hover-distance: -12px; 269 | --custom-guild-settings-community-intro-text-spacing: 8px; 270 | --custom-guild-settings-discovery-landing-page-max-width-tab: 905px; 271 | --custom-guild-settings-discovery-landing-page-settings-max-width: 520px; 272 | --custom-guild-settings-partner-content-spacing: 32px; 273 | --custom-event-detail-info-tab-base-spacing: 8px; 274 | --custom-subscription-listing-previews-carousel-cards-get-cut-off-width: 724px; 275 | --custom-editable-benefits-list-emoji-size: 24px; 276 | --custom-edit-benefit-modal-emoji-size: 22px; 277 | --custom-edit-benefit-modal-emoji-margin: 10px; 278 | --custom-guild-settings-role-subscriptions-max-width: 905px; 279 | --custom-guild-settings-role-subscriptions-overview-settings-max-width: 520px; 280 | --custom-guild-settings-store-page-settings-max-width: 520px; 281 | --custom-importable-benefits-list-listing-image-size: 40px; 282 | --custom-import-benefits-modal-icon-size: 24px; 283 | --custom-import-benefits-modal-role-icon-size: 40px; 284 | --custom-role-icon-uploader-icon-size: 24px; 285 | --custom-guild-role-subscription-style-constants-cover-image-aspect-ratio: 4; 286 | --custom-historic-earnings-table-toggle-expand-column-width: 30px; 287 | --custom-guild-role-subscription-card-basic-info-tier-image-size: 80px; 288 | --custom-guild-role-subscription-card-basic-info-tier-image-size-mobile: 48px; 289 | --custom-guild-role-subscriptions-overview-page-page-max-width: 1180px; 290 | --custom-guild-dialog-popout-width: 250px; 291 | --custom-guild-dialog-splash-ratio: 1.77778; 292 | --custom-guild-dialog-icon-size: 84px; 293 | --custom-guild-dialog-icon-padding: 4px; 294 | --custom-guild-product-download-modal-header-image-width: 119px; 295 | --custom-guild-onboarding-home-page-max-page-width: 1128px; 296 | --custom-guild-onboarding-home-page-max-single-column-width: 704px; 297 | --custom-home-resource-channels-obscured-blur-radius: 20px; 298 | --custom-guild-member-application-review-sidebar-width: 29vw; 299 | --custom-featured-items-popout-featured-items-popout-footer-height: 120px; 300 | --custom-guild-boosting-sidebar-display-conditional-bottom-margin: 12px; 301 | --custom-guild-boosting-marketing-progress-bar-marker-dimensions: 32px; 302 | --custom-guild-boosting-marketing-progress-bar-end-markers-margin: 4px; 303 | --custom-guild-boosting-marketing-progress-bar-marker-marker-dimensions: 32px; 304 | --custom-guild-boosting-marketing-tier-cards-tier-card-border-radius: 16px; 305 | --custom-go-live-modal-art-height: 112px; 306 | --custom-gif-picker-gutter-size: 0 16px 12px 16px; 307 | --custom-gif-picker-search-results-desired-item-width: 160px; 308 | --custom-forum-composer-attachments-attachment-size: 78px; 309 | --custom-forum-post-obscured-blur-radius: 20px; 310 | --custom-forum-post-grid-view-obscured-blur-radius: 20px; 311 | --custom-demo-forum-channel-padding-large: 20px; 312 | --custom-demo-forum-channel-post-padding: 12px; 313 | --custom-demo-forum-channel-gap-size: 8px; 314 | --custom-feedback-modal-emoji-size: 64px; 315 | --custom-feedback-modal-close-button-margin: 12px; 316 | --custom-expression-suggestions-container-padding: 8px; 317 | --custom-expression-suggestions-sticker-suggestion-size: 48px; 318 | --custom-expression-suggestions-sticker-suggestion-margin: 8px; 319 | --custom-expression-picker-constants-expression-picker-list-section-heading-height: 32px; 320 | --custom-expression-picker-constants-expression-picker-inspector-bar-graphic-primary-dimensions: 28px; 321 | --custom-expression-picker-constants-expression-picker-inspector-bar-graphic-secondary-dimensions: 32px; 322 | --custom-expression-picker-constants-expression-picker-inspector-bar-height: 48px; 323 | --custom-emoji-picker-border-radius: 8px; 324 | --custom-emoji-picker-constants-min-emoji-picker-width: 498px; 325 | --custom-emoji-picker-constants-emoji-size-medium: 40px; 326 | --custom-emoji-picker-constants-emoji-size-large: 48px; 327 | --custom-emoji-picker-constants-emoji-container-padding-horizontal: 4px; 328 | --custom-emoji-picker-constants-emoji-container-padding-vertical: 4px; 329 | --custom-emoji-picker-constants-emoji-picker-height: 440px; 330 | --custom-emoji-picker-constants-emoji-section-margin-bottom: 12px; 331 | --custom-emoji-picker-constants-emoji-list-padding-top: 0; 332 | --custom-emoji-picker-constants-emoji-list-padding-right: 0; 333 | --custom-emoji-picker-constants-emoji-list-padding-bottom: 8px; 334 | --custom-emoji-picker-constants-emoji-list-padding-left: 8px; 335 | --custom-emoji-picker-constants-emoji-list-search-results-padding-top: 8px; 336 | --custom-emoji-picker-constants-unicode-category-icon-margin-vertical: 2px; 337 | --custom-emoji-picker-constants-unicode-category-icon-size: 24px; 338 | --custom-emoji-picker-constants-unicode-category-icon-padding: 4px; 339 | --custom-emoji-picker-constants-unicode-category-shortcut-height: 48px; 340 | --custom-emoji-picker-constants-guild-category-icon-size: 32px; 341 | --custom-emoji-picker-constants-guild-category-icon-margin-verical: 8px; 342 | --custom-emoji-picker-constants-category-separator-size: 1px; 343 | --custom-emoji-picker-constants-category-separator-margin-vertical: 12px; 344 | --custom-emoji-picker-constants-diversity-emoji-size: 24px; 345 | --custom-emoji-picker-constants-emoji-premium-upsell-height: 54px; 346 | --custom-emoji-picker-constants-emoji-premium-upsell-margin-top: 16px; 347 | --custom-emoji-picker-constants-newly-added-emoji-badge-height: 16px; 348 | --custom-discover-static-guild-card-card-height: 258px; 349 | --custom-discover-featured-guilds-section-card-height: 320px; 350 | --custom-discover-featured-guilds-section-min-card-width: 248px; 351 | --custom-discover-featured-guilds-section-gutter-size: 16px; 352 | --custom-discover-search-results-max-search-bar-width: 720px; 353 | --custom-guild-directory-min-card-width: 248px; 354 | --custom-guild-directory-gutter-size: 16px; 355 | --custom-guild-directory-min-content-width: 320px; 356 | --custom-guild-directory-max-page-width: 1608px; 357 | --custom-guild-directory-entry-card-card-height: 274px; 358 | --custom-guild-directory-landing-min-header-height: 200px; 359 | --custom-guild-shop-page-two-column-max-width: 1439px; 360 | --custom-aspect-stable-image-container-padding: 20px; 361 | --custom-monetization-info-table-expandable-rows-toggle-expand-column-width: 30px; 362 | --custom-guild-shop-content-width: 1044px; 363 | --custom-guild-shop-content-width-reduced: 788px; 364 | --custom-guild-shop-content-width-minimum: 688px; 365 | --custom-guild-shop-channel-row-gradient: linear-gradient(113deg, #2f3570 1.98%, #422c70 94.48%); 366 | --custom-guild-shop-channel-row-gradient-hover: linear-gradient(113deg, #383f86 1.98%, #4d3385 94.48%); 367 | --custom-guild-shop-channel-row-border-gradient: linear-gradient(113deg, #6591ff, #d150ff); 368 | --custom-guild-shop-channel-row-glow: 0 0 4px rgba(189, 149, 255, 0.5); 369 | --custom-guild-shop-preview-pill-shadow-dark: -4px 5px #1d1d1d; 370 | --custom-guild-shop-preview-pill-shadow-light: -4px 5px #d7dce8; 371 | --custom-guild-shop-gradient-start: #686bff; 372 | --custom-guild-shop-gradient-end: #c356fd; 373 | --custom-guild-role-connections-modal-close-button-margin: 12px; 374 | --custom-clips-enabled-indicator-medium-break-point: 920px; 375 | --custom-clips-enabled-indicator-badge-icon-dimension-override: 20px; 376 | --custom-client-themes-editor-content-width: calc(var(--custom-theme-selection-selection-size)* 3 + var(--custom-theme-selection-group-column-gap)* 2); 377 | --custom-client-themes-editor-editor-padding: 16px; 378 | --custom-theme-selection-selection-size: 60px; 379 | --custom-theme-selection-group-column-gap: 24px; 380 | --custom-channel-attachment-upload-spoiler-blur-radius: 44px; 381 | --custom-channel-attachment-upload-mini-attachment-size: 78px; 382 | --custom-channel-textarea-text-area-height: 44px; 383 | --custom-channel-textarea-text-area-max-height: 50vh; 384 | --custom-channel-textarea-app-launcher-button-gap: 8px; 385 | --custom-channel-notice-icon-size: 16px; 386 | --custom-channel-notice-padding: 12px; 387 | --custom-channel-call-participants-popout-padding-value: 16px; 388 | --custom-stream-upsell-modal-art-height: 149px; 389 | --custom-voice-channel-status-modal-emoji-size: 22px; 390 | --custom-voice-channel-status-modal-emoji-margin: 10px; 391 | --custom-broadcasting-tooltip-image-offset: 40px; 392 | --custom-application-directory-content-min-width: 600px; 393 | --custom-application-directory-content-max-width: 1024px; 394 | --custom-guild-count-small-icon-size: 16px; 395 | --custom-guild-count-large-icon-size: 20px; 396 | --custom-collection-gallery-text-container-width: 400px; 397 | --custom-collection-gallery-media-breakpoint: 1024px; 398 | --custom-collection-gallery-column-card-height: 600px; 399 | --custom-collection-gallery-row-card-height: 283px; 400 | --custom-collection-list-card-gap: 16px; 401 | --custom-collection-list-with-image-grid-gap: 16px; 402 | --custom-collections-collection-gap: 32px; 403 | --custom-application-directory-profile-sidebar-width: 192px; 404 | --custom-application-directory-profile-sidebar-margin-right: 48px; 405 | --custom-application-directory-profile-icon-size: 122px; 406 | --custom-application-directory-search-sidebar-width: 200px; 407 | --custom-application-directory-search-sidebar-margin-right: 32px; 408 | --custom-activity-bookmark-embed-image-width: 356px; 409 | --custom-activity-bookmark-embed-image-height: 200px; 410 | --custom-activity-bookmark-embed-content-height: 400px; 411 | --custom-activity-shelf-item-activity-item-height: 230px; 412 | --custom-activity-shelf-item-large-activity-item-height: 143px; 413 | --custom-activity-shelf-modal-modal-padding: 80px; 414 | --custom-activity-shelf-modal-modal-width: 496px; 415 | --custom-activity-shelf-modal-modal-min-width: 496px; 416 | --custom-activity-shelf-modal-modal-max-width: 1024px; 417 | --custom-activity-shelf-modal-modal-header-height: 92px; 418 | --custom-activity-shelf-modal-modal-header-without-description-height: 74px; 419 | --custom-activity-shelf-modal-modal-footer-height: 50px; 420 | --custom-activity-shelf-modal-modal-art-height: 64px; 421 | --custom-activity-shelf-modal-modal-max-height: 720px; 422 | --custom-activity-shelf-modal-modal-header-developer-controls-height: 176px; 423 | --custom-activity-shelf-modal-dividers-height: 2px; 424 | --custom-activity-shelf-modal-divider-height: 1px; 425 | --custom-activity-shelf-slide-activity-directory-shelf-grid-gap: 16px; 426 | --custom-accept-invite-modal-invite-modal-height: 420px; 427 | --custom-accept-invite-modal-small-screen-width: 720px; 428 | --custom-avatar-avatar-decoration-border-position: calc((0.5 - var(--decoration-to-avatar-ratio) / 2)* 100%); 429 | --custom-button-button-xl-width: 148px; 430 | --custom-button-button-xl-height: 50px; 431 | --custom-button-button-lg-width: 130px; 432 | --custom-button-button-lg-height: 44px; 433 | --custom-button-button-md-width: 96px; 434 | --custom-button-button-md-height: 38px; 435 | --custom-button-button-sm-width: 60px; 436 | --custom-button-button-sm-height: 32px; 437 | --custom-button-button-tn-height: 24px; 438 | --custom-button-button-tn-width: 52px; 439 | --custom-button-link-underline-width: 1px; 440 | --custom-button-link-underline-offset: 1px; 441 | --custom-button-link-underline-stop: calc(var(--custom-button-link-underline-width) + var(--custom-button-link-underline-offset)); 442 | --custom-button-filled-hover: 0.1; 443 | --custom-button-filled-active: 0.2; 444 | --custom-button-transition-duration: 170ms; 445 | --custom-modal-min-width-large: 800px; 446 | --custom-special-markdown-small-break-point: 600px; 447 | --custom-special-markdown-medium-break-point: 768px; 448 | --custom-user-profile-hype-squad-badge-icon-size: 24px; 449 | --custom-user-profile-hype-squad-badge-shine-size-offset: 64px; 450 | --custom-guild-discovery-gutter-size: 16px; 451 | --custom-guild-discovery-max-page-width: 1608px; 452 | --custom-dropdown-button-small-dropdown-size: 16px; 453 | --custom-dropdown-button-medium-dropdown-size: 24px; 454 | --custom-dropdown-button-large-dropdown-size: 32px; 455 | --custom-dropdown-button-separator-padding: 4px; 456 | --custom-dropdown-button-hitbox-padding: 8px; 457 | --custom-responsive-embed-tile-loading-background-width: 271px; 458 | --custom-game-install-locations-item-padding: 20px; 459 | --custom-game-list-row-min-height: 62px; 460 | --custom-game-list-linked-to-glow-duration: 2000ms; 461 | --custom-application-store-home-store-home-width: 1245px; 462 | --custom-application-store-listing-body-max-width: 880px; 463 | --custom-store-colors-primary-750: #191b1d; 464 | --custom-store-colors-premium-gradient: linear-gradient(90deg, var(--premium-tier-2-purple), var(--premium-tier-2-pink)); 465 | --custom-member-list-item-avatar-decoration-padding: 2px; 466 | --custom-messages-popout-messages-popout-footer-height: 120px; 467 | --custom-radio-image-border-thickness: 2px; 468 | --custom-standard-sidebar-view-sidebar-content-width: 192px; 469 | --custom-standard-sidebar-view-standard-padding: 20px; 470 | --custom-standard-sidebar-view-sidebar-content-scrollbar-padding: 6px; 471 | --custom-standard-sidebar-view-sidebar-total-width: calc(var(--custom-standard-sidebar-view-sidebar-content-width) + var(--custom-standard-sidebar-view-standard-padding) + var(--custom-standard-sidebar-view-sidebar-content-scrollbar-padding)); 472 | } -------------------------------------------------------------------------------- /src/main.css: -------------------------------------------------------------------------------- 1 | @import url("https://milbits.github.io/oldcord/src/components/vars.css");@import url("https://milbits.github.io/oldcord/src/components/color.css");@import url("https://milbits.github.io/oldcord/src/components/imgs.css");@import url("https://milbits.github.io/oldcord/src/components/other.css");@import url("https://milbits.github.io/oldcord/src/components/profile.css");@import url("https://milbits.github.io/oldcord/src/components/redesign.css"); 2 | --------------------------------------------------------------------------------