├── .github └── ISSUE_TEMPLATE │ ├── UNTHEMED_AREAS.yaml │ ├── config.yml │ └── workflows │ └── update-classnames.yml ├── .gitignore ├── LICENSE ├── README.md ├── clients ├── amoled-cord.theme.css ├── amoled-cord.user.css └── metas │ ├── betterdiscord.json │ └── userstyle.json ├── package.json ├── src ├── amoled-cord.css ├── dev.scss ├── source.scss ├── support │ └── betterdiscord │ │ └── compiled.css └── theme │ ├── _index.scss │ ├── _variables.scss │ ├── content │ ├── _browse-channels.scss │ ├── _chat.scss │ ├── _devtools.scss │ ├── _forums.scss │ ├── _header.scss │ ├── _index.scss │ ├── _members.scss │ ├── _message-search.scss │ ├── _powerups.scss │ ├── _server-guide.scss │ ├── _server-shop.scss │ ├── _sliders.scss │ ├── _student-hub.scss │ └── _voice-call.scss │ ├── modals │ ├── _accept-invite.scss │ ├── _auth-box.scss │ ├── _captcha.scss │ ├── _claim-reward.scss │ ├── _connections.scss │ ├── _delete-message.scss │ ├── _edit-upload.scss │ ├── _gif-picker.scss │ ├── _index.scss │ ├── _invite.scss │ ├── _keyboard-shortcuts.scss │ ├── _mana.scss │ ├── _message-reactions.scss │ ├── _nitro.scss │ ├── _onboarding.scss │ ├── _payment.scss │ ├── _pending-application.scss │ ├── _poll-votes.scss │ ├── _quest-console-connection.scss │ ├── _server-tag.scss │ ├── _student-hub-email.scss │ ├── _upload-stickers.scss │ └── _voice-channel-status.scss │ ├── pages │ ├── _discovery.scss │ ├── _family-center.scss │ ├── _friends.scss │ ├── _generic.scss │ ├── _index.scss │ ├── _library.scss │ ├── _message-requests.scss │ ├── _nitro.scss │ └── _shop.scss │ ├── popouts │ ├── _add-game.scss │ ├── _add-tags.scss │ ├── _autocomplete.scss │ ├── _channel-permissions.scss │ ├── _content-warning.scss │ ├── _context-menu.scss │ ├── _country-code.scss │ ├── _dropdowns.scss │ ├── _emoji-info.scss │ ├── _inbox.scss │ ├── _index.scss │ ├── _messages.scss │ ├── _region-select.scss │ ├── _search.scss │ └── _threads.scss │ └── settings │ ├── _content.scss │ ├── _index.scss │ └── _sidebar.scss └── theme-config.json /.github/ISSUE_TEMPLATE/UNTHEMED_AREAS.yaml: -------------------------------------------------------------------------------- 1 | name: Report Unthemed Area(s) 2 | description: Create a report for areas aren't themed properly or at all. If you have multiple include it in one report. 3 | title: "[UNTHEMED]: x is not themed" 4 | labels: ["bug"] 5 | body: 6 | - type: input 7 | id: mod 8 | attributes: 9 | label: Client Mod 10 | description: What client mod do you use? 11 | placeholder: ex. Vencord, BetterDiscord, Replugged 12 | validations: 13 | required: true 14 | - type: textarea 15 | id: media 16 | attributes: 17 | label: Please provide screenshots of the unthemed areas. 18 | validations: 19 | required: true 20 | - type: checkboxes 21 | id: confirmation 22 | attributes: 23 | label: Before Submitting 24 | description: Please check the boxes below before submitting. 25 | options: 26 | - label: I checked for similar reports of this issue. 27 | required: true 28 | - label: I am on the latest stable Discord version. 29 | required: true 30 | - label: I am on the latest version of the theme. 31 | required: true 32 | - label: I have reinstalled the theme. 33 | required: true 34 | - label: I am using the Discord's Onyx theme. 35 | required: true -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/config.yml: -------------------------------------------------------------------------------- 1 | blank_issues_enabled: false -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/workflows/update-classnames.yml: -------------------------------------------------------------------------------- 1 | # name: Update Discord Class Names 2 | # on: 3 | # schedule: 4 | # - cron: "0 0 * * *" # Daily check 5 | # workflow_dispatch: 6 | 7 | # jobs: 8 | # update: 9 | # runs-on: ubuntu-latest 10 | # steps: 11 | # - uses: actions/checkout@v4 12 | 13 | # - name: Run Class Name Updater 14 | # uses: fedeericodl/discord-update-classnames@v1 15 | # with: 16 | # files: "src/theme/" -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ 2 | package-lock.json 3 | pnpm-lock.yaml -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 LuckFire 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![banner](https://discord-extensions.github.io/assets/banners/amoled-cord.png) 2 | 3 | --- 4 | 5 | > [!IMPORTANT] 6 | > AMOLED-cord only works with Discord's Onyx theme enabled. You can enable it by going to user settings (CTRL + ,), selecting the "Appearance" tab, then selecting "Onyx" under "Default Themes". 7 | 8 | ### ![betterdiscord](https://discord-extensions.github.io/assets/icons/betterdiscord.png) **[BetterDiscord](https://betterdiscord.app)** 9 | 1. [Download the theme from BetterDiscord's website](https://betterdiscord.app/Download?id=144) 10 | 2. Open your themes folder by going to the "BetterDiscord" category in user settings (CTRL + ,), selecting "Themes", and pressing the "Open Themes Folder" button. 11 | 3. Drag the file into that folder. 12 | 13 | ### ![vencord](https://discord-extensions.github.io/assets/icons/vencord.gif) **[Vencord](https://github.com/Vendicated/Vencord)** 14 | #### From URL 15 | 1. Go to user settings (CTRL + ,) 16 | 2. Go to the "Vencord" category in user settings (CTRL + ,), select the "Themes" tab, then select "Online Themes". 17 | 3. In the input field under "Online Themes" paste the following URL (if you have some here already, add a comma before the url). 18 | ``` 19 | https://luckfire.github.io/amoled-cord/src/amoled-cord.css 20 | ``` 21 | #### From `.theme.css` File 22 | 1. [Download the theme from BetterDiscord's website](https://betterdiscord.app/Download?id=144) 23 | 2. Open your themes folder by going to the "Vencord" category in user settings (CTRL + ,), select the "Themes" tab, and press the "Open Themes Folder" button. 24 | 3. Drag the file into that folder. 25 | 26 | ### ![stylus](https://discord-extensions.github.io/assets/icons/stylus.png) **Stylus** 27 | 1. Install the browser extensions for your respective browser. 28 | - [Chrome Webstore](https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne) 29 | - [Firefox Addons](https://addons.mozilla.org/en-US/firefox/addon/styl-us) 30 | 2. Once installed, open [this link](https://luckfire.github.io/amoled-cord/clients/amoled-cord.user.css) in a new browser tab. This opens the page where you will install this userstyle. 31 | 3. Press the `Install Style` button. 32 | 33 | ### ![replugged](https://discord-extensions.github.io/assets/icons/replugged.png) **[Replugged](https://replugged.dev)** 34 | This version of the theme is [maintained by fedeericodl](https://github.com/fedeericodl/amoled-cord), please report any issues to *their* repository and not this one. 35 | - [Direct Install](https://replugged.dev/install?identifier=dev.LuckFire.AMOLEDCord) 36 | 37 | --- 38 | 39 | ### License 40 | This theme is licensed under the MIT license. Please refer to the [LICENSE](./LICENSE) file for more details regarding rights and limitations. 41 | 42 | ### Support 43 | If you've ran into an issue with an area being unthemed, **PLEASE REPORT IT IN AN ISSUE**. If you have some other issue you need help with, feel free to join my [support server](https://discord.gg/vYdXbEzqDs). -------------------------------------------------------------------------------- /clients/amoled-cord.theme.css: -------------------------------------------------------------------------------- 1 | /** 2 | * @name AMOLED-Cord 3 | * @author LuckFire 4 | * @description A basically pitch black theme for Discord. Lights out, baby! 5 | * @version 5.0.6 6 | * @invite vYdXbEzqDs 7 | * @authorId 399416615742996480 8 | * @source https://github.com/LuckFire/amoled-cord 9 | * @updateUrl https://github.com/LuckFire/amoled-cord/blob/main/clients/amoled-cord.theme.css 10 | */ 11 | 12 | @import url("https://luckfire.github.io/amoled-cord/src/amoled-cord.css"); 13 | 14 | .theme-midnight { 15 | --background-message-hover: var(--opacity-8) !important; 16 | --background-mod-faint: var(--opacity-4) !important; 17 | --background-mod-normal: var(--opacity-16) !important; 18 | --background-mod-strong: var(--opacity-20) !important; 19 | --background-mod-subtle: var(--opacity-8) !important; 20 | --background-modifier-active: var(--opacity-16) !important; 21 | --background-modifier-hover: var(--opacity-8) !important; 22 | --background-modifier-selected: var(--opacity-20) !important; 23 | --background-secondary-alt: var(--neutral-88) !important; 24 | --card-primary-bg: var(--background-base-low) !important; 25 | --modal-background: var(--background-base-lowest) !important; 26 | --modal-footer-background: var(--background-base-lowest) !important; 27 | --scrollbar-auto-scrollbar-color-thumb: var(--neutral-80) !important; 28 | --scrollbar-auto-thumb: var(--neutral-80) !important; 29 | --scrollbar-thin-thumb: var(--neutral-79) !important; 30 | --custom-channel-members-bg: var(--background-base-lowest) !important; 31 | } 32 | 33 | @supports (color: color-mix(in lch, red, blue)) { 34 | .theme-midnight { 35 | --background-message-hover: color-mix( 36 | in oklab, 37 | var(--opacity-8) 100%, 38 | hsl(var(--theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) 39 | var(--theme-base-color-amount, 0%) 40 | ) !important; 41 | --background-secondary-alt: color-mix( 42 | in oklab, 43 | var(--neutral-88) 100%, 44 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 45 | ) !important; 46 | --card-primary-bg: color-mix( 47 | in oklab, 48 | var(--background-base-low) 100%, 49 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 50 | ) !important; 51 | --modal-background: color-mix( 52 | in oklab, 53 | var(--background-base-lowest) 100%, 54 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 55 | ) !important; 56 | --modal-footer-background: color-mix( 57 | in oklab, 58 | var(--background-base-lowest) 100%, 59 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 60 | ) !important; 61 | --scrollbar-auto-scrollbar-color-thumb: color-mix( 62 | in oklab, 63 | var(--neutral-80) 100%, 64 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 65 | ) !important; 66 | --scrollbar-auto-thumb: color-mix( 67 | in oklab, 68 | var(--neutral-80) 100%, 69 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 70 | ) !important; 71 | --scrollbar-thin-thumb: color-mix( 72 | in oklab, 73 | var(--neutral-79) 100%, 74 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 75 | ) !important; 76 | } 77 | } 78 | .theme-midnight .header__0b563 { 79 | background-color: var(--background-base-lowest) !important; 80 | } 81 | .theme-midnight .pageBody__41ed7 { 82 | background-color: var(--background-base-lowest); 83 | } 84 | .theme-midnight .container__0b563 { 85 | background-color: var(--background-base-lowest) !important; 86 | } 87 | .theme-midnight .prompt__5d7c9 { 88 | background-color: var(--background-base-low); 89 | } 90 | .theme-midnight .emptyPage__5d7c9 { 91 | background-color: var(--background-base-lowest); 92 | } 93 | .theme-midnight .profileCard__5d7c9 { 94 | border: 1px solid var(--border-subtle); 95 | } 96 | 97 | .theme-midnight .wrapper_fc8177, 98 | .theme-midnight .wrapper_d852db { 99 | background: var(--background-base-lowest); 100 | } 101 | .theme-midnight .chatContent_f75fb0, 102 | .theme-midnight .container__34c2c, 103 | .theme-midnight .container_fb64c9 { 104 | background: var(--background-base-lowest); 105 | } 106 | .theme-midnight .emptyState__7641b { 107 | border-left: 1px solid var(--app-border-frame); 108 | } 109 | .theme-midnight .wrapper_f7ecac { 110 | background-color: var(--background-surface-high); 111 | } 112 | .theme-midnight .channelTextArea_f75fb0 { 113 | background: var(--background-base-low); 114 | } 115 | .theme-midnight .channelTextArea__74017:not(.inlineContainer__74017) .themedBackground__74017 { 116 | background: var(--background-base-low); 117 | } 118 | .theme-midnight .bannerContainer__362cd { 119 | background: var(--background-base-low); 120 | } 121 | .theme-midnight .formWithLoadedChatInput_f75fb0:before, 122 | .theme-midnight .chatGradient__36d07 { 123 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 100%); 124 | } 125 | .theme-midnight .chatTypingGradientAtBottom__36d07 { 126 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 8px, var(--background-base-lowest) 100%); 127 | } 128 | .theme-midnight .chatTypingGradientNotAtBottom__36d07 { 129 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 72px, var(--background-base-lowest) 100%); 130 | } 131 | .theme-midnight .optionPill__1464f { 132 | border: 1px solid var(--border-faint); 133 | background-color: var(--background-surface-high); 134 | } 135 | .theme-midnight .optionPill__1464f .optionPillKey__1464f { 136 | background-color: var(--background-base-lower); 137 | } 138 | .theme-midnight .stackedBars__74017 { 139 | background: var(--background-surface-high); 140 | } 141 | .theme-midnight .content__44492 .messageContent__44492 { 142 | border: 1px solid var(--border-subtle); 143 | border-bottom: none; 144 | background-color: var(--background-surface-high); 145 | } 146 | .theme-midnight .content__44492 .messageContent__44492 .embedCard__44c9a { 147 | background-color: transparent; 148 | } 149 | .theme-midnight .content__44492 .footerContainer__44492 { 150 | border: 1px solid var(--border-subtle); 151 | } 152 | .theme-midnight .embedCard_b99f57 { 153 | border: 1px solid var(--border-subtle); 154 | background-color: var(--background-surface-high); 155 | } 156 | .theme-midnight .embedCard_b99f57 .cardFooter_b99f57 { 157 | border-top: 1px solid var(--border-subtle); 158 | background-color: var(--background-base-low); 159 | } 160 | .theme-midnight .bumpBox_cacd02 { 161 | background-color: var(--background-base-low); 162 | border: 1px solid var(--border-faint); 163 | } 164 | 165 | .theme-midnight .container_db0ccb, 166 | .theme-midnight .container_a51e6d { 167 | background-color: var(--background-base-lowest); 168 | } 169 | .theme-midnight .sidebarContent_db0ccb { 170 | border-color: var(--app-border-frame); 171 | } 172 | 173 | .theme-midnight .container_f369db { 174 | background-color: var(--background-base-lowest); 175 | } 176 | .theme-midnight .previewForm_d9be46 { 177 | background-color: var(--background-base-low); 178 | border-color: var(--border-faint); 179 | } 180 | .theme-midnight .descriptionContainer_ca49a1 { 181 | background-color: var(--background-base-lowest); 182 | border: 1px solid var(--border-subtle); 183 | } 184 | .theme-midnight .linkContainer_ca49a1 { 185 | background-color: var(--background-base-lowest); 186 | } 187 | .theme-midnight .gradient_ca49a1 { 188 | background: linear-gradient(to top, var(--background-base-lowest), transparent); 189 | } 190 | .theme-midnight .contentPreview__9a337 { 191 | background-color: var(--background-base-lowest); 192 | } 193 | .theme-midnight .textContentFooter__9a337 { 194 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0.97) 36px, hsl(var(--black-hsl)/0.4)); 195 | } 196 | .theme-midnight .textContentFooter__9a337.noTags__9a337 { 197 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0)); 198 | } 199 | 200 | .theme-midnight .container__9293f, 201 | .theme-midnight .chatHeaderBar_a53846 { 202 | --__header-bar-background: var(--background-base-lowest); 203 | } 204 | .theme-midnight .backdrop__8a7fc { 205 | background: var(--background-base-lowest); 206 | } 207 | 208 | .theme-midnight .page_c791b2 { 209 | background-color: var(--background-base-lowest) !important; 210 | } 211 | 212 | .theme-midnight .searchResult__02a39 { 213 | background-color: var(--background-base-lowest); 214 | } 215 | 216 | .theme-midnight .contentContainer__89463, 217 | .theme-midnight .sidebarContainer__89463 { 218 | background-color: var(--background-base-lowest); 219 | } 220 | 221 | .theme-midnight .background__7449f { 222 | background-color: var(--background-base-lowest); 223 | } 224 | .theme-midnight .resourceChannel__7449f:hover { 225 | background-color: var(--background-modifier-hover); 226 | } 227 | .theme-midnight .headerBarInner__7449f:after { 228 | background: linear-gradient(to bottom, rgba(50, 52, 58, 0) 0, var(--background-base-lowest) 100%); 229 | } 230 | 231 | .theme-midnight .opaqueBackground__79d38 { 232 | background: hsl(var(--primary-800-hsl)/0.85); 233 | } 234 | 235 | .theme-midnight .mini_a562c8 .bar_a562c8, 236 | .theme-midnight .slider_a562c8 .bar_a562c8 { 237 | background-color: var(--background-surface-highest); 238 | } 239 | .theme-midnight .markDash_a562c8 { 240 | background-color: var(--background-surface-highest); 241 | } 242 | 243 | .theme-midnight .pageContainer__09fde, 244 | .theme-midnight .emptySearchWrapper__83bd4 { 245 | background-color: var(--background-base-lowest); 246 | } 247 | 248 | .theme-midnight .videoWrapper__2f4f7:not(.wrapper__48b20), 249 | .theme-midnight .streamHidden_c30e20, 250 | .theme-midnight .streamPreview__2f4f7 { 251 | background-color: var(--background-base-low); 252 | } 253 | .theme-midnight .cta_a3a802 { 254 | background-color: var(--button-secondary-background); 255 | } 256 | .theme-midnight .cta_a3a802:hover { 257 | background-color: var(--button-secondary-background-hover); 258 | } 259 | .theme-midnight .participantsButton__211d1, 260 | .theme-midnight .buttonColor__7b3e8 { 261 | background-color: var(--background-surface-higher); 262 | } 263 | .theme-midnight .participantsButton__211d1:hover, 264 | .theme-midnight .buttonColor__7b3e8:hover { 265 | background-color: var(--background-surface-high); 266 | } 267 | .theme-midnight .wrapper_cb9592:has(.resizeHandle__4b144) .callContainer_cb9592 { 268 | border-bottom: 1px solid var(--border-subtle); 269 | } 270 | .theme-midnight .container__664ff { 271 | border-left: 1px solid var(--app-border-frame); 272 | background-color: var(--background-base-lowest); 273 | } 274 | .theme-midnight .background__506d9 { 275 | background-color: var(--background-base-low); 276 | } 277 | .theme-midnight .container__6b38f.pulse__6b38f { 278 | background-color: var(--neutral-95); 279 | border: 1px solid var(--opacity-24); 280 | } 281 | .theme-midnight .container__6b38f.pulse__6b38f:hover { 282 | background-color: var(--opacity-12); 283 | } 284 | .theme-midnight .tileContainer__71eb2:hover { 285 | background-color: var(--opacity-12); 286 | } 287 | 288 | .theme-midnight .editProfileContainer__42179 { 289 | background-color: var(--background-base-low); 290 | } 291 | 292 | .theme-midnight .authBox__921c5 { 293 | background-color: var(--background-base-lowest); 294 | } 295 | 296 | .theme-midnight .container_deee3a { 297 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-blue-end) 0, var(--expressive-gradient-blue-start) 100%); 298 | } 299 | 300 | .theme-midnight .upsellContainer__88422 { 301 | background-color: var(--opacity-8); 302 | } 303 | 304 | .theme-midnight .accountBtnInner__750de, 305 | .theme-midnight .application__750de { 306 | border: 1px solid var(--border-subtle); 307 | } 308 | 309 | .theme-midnight .message__89466 { 310 | background-color: var(--background-base-lowest); 311 | border: 1px solid var(--border-subtle); 312 | } 313 | 314 | .theme-midnight .uploadModal_dbca3c .footer_dbca3c { 315 | background-color: var(--background-base-lowest); 316 | } 317 | 318 | .theme-midnight .gifPicker__6c39d .header_fed6d3 { 319 | background-color: var(--background-base-lowest); 320 | } 321 | 322 | .theme-midnight .footer__67dba { 323 | background-color: var(--background-base-lowest); 324 | } 325 | 326 | .theme-midnight .keyboardShortcutsModal_f061f6 { 327 | background-color: var(--background-base-lowest); 328 | } 329 | 330 | .theme-midnight .scroller_cc2dff { 331 | border-right: 1px solid var(--border-subtle); 332 | background-color: var(--background-base-lowest); 333 | } 334 | 335 | .theme-midnight .container__53cea { 336 | background-color: var(--background-base-lowest); 337 | } 338 | .theme-midnight .bodyControls__53cea:after { 339 | background: radial-gradient(88.69% 87.5% at 50% 87.5%, transparent 0, var(--background-base-lowest) 100%); 340 | } 341 | 342 | .theme-midnight .scroller__6fd0e { 343 | background-color: var(--background-base-lowest); 344 | } 345 | .theme-midnight .headerWave__1dfae { 346 | color: var(--background-base-lowest); 347 | } 348 | .theme-midnight .bodyWaveGradientStop1__1dfae, 349 | .theme-midnight .bodyWaveGradientStop3__1dfae { 350 | stop-color: var(--background-base-lower); 351 | } 352 | .theme-midnight .bodyWaveGradientStop2__1dfae { 353 | stop-color: var(--background-base-low); 354 | } 355 | 356 | .theme-midnight .main_c08b38:not(.fullBorderWithGradient_c08b38) { 357 | border-top: 1px solid var(--app-border-frame); 358 | } 359 | .theme-midnight .prompt_fe70ca { 360 | border: 1px solid var(--border-normal); 361 | } 362 | .theme-midnight .navButtons_fe70ca { 363 | background-color: var(--background-base-lowest); 364 | } 365 | .theme-midnight .termsFieldBody_fe70ca { 366 | background-color: var(--background-base-low); 367 | border: 1px solid var(--border-subtle); 368 | } 369 | 370 | .theme-midnight .premiumBrandRefreshBackground_e5f3a9 { 371 | background-color: var(--background-base-lowest) !important; 372 | } 373 | .theme-midnight .premiumBrandRefreshHeader_e50a4d, 374 | .theme-midnight .skuSelectModalContent_e50a4d.premiumBrandRefreshContent_e50a4d.premiumBrandRefreshContent_e50a4d { 375 | background-color: var(--background-base-lowest); 376 | } 377 | 378 | .theme-midnight .confirmation__1051d { 379 | background-color: var(--background-base-lowest); 380 | } 381 | .theme-midnight .iconWrapper__1051d { 382 | background-color: var(--background-base-low); 383 | } 384 | 385 | .theme-midnight .scroller__01c8c { 386 | border-right: 1px solid var(--border-subtle); 387 | background-color: var(--background-base-lowest); 388 | } 389 | .theme-midnight .container__01c8c, 390 | .theme-midnight .voters__01c8c { 391 | background-color: var(--background-base-lowest); 392 | } 393 | .theme-midnight .voteSelected__01c8c { 394 | background-color: var(--background-base-low); 395 | } 396 | 397 | .theme-midnight .modalRoot__5b400, 398 | .theme-midnight .footer__5b400 { 399 | background-color: var(--background-base-lowest); 400 | } 401 | .theme-midnight .connectionRowHeaderError__5b400 { 402 | background-color: hsl(var(--neutral-95-hsl)/0.7); 403 | } 404 | 405 | .theme-midnight .right__58ae6, 406 | .theme-midnight .rightContent__58ae6 { 407 | background-color: var(--background-base-lowest); 408 | } 409 | 410 | .theme-midnight .sidebarContainer__1d6c7 { 411 | border-right: 1px solid var(--border-subtle); 412 | background-color: var(--background-base-lowest); 413 | } 414 | 415 | .theme-midnight .previewDark__4e29d { 416 | background-color: var(--background-base-lowest); 417 | } 418 | 419 | .theme-midnight .container__08bd2 { 420 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-purple-end) 0, var(--expressive-gradient-purple-start) 100%); 421 | } 422 | 423 | .theme-midnight .relative__8a7fc { 424 | border-bottom: 1px solid var(--app-border-frame); 425 | } 426 | .theme-midnight .relative__8a7fc, 427 | .theme-midnight .scroller__23746, 428 | .theme-midnight .container_cbd375 { 429 | background-color: var(--background-base-lowest); 430 | } 431 | 432 | .theme-midnight .containerSidenav_dc2e0e { 433 | background-color: var(--background-base-lowest); 434 | } 435 | 436 | .theme-midnight .tabBody__133bf, 437 | .theme-midnight .nowPlayingColumn__133bf, 438 | .theme-midnight .container__7d20c, 439 | .theme-midnight .emptyCard__7e549 { 440 | background-color: var(--background-base-lowest); 441 | } 442 | .theme-midnight .body__00943 .section__00943 { 443 | background-color: var(--background-base-lowest); 444 | border: 1px solid var(--border-subtle); 445 | } 446 | .theme-midnight .body__00943 .section__00943:has(+ .separator__00943) { 447 | border-bottom: none; 448 | } 449 | .theme-midnight .body__00943 .wrapper__960df { 450 | background-color: var(--background-base-lowest); 451 | border: 1px solid var(--border-subtle); 452 | } 453 | .theme-midnight .body__00943 .separator__00943 + .section__00943, 454 | .theme-midnight .body__00943 .separator__00943 + .wrapper__960df { 455 | border-top: none; 456 | } 457 | .theme-midnight .addFriendInputWrapper__72ba7:not(:focus-within) { 458 | border-color: var(--input-border); 459 | } 460 | .theme-midnight .addFriendInputWrapper__72ba7 { 461 | background: var(--input-background); 462 | } 463 | .theme-midnight .outer_bf1984 { 464 | background-color: var(--background-base-low); 465 | } 466 | .theme-midnight .outer_bf1984.active_bf1984:hover, .theme-midnight .outer_bf1984.interactive_bf1984:hover { 467 | background-color: var(--background-surface-high); 468 | } 469 | 470 | .theme-midnight .page_c48ade:empty, 471 | .theme-midnight .page_c48ade:has(.loader_c48ade, > div:empty:only-child), 472 | .theme-midnight .noChannel__01d5c { 473 | border-top: 1px solid var(--app-border-frame); 474 | } 475 | 476 | .theme-midnight .container_ad5cdf { 477 | border-top: 1px solid var(--app-border-frame); 478 | } 479 | .theme-midnight .scroller__4a84a, 480 | .theme-midnight .scroller_fb04e1 { 481 | background-color: var(--background-base-lowest); 482 | } 483 | .theme-midnight .installationPath_a6f654 { 484 | box-shadow: 0 1px 0 0 var(--border-subtle); 485 | } 486 | 487 | .theme-midnight .container_f391e3 { 488 | background-color: var(--background-base-lowest); 489 | } 490 | 491 | .theme-midnight .applicationStore_f07d62, 492 | .theme-midnight .mainPageScroller_ca1a02, 493 | .theme-midnight .scroller_c880e8, 494 | .theme-midnight .allPerksScroller_ca1a02 { 495 | background-color: var(--background-base-lowest); 496 | } 497 | .theme-midnight .card_b5493b { 498 | border: 1px solid var(--border-subtle); 499 | background-color: var(--background-surface-high); 500 | } 501 | .theme-midnight .card_b5493b .cardDescription__1f069 { 502 | background-image: linear-gradient(to bottom, var(--background-surface-high) 50%, hsl(var(--primary-800-hsl)/0.75) 80%); 503 | } 504 | .theme-midnight .container_da4aee { 505 | border: 1px solid var(--border-subtle); 506 | background-color: var(--background-surface-high); 507 | } 508 | .theme-midnight .container_da4aee .textContainer_da4aee { 509 | background-image: linear-gradient(to right, var(--background-surface-high), hsl(var(--primary-800-hsl)/40%) 90%, transparent); 510 | } 511 | 512 | .theme-midnight .shop__6db1d, 513 | .theme-midnight .shop__08415, 514 | .theme-midnight .page__1feb0, 515 | .theme-midnight .shopScroll__1feb0, 516 | .theme-midnight .filterBar__1feb0 .filterBar__11877 { 517 | background-color: var(--background-base-lowest); 518 | } 519 | .theme-midnight .darkCardBackground_c3d04b { 520 | background-color: var(--background-base-low); 521 | } 522 | 523 | .theme-midnight .addGamePopout_cc46f0 { 524 | box-shadow: 0 0 0 1px var(--border-subtle), var(--legacy-elevation-high); 525 | background-color: var(--background-base-low); 526 | } 527 | 528 | .theme-midnight .container__5808f { 529 | background-color: var(--background-surface-high); 530 | } 531 | 532 | .theme-midnight .autocomplete__13533 { 533 | border: 1px solid var(--border-faint); 534 | background-color: var(--background-base-low); 535 | } 536 | .theme-midnight .autocomplete__13533 .wrapper__14245 { 537 | background-color: var(--background-base-low); 538 | } 539 | .theme-midnight .autocomplete__13533 .wrapper__4e6ce { 540 | border-right: 1px solid var(--border-faint); 541 | } 542 | 543 | .theme-midnight .autocompleteArrow_d5ae15, 544 | .theme-midnight .header_d5ae15 { 545 | background-color: var(--background-surface-high); 546 | } 547 | .theme-midnight .container_d5ae15 { 548 | background-color: var(--background-base-low); 549 | } 550 | 551 | .theme-midnight .contentWarningPopout_be95d0 { 552 | background-color: var(--background-surface-high); 553 | } 554 | .theme-midnight .footer_be95d0 { 555 | background-color: var(--background-mod-faint); 556 | } 557 | 558 | .theme-midnight .menu_c1e9c4 { 559 | border-color: var(--border-faint); 560 | background-color: var(--background-surface-high); 561 | } 562 | .theme-midnight .button_f563df { 563 | background-color: var(--background-mod-faint); 564 | } 565 | .theme-midnight .button_f563df:hover { 566 | background-color: var(--background-mod-subtle); 567 | } 568 | .theme-midnight .button_f563df:active { 569 | background-color: var(--background-mod-strong); 570 | } 571 | 572 | .theme-midnight .popoutList__92efc { 573 | background-color: var(--background-base-low); 574 | } 575 | 576 | .theme-midnight .popout__3f413 { 577 | background-color: var(--background-base-low); 578 | } 579 | 580 | .theme-midnight .popoutContainer__0f481 { 581 | background-color: color-mix(in oklab, var(--background-surface-high), transparent 10%); 582 | } 583 | .theme-midnight .guildSection_d5cd2d { 584 | background-color: var(--background-base-low); 585 | border-top: 1px solid var(--border-faint); 586 | } 587 | 588 | .theme-midnight .container__2692d, 589 | .theme-midnight .container_fc561d, 590 | .theme-midnight .container_f6bd5f, 591 | .theme-midnight .container__03885 { 592 | border: 1px solid var(--app-border-frame); 593 | background-color: var(--background-base-low); 594 | } 595 | .theme-midnight .channelHeader__35a7e, 596 | .theme-midnight .container__0f711 { 597 | background-color: var(--background-base-low); 598 | } 599 | .theme-midnight .messageContainer__95796, 600 | .theme-midnight .messages__1ccd1, 601 | .theme-midnight .forumPost__7d15e { 602 | background-color: var(--background-base-lowest); 603 | } 604 | .theme-midnight .tutorial__2692d, 605 | .theme-midnight .upsellContainer__4a7f0, 606 | .theme-midnight .icon_d404a3 { 607 | background-color: var(--background-surface-high); 608 | } 609 | 610 | .theme-midnight .messagesPopoutWrap__45690 { 611 | border: 1px solid var(--app-border-frame); 612 | background-color: var(--background-base-low); 613 | } 614 | .theme-midnight .header__45690 { 615 | background-color: var(--background-base-low); 616 | } 617 | .theme-midnight .footer__45690 { 618 | border-top: 1px solid var(--app-border-frame); 619 | background-color: var(--background-surface-high); 620 | } 621 | .theme-midnight .messageGroupWrapper__45690 { 622 | background-color: var(--background-base-lowest); 623 | } 624 | 625 | .theme-midnight .quickSelectPopout_ebaca5 { 626 | border: 1px solid var(--border-faint); 627 | background-color: var(--background-surface-high); 628 | } 629 | .theme-midnight .quickSelectPopoutOption_ebaca5:hover { 630 | background-color: var(--background-mod-faint); 631 | } 632 | .theme-midnight .quickSelectPopoutOption_ebaca5:focus { 633 | background-color: var(--background-mod-subtle); 634 | } 635 | 636 | .theme-midnight .container__55c99 { 637 | background-color: var(--background-base-low); 638 | } 639 | .theme-midnight .queryContainer__55c99 { 640 | border-bottom-color: var(--border-subtle); 641 | } 642 | .theme-midnight .focused__55c99 { 643 | background-color: var(--background-base-lower); 644 | } 645 | .theme-midnight .calendarPicker_d27f17 .react-datepicker, 646 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__header { 647 | background-color: var(--background-base-low); 648 | } 649 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__current-month { 650 | border-bottom-color: var(--border-faint); 651 | } 652 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled, .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled:hover { 653 | background-color: var(--background-base-lower); 654 | } 655 | 656 | .theme-midnight .container_d9c882 { 657 | background-color: var(--background-base-low); 658 | } 659 | .theme-midnight .container_d9c882:not(.browser__9a792) { 660 | border: 1px solid var(--app-border-frame); 661 | } 662 | .theme-midnight .header_d9c882 { 663 | background-color: var(--background-base-low); 664 | } 665 | .theme-midnight .browser__9a792 { 666 | background-color: var(--background-base-lowest); 667 | } 668 | .theme-midnight .browser__9a792 .header_d9c882 { 669 | background-color: var(--background-base-lowest); 670 | } 671 | .theme-midnight .container__6764b { 672 | background-color: var(--background-base-lowest); 673 | } 674 | .theme-midnight .container__6764b:hover { 675 | background-color: var(--background-base-lower); 676 | } 677 | .theme-midnight .icon__1b24f { 678 | background-color: var(--background-surface-high); 679 | } 680 | 681 | .theme-midnight .sidebarRegionScroller__23e6b { 682 | border-right: 1px solid var(--app-border-frame); 683 | } 684 | 685 | .theme-midnight .contentRegion__23e6b, 686 | .theme-midnight .contentRegionScroller__23e6b { 687 | background: var(--background-base-lowest); 688 | } 689 | .theme-midnight .content_e9e3ed, 690 | .theme-midnight .sidebar__409aa { 691 | background-color: var(--background-base-lowest); 692 | } 693 | .theme-midnight .accountProfileCard__1fed1 { 694 | background-color: var(--background-base-low); 695 | border: 1px solid var(--border-subtle); 696 | } 697 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 { 698 | border: 1px solid var(--border-subtle); 699 | background-color: var(--background-base-lowest); 700 | } 701 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 .fieldList__1fed1 { 702 | background-color: var(--background-base-lowest); 703 | } 704 | .theme-midnight .emptyContainer_de8069 { 705 | border: 1px solid var(--border-faint); 706 | background-color: var(--background-base-low); 707 | } 708 | .theme-midnight .card__5cea9 { 709 | border: 1px solid var(--border-faint); 710 | } 711 | .theme-midnight .card__5cea9 .header__5cea9 { 712 | border-bottom: 1px solid var(--border-faint); 713 | background-color: var(--background-base-low); 714 | } 715 | .theme-midnight .box_f8c98c { 716 | border-color: var(--border-faint); 717 | background-color: var(--background-base-low); 718 | } 719 | .theme-midnight .headerV2__50a54 { 720 | border-bottom: 1px solid var(--border-faint); 721 | background-color: var(--background-base-low); 722 | } 723 | .theme-midnight .authedAppV2__50a54 { 724 | border: 1px solid var(--border-faint); 725 | background-color: var(--background-base-lower); 726 | } 727 | .theme-midnight .connectContainer_c7f964 { 728 | border: 1px solid var(--border-faint); 729 | background-color: var(--background-base-low); 730 | } 731 | .theme-midnight .accountButtonInner_c7f964, 732 | .theme-midnight .accountAddInner_c7f964 { 733 | border: 1px solid var(--border-subtle); 734 | } 735 | .theme-midnight .accountButtonInner_c7f964:not(:hover), 736 | .theme-midnight .accountAddInner_c7f964:not(:hover) { 737 | background-color: var(--background-base-lower); 738 | } 739 | .theme-midnight .connection_c7f964 { 740 | border: 1px solid var(--border-faint); 741 | background-color: var(--background-base-lower); 742 | } 743 | .theme-midnight .connection_c7f964 .connectionHeader_c7f964 { 744 | border-bottom: 1px solid var(--border-faint); 745 | background-color: var(--background-base-low); 746 | } 747 | .theme-midnight .connection_c7f964 .metadataContainer_c7f964 { 748 | border: 1px solid var(--border-faint); 749 | background-color: var(--background-base-lowest); 750 | } 751 | .theme-midnight .connection_c7f964 .integrationWrapper_c7f964 { 752 | border: 1px solid var(--border-faint); 753 | background-color: var(--background-base-lowest); 754 | } 755 | .theme-midnight .expandedProgressBarContainerSettingsPage_a61c56, 756 | .theme-midnight .giftCard_a45ed3 { 757 | border: 1px solid var(--border-faint); 758 | background-color: var(--background-base-low); 759 | } 760 | .theme-midnight .perkCard_b62c4e { 761 | border: 1px solid var(--border-faint); 762 | background-color: var(--background-base-low); 763 | } 764 | .theme-midnight .rowBottomBorder_e4ef5c { 765 | border-color: var(--border-subtle); 766 | } 767 | .theme-midnight .appliedBoostContainer_ceb06a { 768 | border: 1px solid var(--border-faint); 769 | background-color: var(--background-base-low); 770 | } 771 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainerSeparator_ceb06a { 772 | background-color: var(--border-subtle); 773 | } 774 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainer_ceb06a { 775 | background-color: var(--background-base-low); 776 | } 777 | .theme-midnight .appliedBoostContainer_ceb06a .guildContainer__5dba5:not(.recommendedServerCard__51537) { 778 | border-bottom: 1px solid var(--border-faint); 779 | } 780 | .theme-midnight .wave__8e08c { 781 | fill: var(--background-base-lowest); 782 | } 783 | .theme-midnight .guildContainer__5dba5 { 784 | background-color: var(--background-base-low); 785 | } 786 | .theme-midnight .guildContainer__5dba5.recommendedServerCard__51537 { 787 | border: 1px solid var(--border-faint); 788 | } 789 | .theme-midnight .wrapper__5b98e { 790 | border: 1px solid var(--border-faint); 791 | background-color: var(--background-base-low); 792 | } 793 | .theme-midnight .wrapper__5b98e .list__5b98e { 794 | border-color: var(--border-subtle); 795 | } 796 | .theme-midnight .wrapper__5b98e .listItem__5b98e { 797 | border-color: var(--border-subtle); 798 | } 799 | .theme-midnight .detailsBlock_e335a7 { 800 | border: 1px solid var(--border-faint); 801 | background-color: var(--background-base-low); 802 | } 803 | .theme-midnight .accountCreditsContainer__94f72 .accountCreditRow__94f72:not(:last-child) { 804 | border-bottom: 1px solid var(--border-faint); 805 | } 806 | .theme-midnight .fractionalPremiumAccountCredit__94f72, 807 | .theme-midnight .premiumSubscriptionAccountCredit__94f72 { 808 | border: 1px solid var(--border-faint); 809 | background-color: var(--background-base-low); 810 | } 811 | .theme-midnight .fractionalTimeRemainingRow__94f72 { 812 | background-color: var(--background-base-lower); 813 | } 814 | .theme-midnight .paymentPane__01014 { 815 | background-color: var(--background-base-low); 816 | } 817 | .theme-midnight .paymentPane__01014 .payment_e9cb00 { 818 | background-color: var(--background-base-low); 819 | } 820 | .theme-midnight .paymentPane__01014 .expandedInfo_e9cb00 { 821 | background-color: var(--background-base-lowest); 822 | } 823 | .theme-midnight .preview__3e443 { 824 | background-color: var(--background-base-lowest); 825 | } 826 | .theme-midnight .container_a1d343 { 827 | background-color: var(--background-base-low); 828 | border: 1px solid var(--border-subtle); 829 | } 830 | .theme-midnight .preview__5d148 { 831 | background-color: var(--background-base-lowest); 832 | } 833 | .theme-midnight .notches__06283.gray__06283 { 834 | color: var(--background-base-lowest); 835 | } 836 | .theme-midnight .progress__06283 { 837 | background-color: var(--background-surface-highest); 838 | } 839 | .theme-midnight .sliderBar_ac7648:not(.speaking_ac7648) { 840 | background-color: var(--background-surface-highest); 841 | } 842 | .theme-midnight .cameraWrapper_d41d5f { 843 | background-color: var(--background-base-low); 844 | border-color: var(--border-subtle); 845 | } 846 | .theme-midnight .backgroundOptionInner__53965 { 847 | background-color: var(--background-base-low); 848 | } 849 | .theme-midnight .headerContainer__7db08 { 850 | background-color: var(--background-base-lowest); 851 | } 852 | .theme-midnight .game_cc46f0 { 853 | box-shadow: 0 1px 0 0 var(--border-subtle); 854 | } 855 | .theme-midnight .avatarUploaderInnerSquareDisabled_e04502 { 856 | background-color: var(--background-surface-high); 857 | } 858 | .theme-midnight .wrapper__83b1d { 859 | background-color: var(--background-surface-high); 860 | } 861 | .theme-midnight .wrapper__83b1d:focus-within, .theme-midnight .wrapper__83b1d:hover { 862 | background-color: var(--background-mod-subtle); 863 | } 864 | .theme-midnight .titleContainer_e29cd7, 865 | .theme-midnight .header_c6bf1b { 866 | background-color: var(--background-base-lowest); 867 | } 868 | .theme-midnight .theme-midnight.messageWrapper__981c8 { 869 | background-color: var(--background-base-lowest); 870 | } 871 | .theme-midnight .joinOptions__959cb { 872 | background-color: var(--background-base-low); 873 | } 874 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.uninteractive__959cb:hover { 875 | background-color: var(--background-base-low); 876 | } 877 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.active__959cb { 878 | background-color: var(--background-surface-high); 879 | } 880 | .theme-midnight .header__812a7 { 881 | background-color: var(--background-base-low); 882 | border-bottom: 1px solid var(--border-faint); 883 | } 884 | .theme-midnight .container__812a7 { 885 | background-color: var(--background-base-lower); 886 | } 887 | .theme-midnight .actionContainer__6446f, 888 | .theme-midnight .mentionLimitContainer_ed9c90 { 889 | background-color: var(--background-surface-higher); 890 | } 891 | .theme-midnight .actionContainer_bc4513 { 892 | background-color: var(--background-surface-highest); 893 | } 894 | .theme-midnight .editCard_a25a68 { 895 | background-color: var(--background-base-low); 896 | } 897 | .theme-midnight .collapseable__217b7:is(.collapseable__4546e, .collapseable_fc46b1) { 898 | background-color: var(--background-surface-high); 899 | } 900 | .theme-midnight .bannedUser_cdb2b0:not(:hover) { 901 | background-color: var(--background-surface-higher); 902 | } 903 | .theme-midnight .notice_a9b452, 904 | .theme-midnight .review_a9b452 { 905 | background-color: var(--background-base-low); 906 | border: 1px solid var(--border-subtle); 907 | } 908 | .theme-midnight .onboardingStepContainer__28e57 { 909 | border-left: 1px solid var(--border-subtle); 910 | border-right: 1px solid var(--border-subtle); 911 | } 912 | .theme-midnight .onboardingStepContainer__28e57:last-child { 913 | border-bottom: 1px solid var(--border-subtle); 914 | } 915 | .theme-midnight .container__5d756 { 916 | border: 1px solid var(--border-subtle); 917 | } 918 | .theme-midnight .example__5d756 { 919 | background-color: var(--background-surface-high); 920 | } 921 | .theme-midnight .channelCoverage_e34850 { 922 | background-color: var(--background-base-low); 923 | } 924 | .theme-midnight .actionItem_d2b0e4, 925 | .theme-midnight .resourceChannel_d2b0e4, 926 | .theme-midnight .suggestedChannels_d2b0e4 { 927 | background-color: var(--background-base-low); 928 | } 929 | .theme-midnight .howItWorksContainer_dd30dc, 930 | .theme-midnight .creatorBenefitCard__02e4c, 931 | .theme-midnight .guildCard__2485e { 932 | border: 1px solid var(--border-faint); 933 | background-color: var(--background-surface-high); 934 | } 935 | .theme-midnight .descriptionBox__981f7 { 936 | border: 1px solid var(--border-subtle); 937 | background-color: var(--background-base-low); 938 | } 939 | .theme-midnight .settingCard__1a4ef { 940 | border: 1px solid var(--border-subtle); 941 | } 942 | .theme-midnight .settingCard__1a4ef.active__1a4ef { 943 | background-color: var(--background-base-low); 944 | } 945 | .theme-midnight .cardFolder__1a4ef:not(:empty) { 946 | border-top: 1px solid var(--border-subtle); 947 | } 948 | .theme-midnight .scroller__53543 { 949 | background-color: var(--background-base-lowest); 950 | } -------------------------------------------------------------------------------- /clients/amoled-cord.user.css: -------------------------------------------------------------------------------- 1 | @-moz-document domain("discord.com") { 2 | /* ==UserStyle== 3 | @name AMOLED-Cord 4 | @author LuckFire 5 | @description A basically pitch black theme for Discord. Lights out, baby! 6 | @version 5.0.6 7 | @namespace https://github.com/discord-extensions/amoled-cord 8 | @license MIT 9 | ==/UserStyle== */ 10 | 11 | @import url("https://luckfire.github.io/amoled-cord/src/amoled-cord.css"); 12 | 13 | .theme-midnight { 14 | --background-message-hover: var(--opacity-8) !important; 15 | --background-mod-faint: var(--opacity-4) !important; 16 | --background-mod-normal: var(--opacity-16) !important; 17 | --background-mod-strong: var(--opacity-20) !important; 18 | --background-mod-subtle: var(--opacity-8) !important; 19 | --background-modifier-active: var(--opacity-16) !important; 20 | --background-modifier-hover: var(--opacity-8) !important; 21 | --background-modifier-selected: var(--opacity-20) !important; 22 | --background-secondary-alt: var(--neutral-88) !important; 23 | --card-primary-bg: var(--background-base-low) !important; 24 | --modal-background: var(--background-base-lowest) !important; 25 | --modal-footer-background: var(--background-base-lowest) !important; 26 | --scrollbar-auto-scrollbar-color-thumb: var(--neutral-80) !important; 27 | --scrollbar-auto-thumb: var(--neutral-80) !important; 28 | --scrollbar-thin-thumb: var(--neutral-79) !important; 29 | --custom-channel-members-bg: var(--background-base-lowest) !important; 30 | } 31 | 32 | @supports (color: color-mix(in lch, red, blue)) { 33 | .theme-midnight { 34 | --background-message-hover: color-mix( 35 | in oklab, 36 | var(--opacity-8) 100%, 37 | hsl(var(--theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) 38 | var(--theme-base-color-amount, 0%) 39 | ) !important; 40 | --background-secondary-alt: color-mix( 41 | in oklab, 42 | var(--neutral-88) 100%, 43 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 44 | ) !important; 45 | --card-primary-bg: color-mix( 46 | in oklab, 47 | var(--background-base-low) 100%, 48 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 49 | ) !important; 50 | --modal-background: color-mix( 51 | in oklab, 52 | var(--background-base-lowest) 100%, 53 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 54 | ) !important; 55 | --modal-footer-background: color-mix( 56 | in oklab, 57 | var(--background-base-lowest) 100%, 58 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 59 | ) !important; 60 | --scrollbar-auto-scrollbar-color-thumb: color-mix( 61 | in oklab, 62 | var(--neutral-80) 100%, 63 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 64 | ) !important; 65 | --scrollbar-auto-thumb: color-mix( 66 | in oklab, 67 | var(--neutral-80) 100%, 68 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 69 | ) !important; 70 | --scrollbar-thin-thumb: color-mix( 71 | in oklab, 72 | var(--neutral-79) 100%, 73 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 74 | ) !important; 75 | } 76 | } 77 | .theme-midnight .header__0b563 { 78 | background-color: var(--background-base-lowest) !important; 79 | } 80 | .theme-midnight .pageBody__41ed7 { 81 | background-color: var(--background-base-lowest); 82 | } 83 | .theme-midnight .container__0b563 { 84 | background-color: var(--background-base-lowest) !important; 85 | } 86 | .theme-midnight .prompt__5d7c9 { 87 | background-color: var(--background-base-low); 88 | } 89 | .theme-midnight .emptyPage__5d7c9 { 90 | background-color: var(--background-base-lowest); 91 | } 92 | .theme-midnight .profileCard__5d7c9 { 93 | border: 1px solid var(--border-subtle); 94 | } 95 | 96 | .theme-midnight .wrapper_fc8177, 97 | .theme-midnight .wrapper_d852db { 98 | background: var(--background-base-lowest); 99 | } 100 | .theme-midnight .chatContent_f75fb0, 101 | .theme-midnight .container__34c2c, 102 | .theme-midnight .container_fb64c9 { 103 | background: var(--background-base-lowest); 104 | } 105 | .theme-midnight .emptyState__7641b { 106 | border-left: 1px solid var(--app-border-frame); 107 | } 108 | .theme-midnight .wrapper_f7ecac { 109 | background-color: var(--background-surface-high); 110 | } 111 | .theme-midnight .channelTextArea_f75fb0 { 112 | background: var(--background-base-low); 113 | } 114 | .theme-midnight .channelTextArea__74017:not(.inlineContainer__74017) .themedBackground__74017 { 115 | background: var(--background-base-low); 116 | } 117 | .theme-midnight .bannerContainer__362cd { 118 | background: var(--background-base-low); 119 | } 120 | .theme-midnight .formWithLoadedChatInput_f75fb0:before, 121 | .theme-midnight .chatGradient__36d07 { 122 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 100%); 123 | } 124 | .theme-midnight .chatTypingGradientAtBottom__36d07 { 125 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 8px, var(--background-base-lowest) 100%); 126 | } 127 | .theme-midnight .chatTypingGradientNotAtBottom__36d07 { 128 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 72px, var(--background-base-lowest) 100%); 129 | } 130 | .theme-midnight .optionPill__1464f { 131 | border: 1px solid var(--border-faint); 132 | background-color: var(--background-surface-high); 133 | } 134 | .theme-midnight .optionPill__1464f .optionPillKey__1464f { 135 | background-color: var(--background-base-lower); 136 | } 137 | .theme-midnight .stackedBars__74017 { 138 | background: var(--background-surface-high); 139 | } 140 | .theme-midnight .content__44492 .messageContent__44492 { 141 | border: 1px solid var(--border-subtle); 142 | border-bottom: none; 143 | background-color: var(--background-surface-high); 144 | } 145 | .theme-midnight .content__44492 .messageContent__44492 .embedCard__44c9a { 146 | background-color: transparent; 147 | } 148 | .theme-midnight .content__44492 .footerContainer__44492 { 149 | border: 1px solid var(--border-subtle); 150 | } 151 | .theme-midnight .embedCard_b99f57 { 152 | border: 1px solid var(--border-subtle); 153 | background-color: var(--background-surface-high); 154 | } 155 | .theme-midnight .embedCard_b99f57 .cardFooter_b99f57 { 156 | border-top: 1px solid var(--border-subtle); 157 | background-color: var(--background-base-low); 158 | } 159 | .theme-midnight .bumpBox_cacd02 { 160 | background-color: var(--background-base-low); 161 | border: 1px solid var(--border-faint); 162 | } 163 | 164 | .theme-midnight .container_db0ccb, 165 | .theme-midnight .container_a51e6d { 166 | background-color: var(--background-base-lowest); 167 | } 168 | .theme-midnight .sidebarContent_db0ccb { 169 | border-color: var(--app-border-frame); 170 | } 171 | 172 | .theme-midnight .container_f369db { 173 | background-color: var(--background-base-lowest); 174 | } 175 | .theme-midnight .previewForm_d9be46 { 176 | background-color: var(--background-base-low); 177 | border-color: var(--border-faint); 178 | } 179 | .theme-midnight .descriptionContainer_ca49a1 { 180 | background-color: var(--background-base-lowest); 181 | border: 1px solid var(--border-subtle); 182 | } 183 | .theme-midnight .linkContainer_ca49a1 { 184 | background-color: var(--background-base-lowest); 185 | } 186 | .theme-midnight .gradient_ca49a1 { 187 | background: linear-gradient(to top, var(--background-base-lowest), transparent); 188 | } 189 | .theme-midnight .contentPreview__9a337 { 190 | background-color: var(--background-base-lowest); 191 | } 192 | .theme-midnight .textContentFooter__9a337 { 193 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0.97) 36px, hsl(var(--black-hsl)/0.4)); 194 | } 195 | .theme-midnight .textContentFooter__9a337.noTags__9a337 { 196 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0)); 197 | } 198 | 199 | .theme-midnight .container__9293f, 200 | .theme-midnight .chatHeaderBar_a53846 { 201 | --__header-bar-background: var(--background-base-lowest); 202 | } 203 | .theme-midnight .backdrop__8a7fc { 204 | background: var(--background-base-lowest); 205 | } 206 | 207 | .theme-midnight .page_c791b2 { 208 | background-color: var(--background-base-lowest) !important; 209 | } 210 | 211 | .theme-midnight .searchResult__02a39 { 212 | background-color: var(--background-base-lowest); 213 | } 214 | 215 | .theme-midnight .contentContainer__89463, 216 | .theme-midnight .sidebarContainer__89463 { 217 | background-color: var(--background-base-lowest); 218 | } 219 | 220 | .theme-midnight .background__7449f { 221 | background-color: var(--background-base-lowest); 222 | } 223 | .theme-midnight .resourceChannel__7449f:hover { 224 | background-color: var(--background-modifier-hover); 225 | } 226 | .theme-midnight .headerBarInner__7449f:after { 227 | background: linear-gradient(to bottom, rgba(50, 52, 58, 0) 0, var(--background-base-lowest) 100%); 228 | } 229 | 230 | .theme-midnight .opaqueBackground__79d38 { 231 | background: hsl(var(--primary-800-hsl)/0.85); 232 | } 233 | 234 | .theme-midnight .mini_a562c8 .bar_a562c8, 235 | .theme-midnight .slider_a562c8 .bar_a562c8 { 236 | background-color: var(--background-surface-highest); 237 | } 238 | .theme-midnight .markDash_a562c8 { 239 | background-color: var(--background-surface-highest); 240 | } 241 | 242 | .theme-midnight .pageContainer__09fde, 243 | .theme-midnight .emptySearchWrapper__83bd4 { 244 | background-color: var(--background-base-lowest); 245 | } 246 | 247 | .theme-midnight .videoWrapper__2f4f7:not(.wrapper__48b20), 248 | .theme-midnight .streamHidden_c30e20, 249 | .theme-midnight .streamPreview__2f4f7 { 250 | background-color: var(--background-base-low); 251 | } 252 | .theme-midnight .cta_a3a802 { 253 | background-color: var(--button-secondary-background); 254 | } 255 | .theme-midnight .cta_a3a802:hover { 256 | background-color: var(--button-secondary-background-hover); 257 | } 258 | .theme-midnight .participantsButton__211d1, 259 | .theme-midnight .buttonColor__7b3e8 { 260 | background-color: var(--background-surface-higher); 261 | } 262 | .theme-midnight .participantsButton__211d1:hover, 263 | .theme-midnight .buttonColor__7b3e8:hover { 264 | background-color: var(--background-surface-high); 265 | } 266 | .theme-midnight .wrapper_cb9592:has(.resizeHandle__4b144) .callContainer_cb9592 { 267 | border-bottom: 1px solid var(--border-subtle); 268 | } 269 | .theme-midnight .container__664ff { 270 | border-left: 1px solid var(--app-border-frame); 271 | background-color: var(--background-base-lowest); 272 | } 273 | .theme-midnight .background__506d9 { 274 | background-color: var(--background-base-low); 275 | } 276 | .theme-midnight .container__6b38f.pulse__6b38f { 277 | background-color: var(--neutral-95); 278 | border: 1px solid var(--opacity-24); 279 | } 280 | .theme-midnight .container__6b38f.pulse__6b38f:hover { 281 | background-color: var(--opacity-12); 282 | } 283 | .theme-midnight .tileContainer__71eb2:hover { 284 | background-color: var(--opacity-12); 285 | } 286 | 287 | .theme-midnight .editProfileContainer__42179 { 288 | background-color: var(--background-base-low); 289 | } 290 | 291 | .theme-midnight .authBox__921c5 { 292 | background-color: var(--background-base-lowest); 293 | } 294 | 295 | .theme-midnight .container_deee3a { 296 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-blue-end) 0, var(--expressive-gradient-blue-start) 100%); 297 | } 298 | 299 | .theme-midnight .upsellContainer__88422 { 300 | background-color: var(--opacity-8); 301 | } 302 | 303 | .theme-midnight .accountBtnInner__750de, 304 | .theme-midnight .application__750de { 305 | border: 1px solid var(--border-subtle); 306 | } 307 | 308 | .theme-midnight .message__89466 { 309 | background-color: var(--background-base-lowest); 310 | border: 1px solid var(--border-subtle); 311 | } 312 | 313 | .theme-midnight .uploadModal_dbca3c .footer_dbca3c { 314 | background-color: var(--background-base-lowest); 315 | } 316 | 317 | .theme-midnight .gifPicker__6c39d .header_fed6d3 { 318 | background-color: var(--background-base-lowest); 319 | } 320 | 321 | .theme-midnight .footer__67dba { 322 | background-color: var(--background-base-lowest); 323 | } 324 | 325 | .theme-midnight .keyboardShortcutsModal_f061f6 { 326 | background-color: var(--background-base-lowest); 327 | } 328 | 329 | .theme-midnight .scroller_cc2dff { 330 | border-right: 1px solid var(--border-subtle); 331 | background-color: var(--background-base-lowest); 332 | } 333 | 334 | .theme-midnight .container__53cea { 335 | background-color: var(--background-base-lowest); 336 | } 337 | .theme-midnight .bodyControls__53cea:after { 338 | background: radial-gradient(88.69% 87.5% at 50% 87.5%, transparent 0, var(--background-base-lowest) 100%); 339 | } 340 | 341 | .theme-midnight .scroller__6fd0e { 342 | background-color: var(--background-base-lowest); 343 | } 344 | .theme-midnight .headerWave__1dfae { 345 | color: var(--background-base-lowest); 346 | } 347 | .theme-midnight .bodyWaveGradientStop1__1dfae, 348 | .theme-midnight .bodyWaveGradientStop3__1dfae { 349 | stop-color: var(--background-base-lower); 350 | } 351 | .theme-midnight .bodyWaveGradientStop2__1dfae { 352 | stop-color: var(--background-base-low); 353 | } 354 | 355 | .theme-midnight .main_c08b38:not(.fullBorderWithGradient_c08b38) { 356 | border-top: 1px solid var(--app-border-frame); 357 | } 358 | .theme-midnight .prompt_fe70ca { 359 | border: 1px solid var(--border-normal); 360 | } 361 | .theme-midnight .navButtons_fe70ca { 362 | background-color: var(--background-base-lowest); 363 | } 364 | .theme-midnight .termsFieldBody_fe70ca { 365 | background-color: var(--background-base-low); 366 | border: 1px solid var(--border-subtle); 367 | } 368 | 369 | .theme-midnight .premiumBrandRefreshBackground_e5f3a9 { 370 | background-color: var(--background-base-lowest) !important; 371 | } 372 | .theme-midnight .premiumBrandRefreshHeader_e50a4d, 373 | .theme-midnight .skuSelectModalContent_e50a4d.premiumBrandRefreshContent_e50a4d.premiumBrandRefreshContent_e50a4d { 374 | background-color: var(--background-base-lowest); 375 | } 376 | 377 | .theme-midnight .confirmation__1051d { 378 | background-color: var(--background-base-lowest); 379 | } 380 | .theme-midnight .iconWrapper__1051d { 381 | background-color: var(--background-base-low); 382 | } 383 | 384 | .theme-midnight .scroller__01c8c { 385 | border-right: 1px solid var(--border-subtle); 386 | background-color: var(--background-base-lowest); 387 | } 388 | .theme-midnight .container__01c8c, 389 | .theme-midnight .voters__01c8c { 390 | background-color: var(--background-base-lowest); 391 | } 392 | .theme-midnight .voteSelected__01c8c { 393 | background-color: var(--background-base-low); 394 | } 395 | 396 | .theme-midnight .modalRoot__5b400, 397 | .theme-midnight .footer__5b400 { 398 | background-color: var(--background-base-lowest); 399 | } 400 | .theme-midnight .connectionRowHeaderError__5b400 { 401 | background-color: hsl(var(--neutral-95-hsl)/0.7); 402 | } 403 | 404 | .theme-midnight .right__58ae6, 405 | .theme-midnight .rightContent__58ae6 { 406 | background-color: var(--background-base-lowest); 407 | } 408 | 409 | .theme-midnight .sidebarContainer__1d6c7 { 410 | border-right: 1px solid var(--border-subtle); 411 | background-color: var(--background-base-lowest); 412 | } 413 | 414 | .theme-midnight .previewDark__4e29d { 415 | background-color: var(--background-base-lowest); 416 | } 417 | 418 | .theme-midnight .container__08bd2 { 419 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-purple-end) 0, var(--expressive-gradient-purple-start) 100%); 420 | } 421 | 422 | .theme-midnight .relative__8a7fc { 423 | border-bottom: 1px solid var(--app-border-frame); 424 | } 425 | .theme-midnight .relative__8a7fc, 426 | .theme-midnight .scroller__23746, 427 | .theme-midnight .container_cbd375 { 428 | background-color: var(--background-base-lowest); 429 | } 430 | 431 | .theme-midnight .containerSidenav_dc2e0e { 432 | background-color: var(--background-base-lowest); 433 | } 434 | 435 | .theme-midnight .tabBody__133bf, 436 | .theme-midnight .nowPlayingColumn__133bf, 437 | .theme-midnight .container__7d20c, 438 | .theme-midnight .emptyCard__7e549 { 439 | background-color: var(--background-base-lowest); 440 | } 441 | .theme-midnight .body__00943 .section__00943 { 442 | background-color: var(--background-base-lowest); 443 | border: 1px solid var(--border-subtle); 444 | } 445 | .theme-midnight .body__00943 .section__00943:has(+ .separator__00943) { 446 | border-bottom: none; 447 | } 448 | .theme-midnight .body__00943 .wrapper__960df { 449 | background-color: var(--background-base-lowest); 450 | border: 1px solid var(--border-subtle); 451 | } 452 | .theme-midnight .body__00943 .separator__00943 + .section__00943, 453 | .theme-midnight .body__00943 .separator__00943 + .wrapper__960df { 454 | border-top: none; 455 | } 456 | .theme-midnight .addFriendInputWrapper__72ba7:not(:focus-within) { 457 | border-color: var(--input-border); 458 | } 459 | .theme-midnight .addFriendInputWrapper__72ba7 { 460 | background: var(--input-background); 461 | } 462 | .theme-midnight .outer_bf1984 { 463 | background-color: var(--background-base-low); 464 | } 465 | .theme-midnight .outer_bf1984.active_bf1984:hover, .theme-midnight .outer_bf1984.interactive_bf1984:hover { 466 | background-color: var(--background-surface-high); 467 | } 468 | 469 | .theme-midnight .page_c48ade:empty, 470 | .theme-midnight .page_c48ade:has(.loader_c48ade, > div:empty:only-child), 471 | .theme-midnight .noChannel__01d5c { 472 | border-top: 1px solid var(--app-border-frame); 473 | } 474 | 475 | .theme-midnight .container_ad5cdf { 476 | border-top: 1px solid var(--app-border-frame); 477 | } 478 | .theme-midnight .scroller__4a84a, 479 | .theme-midnight .scroller_fb04e1 { 480 | background-color: var(--background-base-lowest); 481 | } 482 | .theme-midnight .installationPath_a6f654 { 483 | box-shadow: 0 1px 0 0 var(--border-subtle); 484 | } 485 | 486 | .theme-midnight .container_f391e3 { 487 | background-color: var(--background-base-lowest); 488 | } 489 | 490 | .theme-midnight .applicationStore_f07d62, 491 | .theme-midnight .mainPageScroller_ca1a02, 492 | .theme-midnight .scroller_c880e8, 493 | .theme-midnight .allPerksScroller_ca1a02 { 494 | background-color: var(--background-base-lowest); 495 | } 496 | .theme-midnight .card_b5493b { 497 | border: 1px solid var(--border-subtle); 498 | background-color: var(--background-surface-high); 499 | } 500 | .theme-midnight .card_b5493b .cardDescription__1f069 { 501 | background-image: linear-gradient(to bottom, var(--background-surface-high) 50%, hsl(var(--primary-800-hsl)/0.75) 80%); 502 | } 503 | .theme-midnight .container_da4aee { 504 | border: 1px solid var(--border-subtle); 505 | background-color: var(--background-surface-high); 506 | } 507 | .theme-midnight .container_da4aee .textContainer_da4aee { 508 | background-image: linear-gradient(to right, var(--background-surface-high), hsl(var(--primary-800-hsl)/40%) 90%, transparent); 509 | } 510 | 511 | .theme-midnight .shop__6db1d, 512 | .theme-midnight .shop__08415, 513 | .theme-midnight .page__1feb0, 514 | .theme-midnight .shopScroll__1feb0, 515 | .theme-midnight .filterBar__1feb0 .filterBar__11877 { 516 | background-color: var(--background-base-lowest); 517 | } 518 | .theme-midnight .darkCardBackground_c3d04b { 519 | background-color: var(--background-base-low); 520 | } 521 | 522 | .theme-midnight .addGamePopout_cc46f0 { 523 | box-shadow: 0 0 0 1px var(--border-subtle), var(--legacy-elevation-high); 524 | background-color: var(--background-base-low); 525 | } 526 | 527 | .theme-midnight .container__5808f { 528 | background-color: var(--background-surface-high); 529 | } 530 | 531 | .theme-midnight .autocomplete__13533 { 532 | border: 1px solid var(--border-faint); 533 | background-color: var(--background-base-low); 534 | } 535 | .theme-midnight .autocomplete__13533 .wrapper__14245 { 536 | background-color: var(--background-base-low); 537 | } 538 | .theme-midnight .autocomplete__13533 .wrapper__4e6ce { 539 | border-right: 1px solid var(--border-faint); 540 | } 541 | 542 | .theme-midnight .autocompleteArrow_d5ae15, 543 | .theme-midnight .header_d5ae15 { 544 | background-color: var(--background-surface-high); 545 | } 546 | .theme-midnight .container_d5ae15 { 547 | background-color: var(--background-base-low); 548 | } 549 | 550 | .theme-midnight .contentWarningPopout_be95d0 { 551 | background-color: var(--background-surface-high); 552 | } 553 | .theme-midnight .footer_be95d0 { 554 | background-color: var(--background-mod-faint); 555 | } 556 | 557 | .theme-midnight .menu_c1e9c4 { 558 | border-color: var(--border-faint); 559 | background-color: var(--background-surface-high); 560 | } 561 | .theme-midnight .button_f563df { 562 | background-color: var(--background-mod-faint); 563 | } 564 | .theme-midnight .button_f563df:hover { 565 | background-color: var(--background-mod-subtle); 566 | } 567 | .theme-midnight .button_f563df:active { 568 | background-color: var(--background-mod-strong); 569 | } 570 | 571 | .theme-midnight .popoutList__92efc { 572 | background-color: var(--background-base-low); 573 | } 574 | 575 | .theme-midnight .popout__3f413 { 576 | background-color: var(--background-base-low); 577 | } 578 | 579 | .theme-midnight .popoutContainer__0f481 { 580 | background-color: color-mix(in oklab, var(--background-surface-high), transparent 10%); 581 | } 582 | .theme-midnight .guildSection_d5cd2d { 583 | background-color: var(--background-base-low); 584 | border-top: 1px solid var(--border-faint); 585 | } 586 | 587 | .theme-midnight .container__2692d, 588 | .theme-midnight .container_fc561d, 589 | .theme-midnight .container_f6bd5f, 590 | .theme-midnight .container__03885 { 591 | border: 1px solid var(--app-border-frame); 592 | background-color: var(--background-base-low); 593 | } 594 | .theme-midnight .channelHeader__35a7e, 595 | .theme-midnight .container__0f711 { 596 | background-color: var(--background-base-low); 597 | } 598 | .theme-midnight .messageContainer__95796, 599 | .theme-midnight .messages__1ccd1, 600 | .theme-midnight .forumPost__7d15e { 601 | background-color: var(--background-base-lowest); 602 | } 603 | .theme-midnight .tutorial__2692d, 604 | .theme-midnight .upsellContainer__4a7f0, 605 | .theme-midnight .icon_d404a3 { 606 | background-color: var(--background-surface-high); 607 | } 608 | 609 | .theme-midnight .messagesPopoutWrap__45690 { 610 | border: 1px solid var(--app-border-frame); 611 | background-color: var(--background-base-low); 612 | } 613 | .theme-midnight .header__45690 { 614 | background-color: var(--background-base-low); 615 | } 616 | .theme-midnight .footer__45690 { 617 | border-top: 1px solid var(--app-border-frame); 618 | background-color: var(--background-surface-high); 619 | } 620 | .theme-midnight .messageGroupWrapper__45690 { 621 | background-color: var(--background-base-lowest); 622 | } 623 | 624 | .theme-midnight .quickSelectPopout_ebaca5 { 625 | border: 1px solid var(--border-faint); 626 | background-color: var(--background-surface-high); 627 | } 628 | .theme-midnight .quickSelectPopoutOption_ebaca5:hover { 629 | background-color: var(--background-mod-faint); 630 | } 631 | .theme-midnight .quickSelectPopoutOption_ebaca5:focus { 632 | background-color: var(--background-mod-subtle); 633 | } 634 | 635 | .theme-midnight .container__55c99 { 636 | background-color: var(--background-base-low); 637 | } 638 | .theme-midnight .queryContainer__55c99 { 639 | border-bottom-color: var(--border-subtle); 640 | } 641 | .theme-midnight .focused__55c99 { 642 | background-color: var(--background-base-lower); 643 | } 644 | .theme-midnight .calendarPicker_d27f17 .react-datepicker, 645 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__header { 646 | background-color: var(--background-base-low); 647 | } 648 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__current-month { 649 | border-bottom-color: var(--border-faint); 650 | } 651 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled, .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled:hover { 652 | background-color: var(--background-base-lower); 653 | } 654 | 655 | .theme-midnight .container_d9c882 { 656 | background-color: var(--background-base-low); 657 | } 658 | .theme-midnight .container_d9c882:not(.browser__9a792) { 659 | border: 1px solid var(--app-border-frame); 660 | } 661 | .theme-midnight .header_d9c882 { 662 | background-color: var(--background-base-low); 663 | } 664 | .theme-midnight .browser__9a792 { 665 | background-color: var(--background-base-lowest); 666 | } 667 | .theme-midnight .browser__9a792 .header_d9c882 { 668 | background-color: var(--background-base-lowest); 669 | } 670 | .theme-midnight .container__6764b { 671 | background-color: var(--background-base-lowest); 672 | } 673 | .theme-midnight .container__6764b:hover { 674 | background-color: var(--background-base-lower); 675 | } 676 | .theme-midnight .icon__1b24f { 677 | background-color: var(--background-surface-high); 678 | } 679 | 680 | .theme-midnight .sidebarRegionScroller__23e6b { 681 | border-right: 1px solid var(--app-border-frame); 682 | } 683 | 684 | .theme-midnight .contentRegion__23e6b, 685 | .theme-midnight .contentRegionScroller__23e6b { 686 | background: var(--background-base-lowest); 687 | } 688 | .theme-midnight .content_e9e3ed, 689 | .theme-midnight .sidebar__409aa { 690 | background-color: var(--background-base-lowest); 691 | } 692 | .theme-midnight .accountProfileCard__1fed1 { 693 | background-color: var(--background-base-low); 694 | border: 1px solid var(--border-subtle); 695 | } 696 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 { 697 | border: 1px solid var(--border-subtle); 698 | background-color: var(--background-base-lowest); 699 | } 700 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 .fieldList__1fed1 { 701 | background-color: var(--background-base-lowest); 702 | } 703 | .theme-midnight .emptyContainer_de8069 { 704 | border: 1px solid var(--border-faint); 705 | background-color: var(--background-base-low); 706 | } 707 | .theme-midnight .card__5cea9 { 708 | border: 1px solid var(--border-faint); 709 | } 710 | .theme-midnight .card__5cea9 .header__5cea9 { 711 | border-bottom: 1px solid var(--border-faint); 712 | background-color: var(--background-base-low); 713 | } 714 | .theme-midnight .box_f8c98c { 715 | border-color: var(--border-faint); 716 | background-color: var(--background-base-low); 717 | } 718 | .theme-midnight .headerV2__50a54 { 719 | border-bottom: 1px solid var(--border-faint); 720 | background-color: var(--background-base-low); 721 | } 722 | .theme-midnight .authedAppV2__50a54 { 723 | border: 1px solid var(--border-faint); 724 | background-color: var(--background-base-lower); 725 | } 726 | .theme-midnight .connectContainer_c7f964 { 727 | border: 1px solid var(--border-faint); 728 | background-color: var(--background-base-low); 729 | } 730 | .theme-midnight .accountButtonInner_c7f964, 731 | .theme-midnight .accountAddInner_c7f964 { 732 | border: 1px solid var(--border-subtle); 733 | } 734 | .theme-midnight .accountButtonInner_c7f964:not(:hover), 735 | .theme-midnight .accountAddInner_c7f964:not(:hover) { 736 | background-color: var(--background-base-lower); 737 | } 738 | .theme-midnight .connection_c7f964 { 739 | border: 1px solid var(--border-faint); 740 | background-color: var(--background-base-lower); 741 | } 742 | .theme-midnight .connection_c7f964 .connectionHeader_c7f964 { 743 | border-bottom: 1px solid var(--border-faint); 744 | background-color: var(--background-base-low); 745 | } 746 | .theme-midnight .connection_c7f964 .metadataContainer_c7f964 { 747 | border: 1px solid var(--border-faint); 748 | background-color: var(--background-base-lowest); 749 | } 750 | .theme-midnight .connection_c7f964 .integrationWrapper_c7f964 { 751 | border: 1px solid var(--border-faint); 752 | background-color: var(--background-base-lowest); 753 | } 754 | .theme-midnight .expandedProgressBarContainerSettingsPage_a61c56, 755 | .theme-midnight .giftCard_a45ed3 { 756 | border: 1px solid var(--border-faint); 757 | background-color: var(--background-base-low); 758 | } 759 | .theme-midnight .perkCard_b62c4e { 760 | border: 1px solid var(--border-faint); 761 | background-color: var(--background-base-low); 762 | } 763 | .theme-midnight .rowBottomBorder_e4ef5c { 764 | border-color: var(--border-subtle); 765 | } 766 | .theme-midnight .appliedBoostContainer_ceb06a { 767 | border: 1px solid var(--border-faint); 768 | background-color: var(--background-base-low); 769 | } 770 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainerSeparator_ceb06a { 771 | background-color: var(--border-subtle); 772 | } 773 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainer_ceb06a { 774 | background-color: var(--background-base-low); 775 | } 776 | .theme-midnight .appliedBoostContainer_ceb06a .guildContainer__5dba5:not(.recommendedServerCard__51537) { 777 | border-bottom: 1px solid var(--border-faint); 778 | } 779 | .theme-midnight .wave__8e08c { 780 | fill: var(--background-base-lowest); 781 | } 782 | .theme-midnight .guildContainer__5dba5 { 783 | background-color: var(--background-base-low); 784 | } 785 | .theme-midnight .guildContainer__5dba5.recommendedServerCard__51537 { 786 | border: 1px solid var(--border-faint); 787 | } 788 | .theme-midnight .wrapper__5b98e { 789 | border: 1px solid var(--border-faint); 790 | background-color: var(--background-base-low); 791 | } 792 | .theme-midnight .wrapper__5b98e .list__5b98e { 793 | border-color: var(--border-subtle); 794 | } 795 | .theme-midnight .wrapper__5b98e .listItem__5b98e { 796 | border-color: var(--border-subtle); 797 | } 798 | .theme-midnight .detailsBlock_e335a7 { 799 | border: 1px solid var(--border-faint); 800 | background-color: var(--background-base-low); 801 | } 802 | .theme-midnight .accountCreditsContainer__94f72 .accountCreditRow__94f72:not(:last-child) { 803 | border-bottom: 1px solid var(--border-faint); 804 | } 805 | .theme-midnight .fractionalPremiumAccountCredit__94f72, 806 | .theme-midnight .premiumSubscriptionAccountCredit__94f72 { 807 | border: 1px solid var(--border-faint); 808 | background-color: var(--background-base-low); 809 | } 810 | .theme-midnight .fractionalTimeRemainingRow__94f72 { 811 | background-color: var(--background-base-lower); 812 | } 813 | .theme-midnight .paymentPane__01014 { 814 | background-color: var(--background-base-low); 815 | } 816 | .theme-midnight .paymentPane__01014 .payment_e9cb00 { 817 | background-color: var(--background-base-low); 818 | } 819 | .theme-midnight .paymentPane__01014 .expandedInfo_e9cb00 { 820 | background-color: var(--background-base-lowest); 821 | } 822 | .theme-midnight .preview__3e443 { 823 | background-color: var(--background-base-lowest); 824 | } 825 | .theme-midnight .container_a1d343 { 826 | background-color: var(--background-base-low); 827 | border: 1px solid var(--border-subtle); 828 | } 829 | .theme-midnight .preview__5d148 { 830 | background-color: var(--background-base-lowest); 831 | } 832 | .theme-midnight .notches__06283.gray__06283 { 833 | color: var(--background-base-lowest); 834 | } 835 | .theme-midnight .progress__06283 { 836 | background-color: var(--background-surface-highest); 837 | } 838 | .theme-midnight .sliderBar_ac7648:not(.speaking_ac7648) { 839 | background-color: var(--background-surface-highest); 840 | } 841 | .theme-midnight .cameraWrapper_d41d5f { 842 | background-color: var(--background-base-low); 843 | border-color: var(--border-subtle); 844 | } 845 | .theme-midnight .backgroundOptionInner__53965 { 846 | background-color: var(--background-base-low); 847 | } 848 | .theme-midnight .headerContainer__7db08 { 849 | background-color: var(--background-base-lowest); 850 | } 851 | .theme-midnight .game_cc46f0 { 852 | box-shadow: 0 1px 0 0 var(--border-subtle); 853 | } 854 | .theme-midnight .avatarUploaderInnerSquareDisabled_e04502 { 855 | background-color: var(--background-surface-high); 856 | } 857 | .theme-midnight .wrapper__83b1d { 858 | background-color: var(--background-surface-high); 859 | } 860 | .theme-midnight .wrapper__83b1d:focus-within, .theme-midnight .wrapper__83b1d:hover { 861 | background-color: var(--background-mod-subtle); 862 | } 863 | .theme-midnight .titleContainer_e29cd7, 864 | .theme-midnight .header_c6bf1b { 865 | background-color: var(--background-base-lowest); 866 | } 867 | .theme-midnight .theme-midnight.messageWrapper__981c8 { 868 | background-color: var(--background-base-lowest); 869 | } 870 | .theme-midnight .joinOptions__959cb { 871 | background-color: var(--background-base-low); 872 | } 873 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.uninteractive__959cb:hover { 874 | background-color: var(--background-base-low); 875 | } 876 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.active__959cb { 877 | background-color: var(--background-surface-high); 878 | } 879 | .theme-midnight .header__812a7 { 880 | background-color: var(--background-base-low); 881 | border-bottom: 1px solid var(--border-faint); 882 | } 883 | .theme-midnight .container__812a7 { 884 | background-color: var(--background-base-lower); 885 | } 886 | .theme-midnight .actionContainer__6446f, 887 | .theme-midnight .mentionLimitContainer_ed9c90 { 888 | background-color: var(--background-surface-higher); 889 | } 890 | .theme-midnight .actionContainer_bc4513 { 891 | background-color: var(--background-surface-highest); 892 | } 893 | .theme-midnight .editCard_a25a68 { 894 | background-color: var(--background-base-low); 895 | } 896 | .theme-midnight .collapseable__217b7:is(.collapseable__4546e, .collapseable_fc46b1) { 897 | background-color: var(--background-surface-high); 898 | } 899 | .theme-midnight .bannedUser_cdb2b0:not(:hover) { 900 | background-color: var(--background-surface-higher); 901 | } 902 | .theme-midnight .notice_a9b452, 903 | .theme-midnight .review_a9b452 { 904 | background-color: var(--background-base-low); 905 | border: 1px solid var(--border-subtle); 906 | } 907 | .theme-midnight .onboardingStepContainer__28e57 { 908 | border-left: 1px solid var(--border-subtle); 909 | border-right: 1px solid var(--border-subtle); 910 | } 911 | .theme-midnight .onboardingStepContainer__28e57:last-child { 912 | border-bottom: 1px solid var(--border-subtle); 913 | } 914 | .theme-midnight .container__5d756 { 915 | border: 1px solid var(--border-subtle); 916 | } 917 | .theme-midnight .example__5d756 { 918 | background-color: var(--background-surface-high); 919 | } 920 | .theme-midnight .channelCoverage_e34850 { 921 | background-color: var(--background-base-low); 922 | } 923 | .theme-midnight .actionItem_d2b0e4, 924 | .theme-midnight .resourceChannel_d2b0e4, 925 | .theme-midnight .suggestedChannels_d2b0e4 { 926 | background-color: var(--background-base-low); 927 | } 928 | .theme-midnight .howItWorksContainer_dd30dc, 929 | .theme-midnight .creatorBenefitCard__02e4c, 930 | .theme-midnight .guildCard__2485e { 931 | border: 1px solid var(--border-faint); 932 | background-color: var(--background-surface-high); 933 | } 934 | .theme-midnight .descriptionBox__981f7 { 935 | border: 1px solid var(--border-subtle); 936 | background-color: var(--background-base-low); 937 | } 938 | .theme-midnight .settingCard__1a4ef { 939 | border: 1px solid var(--border-subtle); 940 | } 941 | .theme-midnight .settingCard__1a4ef.active__1a4ef { 942 | background-color: var(--background-base-low); 943 | } 944 | .theme-midnight .cardFolder__1a4ef:not(:empty) { 945 | border-top: 1px solid var(--border-subtle); 946 | } 947 | .theme-midnight .scroller__53543 { 948 | background-color: var(--background-base-lowest); 949 | } 950 | } -------------------------------------------------------------------------------- /clients/metas/betterdiscord.json: -------------------------------------------------------------------------------- 1 | { 2 | "invite": "vYdXbEzqDs", 3 | "authorId": "399416615742996480", 4 | "source": "https://github.com/LuckFire/amoled-cord", 5 | "updateUrl": "https://github.com/LuckFire/amoled-cord/blob/main/clients/amoled-cord.theme.css" 6 | } -------------------------------------------------------------------------------- /clients/metas/userstyle.json: -------------------------------------------------------------------------------- 1 | { 2 | "namespace": "https://github.com/discord-extensions/amoled-cord", 3 | "license": "MIT" 4 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "amoled-cord", 3 | "version": "5.0.6", 4 | "description": "A basically pitch black theme for Discord. Lights out, baby!", 5 | "author": "LuckFire", 6 | "scripts": { 7 | "dev": "theme-scss dev", 8 | "build": "theme-scss build", 9 | "bump:patch": "pnpm version --commit-hooks false --git-tag-version false patch", 10 | "bump:minor": "pnpm version --commit-hooks false --git-tag-version false minor", 11 | "bump:major": "pnpm version --commit-hooks false --git-tag-version false major" 12 | }, 13 | "dependencies": { 14 | "theme-scss": "^1.1.2" 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/amoled-cord.css: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | --background-message-hover: var(--opacity-8) !important; 3 | --background-mod-faint: var(--opacity-4) !important; 4 | --background-mod-normal: var(--opacity-16) !important; 5 | --background-mod-strong: var(--opacity-20) !important; 6 | --background-mod-subtle: var(--opacity-8) !important; 7 | --background-modifier-active: var(--opacity-16) !important; 8 | --background-modifier-hover: var(--opacity-8) !important; 9 | --background-modifier-selected: var(--opacity-20) !important; 10 | --background-secondary-alt: var(--neutral-88) !important; 11 | --card-primary-bg: var(--background-base-low) !important; 12 | --modal-background: var(--background-base-lowest) !important; 13 | --modal-footer-background: var(--background-base-lowest) !important; 14 | --scrollbar-auto-scrollbar-color-thumb: var(--neutral-80) !important; 15 | --scrollbar-auto-thumb: var(--neutral-80) !important; 16 | --scrollbar-thin-thumb: var(--neutral-79) !important; 17 | --custom-channel-members-bg: var(--background-base-lowest) !important; 18 | } 19 | 20 | @supports (color: color-mix(in lch, red, blue)) { 21 | .theme-midnight { 22 | --background-message-hover: color-mix( 23 | in oklab, 24 | var(--opacity-8) 100%, 25 | hsl(var(--theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) 26 | var(--theme-base-color-amount, 0%) 27 | ) !important; 28 | --background-secondary-alt: color-mix( 29 | in oklab, 30 | var(--neutral-88) 100%, 31 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 32 | ) !important; 33 | --card-primary-bg: color-mix( 34 | in oklab, 35 | var(--background-base-low) 100%, 36 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 37 | ) !important; 38 | --modal-background: color-mix( 39 | in oklab, 40 | var(--background-base-lowest) 100%, 41 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 42 | ) !important; 43 | --modal-footer-background: color-mix( 44 | in oklab, 45 | var(--background-base-lowest) 100%, 46 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 47 | ) !important; 48 | --scrollbar-auto-scrollbar-color-thumb: color-mix( 49 | in oklab, 50 | var(--neutral-80) 100%, 51 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 52 | ) !important; 53 | --scrollbar-auto-thumb: color-mix( 54 | in oklab, 55 | var(--neutral-80) 100%, 56 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 57 | ) !important; 58 | --scrollbar-thin-thumb: color-mix( 59 | in oklab, 60 | var(--neutral-79) 100%, 61 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 62 | ) !important; 63 | } 64 | } 65 | .theme-midnight .header__0b563 { 66 | background-color: var(--background-base-lowest) !important; 67 | } 68 | .theme-midnight .pageBody__41ed7 { 69 | background-color: var(--background-base-lowest); 70 | } 71 | .theme-midnight .container__0b563 { 72 | background-color: var(--background-base-lowest) !important; 73 | } 74 | .theme-midnight .prompt__5d7c9 { 75 | background-color: var(--background-base-low); 76 | } 77 | .theme-midnight .emptyPage__5d7c9 { 78 | background-color: var(--background-base-lowest); 79 | } 80 | .theme-midnight .profileCard__5d7c9 { 81 | border: 1px solid var(--border-subtle); 82 | } 83 | 84 | .theme-midnight .wrapper_fc8177, 85 | .theme-midnight .wrapper_d852db { 86 | background: var(--background-base-lowest); 87 | } 88 | .theme-midnight .chatContent_f75fb0, 89 | .theme-midnight .container__34c2c, 90 | .theme-midnight .container_fb64c9 { 91 | background: var(--background-base-lowest); 92 | } 93 | .theme-midnight .emptyState__7641b { 94 | border-left: 1px solid var(--app-border-frame); 95 | } 96 | .theme-midnight .wrapper_f7ecac { 97 | background-color: var(--background-surface-high); 98 | } 99 | .theme-midnight .channelTextArea_f75fb0 { 100 | background: var(--background-base-low); 101 | } 102 | .theme-midnight .channelTextArea__74017:not(.inlineContainer__74017) .themedBackground__74017 { 103 | background: var(--background-base-low); 104 | } 105 | .theme-midnight .bannerContainer__362cd { 106 | background: var(--background-base-low); 107 | } 108 | .theme-midnight .formWithLoadedChatInput_f75fb0:before, 109 | .theme-midnight .chatGradient__36d07 { 110 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 100%); 111 | } 112 | .theme-midnight .chatTypingGradientAtBottom__36d07 { 113 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 8px, var(--background-base-lowest) 100%); 114 | } 115 | .theme-midnight .chatTypingGradientNotAtBottom__36d07 { 116 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 72px, var(--background-base-lowest) 100%); 117 | } 118 | .theme-midnight .optionPill__1464f { 119 | border: 1px solid var(--border-faint); 120 | background-color: var(--background-surface-high); 121 | } 122 | .theme-midnight .optionPill__1464f .optionPillKey__1464f { 123 | background-color: var(--background-base-lower); 124 | } 125 | .theme-midnight .stackedBars__74017 { 126 | background: var(--background-surface-high); 127 | } 128 | .theme-midnight .content__44492 .messageContent__44492 { 129 | border: 1px solid var(--border-subtle); 130 | border-bottom: none; 131 | background-color: var(--background-surface-high); 132 | } 133 | .theme-midnight .content__44492 .messageContent__44492 .embedCard__44c9a { 134 | background-color: transparent; 135 | } 136 | .theme-midnight .content__44492 .footerContainer__44492 { 137 | border: 1px solid var(--border-subtle); 138 | } 139 | .theme-midnight .embedCard_b99f57 { 140 | border: 1px solid var(--border-subtle); 141 | background-color: var(--background-surface-high); 142 | } 143 | .theme-midnight .embedCard_b99f57 .cardFooter_b99f57 { 144 | border-top: 1px solid var(--border-subtle); 145 | background-color: var(--background-base-low); 146 | } 147 | .theme-midnight .bumpBox_cacd02 { 148 | background-color: var(--background-base-low); 149 | border: 1px solid var(--border-faint); 150 | } 151 | 152 | .theme-midnight .container_db0ccb, 153 | .theme-midnight .container_a51e6d { 154 | background-color: var(--background-base-lowest); 155 | } 156 | .theme-midnight .sidebarContent_db0ccb { 157 | border-color: var(--app-border-frame); 158 | } 159 | 160 | .theme-midnight .container_f369db { 161 | background-color: var(--background-base-lowest); 162 | } 163 | .theme-midnight .previewForm_d9be46 { 164 | background-color: var(--background-base-low); 165 | border-color: var(--border-faint); 166 | } 167 | .theme-midnight .descriptionContainer_ca49a1 { 168 | background-color: var(--background-base-lowest); 169 | border: 1px solid var(--border-subtle); 170 | } 171 | .theme-midnight .linkContainer_ca49a1 { 172 | background-color: var(--background-base-lowest); 173 | } 174 | .theme-midnight .gradient_ca49a1 { 175 | background: linear-gradient(to top, var(--background-base-lowest), transparent); 176 | } 177 | .theme-midnight .contentPreview__9a337 { 178 | background-color: var(--background-base-lowest); 179 | } 180 | .theme-midnight .textContentFooter__9a337 { 181 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0.97) 36px, hsl(var(--black-hsl)/0.4)); 182 | } 183 | .theme-midnight .textContentFooter__9a337.noTags__9a337 { 184 | background: linear-gradient(to top, hsl(var(--black-hsl)/1), hsl(var(--black-hsl)/0)); 185 | } 186 | 187 | .theme-midnight .container__9293f, 188 | .theme-midnight .chatHeaderBar_a53846 { 189 | --__header-bar-background: var(--background-base-lowest); 190 | } 191 | .theme-midnight .backdrop__8a7fc { 192 | background: var(--background-base-lowest); 193 | } 194 | 195 | .theme-midnight .page_c791b2 { 196 | background-color: var(--background-base-lowest) !important; 197 | } 198 | 199 | .theme-midnight .searchResult__02a39 { 200 | background-color: var(--background-base-lowest); 201 | } 202 | 203 | .theme-midnight .contentContainer__89463, 204 | .theme-midnight .sidebarContainer__89463 { 205 | background-color: var(--background-base-lowest); 206 | } 207 | 208 | .theme-midnight .background__7449f { 209 | background-color: var(--background-base-lowest); 210 | } 211 | .theme-midnight .resourceChannel__7449f:hover { 212 | background-color: var(--background-modifier-hover); 213 | } 214 | .theme-midnight .headerBarInner__7449f:after { 215 | background: linear-gradient(to bottom, rgba(50, 52, 58, 0) 0, var(--background-base-lowest) 100%); 216 | } 217 | 218 | .theme-midnight .opaqueBackground__79d38 { 219 | background: hsl(var(--primary-800-hsl)/0.85); 220 | } 221 | 222 | .theme-midnight .mini_a562c8 .bar_a562c8, 223 | .theme-midnight .slider_a562c8 .bar_a562c8 { 224 | background-color: var(--background-surface-highest); 225 | } 226 | .theme-midnight .markDash_a562c8 { 227 | background-color: var(--background-surface-highest); 228 | } 229 | 230 | .theme-midnight .pageContainer__09fde, 231 | .theme-midnight .emptySearchWrapper__83bd4 { 232 | background-color: var(--background-base-lowest); 233 | } 234 | 235 | .theme-midnight .videoWrapper__2f4f7:not(.wrapper__48b20), 236 | .theme-midnight .streamHidden_c30e20, 237 | .theme-midnight .streamPreview__2f4f7 { 238 | background-color: var(--background-base-low); 239 | } 240 | .theme-midnight .cta_a3a802 { 241 | background-color: var(--button-secondary-background); 242 | } 243 | .theme-midnight .cta_a3a802:hover { 244 | background-color: var(--button-secondary-background-hover); 245 | } 246 | .theme-midnight .participantsButton__211d1, 247 | .theme-midnight .buttonColor__7b3e8 { 248 | background-color: var(--background-surface-higher); 249 | } 250 | .theme-midnight .participantsButton__211d1:hover, 251 | .theme-midnight .buttonColor__7b3e8:hover { 252 | background-color: var(--background-surface-high); 253 | } 254 | .theme-midnight .wrapper_cb9592:has(.resizeHandle__4b144) .callContainer_cb9592 { 255 | border-bottom: 1px solid var(--border-subtle); 256 | } 257 | .theme-midnight .container__664ff { 258 | border-left: 1px solid var(--app-border-frame); 259 | background-color: var(--background-base-lowest); 260 | } 261 | .theme-midnight .background__506d9 { 262 | background-color: var(--background-base-low); 263 | } 264 | .theme-midnight .container__6b38f.pulse__6b38f { 265 | background-color: var(--neutral-95); 266 | border: 1px solid var(--opacity-24); 267 | } 268 | .theme-midnight .container__6b38f.pulse__6b38f:hover { 269 | background-color: var(--opacity-12); 270 | } 271 | .theme-midnight .tileContainer__71eb2:hover { 272 | background-color: var(--opacity-12); 273 | } 274 | 275 | .theme-midnight .editProfileContainer__42179 { 276 | background-color: var(--background-base-low); 277 | } 278 | 279 | .theme-midnight .authBox__921c5 { 280 | background-color: var(--background-base-lowest); 281 | } 282 | 283 | .theme-midnight .container_deee3a { 284 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-blue-end) 0, var(--expressive-gradient-blue-start) 100%); 285 | } 286 | 287 | .theme-midnight .upsellContainer__88422 { 288 | background-color: var(--opacity-8); 289 | } 290 | 291 | .theme-midnight .accountBtnInner__750de, 292 | .theme-midnight .application__750de { 293 | border: 1px solid var(--border-subtle); 294 | } 295 | 296 | .theme-midnight .message__89466 { 297 | background-color: var(--background-base-lowest); 298 | border: 1px solid var(--border-subtle); 299 | } 300 | 301 | .theme-midnight .uploadModal_dbca3c .footer_dbca3c { 302 | background-color: var(--background-base-lowest); 303 | } 304 | 305 | .theme-midnight .gifPicker__6c39d .header_fed6d3 { 306 | background-color: var(--background-base-lowest); 307 | } 308 | 309 | .theme-midnight .footer__67dba { 310 | background-color: var(--background-base-lowest); 311 | } 312 | 313 | .theme-midnight .keyboardShortcutsModal_f061f6 { 314 | background-color: var(--background-base-lowest); 315 | } 316 | 317 | .theme-midnight .scroller_cc2dff { 318 | border-right: 1px solid var(--border-subtle); 319 | background-color: var(--background-base-lowest); 320 | } 321 | 322 | .theme-midnight .container__53cea { 323 | background-color: var(--background-base-lowest); 324 | } 325 | .theme-midnight .bodyControls__53cea:after { 326 | background: radial-gradient(88.69% 87.5% at 50% 87.5%, transparent 0, var(--background-base-lowest) 100%); 327 | } 328 | 329 | .theme-midnight .scroller__6fd0e { 330 | background-color: var(--background-base-lowest); 331 | } 332 | .theme-midnight .headerWave__1dfae { 333 | color: var(--background-base-lowest); 334 | } 335 | .theme-midnight .bodyWaveGradientStop1__1dfae, 336 | .theme-midnight .bodyWaveGradientStop3__1dfae { 337 | stop-color: var(--background-base-lower); 338 | } 339 | .theme-midnight .bodyWaveGradientStop2__1dfae { 340 | stop-color: var(--background-base-low); 341 | } 342 | 343 | .theme-midnight .main_c08b38:not(.fullBorderWithGradient_c08b38) { 344 | border-top: 1px solid var(--app-border-frame); 345 | } 346 | .theme-midnight .prompt_fe70ca { 347 | border: 1px solid var(--border-normal); 348 | } 349 | .theme-midnight .navButtons_fe70ca { 350 | background-color: var(--background-base-lowest); 351 | } 352 | .theme-midnight .termsFieldBody_fe70ca { 353 | background-color: var(--background-base-low); 354 | border: 1px solid var(--border-subtle); 355 | } 356 | 357 | .theme-midnight .premiumBrandRefreshBackground_e5f3a9 { 358 | background-color: var(--background-base-lowest) !important; 359 | } 360 | .theme-midnight .premiumBrandRefreshHeader_e50a4d, 361 | .theme-midnight .skuSelectModalContent_e50a4d.premiumBrandRefreshContent_e50a4d.premiumBrandRefreshContent_e50a4d { 362 | background-color: var(--background-base-lowest); 363 | } 364 | 365 | .theme-midnight .confirmation__1051d { 366 | background-color: var(--background-base-lowest); 367 | } 368 | .theme-midnight .iconWrapper__1051d { 369 | background-color: var(--background-base-low); 370 | } 371 | 372 | .theme-midnight .scroller__01c8c { 373 | border-right: 1px solid var(--border-subtle); 374 | background-color: var(--background-base-lowest); 375 | } 376 | .theme-midnight .container__01c8c, 377 | .theme-midnight .voters__01c8c { 378 | background-color: var(--background-base-lowest); 379 | } 380 | .theme-midnight .voteSelected__01c8c { 381 | background-color: var(--background-base-low); 382 | } 383 | 384 | .theme-midnight .modalRoot__5b400, 385 | .theme-midnight .footer__5b400 { 386 | background-color: var(--background-base-lowest); 387 | } 388 | .theme-midnight .connectionRowHeaderError__5b400 { 389 | background-color: hsl(var(--neutral-95-hsl)/0.7); 390 | } 391 | 392 | .theme-midnight .right__58ae6, 393 | .theme-midnight .rightContent__58ae6 { 394 | background-color: var(--background-base-lowest); 395 | } 396 | 397 | .theme-midnight .sidebarContainer__1d6c7 { 398 | border-right: 1px solid var(--border-subtle); 399 | background-color: var(--background-base-lowest); 400 | } 401 | 402 | .theme-midnight .previewDark__4e29d { 403 | background-color: var(--background-base-lowest); 404 | } 405 | 406 | .theme-midnight .container__08bd2 { 407 | background: radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), linear-gradient(270deg, var(--expressive-gradient-purple-end) 0, var(--expressive-gradient-purple-start) 100%); 408 | } 409 | 410 | .theme-midnight .relative__8a7fc { 411 | border-bottom: 1px solid var(--app-border-frame); 412 | } 413 | .theme-midnight .relative__8a7fc, 414 | .theme-midnight .scroller__23746, 415 | .theme-midnight .container_cbd375 { 416 | background-color: var(--background-base-lowest); 417 | } 418 | 419 | .theme-midnight .containerSidenav_dc2e0e { 420 | background-color: var(--background-base-lowest); 421 | } 422 | 423 | .theme-midnight .tabBody__133bf, 424 | .theme-midnight .nowPlayingColumn__133bf, 425 | .theme-midnight .container__7d20c, 426 | .theme-midnight .emptyCard__7e549 { 427 | background-color: var(--background-base-lowest); 428 | } 429 | .theme-midnight .body__00943 .section__00943 { 430 | background-color: var(--background-base-lowest); 431 | border: 1px solid var(--border-subtle); 432 | } 433 | .theme-midnight .body__00943 .section__00943:has(+ .separator__00943) { 434 | border-bottom: none; 435 | } 436 | .theme-midnight .body__00943 .wrapper__960df { 437 | background-color: var(--background-base-lowest); 438 | border: 1px solid var(--border-subtle); 439 | } 440 | .theme-midnight .body__00943 .separator__00943 + .section__00943, 441 | .theme-midnight .body__00943 .separator__00943 + .wrapper__960df { 442 | border-top: none; 443 | } 444 | .theme-midnight .addFriendInputWrapper__72ba7:not(:focus-within) { 445 | border-color: var(--input-border); 446 | } 447 | .theme-midnight .addFriendInputWrapper__72ba7 { 448 | background: var(--input-background); 449 | } 450 | .theme-midnight .outer_bf1984 { 451 | background-color: var(--background-base-low); 452 | } 453 | .theme-midnight .outer_bf1984.active_bf1984:hover, .theme-midnight .outer_bf1984.interactive_bf1984:hover { 454 | background-color: var(--background-surface-high); 455 | } 456 | 457 | .theme-midnight .page_c48ade:empty, 458 | .theme-midnight .page_c48ade:has(.loader_c48ade, > div:empty:only-child), 459 | .theme-midnight .noChannel__01d5c { 460 | border-top: 1px solid var(--app-border-frame); 461 | } 462 | 463 | .theme-midnight .container_ad5cdf { 464 | border-top: 1px solid var(--app-border-frame); 465 | } 466 | .theme-midnight .scroller__4a84a, 467 | .theme-midnight .scroller_fb04e1 { 468 | background-color: var(--background-base-lowest); 469 | } 470 | .theme-midnight .installationPath_a6f654 { 471 | box-shadow: 0 1px 0 0 var(--border-subtle); 472 | } 473 | 474 | .theme-midnight .container_f391e3 { 475 | background-color: var(--background-base-lowest); 476 | } 477 | 478 | .theme-midnight .applicationStore_f07d62, 479 | .theme-midnight .mainPageScroller_ca1a02, 480 | .theme-midnight .scroller_c880e8, 481 | .theme-midnight .allPerksScroller_ca1a02 { 482 | background-color: var(--background-base-lowest); 483 | } 484 | .theme-midnight .card_b5493b { 485 | border: 1px solid var(--border-subtle); 486 | background-color: var(--background-surface-high); 487 | } 488 | .theme-midnight .card_b5493b .cardDescription__1f069 { 489 | background-image: linear-gradient(to bottom, var(--background-surface-high) 50%, hsl(var(--primary-800-hsl)/0.75) 80%); 490 | } 491 | .theme-midnight .container_da4aee { 492 | border: 1px solid var(--border-subtle); 493 | background-color: var(--background-surface-high); 494 | } 495 | .theme-midnight .container_da4aee .textContainer_da4aee { 496 | background-image: linear-gradient(to right, var(--background-surface-high), hsl(var(--primary-800-hsl)/40%) 90%, transparent); 497 | } 498 | 499 | .theme-midnight .shop__6db1d, 500 | .theme-midnight .shop__08415, 501 | .theme-midnight .page__1feb0, 502 | .theme-midnight .shopScroll__1feb0, 503 | .theme-midnight .filterBar__1feb0 .filterBar__11877 { 504 | background-color: var(--background-base-lowest); 505 | } 506 | .theme-midnight .darkCardBackground_c3d04b { 507 | background-color: var(--background-base-low); 508 | } 509 | 510 | .theme-midnight .addGamePopout_cc46f0 { 511 | box-shadow: 0 0 0 1px var(--border-subtle), var(--legacy-elevation-high); 512 | background-color: var(--background-base-low); 513 | } 514 | 515 | .theme-midnight .container__5808f { 516 | background-color: var(--background-surface-high); 517 | } 518 | 519 | .theme-midnight .autocomplete__13533 { 520 | border: 1px solid var(--border-faint); 521 | background-color: var(--background-base-low); 522 | } 523 | .theme-midnight .autocomplete__13533 .wrapper__14245 { 524 | background-color: var(--background-base-low); 525 | } 526 | .theme-midnight .autocomplete__13533 .wrapper__4e6ce { 527 | border-right: 1px solid var(--border-faint); 528 | } 529 | 530 | .theme-midnight .autocompleteArrow_d5ae15, 531 | .theme-midnight .header_d5ae15 { 532 | background-color: var(--background-surface-high); 533 | } 534 | .theme-midnight .container_d5ae15 { 535 | background-color: var(--background-base-low); 536 | } 537 | 538 | .theme-midnight .contentWarningPopout_be95d0 { 539 | background-color: var(--background-surface-high); 540 | } 541 | .theme-midnight .footer_be95d0 { 542 | background-color: var(--background-mod-faint); 543 | } 544 | 545 | .theme-midnight .menu_c1e9c4 { 546 | border-color: var(--border-faint); 547 | background-color: var(--background-surface-high); 548 | } 549 | .theme-midnight .button_f563df { 550 | background-color: var(--background-mod-faint); 551 | } 552 | .theme-midnight .button_f563df:hover { 553 | background-color: var(--background-mod-subtle); 554 | } 555 | .theme-midnight .button_f563df:active { 556 | background-color: var(--background-mod-strong); 557 | } 558 | 559 | .theme-midnight .popoutList__92efc { 560 | background-color: var(--background-base-low); 561 | } 562 | 563 | .theme-midnight .popout__3f413 { 564 | background-color: var(--background-base-low); 565 | } 566 | 567 | .theme-midnight .popoutContainer__0f481 { 568 | background-color: color-mix(in oklab, var(--background-surface-high), transparent 10%); 569 | } 570 | .theme-midnight .guildSection_d5cd2d { 571 | background-color: var(--background-base-low); 572 | border-top: 1px solid var(--border-faint); 573 | } 574 | 575 | .theme-midnight .container__2692d, 576 | .theme-midnight .container_fc561d, 577 | .theme-midnight .container_f6bd5f, 578 | .theme-midnight .container__03885 { 579 | border: 1px solid var(--app-border-frame); 580 | background-color: var(--background-base-low); 581 | } 582 | .theme-midnight .channelHeader__35a7e, 583 | .theme-midnight .container__0f711 { 584 | background-color: var(--background-base-low); 585 | } 586 | .theme-midnight .messageContainer__95796, 587 | .theme-midnight .messages__1ccd1, 588 | .theme-midnight .forumPost__7d15e { 589 | background-color: var(--background-base-lowest); 590 | } 591 | .theme-midnight .tutorial__2692d, 592 | .theme-midnight .upsellContainer__4a7f0, 593 | .theme-midnight .icon_d404a3 { 594 | background-color: var(--background-surface-high); 595 | } 596 | 597 | .theme-midnight .messagesPopoutWrap__45690 { 598 | border: 1px solid var(--app-border-frame); 599 | background-color: var(--background-base-low); 600 | } 601 | .theme-midnight .header__45690 { 602 | background-color: var(--background-base-low); 603 | } 604 | .theme-midnight .footer__45690 { 605 | border-top: 1px solid var(--app-border-frame); 606 | background-color: var(--background-surface-high); 607 | } 608 | .theme-midnight .messageGroupWrapper__45690 { 609 | background-color: var(--background-base-lowest); 610 | } 611 | 612 | .theme-midnight .quickSelectPopout_ebaca5 { 613 | border: 1px solid var(--border-faint); 614 | background-color: var(--background-surface-high); 615 | } 616 | .theme-midnight .quickSelectPopoutOption_ebaca5:hover { 617 | background-color: var(--background-mod-faint); 618 | } 619 | .theme-midnight .quickSelectPopoutOption_ebaca5:focus { 620 | background-color: var(--background-mod-subtle); 621 | } 622 | 623 | .theme-midnight .container__55c99 { 624 | background-color: var(--background-base-low); 625 | } 626 | .theme-midnight .queryContainer__55c99 { 627 | border-bottom-color: var(--border-subtle); 628 | } 629 | .theme-midnight .focused__55c99 { 630 | background-color: var(--background-base-lower); 631 | } 632 | .theme-midnight .calendarPicker_d27f17 .react-datepicker, 633 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__header { 634 | background-color: var(--background-base-low); 635 | } 636 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__current-month { 637 | border-bottom-color: var(--border-faint); 638 | } 639 | .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled, .theme-midnight .calendarPicker_d27f17 .react-datepicker__day.react-datepicker__day--disabled:hover { 640 | background-color: var(--background-base-lower); 641 | } 642 | 643 | .theme-midnight .container_d9c882 { 644 | background-color: var(--background-base-low); 645 | } 646 | .theme-midnight .container_d9c882:not(.browser__9a792) { 647 | border: 1px solid var(--app-border-frame); 648 | } 649 | .theme-midnight .header_d9c882 { 650 | background-color: var(--background-base-low); 651 | } 652 | .theme-midnight .browser__9a792 { 653 | background-color: var(--background-base-lowest); 654 | } 655 | .theme-midnight .browser__9a792 .header_d9c882 { 656 | background-color: var(--background-base-lowest); 657 | } 658 | .theme-midnight .container__6764b { 659 | background-color: var(--background-base-lowest); 660 | } 661 | .theme-midnight .container__6764b:hover { 662 | background-color: var(--background-base-lower); 663 | } 664 | .theme-midnight .icon__1b24f { 665 | background-color: var(--background-surface-high); 666 | } 667 | 668 | .theme-midnight .sidebarRegionScroller__23e6b { 669 | border-right: 1px solid var(--app-border-frame); 670 | } 671 | 672 | .theme-midnight .contentRegion__23e6b, 673 | .theme-midnight .contentRegionScroller__23e6b { 674 | background: var(--background-base-lowest); 675 | } 676 | .theme-midnight .content_e9e3ed, 677 | .theme-midnight .sidebar__409aa { 678 | background-color: var(--background-base-lowest); 679 | } 680 | .theme-midnight .accountProfileCard__1fed1 { 681 | background-color: var(--background-base-low); 682 | border: 1px solid var(--border-subtle); 683 | } 684 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 { 685 | border: 1px solid var(--border-subtle); 686 | background-color: var(--background-base-lowest); 687 | } 688 | .theme-midnight .accountProfileCard__1fed1 .background__1fed1 .fieldList__1fed1 { 689 | background-color: var(--background-base-lowest); 690 | } 691 | .theme-midnight .emptyContainer_de8069 { 692 | border: 1px solid var(--border-faint); 693 | background-color: var(--background-base-low); 694 | } 695 | .theme-midnight .card__5cea9 { 696 | border: 1px solid var(--border-faint); 697 | } 698 | .theme-midnight .card__5cea9 .header__5cea9 { 699 | border-bottom: 1px solid var(--border-faint); 700 | background-color: var(--background-base-low); 701 | } 702 | .theme-midnight .box_f8c98c { 703 | border-color: var(--border-faint); 704 | background-color: var(--background-base-low); 705 | } 706 | .theme-midnight .headerV2__50a54 { 707 | border-bottom: 1px solid var(--border-faint); 708 | background-color: var(--background-base-low); 709 | } 710 | .theme-midnight .authedAppV2__50a54 { 711 | border: 1px solid var(--border-faint); 712 | background-color: var(--background-base-lower); 713 | } 714 | .theme-midnight .connectContainer_c7f964 { 715 | border: 1px solid var(--border-faint); 716 | background-color: var(--background-base-low); 717 | } 718 | .theme-midnight .accountButtonInner_c7f964, 719 | .theme-midnight .accountAddInner_c7f964 { 720 | border: 1px solid var(--border-subtle); 721 | } 722 | .theme-midnight .accountButtonInner_c7f964:not(:hover), 723 | .theme-midnight .accountAddInner_c7f964:not(:hover) { 724 | background-color: var(--background-base-lower); 725 | } 726 | .theme-midnight .connection_c7f964 { 727 | border: 1px solid var(--border-faint); 728 | background-color: var(--background-base-lower); 729 | } 730 | .theme-midnight .connection_c7f964 .connectionHeader_c7f964 { 731 | border-bottom: 1px solid var(--border-faint); 732 | background-color: var(--background-base-low); 733 | } 734 | .theme-midnight .connection_c7f964 .metadataContainer_c7f964 { 735 | border: 1px solid var(--border-faint); 736 | background-color: var(--background-base-lowest); 737 | } 738 | .theme-midnight .connection_c7f964 .integrationWrapper_c7f964 { 739 | border: 1px solid var(--border-faint); 740 | background-color: var(--background-base-lowest); 741 | } 742 | .theme-midnight .expandedProgressBarContainerSettingsPage_a61c56, 743 | .theme-midnight .giftCard_a45ed3 { 744 | border: 1px solid var(--border-faint); 745 | background-color: var(--background-base-low); 746 | } 747 | .theme-midnight .perkCard_b62c4e { 748 | border: 1px solid var(--border-faint); 749 | background-color: var(--background-base-low); 750 | } 751 | .theme-midnight .rowBottomBorder_e4ef5c { 752 | border-color: var(--border-subtle); 753 | } 754 | .theme-midnight .appliedBoostContainer_ceb06a { 755 | border: 1px solid var(--border-faint); 756 | background-color: var(--background-base-low); 757 | } 758 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainerSeparator_ceb06a { 759 | background-color: var(--border-subtle); 760 | } 761 | .theme-midnight .appliedBoostContainer_ceb06a .boostContainer_ceb06a { 762 | background-color: var(--background-base-low); 763 | } 764 | .theme-midnight .appliedBoostContainer_ceb06a .guildContainer__5dba5:not(.recommendedServerCard__51537) { 765 | border-bottom: 1px solid var(--border-faint); 766 | } 767 | .theme-midnight .wave__8e08c { 768 | fill: var(--background-base-lowest); 769 | } 770 | .theme-midnight .guildContainer__5dba5 { 771 | background-color: var(--background-base-low); 772 | } 773 | .theme-midnight .guildContainer__5dba5.recommendedServerCard__51537 { 774 | border: 1px solid var(--border-faint); 775 | } 776 | .theme-midnight .wrapper__5b98e { 777 | border: 1px solid var(--border-faint); 778 | background-color: var(--background-base-low); 779 | } 780 | .theme-midnight .wrapper__5b98e .list__5b98e { 781 | border-color: var(--border-subtle); 782 | } 783 | .theme-midnight .wrapper__5b98e .listItem__5b98e { 784 | border-color: var(--border-subtle); 785 | } 786 | .theme-midnight .detailsBlock_e335a7 { 787 | border: 1px solid var(--border-faint); 788 | background-color: var(--background-base-low); 789 | } 790 | .theme-midnight .accountCreditsContainer__94f72 .accountCreditRow__94f72:not(:last-child) { 791 | border-bottom: 1px solid var(--border-faint); 792 | } 793 | .theme-midnight .fractionalPremiumAccountCredit__94f72, 794 | .theme-midnight .premiumSubscriptionAccountCredit__94f72 { 795 | border: 1px solid var(--border-faint); 796 | background-color: var(--background-base-low); 797 | } 798 | .theme-midnight .fractionalTimeRemainingRow__94f72 { 799 | background-color: var(--background-base-lower); 800 | } 801 | .theme-midnight .paymentPane__01014 { 802 | background-color: var(--background-base-low); 803 | } 804 | .theme-midnight .paymentPane__01014 .payment_e9cb00 { 805 | background-color: var(--background-base-low); 806 | } 807 | .theme-midnight .paymentPane__01014 .expandedInfo_e9cb00 { 808 | background-color: var(--background-base-lowest); 809 | } 810 | .theme-midnight .preview__3e443 { 811 | background-color: var(--background-base-lowest); 812 | } 813 | .theme-midnight .container_a1d343 { 814 | background-color: var(--background-base-low); 815 | border: 1px solid var(--border-subtle); 816 | } 817 | .theme-midnight .preview__5d148 { 818 | background-color: var(--background-base-lowest); 819 | } 820 | .theme-midnight .notches__06283.gray__06283 { 821 | color: var(--background-base-lowest); 822 | } 823 | .theme-midnight .progress__06283 { 824 | background-color: var(--background-surface-highest); 825 | } 826 | .theme-midnight .sliderBar_ac7648:not(.speaking_ac7648) { 827 | background-color: var(--background-surface-highest); 828 | } 829 | .theme-midnight .cameraWrapper_d41d5f { 830 | background-color: var(--background-base-low); 831 | border-color: var(--border-subtle); 832 | } 833 | .theme-midnight .backgroundOptionInner__53965 { 834 | background-color: var(--background-base-low); 835 | } 836 | .theme-midnight .headerContainer__7db08 { 837 | background-color: var(--background-base-lowest); 838 | } 839 | .theme-midnight .game_cc46f0 { 840 | box-shadow: 0 1px 0 0 var(--border-subtle); 841 | } 842 | .theme-midnight .avatarUploaderInnerSquareDisabled_e04502 { 843 | background-color: var(--background-surface-high); 844 | } 845 | .theme-midnight .wrapper__83b1d { 846 | background-color: var(--background-surface-high); 847 | } 848 | .theme-midnight .wrapper__83b1d:focus-within, .theme-midnight .wrapper__83b1d:hover { 849 | background-color: var(--background-mod-subtle); 850 | } 851 | .theme-midnight .titleContainer_e29cd7, 852 | .theme-midnight .header_c6bf1b { 853 | background-color: var(--background-base-lowest); 854 | } 855 | .theme-midnight .theme-midnight.messageWrapper__981c8 { 856 | background-color: var(--background-base-lowest); 857 | } 858 | .theme-midnight .joinOptions__959cb { 859 | background-color: var(--background-base-low); 860 | } 861 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.uninteractive__959cb:hover { 862 | background-color: var(--background-base-low); 863 | } 864 | .theme-midnight .joinOptions__959cb .joinOptionContent__959cb.active__959cb { 865 | background-color: var(--background-surface-high); 866 | } 867 | .theme-midnight .header__812a7 { 868 | background-color: var(--background-base-low); 869 | border-bottom: 1px solid var(--border-faint); 870 | } 871 | .theme-midnight .container__812a7 { 872 | background-color: var(--background-base-lower); 873 | } 874 | .theme-midnight .actionContainer__6446f, 875 | .theme-midnight .mentionLimitContainer_ed9c90 { 876 | background-color: var(--background-surface-higher); 877 | } 878 | .theme-midnight .actionContainer_bc4513 { 879 | background-color: var(--background-surface-highest); 880 | } 881 | .theme-midnight .editCard_a25a68 { 882 | background-color: var(--background-base-low); 883 | } 884 | .theme-midnight .collapseable__217b7:is(.collapseable__4546e, .collapseable_fc46b1) { 885 | background-color: var(--background-surface-high); 886 | } 887 | .theme-midnight .bannedUser_cdb2b0:not(:hover) { 888 | background-color: var(--background-surface-higher); 889 | } 890 | .theme-midnight .notice_a9b452, 891 | .theme-midnight .review_a9b452 { 892 | background-color: var(--background-base-low); 893 | border: 1px solid var(--border-subtle); 894 | } 895 | .theme-midnight .onboardingStepContainer__28e57 { 896 | border-left: 1px solid var(--border-subtle); 897 | border-right: 1px solid var(--border-subtle); 898 | } 899 | .theme-midnight .onboardingStepContainer__28e57:last-child { 900 | border-bottom: 1px solid var(--border-subtle); 901 | } 902 | .theme-midnight .container__5d756 { 903 | border: 1px solid var(--border-subtle); 904 | } 905 | .theme-midnight .example__5d756 { 906 | background-color: var(--background-surface-high); 907 | } 908 | .theme-midnight .channelCoverage_e34850 { 909 | background-color: var(--background-base-low); 910 | } 911 | .theme-midnight .actionItem_d2b0e4, 912 | .theme-midnight .resourceChannel_d2b0e4, 913 | .theme-midnight .suggestedChannels_d2b0e4 { 914 | background-color: var(--background-base-low); 915 | } 916 | .theme-midnight .howItWorksContainer_dd30dc, 917 | .theme-midnight .creatorBenefitCard__02e4c, 918 | .theme-midnight .guildCard__2485e { 919 | border: 1px solid var(--border-faint); 920 | background-color: var(--background-surface-high); 921 | } 922 | .theme-midnight .descriptionBox__981f7 { 923 | border: 1px solid var(--border-subtle); 924 | background-color: var(--background-base-low); 925 | } 926 | .theme-midnight .settingCard__1a4ef { 927 | border: 1px solid var(--border-subtle); 928 | } 929 | .theme-midnight .settingCard__1a4ef.active__1a4ef { 930 | background-color: var(--background-base-low); 931 | } 932 | .theme-midnight .cardFolder__1a4ef:not(:empty) { 933 | border-top: 1px solid var(--border-subtle); 934 | } 935 | .theme-midnight .scroller__53543 { 936 | background-color: var(--background-base-lowest); 937 | } -------------------------------------------------------------------------------- /src/dev.scss: -------------------------------------------------------------------------------- 1 | @use 'theme'; -------------------------------------------------------------------------------- /src/source.scss: -------------------------------------------------------------------------------- 1 | @use 'theme'; -------------------------------------------------------------------------------- /src/support/betterdiscord/compiled.css: -------------------------------------------------------------------------------- 1 | /* Support for legacy users. I really DO NOT want to break the theme for them. */ 2 | @import url('https://luckfire.github.io/amoled-cord/src/amoled-cord.css'); -------------------------------------------------------------------------------- /src/theme/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'variables'; 2 | 3 | @forward 'content'; 4 | @forward 'modals'; 5 | @forward 'pages'; 6 | @forward 'popouts'; 7 | @forward 'settings'; -------------------------------------------------------------------------------- /src/theme/_variables.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | --background-message-hover: var(--opacity-8) !important; 3 | 4 | --background-mod-faint: var(--opacity-4) !important; 5 | --background-mod-normal: var(--opacity-16) !important; 6 | --background-mod-strong: var(--opacity-20) !important; 7 | --background-mod-subtle: var(--opacity-8) !important; 8 | 9 | --background-modifier-active: var(--opacity-16) !important; 10 | --background-modifier-hover: var(--opacity-8) !important; 11 | --background-modifier-selected: var(--opacity-20) !important; 12 | 13 | --background-secondary-alt: var(--neutral-88) !important; 14 | 15 | --card-primary-bg: var(--background-base-low) !important; 16 | 17 | --modal-background: var(--background-base-lowest) !important; 18 | --modal-footer-background: var(--background-base-lowest) !important; 19 | 20 | --scrollbar-auto-scrollbar-color-thumb: var(--neutral-80) !important; 21 | --scrollbar-auto-thumb: var(--neutral-80) !important; 22 | --scrollbar-thin-thumb: var(--neutral-79) !important; 23 | 24 | --custom-channel-members-bg: var(--background-base-lowest) !important; 25 | } 26 | 27 | @supports (color: color-mix(in lch, red, blue)) { 28 | .theme-midnight { 29 | --background-message-hover: color-mix( 30 | in oklab, 31 | var(--opacity-8) 100%, 32 | hsl(var(--theme-base-color-hsl, 0 0% 0%) / 0.0784313725490196) 33 | var(--theme-base-color-amount, 0%) 34 | ) !important; 35 | --background-secondary-alt: color-mix( 36 | in oklab, 37 | var(--neutral-88) 100%, 38 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 39 | ) !important; 40 | --card-primary-bg: color-mix( 41 | in oklab, 42 | var(--background-base-low) 100%, 43 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 44 | ) !important; 45 | --modal-background: color-mix( 46 | in oklab, 47 | var(--background-base-lowest) 100%, 48 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 49 | ) !important; 50 | --modal-footer-background: color-mix( 51 | in oklab, 52 | var(--background-base-lowest) 100%, 53 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 54 | ) !important; 55 | --scrollbar-auto-scrollbar-color-thumb: color-mix( 56 | in oklab, 57 | var(--neutral-80) 100%, 58 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 59 | ) !important; 60 | --scrollbar-auto-thumb: color-mix( 61 | in oklab, 62 | var(--neutral-80) 100%, 63 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 64 | ) !important; 65 | --scrollbar-thin-thumb: color-mix( 66 | in oklab, 67 | var(--neutral-79) 100%, 68 | var(--theme-base-color, #000) var(--theme-base-color-amount, 0%) 69 | ) !important; 70 | } 71 | } -------------------------------------------------------------------------------- /src/theme/content/_browse-channels.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | // Browse Channels 3 | .header__0b563 { 4 | background-color: var(--background-base-lowest) !important; 5 | } 6 | .pageBody__41ed7 { 7 | background-color: var(--background-base-lowest); 8 | } 9 | .container__0b563 { 10 | background-color: var(--background-base-lowest) !important; 11 | } 12 | 13 | // Customize 14 | .prompt__5d7c9 { 15 | background-color: var(--background-base-low); 16 | } 17 | .emptyPage__5d7c9 { 18 | background-color: var(--background-base-lowest); 19 | } 20 | .profileCard__5d7c9 { 21 | border: 1px solid var(--border-subtle); 22 | } 23 | } -------------------------------------------------------------------------------- /src/theme/content/_chat.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | // Content Loading 3 | .wrapper_fc8177, 4 | .wrapper_d852db { 5 | background: var(--background-base-lowest); 6 | } 7 | 8 | .chatContent_f75fb0, 9 | .container__34c2c, 10 | .container_fb64c9 { 11 | background: var(--background-base-lowest); 12 | } 13 | 14 | .emptyState__7641b { 15 | border-left: 1px solid var(--app-border-frame); 16 | } 17 | 18 | .wrapper_f7ecac { 19 | background-color: var(--background-surface-high); 20 | } 21 | 22 | .channelTextArea_f75fb0 { 23 | background: var(--background-base-low); 24 | } 25 | .channelTextArea__74017:not(.inlineContainer__74017) .themedBackground__74017 { 26 | background: var(--background-base-low); 27 | } 28 | .bannerContainer__362cd { 29 | background: var(--background-base-low); 30 | } 31 | 32 | .formWithLoadedChatInput_f75fb0:before, 33 | .chatGradient__36d07 { 34 | background: linear-gradient(to bottom, transparent, var(--background-base-lowest) 100%); 35 | } 36 | .chatTypingGradientAtBottom__36d07 { 37 | background: linear-gradient( 38 | to bottom, 39 | transparent, 40 | var(--background-base-lowest) 8px, 41 | var(--background-base-lowest) 100% 42 | ); 43 | } 44 | .chatTypingGradientNotAtBottom__36d07 { 45 | background: linear-gradient( 46 | to bottom, 47 | transparent, 48 | var(--background-base-lowest) 72px, 49 | var(--background-base-lowest) 100% 50 | ); 51 | } 52 | 53 | // Commands 54 | .optionPill__1464f { 55 | border: 1px solid var(--border-faint); 56 | background-color: var(--background-surface-high); 57 | .optionPillKey__1464f { 58 | background-color: var(--background-base-lower); 59 | } 60 | } 61 | 62 | .stackedBars__74017 { 63 | background: var(--background-surface-high); 64 | } 65 | 66 | // AutoMod 67 | .content__44492 { 68 | .messageContent__44492 { 69 | border: 1px solid var(--border-subtle); 70 | border-bottom: none; 71 | background-color: var(--background-surface-high); 72 | 73 | .embedCard__44c9a { 74 | background-color: transparent; 75 | } 76 | } 77 | .footerContainer__44492 { 78 | border: 1px solid var(--border-subtle); 79 | } 80 | } 81 | 82 | .embedCard_b99f57 { 83 | border: 1px solid var(--border-subtle); 84 | background-color: var(--background-surface-high); 85 | .cardFooter_b99f57 { 86 | border-top: 1px solid var(--border-subtle); 87 | background-color: var(--background-base-low); 88 | } 89 | } 90 | 91 | // Channel Followers Publish CTA 92 | .bumpBox_cacd02 { 93 | background-color: var(--background-base-low); 94 | border: 1px solid var(--border-faint); 95 | } 96 | } -------------------------------------------------------------------------------- /src/theme/content/_devtools.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_db0ccb, 3 | .container_a51e6d { 4 | background-color: var(--background-base-lowest); 5 | } 6 | .sidebarContent_db0ccb { 7 | border-color: var(--app-border-frame); 8 | } 9 | } -------------------------------------------------------------------------------- /src/theme/content/_forums.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_f369db { 3 | background-color: var(--background-base-lowest); 4 | } 5 | 6 | .previewForm_d9be46 { 7 | background-color: var(--background-base-low); 8 | border-color: var(--border-faint); 9 | } 10 | 11 | .descriptionContainer_ca49a1 { 12 | background-color: var(--background-base-lowest); 13 | border: 1px solid var(--border-subtle); 14 | } 15 | .linkContainer_ca49a1 { 16 | background-color: var(--background-base-lowest); 17 | } 18 | .gradient_ca49a1 { 19 | background: linear-gradient(to top, var(--background-base-lowest), transparent); 20 | } 21 | 22 | .contentPreview__9a337 { 23 | background-color: var(--background-base-lowest); 24 | } 25 | .textContentFooter__9a337 { 26 | background: linear-gradient( 27 | to top, 28 | hsl(var(--black-hsl) / 1), 29 | hsl(var(--black-hsl) / 0.97) 36px, 30 | hsl(var(--black-hsl) / 0.4) 31 | ); 32 | &.noTags__9a337 { 33 | background: linear-gradient(to top, hsl(var(--black-hsl) / 1), hsl(var(--black-hsl) / 0)); 34 | } 35 | } 36 | } -------------------------------------------------------------------------------- /src/theme/content/_header.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__9293f, 3 | .chatHeaderBar_a53846 { 4 | --__header-bar-background: var(--background-base-lowest); 5 | } 6 | 7 | .backdrop__8a7fc { 8 | background: var(--background-base-lowest); 9 | } 10 | } -------------------------------------------------------------------------------- /src/theme/content/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'browse-channels'; 2 | @forward 'chat'; 3 | @forward 'devtools'; 4 | @forward 'forums'; 5 | @forward 'header'; 6 | @forward 'members'; 7 | @forward 'message-search'; 8 | @forward 'powerups'; 9 | @forward 'server-guide'; 10 | @forward 'server-shop'; 11 | @forward 'sliders'; 12 | @forward 'student-hub'; 13 | @forward 'voice-call'; -------------------------------------------------------------------------------- /src/theme/content/_members.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .page_c791b2 { 3 | background-color: var(--background-base-lowest) !important; 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/content/_message-search.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .searchResult__02a39 { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/content/_powerups.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .contentContainer__89463, 3 | .sidebarContainer__89463 { 4 | background-color: var(--background-base-lowest); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/content/_server-guide.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .background__7449f { 3 | background-color: var(--background-base-lowest); 4 | } 5 | 6 | .resourceChannel__7449f:hover { 7 | background-color: var(--background-modifier-hover); 8 | } 9 | 10 | .headerBarInner__7449f:after { 11 | background: linear-gradient(to bottom, rgba(50, 52, 58, 0) 0, var(--background-base-lowest) 100%); 12 | } 13 | } -------------------------------------------------------------------------------- /src/theme/content/_server-shop.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .opaqueBackground__79d38 { 3 | background: hsl(var(--primary-800-hsl) / 0.85); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/content/_sliders.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .mini_a562c8, 3 | .slider_a562c8 { 4 | .bar_a562c8 { 5 | background-color: var(--background-surface-highest); 6 | } 7 | } 8 | .markDash_a562c8 { 9 | background-color: var(--background-surface-highest); 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/theme/content/_student-hub.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .pageContainer__09fde, 3 | .emptySearchWrapper__83bd4 { 4 | background-color: var(--background-base-lowest); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/content/_voice-call.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .videoWrapper__2f4f7:not(.wrapper__48b20), 3 | .streamHidden_c30e20, 4 | .streamPreview__2f4f7 { 5 | background-color: var(--background-base-low); 6 | } 7 | .cta_a3a802 { 8 | background-color: var(--button-secondary-background); 9 | &:hover { 10 | background-color: var(--button-secondary-background-hover); 11 | } 12 | } 13 | .participantsButton__211d1, 14 | .buttonColor__7b3e8 { 15 | background-color: var(--background-surface-higher); 16 | &:hover { 17 | background-color: var(--background-surface-high); 18 | } 19 | } 20 | 21 | // DM call resize dragger 22 | .wrapper_cb9592:has(.resizeHandle__4b144) .callContainer_cb9592 { 23 | border-bottom: 1px solid var(--border-subtle); 24 | } 25 | 26 | // Stages 27 | .container__664ff { 28 | border-left: 1px solid var(--app-border-frame); 29 | background-color: var(--background-base-lowest); 30 | } 31 | .background__506d9 { 32 | background-color: var(--background-base-low); 33 | } 34 | 35 | // We need to use raw tokens here because they override the default theme to dark 36 | // --neutral-95 is --background-base-low 37 | // --opacity-12 is --background-modifier-hover 38 | // --opacity-24 is --border-subtle 39 | .container__6b38f.pulse__6b38f { 40 | background-color: var(--neutral-95); 41 | border: 1px solid var(--opacity-24); 42 | 43 | &:hover { 44 | background-color: var(--opacity-12); 45 | } 46 | } 47 | .tileContainer__71eb2:hover { 48 | background-color: var(--opacity-12); 49 | } 50 | } -------------------------------------------------------------------------------- /src/theme/modals/_accept-invite.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .editProfileContainer__42179 { 3 | background-color: var(--background-base-low); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_auth-box.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .authBox__921c5 { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_captcha.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_deee3a { 3 | background: 4 | radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), 5 | linear-gradient(270deg, var(--expressive-gradient-blue-end) 0, var(--expressive-gradient-blue-start) 100%); 6 | } 7 | } -------------------------------------------------------------------------------- /src/theme/modals/_claim-reward.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .upsellContainer__88422 { 3 | background-color: var(--opacity-8); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_connections.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .accountBtnInner__750de, 3 | .application__750de { 4 | border: 1px solid var(--border-subtle); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/modals/_delete-message.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .message__89466 { 3 | background-color: var(--background-base-lowest); 4 | border: 1px solid var(--border-subtle); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/modals/_edit-upload.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .uploadModal_dbca3c .footer_dbca3c { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_gif-picker.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .gifPicker__6c39d { 3 | .header_fed6d3 { 4 | background-color: var(--background-base-lowest); 5 | } 6 | } 7 | } -------------------------------------------------------------------------------- /src/theme/modals/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'accept-invite'; 2 | @forward 'auth-box'; 3 | @forward 'captcha'; 4 | @forward 'claim-reward'; 5 | @forward 'connections'; 6 | @forward 'delete-message'; 7 | @forward 'edit-upload'; 8 | @forward 'gif-picker'; 9 | @forward 'invite'; 10 | @forward 'keyboard-shortcuts'; 11 | @forward 'message-reactions'; 12 | @forward 'mana'; 13 | @forward 'nitro'; 14 | @forward 'onboarding'; 15 | @forward 'payment'; 16 | @forward 'pending-application'; 17 | @forward 'poll-votes'; 18 | @forward 'quest-console-connection'; 19 | @forward 'server-tag'; 20 | @forward 'student-hub-email'; 21 | @forward 'upload-stickers'; 22 | @forward 'voice-channel-status'; -------------------------------------------------------------------------------- /src/theme/modals/_invite.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .footer__67dba { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_keyboard-shortcuts.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .keyboardShortcutsModal_f061f6 { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_mana.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__53cea { 3 | background-color: var(--background-base-lowest); 4 | } 5 | .bodyControls__53cea:after { 6 | background: radial-gradient(88.69% 87.5% at 50% 87.5%, transparent 0, var(--background-base-lowest) 100%); 7 | } 8 | } -------------------------------------------------------------------------------- /src/theme/modals/_message-reactions.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .scroller_cc2dff { 3 | border-right: 1px solid var(--border-subtle); 4 | background-color: var(--background-base-lowest); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/modals/_nitro.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .scroller__6fd0e { 3 | background-color: var(--background-base-lowest); 4 | } 5 | .headerWave__1dfae { 6 | color: var(--background-base-lowest); 7 | } 8 | .bodyWaveGradientStop1__1dfae, 9 | .bodyWaveGradientStop3__1dfae { 10 | stop-color: var(--background-base-lower); 11 | } 12 | .bodyWaveGradientStop2__1dfae { 13 | stop-color: var(--background-base-low); 14 | } 15 | } -------------------------------------------------------------------------------- /src/theme/modals/_onboarding.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .main_c08b38:not(.fullBorderWithGradient_c08b38) { 3 | border-top: 1px solid var(--app-border-frame); 4 | } 5 | .prompt_fe70ca { 6 | border: 1px solid var(--border-normal); 7 | } 8 | .navButtons_fe70ca { 9 | background-color: var(--background-base-lowest); 10 | } 11 | .termsFieldBody_fe70ca { 12 | background-color: var(--background-base-low); 13 | border: 1px solid var(--border-subtle); 14 | } 15 | } -------------------------------------------------------------------------------- /src/theme/modals/_payment.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .premiumBrandRefreshBackground_e5f3a9 { 3 | background-color: var(--background-base-lowest) !important; 4 | } 5 | .premiumBrandRefreshHeader_e50a4d, 6 | .skuSelectModalContent_e50a4d.premiumBrandRefreshContent_e50a4d.premiumBrandRefreshContent_e50a4d { 7 | background-color: var(--background-base-lowest); 8 | } 9 | } -------------------------------------------------------------------------------- /src/theme/modals/_pending-application.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .confirmation__1051d { 3 | background-color: var(--background-base-lowest); 4 | } 5 | .iconWrapper__1051d { 6 | background-color: var(--background-base-low); 7 | } 8 | } -------------------------------------------------------------------------------- /src/theme/modals/_poll-votes.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .scroller__01c8c { 3 | border-right: 1px solid var(--border-subtle); 4 | background-color: var(--background-base-lowest); 5 | } 6 | .container__01c8c, 7 | .voters__01c8c { 8 | background-color: var(--background-base-lowest); 9 | } 10 | .voteSelected__01c8c { 11 | background-color: var(--background-base-low); 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/theme/modals/_quest-console-connection.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .modalRoot__5b400, 3 | .footer__5b400 { 4 | background-color: var(--background-base-lowest); 5 | } 6 | 7 | .connectionRowHeaderError__5b400 { 8 | background-color: hsl(var(--neutral-95-hsl) / 0.7); 9 | } 10 | } -------------------------------------------------------------------------------- /src/theme/modals/_server-tag.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .right__58ae6, 3 | .rightContent__58ae6 { 4 | background-color: var(--background-base-lowest); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/modals/_student-hub-email.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .sidebarContainer__1d6c7 { 3 | border-right: 1px solid var(--border-subtle); 4 | background-color: var(--background-base-lowest); 5 | } 6 | } -------------------------------------------------------------------------------- /src/theme/modals/_upload-stickers.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .previewDark__4e29d { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/modals/_voice-channel-status.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__08bd2 { 3 | background: 4 | radial-gradient(100% 100% at 50% 100%, var(--background-base-lowest) 60%, var(--transparent) 100%), 5 | linear-gradient(270deg, var(--expressive-gradient-purple-end) 0, var(--expressive-gradient-purple-start) 100%); 6 | } 7 | } -------------------------------------------------------------------------------- /src/theme/pages/_discovery.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .relative__8a7fc { 3 | border-bottom: 1px solid var(--app-border-frame); 4 | } 5 | .relative__8a7fc, 6 | .scroller__23746, 7 | .container_cbd375 { 8 | background-color: var(--background-base-lowest); 9 | } 10 | } -------------------------------------------------------------------------------- /src/theme/pages/_family-center.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .containerSidenav_dc2e0e { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/pages/_friends.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .tabBody__133bf, 3 | .nowPlayingColumn__133bf, 4 | .container__7d20c, 5 | .emptyCard__7e549 { 6 | background-color: var(--background-base-lowest); 7 | } 8 | 9 | .body__00943 { 10 | .section__00943 { 11 | background-color: var(--background-base-lowest); 12 | border: 1px solid var(--border-subtle); 13 | 14 | &:has(+ .separator__00943) { 15 | border-bottom: none; 16 | } 17 | } 18 | 19 | .wrapper__960df { 20 | background-color: var(--background-base-lowest); 21 | border: 1px solid var(--border-subtle); 22 | } 23 | .separator__00943 { 24 | + .section__00943, 25 | + .wrapper__960df { 26 | border-top: none; 27 | } 28 | } 29 | } 30 | 31 | .addFriendInputWrapper__72ba7 { 32 | // thank you fede 33 | &:not(:focus-within) { 34 | border-color: var(--input-border); 35 | } 36 | background: var(--input-background); 37 | } 38 | 39 | // Active Now 40 | .outer_bf1984 { 41 | background-color: var(--background-base-low); 42 | 43 | &.active_bf1984, 44 | &.interactive_bf1984 { 45 | &:hover { 46 | background-color: var(--background-surface-high); 47 | } 48 | } 49 | } 50 | } -------------------------------------------------------------------------------- /src/theme/pages/_generic.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | // Add borders to loading lazy loaded pages and empty channel page 3 | .page_c48ade:empty, 4 | .page_c48ade:has(.loader_c48ade, > div:empty:only-child), 5 | .noChannel__01d5c { 6 | border-top: 1px solid var(--app-border-frame); 7 | } 8 | } -------------------------------------------------------------------------------- /src/theme/pages/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'discovery'; 2 | @forward 'family-center'; 3 | @forward 'friends'; 4 | @forward 'generic'; 5 | @forward 'library'; 6 | @forward 'message-requests'; 7 | @forward 'nitro'; 8 | @forward 'shop'; 9 | -------------------------------------------------------------------------------- /src/theme/pages/_library.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_ad5cdf { 3 | border-top: 1px solid var(--app-border-frame); 4 | } 5 | 6 | .scroller__4a84a, 7 | .scroller_fb04e1 { 8 | background-color: var(--background-base-lowest); 9 | } 10 | 11 | .installationPath_a6f654 { 12 | box-shadow: 0 1px 0 0 var(--border-subtle); 13 | } 14 | } -------------------------------------------------------------------------------- /src/theme/pages/_message-requests.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_f391e3 { 3 | background-color: var(--background-base-lowest); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/pages/_nitro.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .applicationStore_f07d62, 3 | .mainPageScroller_ca1a02, 4 | .scroller_c880e8, 5 | .allPerksScroller_ca1a02 { 6 | background-color: var(--background-base-lowest); 7 | } 8 | 9 | .card_b5493b { 10 | border: 1px solid var(--border-subtle); 11 | background-color: var(--background-surface-high); 12 | 13 | .cardDescription__1f069 { 14 | background-image: linear-gradient( 15 | to bottom, 16 | var(--background-surface-high) 50%, 17 | hsl(var(--primary-800-hsl) / 0.75) 80% 18 | ); 19 | } 20 | } 21 | 22 | .container_da4aee { 23 | border: 1px solid var(--border-subtle); 24 | background-color: var(--background-surface-high); 25 | 26 | .textContainer_da4aee { 27 | background-image: linear-gradient( 28 | to right, 29 | var(--background-surface-high), 30 | hsl(var(--primary-800-hsl) / 40%) 90%, 31 | transparent 32 | ); 33 | } 34 | } 35 | } -------------------------------------------------------------------------------- /src/theme/pages/_shop.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .shop__6db1d, 3 | .shop__08415, 4 | .page__1feb0, 5 | .shopScroll__1feb0, 6 | .filterBar__1feb0 .filterBar__11877 { 7 | background-color: var(--background-base-lowest); 8 | } 9 | 10 | .darkCardBackground_c3d04b { 11 | background-color: var(--background-base-low); 12 | } 13 | } -------------------------------------------------------------------------------- /src/theme/popouts/_add-game.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .addGamePopout_cc46f0 { 3 | box-shadow: 4 | 0 0 0 1px var(--border-subtle), 5 | var(--legacy-elevation-high); 6 | background-color: var(--background-base-low); 7 | } 8 | } -------------------------------------------------------------------------------- /src/theme/popouts/_add-tags.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__5808f { 3 | background-color: var(--background-surface-high); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/popouts/_autocomplete.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .autocomplete__13533 { 3 | border: 1px solid var(--border-faint); 4 | background-color: var(--background-base-low); 5 | .wrapper__14245 { 6 | background-color: var(--background-base-low); 7 | } 8 | 9 | .wrapper__4e6ce { 10 | border-right: 1px solid var(--border-faint); 11 | } 12 | } 13 | } -------------------------------------------------------------------------------- /src/theme/popouts/_channel-permissions.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .autocompleteArrow_d5ae15, 3 | .header_d5ae15 { 4 | background-color: var(--background-surface-high); 5 | } 6 | 7 | .container_d5ae15 { 8 | background-color: var(--background-base-low); 9 | } 10 | } -------------------------------------------------------------------------------- /src/theme/popouts/_content-warning.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .contentWarningPopout_be95d0 { 3 | background-color: var(--background-surface-high); 4 | } 5 | .footer_be95d0 { 6 | background-color: var(--background-mod-faint); 7 | } 8 | } -------------------------------------------------------------------------------- /src/theme/popouts/_context-menu.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .menu_c1e9c4 { 3 | border-color: var(--border-faint); 4 | background-color: var(--background-surface-high); 5 | } 6 | .button_f563df { 7 | background-color: var(--background-mod-faint); 8 | &:hover { 9 | background-color: var(--background-mod-subtle); 10 | } 11 | &:active { 12 | background-color: var(--background-mod-strong); 13 | } 14 | } 15 | } -------------------------------------------------------------------------------- /src/theme/popouts/_country-code.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .popoutList__92efc { 3 | background-color: var(--background-base-low); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/popouts/_dropdowns.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .popout__3f413 { 3 | background-color: var(--background-base-low); 4 | } 5 | } -------------------------------------------------------------------------------- /src/theme/popouts/_emoji-info.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .popoutContainer__0f481 { 3 | background-color: color-mix(in oklab, var(--background-surface-high), transparent 10%); 4 | } 5 | .guildSection_d5cd2d { 6 | background-color: var(--background-base-low); 7 | border-top: 1px solid var(--border-faint); 8 | } 9 | } -------------------------------------------------------------------------------- /src/theme/popouts/_inbox.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__2692d, 3 | .container_fc561d, 4 | .container_f6bd5f, 5 | .container__03885 { 6 | border: 1px solid var(--app-border-frame); 7 | background-color: var(--background-base-low); 8 | } 9 | 10 | .channelHeader__35a7e, 11 | .container__0f711 { 12 | background-color: var(--background-base-low); 13 | } 14 | 15 | .messageContainer__95796, 16 | .messages__1ccd1, 17 | .forumPost__7d15e { 18 | background-color: var(--background-base-lowest); 19 | } 20 | 21 | .tutorial__2692d, 22 | .upsellContainer__4a7f0, 23 | .icon_d404a3 { 24 | background-color: var(--background-surface-high); 25 | } 26 | } -------------------------------------------------------------------------------- /src/theme/popouts/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'add-game'; 2 | @forward 'add-tags'; 3 | @forward 'autocomplete'; 4 | @forward 'channel-permissions'; 5 | @forward 'content-warning'; 6 | @forward 'context-menu'; 7 | @forward 'country-code'; 8 | @forward 'dropdowns'; 9 | @forward 'emoji-info'; 10 | @forward 'inbox'; 11 | @forward 'messages'; 12 | @forward 'region-select'; 13 | @forward 'search'; 14 | @forward 'threads'; -------------------------------------------------------------------------------- /src/theme/popouts/_messages.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | // Shared styles for pinned messages and inbox 3 | .messagesPopoutWrap__45690 { 4 | border: 1px solid var(--app-border-frame); 5 | background-color: var(--background-base-low); 6 | } 7 | 8 | .header__45690 { 9 | background-color: var(--background-base-low); 10 | } 11 | 12 | .footer__45690 { 13 | border-top: 1px solid var(--app-border-frame); 14 | background-color: var(--background-surface-high); 15 | } 16 | 17 | .messageGroupWrapper__45690 { 18 | background-color: var(--background-base-lowest); 19 | } 20 | } -------------------------------------------------------------------------------- /src/theme/popouts/_region-select.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .quickSelectPopout_ebaca5 { 3 | border: 1px solid var(--border-faint); 4 | background-color: var(--background-surface-high); 5 | } 6 | .quickSelectPopoutOption_ebaca5 { 7 | &:hover { 8 | background-color: var(--background-mod-faint); 9 | } 10 | &:focus { 11 | background-color: var(--background-mod-subtle); 12 | } 13 | } 14 | } -------------------------------------------------------------------------------- /src/theme/popouts/_search.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container__55c99 { 3 | background-color: var(--background-base-low); 4 | } 5 | .queryContainer__55c99 { 6 | border-bottom-color: var(--border-subtle); 7 | } 8 | .focused__55c99 { 9 | background-color: var(--background-base-lower); 10 | } 11 | 12 | .calendarPicker_d27f17 { 13 | .react-datepicker, 14 | .react-datepicker__header { 15 | background-color: var(--background-base-low); 16 | } 17 | .react-datepicker__current-month { 18 | border-bottom-color: var(--border-faint); 19 | } 20 | .react-datepicker__day { 21 | &.react-datepicker__day--disabled, 22 | &.react-datepicker__day--disabled:hover { 23 | background-color: var(--background-base-lower); 24 | } 25 | } 26 | } 27 | } -------------------------------------------------------------------------------- /src/theme/popouts/_threads.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .container_d9c882 { 3 | background-color: var(--background-base-low); 4 | 5 | &:not(.browser__9a792) { 6 | border: 1px solid var(--app-border-frame); 7 | } 8 | } 9 | 10 | .header_d9c882 { 11 | background-color: var(--background-base-low); 12 | } 13 | 14 | .browser__9a792 { 15 | background-color: var(--background-base-lowest); 16 | .header_d9c882 { 17 | background-color: var(--background-base-lowest); 18 | } 19 | } 20 | 21 | .container__6764b { 22 | background-color: var(--background-base-lowest); 23 | &:hover { 24 | background-color: var(--background-base-lower); 25 | } 26 | } 27 | 28 | .icon__1b24f { 29 | background-color: var(--background-surface-high); 30 | } 31 | } -------------------------------------------------------------------------------- /src/theme/settings/_content.scss: -------------------------------------------------------------------------------- 1 | // I organize everything based on how I did stuff in order. 2 | // It should be noted that some elements are used in other areas in settings, 3 | // but I'm not sure which ones and I'm too lazy to really dig into it. 4 | 5 | .theme-midnight { 6 | .contentRegion__23e6b, 7 | .contentRegionScroller__23e6b { 8 | background: var(--background-base-lowest); 9 | } 10 | 11 | // V2 12 | .content_e9e3ed, 13 | .sidebar__409aa { 14 | background-color: var(--background-base-lowest); 15 | } 16 | 17 | // User Settings --> My Account 18 | .accountProfileCard__1fed1 { 19 | background-color: var(--background-base-low); 20 | border: 1px solid var(--border-subtle); 21 | 22 | .background__1fed1 { 23 | border: 1px solid var(--border-subtle); 24 | background-color: var(--background-base-lowest); 25 | .fieldList__1fed1 { 26 | background-color: var(--background-base-lowest); 27 | } 28 | } 29 | } 30 | 31 | // User Settings --> Content & Social 32 | .emptyContainer_de8069 { 33 | border: 1px solid var(--border-faint); 34 | background-color: var(--background-base-low); 35 | } 36 | .card__5cea9 { 37 | border: 1px solid var(--border-faint); 38 | 39 | .header__5cea9 { 40 | border-bottom: 1px solid var(--border-faint); 41 | background-color: var(--background-base-low); 42 | } 43 | } 44 | 45 | // User Settings --> Family Center 46 | .box_f8c98c { 47 | border-color: var(--border-faint); 48 | background-color: var(--background-base-low); 49 | } 50 | 51 | // User Settings --> Authorized Apps 52 | .headerV2__50a54 { 53 | border-bottom: 1px solid var(--border-faint); 54 | background-color: var(--background-base-low); 55 | } 56 | .authedAppV2__50a54 { 57 | border: 1px solid var(--border-faint); 58 | background-color: var(--background-base-lower); 59 | } 60 | 61 | // User Settings --> Connections 62 | .connectContainer_c7f964 { 63 | border: 1px solid var(--border-faint); 64 | background-color: var(--background-base-low); 65 | } 66 | .accountButtonInner_c7f964, 67 | .accountAddInner_c7f964 { 68 | border: 1px solid var(--border-subtle); 69 | &:not(:hover) { 70 | background-color: var(--background-base-lower); 71 | } 72 | } 73 | .connection_c7f964 { 74 | border: 1px solid var(--border-faint); 75 | background-color: var(--background-base-lower); 76 | 77 | .connectionHeader_c7f964 { 78 | border-bottom: 1px solid var(--border-faint); 79 | background-color: var(--background-base-low); 80 | } 81 | 82 | .metadataContainer_c7f964 { 83 | border: 1px solid var(--border-faint); 84 | background-color: var(--background-base-lowest); 85 | } 86 | 87 | .integrationWrapper_c7f964 { 88 | border: 1px solid var(--border-faint); 89 | background-color: var(--background-base-lowest); 90 | } 91 | } 92 | 93 | // User Settings --> Nitro 94 | .expandedProgressBarContainerSettingsPage_a61c56, 95 | .giftCard_a45ed3 { 96 | border: 1px solid var(--border-faint); 97 | background-color: var(--background-base-low); 98 | } 99 | .perkCard_b62c4e { 100 | border: 1px solid var(--border-faint); 101 | background-color: var(--background-base-low); 102 | } 103 | .rowBottomBorder_e4ef5c { 104 | border-color: var(--border-subtle); 105 | } 106 | 107 | // User Settings --> Server Boost 108 | .appliedBoostContainer_ceb06a { 109 | border: 1px solid var(--border-faint); 110 | background-color: var(--background-base-low); 111 | 112 | .boostContainerSeparator_ceb06a { 113 | background-color: var(--border-subtle); 114 | } 115 | 116 | .boostContainer_ceb06a { 117 | background-color: var(--background-base-low); 118 | } 119 | 120 | .guildContainer__5dba5:not(.recommendedServerCard__51537) { 121 | border-bottom: 1px solid var(--border-faint); 122 | } 123 | } 124 | .wave__8e08c { 125 | fill: var(--background-base-lowest); 126 | } 127 | .guildContainer__5dba5 { 128 | background-color: var(--background-base-low); 129 | &.recommendedServerCard__51537 { 130 | border: 1px solid var(--border-faint); 131 | } 132 | } 133 | .wrapper__5b98e { 134 | border: 1px solid var(--border-faint); 135 | background-color: var(--background-base-low); 136 | 137 | .list__5b98e { 138 | border-color: var(--border-subtle); 139 | } 140 | .listItem__5b98e { 141 | border-color: var(--border-subtle); 142 | } 143 | } 144 | 145 | // User Settings --> Subscriptions 146 | .detailsBlock_e335a7 { 147 | border: 1px solid var(--border-faint); 148 | background-color: var(--background-base-low); 149 | } 150 | .accountCreditsContainer__94f72 .accountCreditRow__94f72:not(:last-child) { 151 | border-bottom: 1px solid var(--border-faint); 152 | } 153 | .fractionalPremiumAccountCredit__94f72, 154 | .premiumSubscriptionAccountCredit__94f72 { 155 | border: 1px solid var(--border-faint); 156 | background-color: var(--background-base-low); 157 | } 158 | .fractionalTimeRemainingRow__94f72 { 159 | background-color: var(--background-base-lower); 160 | } 161 | 162 | // User Settings --> Billing 163 | .paymentPane__01014 { 164 | background-color: var(--background-base-low); 165 | 166 | .payment_e9cb00 { 167 | background-color: var(--background-base-low); 168 | } 169 | 170 | .expandedInfo_e9cb00 { 171 | background-color: var(--background-base-lowest); 172 | } 173 | } 174 | 175 | // User Settings --> Appearance 176 | .preview__3e443 { 177 | background-color: var(--background-base-lowest); 178 | } 179 | .container_a1d343 { 180 | background-color: var(--background-base-low); 181 | border: 1px solid var(--border-subtle); 182 | } 183 | 184 | // User Settings --> Accessibility 185 | .preview__5d148 { 186 | background-color: var(--background-base-lowest); 187 | } 188 | 189 | // User Settings --> Voice & Video 190 | .notches__06283.gray__06283 { 191 | color: var(--background-base-lowest); 192 | } 193 | .progress__06283 { 194 | background-color: var(--background-surface-highest); 195 | } 196 | .sliderBar_ac7648:not(.speaking_ac7648) { 197 | background-color: var(--background-surface-highest); 198 | } 199 | .cameraWrapper_d41d5f { 200 | background-color: var(--background-base-low); 201 | border-color: var(--border-subtle); 202 | } 203 | .backgroundOptionInner__53965 { 204 | background-color: var(--background-base-low); 205 | } 206 | 207 | // User Settings --> Activity Privacy 208 | .headerContainer__7db08 { 209 | background-color: var(--background-base-lowest); 210 | } 211 | 212 | // User Settings --> Registered Games 213 | .game_cc46f0 { 214 | box-shadow: 0 1px 0 0 var(--border-subtle); 215 | } 216 | 217 | // Guild Settings --> Boost Perks 218 | .avatarUploaderInnerSquareDisabled_e04502 { 219 | background-color: var(--background-surface-high); 220 | } 221 | 222 | // Guild Settings --> Stickers 223 | .wrapper__83b1d { 224 | background-color: var(--background-surface-high); 225 | &:focus-within, 226 | &:hover { 227 | background-color: var(--background-mod-subtle); 228 | } 229 | } 230 | 231 | // Guild Settings --> Roles 232 | .titleContainer_e29cd7, 233 | .header_c6bf1b { 234 | background-color: var(--background-base-lowest); 235 | } 236 | .theme-midnight.messageWrapper__981c8 { 237 | background-color: var(--background-base-lowest); 238 | } 239 | 240 | // Guild Settings --> Access 241 | .joinOptions__959cb { 242 | background-color: var(--background-base-low); 243 | .joinOptionContent__959cb { 244 | &.uninteractive__959cb:hover { 245 | background-color: var(--background-base-low); 246 | } 247 | &.active__959cb { 248 | background-color: var(--background-surface-high); 249 | } 250 | } 251 | } 252 | .header__812a7 { 253 | background-color: var(--background-base-low); 254 | border-bottom: 1px solid var(--border-faint); 255 | } 256 | .container__812a7 { 257 | background-color: var(--background-base-lower); 258 | } 259 | 260 | // Guild Settings --> Safety Setup 261 | .actionContainer__6446f, 262 | .mentionLimitContainer_ed9c90 { 263 | background-color: var(--background-surface-higher); 264 | } 265 | .actionContainer_bc4513 { 266 | background-color: var(--background-surface-highest); 267 | } 268 | .editCard_a25a68 { 269 | background-color: var(--background-base-low); 270 | } 271 | .collapseable__217b7:is(.collapseable__4546e, .collapseable_fc46b1) { 272 | background-color: var(--background-surface-high); 273 | } 274 | 275 | // Guild Settings --> Bans 276 | .bannedUser_cdb2b0:not(:hover) { 277 | background-color: var(--background-surface-higher); 278 | } 279 | 280 | // Guild Settings --> Onboarding 281 | .notice_a9b452, 282 | .review_a9b452 { 283 | background-color: var(--background-base-low); 284 | border: 1px solid var(--border-subtle); 285 | } 286 | .onboardingStepContainer__28e57 { 287 | border-left: 1px solid var(--border-subtle); 288 | border-right: 1px solid var(--border-subtle); 289 | &:last-child { 290 | border-bottom: 1px solid var(--border-subtle); 291 | } 292 | } 293 | .container__5d756 { 294 | border: 1px solid var(--border-subtle); 295 | } 296 | .example__5d756 { 297 | background-color: var(--background-surface-high); 298 | } 299 | .channelCoverage_e34850 { 300 | background-color: var(--background-base-low); 301 | } 302 | .actionItem_d2b0e4, 303 | .resourceChannel_d2b0e4, 304 | .suggestedChannels_d2b0e4 { 305 | background-color: var(--background-base-low); 306 | } 307 | 308 | // Guild Settings --> Enable Monetization 309 | .howItWorksContainer_dd30dc, 310 | .creatorBenefitCard__02e4c, 311 | .guildCard__2485e { 312 | border: 1px solid var(--border-faint); 313 | background-color: var(--background-surface-high); 314 | } 315 | 316 | // Guild Settings --> Server Template 317 | .descriptionBox__981f7 { 318 | border: 1px solid var(--border-subtle); 319 | background-color: var(--background-base-low); 320 | } 321 | 322 | // Channel Settings --> Permissions 323 | .settingCard__1a4ef { 324 | border: 1px solid var(--border-subtle); 325 | &.active__1a4ef { 326 | background-color: var(--background-base-low); 327 | } 328 | } 329 | .cardFolder__1a4ef:not(:empty) { 330 | border-top: 1px solid var(--border-subtle); 331 | } 332 | .scroller__53543 { 333 | background-color: var(--background-base-lowest); 334 | } 335 | } -------------------------------------------------------------------------------- /src/theme/settings/_index.scss: -------------------------------------------------------------------------------- 1 | @forward 'sidebar'; 2 | @forward 'content'; -------------------------------------------------------------------------------- /src/theme/settings/_sidebar.scss: -------------------------------------------------------------------------------- 1 | .theme-midnight { 2 | .sidebarRegionScroller__23e6b { 3 | border-right: 1px solid var(--app-border-frame); 4 | } 5 | } -------------------------------------------------------------------------------- /theme-config.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "AMOLED-Cord", 3 | "metas": { 4 | "betterdiscord": "clients/metas/betterdiscord.json", 5 | "userstyle": "clients/metas/userstyle.json" 6 | }, 7 | "dist": { 8 | "output": "src/amoled-cord.css", 9 | "clients": { 10 | "compileFor": ["betterdiscord", "userstyle"] 11 | } 12 | }, 13 | "dev": { 14 | "mod": "vencord", 15 | "target": "src/dev.scss" 16 | } 17 | } --------------------------------------------------------------------------------