Skip to content

Instantly share code, notes, and snippets.

@SupremeCheater
Created September 24, 2019 19:19
Show Gist options
  • Save SupremeCheater/2c6ddf320fb1119b7c69fc0304038a46 to your computer and use it in GitHub Desktop.
Save SupremeCheater/2c6ddf320fb1119b7c69fc0304038a46 to your computer and use it in GitHub Desktop.
THEME
@import "https://fontlibrary.org/face/horta"; /* 'HortaRegular' */
@import "https://monstrousdev.github.io/themes/addons/user-tags.css";
@import "https://monstrousdev.github.io/themes/addons/filter.css";
@import "https://www.themonster.xyz/styles/google-fonts.css";
/*
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
/$$$$$$$ /$$ /$$ /$$ /$$ /$$
| $$__ $$| $$ | $$ | $$ | $$ | $$
| $$ \ $$| $$ /$$$$$$ /$$$$$$$| $$ /$$ | $$ | $$ /$$$$$$ | $$ /$$$$$$
| $$$$$$$ | $$ |____ $$ /$$_____/| $$ /$$/ | $$$$$$$$ /$$__ $$| $$ /$$__ $$
| $$__ $$| $$ /$$$$$$$| $$ | $$$$$$/ | $$__ $$| $$ \ $$| $$| $$$$$$$$
| $$ \ $$| $$ /$$__ $$| $$ | $$_ $$ | $$ | $$| $$ | $$| $$| $$_____/
| $$$$$$$/| $$| $$$$$$$| $$$$$$$| $$ \ $$ | $$ | $$| $$$$$$/| $$| $$$$$$$
|_______/ |__/ \_______/ \_______/|__/ \__/ |__/ |__/ \______/ |__/ \_______/
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧
✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ (c) Lil Monster#3557 ✧・゚: *✧・゚:*    *:・゚✧*:・゚✧ ✧・゚: *✧・゚:*
*/
/* *•̩̩͙⊱••••••••••••✩ VARIABLES ✩••••̩̩͙⊰•••••••••** */
:root {
--theme-name: "Black Hole";
--theme-version: "0.1";
--blurple: rgb(113, 136, 217);
--greyple: rgb(151, 168, 180);
--blurple-sheer: rgba(114, 137, 218, 0.267);
--greyple-sheer: rgba(151, 168, 180, 0.267);
--black-hole: url(https://images.all-free-download.com/images/graphicthumb/starry_night_192398.jpg);
--stars: url(https://www.freeiconspng.com/uploads/twinkle-star-png-stars-9.png);
--roundness: 50px;
--uno: rgb(25, 25, 27);
/* primary background color */
--dos: rgb(30, 30, 33);
/* secondary background color */
--tres: rgb(35, 35, 39);
/* tertiary background color */
--quatro: rgb(16, 16, 17);
/* quaternary background color */
--sheer: rgba(0,0,0,0.6);
--veil: rgba(100, 100, 100, 0.2);
--online: rgb(67, 181, 129);
--online-sheer: rgba(67, 181, 129, 0.267);
/* color for online status */
--idle: rgb(250, 166, 26);
--idle-sheer: #faa61a44;
/* color for idle status */
--dnd: rgb(240, 71, 71);
--dnd-sheer: rgba(240, 71, 71, 0.267);
/* color for dnd status */
--offline: rgb(99, 107, 117);
--offline-sheer: rgba(99, 107, 117, 0.267);
/* color for offline status */
--invisi: rgb(116, 127, 141);
--invisi-sheer: rgba(116, 127, 141, 0.267);
/* color for invisible status - Note this will only show for your own invisibility */
--streaming: rgb(100, 61, 167);
--streaming-sheer: rgba(100, 61, 167, 0.267);
/* color for streaming status */
}
/* ==== TABLE OF CONTENTS ====
* ========== STATIC ==========
* I. App Window
* II. Title Bar
* III. Channel Area
* A. Channels Header
* B. Channel Groups and Individual Channels
* C. User Settings and Voice Connection
* D. Private Channels
*
* IV. Guilds Area
* A. Guilds Header
* B. Guild Styles
* C. Guild Folders
*
* V. Pages
* A. Main Areas
* 1. Embeds, Code Blocks, and Invites
* 2. Login Page
* 3. Download Discord
* B. Members List
* C. Top Bar & Typing Status
* D. Cards and Tiles
* E. Buttons, Switches, and Bars
* F. Change SVGs
*
* VI. Top Layers
* VII. ScrollBars
*
*
*
*
* ========== MODALS AND POPOUTS ==========
* VIII. Menus
* A. Server Menu
* B. User Status
* C. Context Menu
* D. Dropdown Menus
* IX. Popouts
* A. User Popout
* B. Message Popout
* C. Search Popout & Results
* D. Attach Popout, Add Game popout
* E. Tooltips & Notices
* F. Autocomplete & Everyone Popout
* G. Gift Nitro and Gif Picker
* H. Emoji Picker
* I. Game Preview
* J. Add Roles Popout & Roles Overflow
* K. RTC Connection
*
* X. Modals
* A. User Modal
* B. Upload Modal
* C. Join Guild Modal
* D. Messages Modal, Games Download Modal, Screenshare
* E. Incoming Call & Phone Verification
* F. Reactions Modal & Server Invite Modal
* G. Gift Modal
* XI. Keyframes
* XII. Custom CSS
*/
/* I. App Window */
#app-mount,
.container-16j22k {
background: linear-gradient(var(--sheer), var(--sheer)),var(--black-hole) center/30%;
}
#app-mount .app-2rEoOp,
#app-mount .layers-3iHuyZ,
.privateChannels-1nO12o,
.container-2lgZY8,
#app-mount .layer-3QrUeG {
background-color: transparent;
}
/* II. Title Bar */
.wordmark-2iDDfm svg {
display: none;
}
.titleBar-AC4pGV:not(.typeMacOS-3EmCyP)::after {
content: "𐌁𐌋𐌀𐌂𐌊 𐋏𐍈𐌋𐌄";
position: absolute;
top: 5px;
left: 10px;
color: rgb(170, 170, 170);
display: block;
height: 16px;
width: fit-content;
pointer-events: none;
font-size: 14px;
}
.winButtonMinMax-PBQ2gm:hover {
background-color: var(--blurple);
}
.titleBar-AC4pGV {
background-color: transparent;
}
/* III. Channel Area */
/* A. Channels Header */
#app-mount .channelNotice-1-XFjC {
background-color: var(--blurple-sheer);
}
#app-mount .channelNotices-41mJbj .channelNotice-1-XFjC .message-3SOT5P .btn-11C5_u {
background-color: var(--blurple-sheer);
border-color: transparent;
transition: all .2s ease-in-out;
}
#app-mount .channelNotices-41mJbj .channelNotice-1-XFjC .message-3SOT5P .btn-11C5_u:hover {
background-color: var(--blurple);
}
.container-PNkimc,
.animatedContainer-1pJv5C,
.sidebar-2K8pFh {
background-color: transparent;
}
.channels-Ie2l6A {
background-color: transparent;
}
#app-mount .bannerImage-1jOskm {
-webkit-mask: linear-gradient(rgb(0, 0, 0), transparent);
mask: linear-gradient(rgb(0, 0, 0), transparent);
border-radius: 10px 10px 0 0;
}
/* B. Channel Groups and Individual Channels */
.containerDefault-3GGEv_,
.containerDragAfter-3TEhpe,
.containerDragBefore-3Dzc5x,
.containerUserOver-1Tcb7l {
padding-top: 20px;
}
.contentSelectedText-3wUhMi,
.contentSelectedVoice-1WDIBM,
.contentConnectedVoice-qL-YrL,
.wrapper-2NJDcI,
#app-mount .wrapper-1ucjTd.modeSelected-1zApJ_ .content-3at_AU,
#app-mount .wrapper-1ucjTd.modeSelected-1zApJ_:hover .content-3at_AU {
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
color: var(--blurple)
}
.contentConnectedVoice-qL-YrL:active,
.contentHoveredText-2D9B-x,
.contentHoveredVoice-3p_NEO:active,
.contentSelectedVoice-1WDIBM:active,
#app-mount .listeningAlong-2UPsxf,
#app-mount .wrapper-1ucjTd:hover .content-3at_AU {
background-color: transparent;
}
.contentSelectedText-3wUhMi .icon-sxakjD,
.contentSelectedVoice-1WDIBM .icon-sxakjD {
opacity: 1;
filter: brightness(100%);
}
.colorHoveredText-OZnAgu,
.colorHoveredVoice-1kucsK,
#app-mount .wrapper-1ucjTd:not(.modeSelected-1zApJ_):hover .name-3_Dsmg,
#app-mount .wrapper-1ucjTd:not(.modeSelected-1zApJ_):hover svg {
color: var(--blurple);
opacity: 1;
}
.nameConnectedText-3CzNQn,
.nameConnectedVoice-MHUX5F,
.nameSelectedText-sp_EUw,
.nameSelectedVoice-1qSph5,
.colorConnectedText-1c_uzY,
.colorConnectedVoice-3kyvUN,
.colorSelectedText-1y4Wvs,
.colorSelectedVoice-Xcb_9R {
color: currentColor;
}
.unread-1xRYoj {
background-color: var(--blurple-sheer);
transition: background-color .2s ease-in-out;
}
.unread-1xRYoj:hover {
background-color: var(--blurple);
}
.mention-1f5kbO {
background-color: var(--dnd-sheer);
transition: background-color .2s ease-in-out;
}
.mention-1f5kbO:hover {
background-color: var(--dnd);
}
/* C. User Settings and Voice Connection */
.panels-j1Uci_ .container-3baos1 {
border-top: 1px solid var(--tres);
}
.container-1giJp5,
.container-3baos1,
.container-1UB9sr,
.payment-xT17Mq,
.expandedInfo-3kfShd,
.panels-j1Uci_ {
background-color: transparent !important;
}
.container-1giJp5,
.container-3baos1 {
border: none;
}
.hoverablePayment-Yc6mK7:hover {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
.notches-1sAcEM {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
-webkit-mask-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20width='8'%20height='20'%20fill='%2336393f'><path%20fill-rule='evenodd'%20d='M0%200h8v20H0V0zm4%202a2%202%200%200%200-2%202v12a2%202%200%201%200%204%200V4a2%202%200%200%200-2-2z'/></svg>");
-webkit-mask-repeat: repeat-x;
}
.progress-1IcQ3A {
background: var(--dos) !important;
}
.authedApp-mj2Hmd,
.paginator-166-09 {
background: var(--sheer) !important;
}
.defaultIndicator-G3c16x,
.paymentPane-3bwJ6A,
#app-mount .defaultIndicator-2X8Auf,
#app-mount .gemIndicatorContainer-2jdECl {
background-color: var(--sheer) !important;
}
.lookFilled-1Gx00P.colorPrimary-3b3xI6 {
background-color: var(--uno) !important;
}
.users-i_3-kL {
background-color: var(--blurple-sheer);
color: white;
}
.total-3tKGEB {
background-color: var(--blurple);
color: white;
}
.total-3tKGEB::after {
border-right-color: var(--blurple);
}
/* D. Private Channels */
.searchBar-6Kv8R2 {
-webkit-box-shadow: none;
box-shadow: none;
}
.scroller-1JbKMe {
background: transparent;
}
.searchBar-2_Yu-C {
background-color: transparent;
border-color: var(--tres);
}
.privateChannels-1nO12o .searchBar-2_Yu-C .searchBarInner-1_Tg2R,
a.selected-aXhQR6 .layout-2DM8Md, a.channel-2QD9_O:hover {
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
}
/* IV. Guilds Area */
/* A. Guilds Header */
#app-mount .wrapper-1Rf91z {
margin-top: 45px;
background-color: transparent;
overflow: visible;
}
#app-mount .platform-osx .wrapper-1Rf91z {
margin-top: 60px;
}
.wrapper-1Rf91z .scroller-2TZvBN::-webkit-scrollbar {
display: none;
}
.container-2td-dC .wrapper-2lTRaf,
.scroller-2TZvBN {
background-color: transparent !important;
}
.scrollerWrap-1IAIlv {
height: 90%;
}
#app-mount .wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child .wrapper-25eVIn .svg-1X37T1 {
height: 100% !important;
width: 100% !important;
}
.scrollerWrap-1IAIlv .scroller-2TZvBN {
padding: 10px 0 20px 0px;
}
.wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child {
position: absolute;
top: -45px;
left: 0px;
width: 70px;
display: flex;
justify-content: center;
}
.wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child .pill-2uzAFe,
.homeIcon-tEMBK1 path {
display: none;
}
.pill-31IEus .item-2hkk8m {
background-color: var(--blurple);
}
#app-mount .button-OhfaWu {
background-color: transparent;
}
.wrapper-1BJsBx[aria-label="Home"] .childWrapper-anI2G9 {
background-color: transparent;
}
.homeIcon-tEMBK1 {
background-color: white;
-webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/home.svg);
-webkit-mask-size: 45px;
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
transform: scale(0.5);
transition: background-color .2s ease-in-out;
-webkit-mask-position: center;
margin-left: 0px;
height: 100% !important;
width: 100% !important;
}
.wrapper-1BJsBx[aria-label="Home"].selected-bZ3Lue .homeIcon-tEMBK1 {
background-color: var(--blurple) !important;
}
#app-mount .downloadProgressCircle-yTgLNF {
top: 0px;
}
.circleBackground-OqqxHM {
fill: var(--blurple-sheer);
stroke: var(--greyple-sheer);
}
.guildIconContainer-E1JUVt {
margin-top: 14px;
transform: translateY(-50%);
}
/* B. Guild Styles */
#app-mount .circleIconButton-jET_ig,
#app-mount .wrapper-2lTRaf {
background: transparent;
}
#app-mount .dragPlaceholder-D9-haY,
#app-mount .acronym-2mOFsV,
#app-mount .placeholderMask-3K9THS .dragInner-_SHftW {
background-color: var(--blurple-sheer);
height: 100%;
width: 100%;
box-sizing: border-box;
transition: all 200ms ease-in-out;
}
#app-mount .acronym-2mOFsV:hover {
background-color: var(--blurple);
}
#app-mount .circleIconButton-jET_ig:hover {
opacity: 1
}
#app-mount .iconBadge-2wi9r4 {
background-color: var(--blurple) !important;
transition: all .2s ease-in-out;
}
.unread-2OHH1w:before {
box-shadow: 2px 0px 10px var(--blurple);
}
.unread-2OHH1w.selected-nT-gM3::before {
box-shadow: none;
}
.createJoinContainer-2Av064 {
margin-bottom: 10px;
}
#app-mount .guildsError-b7zR5H {
background: var(--dnd-sheer);
border-color: transparent;
}
#app-mount .guildsError-b7zR5H:hover {
background: var(--dnd);
}
/* C. Guild Folders */
#app-mount .expandedFolderBackground-2sPsd-,
#app-mount .folder-21wGz3 {
background-color: transparent;
}
#app-mount .expandedFolderBackground-2sPsd-::before {
content: "";
position: absolute;
top: 0;
left: 0;
height: calc(100% + 6px);
width: 100%;
opacity: 0.4;
background-color: var(--blurple-sheer);
border-radius: calc(var(--roundness)/5);
}
#app-mount .folder-21wGz3 [style*="rgba(114, 137, 218, 0.4)"] {
background-color: transparent !important;
}
#app-mount svg[name="Folder"][style*="color: rgb(114, 137, 218)"] {
color: var(--blurple) !important;
}
/* V. Pages */
/* A. Main Areas */
.chat-3bRxxu,
#app-mount .activityFeed-28jde9,
#app-mount .activityFeed-1C0EmJ,
#app-mount .gameLibrary-TTDw4Y,
#app-mount .container-3gCOGc,
#app-mount .applicationStore-1pNvnv,
#app-mount .pageWrapper-1PgVDX,
#app-mount .root-1BQpZw {
background-color: transparent !important;
margin-bottom: 10px;
margin-right: 10px;
border-radius: 10px;
}
#app-mount .messages-3amgkR,
.sidebarRegionScroller-3MXcoP,
.contentRegionScroller-26nc1e {
background-color: transparent;
}
#app-mount .noChannel-Z1DQK7 {
margin-bottom: 10px;
margin-right: 10px;
border-radius: 10px;
}
.searchHelpText-19imBp {
margin-bottom: -20px;
}
.bg-AYqtMd {
-webkit-mask: linear-gradient(rgb(0, 0, 0) 50%, transparent);
mask: linear-gradient(rgb(0, 0, 0) 50%, transparent);
}
#app-mount .searchBox-3Y2Vi7 {
background: var(--veil);
}
#app-mount .title-3qD0b-,
#app-mount .titleCall-_b9o8P,
#app-mount .headerBar-UHpsPw,
#app-mount .container-1r6BKw,
#app-mount .header-39GIC8,
#app-mount .chat-3bRxxu .channelTextArea-rNsIhG,
#app-mount .friendsTable-133bsv .friendsRow-2yicud:hover,
#app-mount .video-1FfuMD {
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
.friendsTable-133bsv .friendsTableBody-1ZhKif {
background: transparent;
}
.channelTextAreaDisabled-rZtG8r {
opacity: 1;
}
#app-mount .children-19S4PO:after {
display: none;
}
#app-mount .gameUpdates-2GPqBU {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--veil) var(--stars) top left fixed;
}
#app-mount .friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:not(:last-child) {
background-color: var(--online-sheer)
}
.friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9.not(:last-child):hover {
background-color: var(--online)
}
.friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:last-child {
background-color: var(--dnd-sheer);
}
.friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:last-child:hover {
background-color: var(--dnd);
}
.gameLibrary-TTDw4Y>.libraryHeader-3g95kE+div+.scrollerWrap-2lJEkd>.scroller-2FKFPG {
margin-top: 47px;
}
.stickyHeader-1pqx0j+.stickyHeader-1pqx0j {
margin-top: -47px;
}
#app-mount .content-yTz4x3,
#app-mount .chat-3bRxxu form .inner-zqa7da,
#app-mount .chat-3bRxxu form,
#app-mount .itemBackground-2vEldQ,
#app-mount .wrapper-29NfPK {
background-color: transparent;
}
#app-mount .contentCozy-3XX413 .inner-zqa7da {
background-color: var(--veil);
border-radius: 3px;
}
#app-mount .containerCozy-jafyvG .divider-32i8lo,
.dividerContent-2L12VI:before {
display: none;
}
#app-mount .dividerContent-2L12VI {
color: var(--greyple-sheer);
}
#app-mount .dividerRed-MKoLlr .dividerContent-2L12VI {
color: var(--dnd-sheer);
}
#app-mount .divider-3gKybi:not(.dividerRed-MKoLlr) .dividerContent-2L12VI:after {
border-image: linear-gradient(to right, var(--greyple-sheer) 50%, transparent);
border-image-slice: 1;
}
#app-mount .divider-3gKybi.dividerRed-MKoLlr .dividerContent-2L12VI:after {
border-image: linear-gradient(to right, var(--dnd-sheer) 50%, transparent);
border-image-slice: 1;
}
#app-mount .content-yTz4x3 {
border: 1px solid var(--quatro);
}
#app-mount .messagesWrapper-3lZDfY {
background-color: transparent;
}
#app-mount .content-yTz4x3,
#app-mount .activityFeed-28jde9m,
.gameLibrary-TTDw4Y .scrollerWrap-2lJEkd,
.friendsTable-133bsv,
.applicationStore-1pNvnv .scrollerWrap-2lJEkd,
.activityFeed-1C0EmJ .scrollerWrap-2lJEkd,
.root-1BQpZw .scrollerWrap-2lJEkd,
#app-mount .noChannel-Z1DQK7 {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
.scrollerWrap-2lJEkd {
contain: layout style;
}
.codeRedemption-2CtsK6,
#app-mount .emptyStateHeader-1ADtcL,
#app-mount .header-2HrZI4 {
padding: 0 20px;
}
.chat-3bRxxu>.content-yTz4x3 .messages-3amgkR .containerCozy-jafyvG:last-child,
.containerCompactBounded-cYR5cW:last-child {
padding-bottom: 30px;
}
.chat-3bRxxu .channelTextArea-rNsIhG {
margin: 0px 0 0 0px;
padding: 0;
border: none;
}
.chat-3bRxxu .innerNoAutocomplete-1WpcVO {
border-radius: 0px;
}
.chat-3bRxxu .textArea-2Spzkt {
background-color: transparent !important;
line-height: 1.25rem !important;
margin-top: 8px;
}
.buttons-205you {
align-self: center;
}
.chat-3bRxxu form,
.chat-3bRxxu .channelTextArea-rNsIhG,
.innerNoAutocomplete-1WpcVO{
margin: 0;
min-height: 55px;
}
.gatedContent-3-B7qB::after {
content: '';
position: absolute;
bottom: 0;
height: 55px;
width: 101.5%;
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
}
.applicationStore-1pNvnv .gatedContent-3-B7qB::after {
display: none;
}
/* 1. Embeds, Code Blocks, and Invites */
#app-mount .markup-2BOw-j pre,
#app-mount .wrapper-35wsBm,
#app-mount .embedInner-1-fpTo,
#app-mount .messageGroupBlocked-3wrQQX .messageGroupBlockedBtn-1PBBh- {
background: var(--uno) var(--stars) top left;
background-attachment: fixed;
border-color: var(--tres)
}
#app-mount .messageGroupBlocked-3wrQQX.revealed-1_RKsf {
background: linear-gradient(var(--dnd-sheer), transparent 80%),var(--uno) var(--stars) top left fixed;
border-color: var(--tres)
}
#app-mount .markup-2BOw-j code,
#app-mount .markup-2BOw-j code.inline,
#app-mount .messageGroupBlocked-3wrQQX.revealed-1_RKsf .messageGroupBlockedBtn-1PBBh-,
#app-mount .bodySection-jqkkIP {
background: transparent;
}
.aka-1mqp34,
#app-mount .akaBadge-1M-1Gw,
#app-mount .spoilerText-3p6IlD.hidden-HHr2R9 {
background: var(--blurple-sheer);
}
#app-mount .spoilerText-3p6IlD {
background: var(--sheer);
padding: 0 5px;
}
#app-mount .partyMemberOverflow-Nei5T6,
#app-mount .guildIconEmptyBackground-14tfYf {
background-color: var(--blurple-sheer);
}
#app-mount .guildIconEmptyIcon-rSyLPf,
#app-mount .partyMemberOverflow-Nei5T6 {
color: white;
}
.smallCarousel-2e0IQc {
background: var(--sheer);
border-radius: 5px;
}
#app-mount .jumpToPresentBar-9P20AM button:first-of-type {
display: none;
}
#app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM {
background-color: var(--blurple);
bottom: 15px;
border-radius: 20px;
right: 50px !important;
width: auto !important;
box-shadow: 0 2px 20px rgba(0, 0, 0, .1);
left: auto !important;
animation: slide-up .7s cubic-bezier(.4, 0, 0, 1), opacity .7s ease;
}
#app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM:before {
content: "";
width: 20px;
background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiI+CiAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxwYXRoIGQ9Ik0wIDEyVjBoMTJ2MTIiLz4KICAgIDxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik01LjI0ODI5MTAyIDJ2NS4yMTg2ODg5NkwzIDUgMiA2bDQgNCA0LTQtMS0xLTIuMjg0MTE4NjUgMi4yMTg2ODg5NlYyIi8+CiAgPC9nPgo8L3N2Zz4=) 50% no-repeat;
margin-right: -15px;
padding-left: 10px;
transition: all .2s ease-in-out;
}
#app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM button:last-child {
text-align: center;
font-family: Montserrat;
font-size: 11px;
}
#app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM .spinner-2enMB9 {
margin-left: 20px !important;
margin-top: 10px;
padding-right: 15px;
margin-bottom: 10px;
-ms-transform: scale(1.3);
transform: scale(1.3)
}
#app-mount .chat-3bRxxu .newMessagesBar-mujexs {
background-color: var(--blurple);
}
#app-mount .chat-3bRxxu .newMessagesBar-mujexs:hover {
background-color: var(--blurple);
}
#app-mount .chat-3bRxxu .hasMore-3e72_v button {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
border: 1px solid var(--quatro);
color: var(--blurple);
}
/* 2. Login Page */
.rightSplit-2US0xy img,
.canvas-3XuBXe {
display: none;
}
.rightSplit-2US0xy {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
-webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/bubbleMask.png) top/100% no-repeat;
animation: slide-in 1.5s cubic-bezier(.4, 0, 0, 1.3) forwards;
}
@keyframes slide-in {
from {
transform: translateX(-50%);
}
to {
transform: translateX(-5%);
}
}
.wrapper-3Q5DdO {
background: linear-gradient(transparent, var(--blurple-sheer) 80%)
}
.authBox-hW6HRx {
background: linear-gradient(var(--greyple-sheer), transparent 80%), var(--uno) var(--stars) top left fixed;
}
/* 3. Download Discord */
#app-mount .backdrop-1wrmKB[style*="background-color: rgb(255, 255, 255)"] {
background: linear-gradient(transparent, var(--blurple-sheer) 80%), var(--quatro) var(--stars) top left fixed !important;
}
/* 4. Light Theme Alert */
[class*="platform-"].theme-light::after {
content: 'Light does not scatter in space. Please turn dark theme back on.';
line-height: 30px;
text-align: center;
white-space: pre;
position: fixed;
top: 10%;
left: 50%;
transform: translate(-40%);
height: fit-content;
width: fit-content;
padding: 5px 10px;
box-sizing: border-box;
color: rgb(255, 255, 255);
font-weight: bold;
text-shadow: 1px 2px 1px rgb(0, 0, 0);
font-size: 15px;
background: var(--dnd-sheer) var(--stars) top left fixed;
z-index: 500;
pointer-events: none;
animation: lightTheme 1s cubic-bezier(.4, 0, 0, 1.3) forwards;
border-radius: 5px;
border: 2px solid var(--dnd);
}
@keyframes lightTheme {
from {
top: -50%;
}
}
#app-mount .theme-light .itemSubMenu-1vN_Yn:nth-child(16) .theme-light.contextMenu-HLZMGh .item-1Yvehc:first-child,
#app-mount .theme-light .preview-2nSL_2+.marginTop40-i-78cZ .radioGroup-1GBvlr:nth-child(2) .cardPrimaryEditable-3KtE4g:nth-child(2) {
color: white;
background-color: var(--dnd-sheer);
border-color: var(--dnd);
box-shadow: 0 0 20px var(--dnd);
}
/* B. Members List */
#app-mount .members-1998pB {
background-color: transparent;
margin-bottom: 55px;
}
#app-mount .members-1998pB::after {
content: '';
position: absolute;
bottom: 0;
height: 55px;
width: 100%;
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
}
#app-mount .member-3W1lQa {
border-right: 2px solid transparent;
}
#app-mount .member-3W1lQa:hover {
background: transparent;
border-right-color: var(--blurple);
}
#app-mount .member-3W1lQa.popout-open,
#app-mount .member-3W1lQa.popout-open:hover,
#app-mount .codeRedemptionRedirect-1wVR4b,
#app-mount .elevationHigh-1PneE4 {
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
}
#app-mount .elevationHigh-1PneE4[style*="background-color: rgba(32, 34, 37, 0.9)"] {
background: linear-gradient(to right, var(--blurple-sheer), transparent 80%), var(--veil) var(--stars) top left fixed !important;
}
#app-mount .status-2s6iDp,
#app-mount .status-2kJpnA,
#app-mount .status-1ibiUI {
border-color: transparent;
right: -4px;
}
/* C. Top Bar & Typing Status */
#app-mount .search-2oPWTC .searchBar-3dMhjb,
#app-mount .darkTheme-3uETC4.container-2XeR5Z,
#app-mount .container-cMG81i {
background: transparent;
}
#app-mount .chat-3bRxxu form .typing-2GQL18 {
background-color: var(--sheer);
bottom: 100%;
padding-left: 20px;
z-index: 0;
animation: opacity 300ms ease;
-ms-transform-origin: bottom left;
transform-origin: bottom left;
-ms-transform: scale(1);
transform: scale(1);
width: auto;
display: -webkit-box;
padding-right: 20px;
padding-top: 0px;
border-radius: 5px 5px 0 0;
margin-left: 15px;
box-shadow: 0 -3px 20px rgba(0, 0, 0, .1);
opacity: 1;
transition: all 200ms ease;
text-overflow: ellipsis;
z-index: 5;
}
/* D. Cards and Tiles */
.article-3kb3qm,
#app-mount .body-SKIE6r,
#app-mount .news-2GDtLJ,
#app-mount .wrapper-2TxpI8,
#app-mount .embedContainer-26S24y,
#app-mount .carousel-2WxMes,
#app-mount .paginationItem-2lUq0s,
#app-mount .info-3NKfPL,
#app-mount .header-Qk7iwL,
#app-mount .tierHeaderLocked-1a2opw,
#app-mount .tierBody-x9kBBp {
background-color: transparent;
}
.disableColor-MwOAZf,
.iconBackgroundTierNone-3MPhMJ,
.iconBackgroundTierOne-2LhaMB,
.iconBackgroundTierThree-3qw3JX,
.iconBackgroundTierTwo-3bCmdc {
color: var(--veil);
}
#app-mount .paginationItem-2lUq0s:after {
background: var(--sheer);
}
#app-mount .splashArt-3I5Qmp {
-webkit-mask: linear-gradient(to right, transparent, rgb(0, 0, 0) 70%);
transition: filter .2s ease-in-out;
opacity: 1;
}
#app-mount .header-1RC2Wb,
#app-mount .bda-slist li,
#app-mount .notDetected-33MY4s,
#app-mount .container-2Zlzt0,
#app-mount .tier1Banner-1B_WXY,
#app-mount .emptyState-2-sT0o,
#app-mount .loading-17PYl_,
#app-mount .userHovered-2_fT4Z:active,
#app-mount .wrapperAudio-1jDe0Q,
#app-mount .guildGraphicContainer-39I_Pl {
background: var(--veil) var(--stars) top left;
background-attachment: fixed;
}
#app-mount .userHovered-2_fT4Z:active {
border-radius: 3px;
}
#app-mount .card-FDVird:before {
background: linear-gradient(to right, var(--blurple-sheer), var(--veil));
}
#app-mount .entitledHeader-3LRNDT {
border-radius: 5px;
}
#app-mount .card-rJBFl3,
#app-mount .card-7JP0BX,
#app-mount .audioControls-2HsaU6,
#app-mount .videoControls-2kcYic,
#app-mount .tile-2OwFgW,
#app-mount .wrapper-3UweLa,
#app-mount .multipleIconWrapper-1PjkRO,
#app-mount .section-2VKIPC,
#app-mount .card-3DjzTQ {
background: var(--sheer) var(--stars) top left;
background-attachment: fixed;
}
#app-mount .splash-3N0nhD {
-webkit-mask: linear-gradient(black, transparent);
mask: linear-gradient(black, transparent);
}
#app-mount .itemBackground-2vEldQ:before {
background: radial-gradient(ellipse at top,transparent,var(--sheer)),linear-gradient(90deg,var(--sheer) 0,transparent 40%,transparent 60%,var(--sheer)),linear-gradient(0deg,var(--sheer) 10%,transparent 70%);
}
#app-mount .carouselRightGradientEdge-2Z3H8D {
background-image: linear-gradient(270deg,var(--sheer),transparent);
}
#app-mount .carouselLeftGradientEdge-3P4spl {
background-image: linear-gradient(90deg,var(--sheer),transparent);
}
#app-mount .iconCircle-1dlYo0,
#app-mount .emojiAliasInput-1y-NBz .emojiInput-1aLNse,
#app-mount .mediaBarWrapper-3D7r67,
#app-mount .mediaBarWrapper-3D7r67:after,
#app-mount .mediaBarWrapper-3D7r67:before,
#app-mount .tierNoneContainer-3hhK3h,
#app-mount .tierBody-16Chc9 {
background: var(--sheer);
}
#app-mount .buffer-26XPkd,
#app-mount .buffer-26XPkd:after,
#app-mount .buffer-26XPkd:before,
#app-mount .tierInProgress-3mBoXq {
background: var(--blurple)
}
#app-mount .tile-QA_yMc,
#app-mount .tileMedia-1q3guD,
#app-mount .popout-2xBvMR,
#app-mount .outer-2IVh5n,
#app-mount .popout-3G62UL,
#app-mount .recentlyPlayedContainer-2F3MqS,
#app-mount .guildPopout-3CgKqR {
background: var(--uno) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .tile-QA_yMc:hover,
#app-mount .tileMedia-1q3guD:hover,
#app-mount .multipleIconWrapper-2TXVB4,
#app-mount .section-3TvauS {
background: var(--sheer) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .nowPlaying-284llR {
background: var(--online-sheer) var(--stars) top left fixed;
}
#app-mount .dockItem-2kQDqg:hover,
#app-mount .entitledHeader-3LRNDT,
#app-mount .cardPrimary-1Hv-to,
#app-mount .cardPrimaryEditable-3KtE4g,
#app-mount .genreTag-3QLRUJ,
#app-mount .content-35aVm0,
#app-mount .emptyCard-3CNsz2,
#app-mount .guildGraphicBackground-UDBjuF,
#app-mount .info-3UT5_W {
background: var(--blurple-sheer) var(--stars) top left fixed;
}
#app-mount .cardPrimary-1Hv-to,
#app-mount .cardPrimaryEditable-3KtE4g,
#app-mount .emptyApplications-3GTmw-,
#app-mount .emptyUsers--hiToV {
border-color: var(--sheer);
}
#app-mount .wrapper-39oAo3 {
background: var(--veil) var(--stars) top left fixed;
margin-bottom: 0px;
height: 23px;
border-radius: 0;
overflow: hidden;
}
#app-mount .nowPlaying-284llR .gameNameInput-385LoS:focus,
#app-mount .nowPlaying-284llR .gameNameInput-385LoS:hover,
#app-mount .tierHeaderLocked-1s2JJz,
#app-mount .guildGraphicBackground-wbfC17,
#app-mount .guildGraphicContainer-_IAetM,
#app-mount .subscriptionDuration-3WXA_o,
#app-mount .subscriptionDuration-UvxLGw,
#app-mount .tierPill-1yRO48,
#app-mount .emptyApplications-3GTmw-,
#app-mount .emptyUsers--hiToV {
background-color: var(--sheer);
}
#app-mount .mediaFade-1SdEfL {
background: linear-gradient(180deg,transparent,var(--sheer));
}
#app-mount .gradientOverlayLeft-3w159C {
background: linear-gradient(90deg,var(--sheer),transparent);
}
#app-mount .gradientOverlayRight-3vMuS8 {
background: linear-gradient(90deg,transparent,var(--sheer));
}
.listingSmall-d9e5gC .purchaseUnit-2lxci3,
#app-mount .root-1bFE0x,
#app-mount .item-2yFVoY,
#app-mount .card-NB61oR,
#app-mount .guildSubscription-2bT8-B,
#app-mount .tier-3H4BXk {
background: linear-gradient(var(--blurple-sheer), transparent 80%),var(--uno) var(--stars) top left fixed;
}
.checkmarkIcon-2EnYwn {
color: var(--online);
}
#app-mount .row-1bU71H {
background: linear-gradient(to right, transparent, var(--online-sheer)),var(--uno) var(--stars) top left fixed;
}
#app-mount .purchaseUnitOperatingSystem-cnbJPz,
#app-mount .background-3xPPFc {
color: var(--blurple-sheer);
}
/* E. Buttons, Switches, and Bars */
.headerButtonColor-G7_f-V {
background-color: var(--dos);
}
.userSettingsVoice-iwdUCU .media-engine-video {
background: transparent;
}
#app-mount .bar-2Qqk5Z,
.themeDefault-24hCdX,
#app-mount .userSettingsVoice-iwdUCU .previewOverlay-2O7_KC,
#bd-settingspane-container .ui-switch-item .ui-switch-wrapper .ui-switch,
#app-mount .interactive-1FxC7B:hover,
#app-mount .price-NUANu6,
#app-mount .playerOverflow-2Hf77M,
#app-mount .barBackground-2EEiLw {
background-color: var(--sheer);
}
#app-mount .tierMarkerBackground-3q29am {
background: linear-gradient(var(--sheer), var(--sheer)), var(--stars) top left, linear-gradient(var(--quatro), var(--quatro));
background-attachment: fixed;
}
#app-mount .userSettingsVoice-iwdUCU .previewOverlay-2O7_KC {
border-color: rgb(0, 0, 0);
}
#app-mount .accountBtnInner-sj5jLs,
#app-mount .button-mM-y8i,
#app-mount .restoreButton-22-SIW,
#app-mount .topPill-30KHOu .itemSelected-1qLhcL,
#app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
#app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
#app-mount #bd-settings-sidebar .ui-tab-bar-item.selected,
#app-mount .listDefault-2y5Z9D .clickable-23RaYz:hover .content-3xS9Lh,
#app-mount .pageButton-MknE-_:hover {
background-color: var(--veil);
}
#app-mount .topPill-30KHOu .itemSelected-1qLhcL,
#app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
#app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
#app-mount #bd-settings-sidebar .ui-tab-bar-item.selected {
color: var(--blurple)
}
#app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ:hover,
#app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ:hover,
#app-mount #bd-settings-sidebar .ui-tab-bar-item.selected:hover {
background-color: var(--greyple-sheer);
color: var(--greyple);
}
#app-mount .accountBtnInner-sj5jLs:hover,
#app-mount .topPill-30KHOu .item-PXvHYJ:hover:not(.itemSelected-1qLhcL) {
background-color: var(--sheer);
}
#app-mount .background-yZEZik {
stroke: var(--sheer);
}
#app-mount .circleIconButton-jET_ig {
border-color: var(--blurple-sheer);
color: var(--blurple-sheer);
}
#app-mount .circleIconButton-jET_ig:hover {
border-color: var(--blurple);
color: var(--blurple);
}
#app-mount .moreUsers-1s5Her,
#app-mount .lookFilled-1Gx00P.colorGrey-2DXtkV:hover,
#app-mount .lookFilled-1Gx00P.colorBrand-3pXr91,
#app-mount .side-8zPYf6 .themed-OHr7kt.item-PXvHYJ:hover,
#app-mount .topPill-30KHOu .themed-OHr7kt.item-PXvHYJ:hover,
#app-mount #bd-settings-sidebar .ui-tab-bar-item:hover,
#app-mount .boostCount-UFqabz,
#app-mount .tag-2gHSR7,
#app-mount .listDefault-2y5Z9D .clickable-23RaYz.selected-3TGCSZ .content-3xS9Lh {
background-color: var(--blurple-sheer);
}
#app-mount .lookFilled-1Gx00P.colorBrand-3pXr91:hover {
background-color: var(--blurple)
}
#app-mount .lookFilled-1Gx00P.hoverGreen-1gjdJc.hasHover-3X1-zV:hover {
background-color: var(--online-sheer);
}
/* F. Change SVGs */
svg[name="Nova_Bell"] path,
svg[name="Nova_BellOff"] path,
svg[name="Nova_Pin"] path,
svg[name="Nova_People"] path,
svg[name="Nova_At"] path,
svg[name="Nova-CallJoin"] path,
svg[name="PersonWaving"] path,
svg[name="NitroWheel"] path,
svg[name="Library"] path,
svg[name="Activity"] path{
display: none;
}
svg[name="Nova_Bell"] {
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
}
svg[name="Nova_BellOff"] {
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell-off.svg) center/100% no-repeat;
mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
}
svg[name="Nova_Pin"] {
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSJub25lIiBkPSJNMCwwaDI0djI0SDBWMHoiLz4NCjxwb2x5Z29uIGZpbGw9IiNGRkZGRkYiIHBvaW50cz0iMTcuOSwxMy43IDE1LjgsMTIuNiAxNS4xLDUuMyAxNi40LDUgMTYuNCwzIDcuNiwzIDcuNiw1IDguOSw1LjMgOC4yLDEyLjYgNi4xLDEzLjcgNi4xLDE1LjcgDQoJMTEsMTUuNyAxMSwyMSAxMywyMSAxMywxNS43IDE3LjksMTUuNyAiLz4NCjwvc3ZnPg0K") center/100% no-repeat;
mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSJub25lIiBkPSJNMCwwaDI0djI0SDBWMHoiLz4NCjxwb2x5Z29uIGZpbGw9IiNGRkZGRkYiIHBvaW50cz0iMTcuOSwxMy43IDE1LjgsMTIuNiAxNS4xLDUuMyAxNi40LDUgMTYuNCwzIDcuNiwzIDcuNiw1IDguOSw1LjMgOC4yLDEyLjYgNi4xLDEzLjcgNi4xLDE1LjcgDQoJMTEsMTUuNyAxMSwyMSAxMywyMSAxMywxNS43IDE3LjksMTUuNyAiLz4NCjwvc3ZnPg0K") center/100% no-repeat;
transform: scaleX(-1)
}
svg[name="Nova_People"] {
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;
mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;
}
svg[name="Nova_At"] {
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' name='Mention' class='iconInactive-g2AXfB icon-1R19_H da-iconInactive da-icon' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' class='iconForeground-3y9f0B da-iconForeground' fill-rule='evenodd' d='M12.2608,9.57136 C11.91424,9.57136 11.6072,9.67136 11.3464,9.87136 C11.0856,10.07136 10.86432,10.32496 10.68208,10.63568 C10.5,10.94288 10.36432,11.2856 10.26784,11.65712 C10.17488,12.02864 10.12496,12.38944 10.12496,12.73216 C10.12496,12.90352 10.14288,13.08576 10.17856,13.28224 C10.21424,13.47504 10.2856,13.6536 10.39632,13.82144 C10.50352,13.9856 10.64624,14.12144 10.82128,14.22864 C10.99632,14.33584 11.22848,14.38944 11.51776,14.38944 C11.91056,14.38944 12.24272,14.2928 12.51776,14.1 C12.7928,13.9072 13.01776,13.66416 13.1928,13.36784 C13.36784,13.07504 13.4928,12.7536 13.57504,12.41088 C13.6536,12.068 13.6928,11.75008 13.6928,11.46432 C13.6928,11.23568 13.67136,11.01072 13.62864,10.78576 C13.58576,10.56432 13.51088,10.36432 13.4,10.18224 C13.2928,10.00368 13.14288,9.85728 12.9536,9.74288 C12.76784,9.62864 12.53584,9.57136 12.2608,9.57136 L12.2608,9.57136 Z M18.57808,16.8728 C18.84672,17.16224 18.84672,17.63168 18.55136,17.89328 C17.81248,18.54608 16.96928,19.0408 16.02144,19.37504 C14.8464,19.7928 13.6072,20 12.30352,20 C11.05696,20 9.92128,19.80352 8.9,19.4072 C7.87856,19.0144 7.00352,18.46416 6.28208,17.7608 C5.55712,17.05728 4.99632,16.21424 4.59632,15.23216 C4.19648,14.24992 4,13.17856 4,12.01792 C4,10.87136 4.21792,9.81072 4.6536,8.83568 C5.08928,7.86064 5.68208,7.01424 6.43568,6.29632 C7.18928,5.57856 8.06784,5.01776 9.07856,4.60704 C10.08208,4.20352 11.16064,4 12.30352,4 C13.28912,4 14.2464,4.14288 15.17136,4.42864 C16.1,4.7144 16.92144,5.1464 17.63936,5.71792 C18.35712,6.29296 18.92864,7.0072 19.35712,7.86784 C19.78576,8.72864 20,9.73936 20,10.9 C20,11.76064 19.88224,12.52144 19.64288,13.17856 C19.40368,13.8392 19.08592,14.38928 18.68592,14.83568 C18.28592,15.28208 17.83232,15.61408 17.31792,15.83568 C16.80368,16.05712 16.26448,16.16768 15.70016,16.16768 C15.1216,16.16768 14.65728,16.032 14.30736,15.76064 C13.96096,15.48912 13.78592,15.14272 13.78592,14.72848 L13.67872,14.72848 C13.46096,15.07136 13.12864,15.39984 12.67872,15.70704 C12.2288,16.01424 11.67872,16.1712 11.02512,16.1712 C10.03936,16.1712 9.27872,15.84976 8.74288,15.20336 C8.2072,14.55696 7.93936,13.72112 7.93936,12.6856 C7.93936,12.08192 8.03936,11.48912 8.24288,10.89984 C8.4464,10.31056 8.73584,9.78912 9.11072,9.32848 C9.48576,8.87136 9.93568,8.49984 10.45712,8.22128 C10.97856,7.94272 11.55712,7.80352 12.19648,7.80352 C12.74656,7.80352 13.21088,7.91776 13.58928,8.1464 C13.96432,8.37504 14.21088,8.65712 14.32864,8.98576 L14.35008,8.98576 L14.38288,8.82512 C14.46144,8.4384 14.8448,8.12512 15.23936,8.12512 L15.74656,8.12512 C16.14128,8.12512 16.3952,8.43792 16.31408,8.824 L15.60736,12.19296 C15.57872,12.39296 15.53936,12.6144 15.48944,12.8608 C15.43952,13.10384 15.4144,13.33232 15.4144,13.55024 C15.4144,13.79312 15.46096,13.99664 15.55744,14.16448 C15.65024,14.3288 15.836,14.41104 16.11088,14.41104 C16.6752,14.41104 17.14304,14.11088 17.51456,13.50752 C17.8824,12.904 18.068,12.0968 18.068,11.07888 C18.068,10.21824 17.9216,9.45392 17.63232,8.7896 C17.34288,8.12176 16.93936,7.56464 16.42512,7.11104 C15.91088,6.66112 15.29648,6.31824 14.58928,6.0896 C13.87872,5.86096 13.10368,5.74672 12.26448,5.74672 C11.35008,5.74672 10.5144,5.90736 9.75376,6.22896 C8.99296,6.5504 8.34304,6.9968 7.8072,7.56112 C7.27152,8.12896 6.85376,8.79328 6.55728,9.56112 C6.25728,10.32544 6.10736,11.15408 6.10736,12.04336 C6.10736,12.98976 6.26448,13.84336 6.5752,14.604 C6.88592,15.36464 7.32528,16.0112 7.88944,16.5504 C8.4536,17.0896 9.1288,17.50048 9.91088,17.78624 C10.69312,18.07184 11.55728,18.21472 12.49664,18.21472 C13.67168,18.21472 14.6824,18.02912 15.5288,17.65408 C16.16528,17.37488 16.76304,17.01264 17.32304,16.56944 C17.632,16.3248 18.08192,16.3384 18.35056,16.62768 L18.57808,16.8728 L18.57808,16.8728 Z'%3E%3C/path%3E%3C/svg%3E") center/100% no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' name='Mention' class='iconInactive-g2AXfB icon-1R19_H da-iconInactive da-icon' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' class='iconForeground-3y9f0B da-iconForeground' fill-rule='evenodd' d='M12.2608,9.57136 C11.91424,9.57136 11.6072,9.67136 11.3464,9.87136 C11.0856,10.07136 10.86432,10.32496 10.68208,10.63568 C10.5,10.94288 10.36432,11.2856 10.26784,11.65712 C10.17488,12.02864 10.12496,12.38944 10.12496,12.73216 C10.12496,12.90352 10.14288,13.08576 10.17856,13.28224 C10.21424,13.47504 10.2856,13.6536 10.39632,13.82144 C10.50352,13.9856 10.64624,14.12144 10.82128,14.22864 C10.99632,14.33584 11.22848,14.38944 11.51776,14.38944 C11.91056,14.38944 12.24272,14.2928 12.51776,14.1 C12.7928,13.9072 13.01776,13.66416 13.1928,13.36784 C13.36784,13.07504 13.4928,12.7536 13.57504,12.41088 C13.6536,12.068 13.6928,11.75008 13.6928,11.46432 C13.6928,11.23568 13.67136,11.01072 13.62864,10.78576 C13.58576,10.56432 13.51088,10.36432 13.4,10.18224 C13.2928,10.00368 13.14288,9.85728 12.9536,9.74288 C12.76784,9.62864 12.53584,9.57136 12.2608,9.57136 L12.2608,9.57136 Z M18.57808,16.8728 C18.84672,17.16224 18.84672,17.63168 18.55136,17.89328 C17.81248,18.54608 16.96928,19.0408 16.02144,19.37504 C14.8464,19.7928 13.6072,20 12.30352,20 C11.05696,20 9.92128,19.80352 8.9,19.4072 C7.87856,19.0144 7.00352,18.46416 6.28208,17.7608 C5.55712,17.05728 4.99632,16.21424 4.59632,15.23216 C4.19648,14.24992 4,13.17856 4,12.01792 C4,10.87136 4.21792,9.81072 4.6536,8.83568 C5.08928,7.86064 5.68208,7.01424 6.43568,6.29632 C7.18928,5.57856 8.06784,5.01776 9.07856,4.60704 C10.08208,4.20352 11.16064,4 12.30352,4 C13.28912,4 14.2464,4.14288 15.17136,4.42864 C16.1,4.7144 16.92144,5.1464 17.63936,5.71792 C18.35712,6.29296 18.92864,7.0072 19.35712,7.86784 C19.78576,8.72864 20,9.73936 20,10.9 C20,11.76064 19.88224,12.52144 19.64288,13.17856 C19.40368,13.8392 19.08592,14.38928 18.68592,14.83568 C18.28592,15.28208 17.83232,15.61408 17.31792,15.83568 C16.80368,16.05712 16.26448,16.16768 15.70016,16.16768 C15.1216,16.16768 14.65728,16.032 14.30736,15.76064 C13.96096,15.48912 13.78592,15.14272 13.78592,14.72848 L13.67872,14.72848 C13.46096,15.07136 13.12864,15.39984 12.67872,15.70704 C12.2288,16.01424 11.67872,16.1712 11.02512,16.1712 C10.03936,16.1712 9.27872,15.84976 8.74288,15.20336 C8.2072,14.55696 7.93936,13.72112 7.93936,12.6856 C7.93936,12.08192 8.03936,11.48912 8.24288,10.89984 C8.4464,10.31056 8.73584,9.78912 9.11072,9.32848 C9.48576,8.87136 9.93568,8.49984 10.45712,8.22128 C10.97856,7.94272 11.55712,7.80352 12.19648,7.80352 C12.74656,7.80352 13.21088,7.91776 13.58928,8.1464 C13.96432,8.37504 14.21088,8.65712 14.32864,8.98576 L14.35008,8.98576 L14.38288,8.82512 C14.46144,8.4384 14.8448,8.12512 15.23936,8.12512 L15.74656,8.12512 C16.14128,8.12512 16.3952,8.43792 16.31408,8.824 L15.60736,12.19296 C15.57872,12.39296 15.53936,12.6144 15.48944,12.8608 C15.43952,13.10384 15.4144,13.33232 15.4144,13.55024 C15.4144,13.79312 15.46096,13.99664 15.55744,14.16448 C15.65024,14.3288 15.836,14.41104 16.11088,14.41104 C16.6752,14.41104 17.14304,14.11088 17.51456,13.50752 C17.8824,12.904 18.068,12.0968 18.068,11.07888 C18.068,10.21824 17.9216,9.45392 17.63232,8.7896 C17.34288,8.12176 16.93936,7.56464 16.42512,7.11104 C15.91088,6.66112 15.29648,6.31824 14.58928,6.0896 C13.87872,5.86096 13.10368,5.74672 12.26448,5.74672 C11.35008,5.74672 10.5144,5.90736 9.75376,6.22896 C8.99296,6.5504 8.34304,6.9968 7.8072,7.56112 C7.27152,8.12896 6.85376,8.79328 6.55728,9.56112 C6.25728,10.32544 6.10736,11.15408 6.10736,12.04336 C6.10736,12.98976 6.26448,13.84336 6.5752,14.604 C6.88592,15.36464 7.32528,16.0112 7.88944,16.5504 C8.4536,17.0896 9.1288,17.50048 9.91088,17.78624 C10.69312,18.07184 11.55728,18.21472 12.49664,18.21472 C13.67168,18.21472 14.6824,18.02912 15.5288,17.65408 C16.16528,17.37488 16.76304,17.01264 17.32304,16.56944 C17.632,16.3248 18.08192,16.3384 18.35056,16.62768 L18.57808,16.8728 L18.57808,16.8728 Z'%3E%3C/path%3E%3C/svg%3E") center/100% no-repeat;
}
svg[name="Nova_CallJoin"] {
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/phone-call.svg) center/100% no-repeat;
mask: url(https://monstrousdev.github.io/themes/assets/svgs/phone-call.svg) center/100% no-repeat;
}
svg[name="Nova_CallVideo"] {
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/video-call.svg) center/100% no-repeat;
mask: url(https://monstrousdev.github.io/themes/assets/svgs/video-call.svg) center/100% no-repeat;
}
svg[name="PersonWaving"] {
color: inherit !important;
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;;
}
svg[name="NitroWheel"] {
color: inherit !important;
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/nitro.svg) center/100% no-repeat;;
}
svg[name="Library"] {
color: inherit !important;
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/library.svg) center/100% no-repeat;;
}
svg[name="Activity"] {
color: inherit !important;
background-color: currentColor;
-webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/activity.svg) center/100% no-repeat;;
}
/* VI. Top Layers */
#app-mount .standardSidebarView-3F1I7i,
#app-mount .sidebarRegion-VFTUkN {
background: transparent;
}
#app-mount .contentRegion-3nDuYy {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
margin-bottom: 10px;
margin-right: 10px;
border-radius: 10px;
}
.sidebarRegionScroller-3MXcoP,
#app-mount .sidebarRegion-VFTUkN .scrollerWrap-2lJEkd {
justify-content: center;
text-align: center;
}
/* VII. Scrollbars */
.scroller-2FKFPG::-webkit-scrollbar,
.rolesList-22qj2L::-webkit-scrollbar,
#bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar {
width: 5px !important;
}
.scroller-2FKFPG::-webkit-scrollbar-track,
.scroller-2FKFPG::-webkit-scrollbar-track-piece,
.rolesList-22qj2L::-webkit-scrollbar-track-piece,
#bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar-track-piece {
background: transparent !important;
border: none !important;
border-radius: 10px;
}
.scroller-2FKFPG::-webkit-scrollbar-thumb,
.rolesList-22qj2L::-webkit-scrollbar-thumb,
#bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar-thumb {
border: none;
background-color: var(--blurple) !important;
border-radius: 10px;
}
/* =================== MODALS AND POPOUTS ================== */
/* VIII. Menus */
/* A. Server Menu */
#app-mount .menu-Sp6bN1 {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
border-radius: 0;
display: flex;
flex-flow: row wrap;
}
#app-mount .item-1GzJrl:hover {
background: var(--uno) var(--stars) top left;
background-attachment: fixed;
color: var(--blurple);
}
.item-1GzJrl {
margin: 0;
padding: 0px;
width: 40px;
justify-content: center;
}
.icon-2doZ3q,
.iconContainer-2ZxvJk,
.premiumGuildIcon-BhwtRn {
margin: 0;
}
.label-1Y-LW5 {
display: none;
}
.popoutBottom-1YbShG[style*="overflow: hidden; visibility: visible;"][role*="dialog"] {
width: fit-content !important;
top: 58px !important;
left: 190px !important;
transform: translateX(-50%) !important;
border: 1px solid var(--blurple);
border-radius: 0;
animation: popoutanim-min 300ms cubic-bezier(.4, 0, 0, 1);
}
/* B. User Status */
.layer-v9HyYc[style="bottom: "][id*="popout_"] {
height: fit-content !important;
width: fit-content !important;
animation: popoutanim-status 300ms cubic-bezier(.4, 0, 0, 1);
}
.layer-v9HyYc[style*="; bottom: "][id*="popout_"],
.layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-Sp6bN1 {
height: fit-content !important;
}
.layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-Sp6bN1 {
box-shadow: 0 -2px 15px rgba(0,0,0,0.6);
}
.layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-Sp6bN1{
bottom: 54px !important;
left: 187.5px !important;
}
.menu-Sp6bN1 {
width: fit-content;
}
.menu-Sp6bN1 .separator-2zcjq8,
.menu-Sp6bN1 .statusItem-2uzPIV:not(:nth-child(7)) * {
display: none;
}
.menu-Sp6bN1 .statusItem-2uzPIV {
display: inline-block;
height: 41px;
width: 41px;
margin: .5vw;
transition: all .2s ease-in-out;
}
.menu-Sp6bN1 .statusItem-2uzPIV:nth-child(1) {
background: var(--online) !important;
-webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTEyIDJDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bS0yIDE1bC01LTUgMS40MS0xLjQxTDEwIDE0LjE3bDcuNTktNy41OUwxOSA4bC05IDl6Ii8+PC9zdmc+) center/90% no-repeat;
}
.menu-Sp6bN1 .statusItem-2uzPIV:nth-child(3) {
background: var(--idle) !important;
-webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE1IDFIOXYyaDZWMXptLTQgMTNoMlY4aC0ydjZ6bTguMDMtNi42MWwxLjQyLTEuNDJjLS40My0uNTEtLjktLjk5LTEuNDEtMS40MWwtMS40MiAxLjQyQzE2LjA3IDQuNzQgMTQuMTIgNCAxMiA0Yy00Ljk3IDAtOSA0LjAzLTkgOXM0LjAyIDkgOSA5IDktNC4wMyA5LTljMC0yLjEyLS43NC00LjA3LTEuOTctNS42MXpNMTIgMjBjLTMuODcgMC03LTMuMTMtNy03czMuMTMtNyA3LTcgNyAzLjEzIDcgNy0zLjEzIDctNyA3eiIvPjwvc3ZnPg==) center/90% no-repeat;
}
.menu-Sp6bN1 .statusItem-2uzPIV:nth-child(4) {
background: var(--dnd) !important;
-webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTkuMzEgMTdsMi40NC0yLjQ0TDE0LjE5IDE3bDEuMDYtMS4wNi0yLjQ0LTIuNDQgMi40NC0yLjQ0TDE0LjE5IDEwbC0yLjQ0IDIuNDRMOS4zMSAxMGwtMS4wNiAxLjA2IDIuNDQgMi40NC0yLjQ0IDIuNDRMOS4zMSAxN3pNMTkgM2gtMVYxaC0ydjJIOFYxSDZ2Mkg1Yy0xLjExIDAtMS45OS45LTEuOTkgMkwzIDE5YzAgMS4xLjg5IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMTZINVY4aDE0djExeiIvPjwvc3ZnPg==) center/90% no-repeat;
}
.menu-Sp6bN1 .statusItem-2uzPIV:nth-child(5) {
background: var(--invisi) !important;
-webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTEyIDQuNUM3IDQuNSAyLjczIDcuNjEgMSAxMmMxLjczIDQuMzkgNiA3LjUgMTEgNy41czkuMjctMy4xMSAxMS03LjVjLTEuNzMtNC4zOS02LTcuNS0xMS03LjV6TTEyIDE3Yy0yLjc2IDAtNS0yLjI0LTUtNXMyLjI0LTUgNS01IDUgMi4yNCA1IDUtMi4yNCA1LTUgNXptMC04Yy0xLjY2IDAtMyAxLjM0LTMgM3MxLjM0IDMgMyAzIDMtMS4zNCAzLTMtMS4zNC0zLTMtM3oiLz48L3N2Zz4=) center/90% no-repeat;
}
.menu-Sp6bN1 .item-1GzJrl:nth-child(7) {
display: block;
width: 100.5%;
top: 0;
left: 0;
padding: 5px;
height: fit-content;
position: absolute;
transform: translateY(-95%);
box-sizing: border-box;
margin: 0;
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
z-index: -1;
}
.menu-Sp6bN1 .item-1GzJrl:nth-child(7) .customStatusContentIcon-2sionu {
justify-content: center;
}
#app-mount .item-1GzJrl:last-child:nth-child(7) {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
}
.menu-Sp6bN1 .statusItem-2uzPIV:not(:nth-child(7)):hover {
transform: scale(1.3);
}
/* C. Context Menu */
#app-mount .contextMenu-HLZMGh,
#app-mount .container-3cGP6G {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
border: 1px solid rgb(0, 0, 0);
}
#app-mount .itemGroup-1tL0uz {
border-color: rgb(0, 0, 0);
}
#app-mount .itemSubMenu-1vN_Yn:hover,
#app-mount .item-1Yvehc:hover,
#app-mount .item-2J1YMK:hover {
background-color: var(--sheer);
}
/* D. Dropdown Menus */
#app-mount .select-2TCrqx .Select-menu-outer,
#app-mount .popout-2sKjHu,
#app-mount .popoutList-T9CKZQ,
#app-mount .css-181m2lf-menu,
#app-mount .css-1rckt42-menu {
background: var(--quatro) var(--stars) top left;
background-attachment: fixed;
border: 1px solid rgb(0, 0, 0);
}
#app-mount .css-1wqqa50-container {
background-color: var(--veil);
}
#app-mount .css-12o7ek3-option {
background-color: var(--blurple-sheer);
}
#app-mount .selectableItem-1MP3MQ[style*="background: rgb(114, 137, 218)"] {
background-color: var(--blurple-sheer) !important;
}
#app-mount .select-2TCrqx .Select-option.is-focused,
#app-mount .select-2TCrqx .Select-option:hover,
#app-mount .optionActive-KkAdqq,
#app-mount .selectableItem-1MP3MQ:hover,
#app-mount .css-1gnr91b-option {
background: var(--sheer);
}
/* IX. Popouts */
/* A. User Popout */
#app-mount .headerNormal-T_seeN,
#app-mount .body-3iLsc4,
#app-mount .footer-1fjuF6,
#app-mount .headerPlaying-j0WQBV,
#app-mount .headerXbox-3G-4PF,
#app-mount .headerSpotify-zpWxgT,
#app-mount .headerStreaming-2FjmGz,
#app-mount .bodyInner-245q0L,
#app-mount .footer-1fjuF6{
background: transparent;
}
.rolesList-22qj2L {
max-height: 70px;
overflow: auto;
}
.role-2irmRk {
border-width: 1px;
border-style: solid;
border-radius: 2px;
box-sizing: content-box;
height: 16px;
margin: 3px;
padding: 2px;
position: relative;
line-height: 16px;
font-size: 10px;
font-weight: 400;
text-transform: uppercase;
overflow: visible;
}
.role-2irmRk::before {
content: '';
position: absolute;
top: 0;
left: -1px;
height: 100%;
width: calc(100% + 1px);
border-top: 21px solid;
border-color: inherit;
opacity: 0.5;
}
.roleName-32vpEy {
margin: 0 4px;
}
.roleCircleButton-377y0l {
padding: 0;
position: absolute;
z-index: 2;
height: 22px;
top: -1px;
left: -1px;
border-radius: 2px 0 0 2px;
width: 0px;
display: flex !important;
transition: width 0.2s;
}
.roleCircle-3xAZ1j {
display: none;
}
.addButton-pcyyf6 {
line-height: 10px;
width: 22px;
box-sizing: border-box;
height: 22px;
}
.roleRemoveIcon-2-TeGW {
display: block;
}
.role-2irmRk:hover .roleCircleButton-377y0l {
transition: width 0.2s;
width: 22px;
}
.addButtonIcon-1NMJ8u {
height: 7px;
width: 7px;
}
#app-mount .userPopout-3XzG_A {
background: linear-gradient(transparent, var(--uno) 90%), var(--quatro) var(--stars) top left fixed;
}
#app-mount .headerPlaying-j0WQBV {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
}
#app-mount .headerXbox-3G-4PF,
#app-mount .headerSpotify-zpWxgT {
background: linear-gradient(var(--online-sheer), transparent 80%), var(--stars) top left fixed;
}
#app-mount .headerStreaming-2FjmGz {
background: linear-gradient(var(--streaming-sheer), transparent 80%), var(--stars) top left fixed;
}
/* B. Message Popout */
#app-mount .messagesPopoutWrap-1MQ1bW {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .messagesPopout-24nkyi {
background: transparent;
}
#app-mount .header-ykumBX,
#app-mount .themedPopout-25DgLi .footer-SRC48P {
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .messageGroupWrapper-o-Zw7G {
background: var(--sheer) var(--stars) top left !important;
background-attachment: fixed;
border-color: var(--quatro);
}
#app-mount .top-28JiJ- .itemSelected-1qLhcL {
color: var(--greyple) !important;
border-color: var(--greyple) !important;
}
#app-mount .hasMoreButton-1MELpI {
background: var(--sheer) var(--stars) top left !important;
background-attachment: fixed;
border-color: var(--quatro);
}
#app-mount .messageGroupWrapper-o-Zw7G:hover .actionButtons-1sUUug {
background-color: var(--veil);
box-shadow: 0 0 6px 4px var(--veil);
}
#app-mount .jumpButton-3DTcS_ {
background-color: var(--veil);
}
/* C. Search Popout & Results */
#app-mount .container-3ayLPN {
background: var(--quatro) var(--stars) top left fixed;
}
#app-mount .option-96V44q:after {
background: linear-gradient(90deg,transparent,var(--sheer) 80%);
}
#app-mount .option-96V44q.selected-rZcOL-,
#app-mount .searchAnswer-3Dz2-q,
#app-mount .searchFilter-2ESiM3 {
background-color: var(--veil);
}
#app-mount .channelSeparator-1X1FuH .channelName-1QajIf {
background-color: var(--sheer);
padding-left: 8px;
border-radius: 5px 5px 0 0;
}
#app-mount .searchResult-3pzFAB:before {
background-image: linear-gradient(0deg,transparent,var(--sheer));
}
#app-mount .searchResult-3pzFAB .hit-NLlWXA {
background: var(--sheer);
box-shadow: 0 0 10px 6px var(--sheer);
border-color: rgb(0, 0, 0);
}
#app-mount .jumpButton-Ia2hRJ {
background-color: var(--blurple);
color: rgb(255, 255, 255);
transition: all .2s ease-in-out;
}
#app-mount .searchBar-1MOL6S {
background-color: var(--veil);
}
#app-mount .quickMessage-1yeL4E,
#app-mount .searchOption-8nCYo-.selected-1r_nkg {
background: var(--sheer) var(--stars) top left !important;
background-attachment: fixed;
border-color: rgb(0, 0, 0);
}
#app-mount .jumpButton-Ia2hRJ:hover,
#app-mount .dim-1l4L4y span {
background-color: var(--greyple);
}
#app-mount .calendarPicker-2yf6Ci .react-datepicker__day--disabled,
#app-mount .calendarPicker-2yf6Ci .react-datepicker__day--outside-month {
background-color: var(--sheer);
}
#app-mount .dim-1l4L4y span {
color: rgb(255, 255, 255);
}
#app-mount .searchResult-3pzFAB:after {
background: linear-gradient(180deg,transparent,var(--sheer));
}
#app-mount .searchResultsWrap-2DKFzt {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .searchHeader-1l-wpR,
#app-mount .focused-2bY0OD,
#app-mount .focused-1Yu0L3 {
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .calendarPicker-2yf6Ci .react-datepicker {
background: var(--blurple-sheer);
}
#app-mount .calendarPicker-2yf6Ci .react-datepicker__header {
background: transparent;
}
#app-mount .searchResultsContainer-1ma_dc {
background: var(--uno) var(--stars) top left fixed;
}
#app-mount .searchHeader-1l-wpR .tab-2Ixsn0.selected-16te-P,
#app-mount .searchHeader-1l-wpR .tab-2Ixsn0:hover {
color: var(--greyple);
border-color: var(--greyple);
}
/* D. Attach Popout, Add Game popout */
#app-mount .attachPopout-1n-ZKM,
#app-mount .colorPickerCustom-2CWBn2 {
background: var(--uno) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .attachPopoutRow-KrE-f6:hover {
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .preview-yX6Nx7,
#app-mount .invite-18yqGF {
background: var(--sheer);
border-color: rgb(0, 0, 0);
}
#app-mount .modal-3HD5ck .inner-zqa7da {
background: var(--veil);
}
.lookFilled-1Gx00P.colorGrey-2DXtkV {
background: var(--uno);
}
/* E. Tooltips & Notices */
.tooltip-2QfLtc {
border-radius: 5px !important;
}
#app-mount .tooltip-2QfLtc.tooltipRed-8-9NeP {
background: var(--dnd);
}
#app-mount .tooltipRed-8-9NeP .tooltipPointer-3ZfirK {
border-top-color: var(--dnd);
}
#app-mount .tooltip-2QfLtc,
#app-mount .bubble-3we2di {
background: var(--blurple);
}
#app-mount .tooltipBlack-PPG47z .tooltipPointer-3ZfirK,
#app-mount .bubble-3we2di:before {
border-top-color: var(--blurple) !important;
}
#app-mount .notice-2FJMB4 {
border-radius: 5px !important;
background-image: var(--stars), linear-gradient(to right, var(--sheer), var(--sheer));
}
#app-mount .button-1MICoQ:hover {
background: var(--blurple-sheer);
border-color: var(--blurple-sheer);
color: rgb(255, 255, 255);
}
.channelNotices-41mJbj .channelNotice-1-XFjC.guildMFAWarning-3GEzs8 {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
border-radius: 10px 10px 0 0;
}
/* tropix's fade in tooltip anim */
.layerContainer-yqaFcK .tooltip-2QfLtc.tooltipRight-2JM5PQ {
animation: fadeFromRight 200ms
}
.layerContainer-yqaFcK .tooltip-2QfLtc.tooltipBottom-3ARrEK {
animation: fadeFromBottom 200ms
}
.layerContainer-yqaFcK .tooltip-2QfLtc[class*="tooltipLeft-"] {
animation: fadeFromLeft 200ms
}
.layerContainer-yqaFcK .tooltip-2QfLtc.tooltipTop-XDDSxx{
animation: fadeFromTop 200ms;
}
/* F. Autocomplete & Everyone Popout */
#app-mount .autocomplete-1vrmpx,
#app-mount .everyonePopout-nEbJY3 {
background: linear-gradient(transparent, var(--blurple-sheer) 80%),var(--uno) var(--stars) top left !important;
background-attachment: fixed;
border: 1px solid var(--sheer);
}
#app-mount .content-Qb0rXO {
color: rgb(255, 255, 255);
}
#app-mount .footer-2aTx0s {
background: transparent;
}
#app-mount .selectorSelected-1_M1WV {
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
/* G. Gift Nitro and Gif Picker */
#app-mount .option-1l2vXE {
background: var(--veil);
}
#app-mount .categoryFadeBlurple-1j72_A {
background: var(--blurple) var(--stars) top left !important;
background-attachment: fixed;
opacity: .7;
}
#app-mount .categoryFade-2ybR1J {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
opacity: .4;
}
#app-mount .categoryFade-2ybR1J:hover {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
opacity: .7;
}
/* H. Emoji Picker */
#app-mount .emojiPicker-3m1S-j,
#app-mount .diversitySelector-tmmMv0 .popout-2nUePc,
.premiumPromo-yVfLiA,
#app-mount #bda-qem-twitch-container,
#app-mount #bda-qem-favourite-container {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
border: 1px solid rgb(0, 0, 0);
height: 326px;
width: 344px;
}
.bda-dark .emojiPicker-3m1S-j .category-2U57w6,
.emojiPicker-3m1S-j .category-2U57w6 {
background-color: transparent;
}
#app-mount .diversitySelector-tmmMv0 .popout-2nUePc {
width: unset;
}
#app-mount .lightTheme-3LGLQs.container-2XeR5Z {
background: transparent
}
#bda-qem {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
border: 1px solid rgb(0, 0, 0);
}
#bda-qem button {
border-left: 1px solid black;
color: rgb(223, 223, 223);
box-shadow: none;
}
#bda-qem button.active {
background-color: var(--blurple-sheer);
}
#app-mount .searchBar-2_Yu-C.searchBarLight-1NxoDG {
background: transparent;
}
#app-mount .diversitySelector-tmmMv0 .popout-2nUePc .item-16cXuq:hover,
#bda-qem button:not(.active):hover {
background-color: var(--veil);
}
#app-mount .searchBar-2_Yu-C.searchBarLight-1NxoDG .searchBarInner-1_Tg2R {
background: var(--veil);
}
#app-mount .emojiPicker-3m1S-j .stickyHeader-1SS0JU,
#app-mount .quickSelectPopout-X1hvgV {
background: var(--uno) var(--stars) top left !important;
background-attachment: fixed;
}
.emojiPicker-3m1S-j .scroller-3vODG7 .emojiItem-109bjA.selected-39BZ4S,
.emote-container:hover {
background-color: var(--blurple-sheer);
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.recent-rdY7_c,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.recent-rdY7_c.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.recent-rdY7_c:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/frequent.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.custom-2TY7UZ,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.custom-2TY7UZ.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.custom-2TY7UZ:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/custom.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.people-2y6eof,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.people-2y6eof.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.people-2y6eof:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/people.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.nature-WkggKK,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.nature-WkggKK.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.nature-WkggKK:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/nature.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.food-3vb4RY,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.food-3vb4RY.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.food-3vb4RY:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/food.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.activity-2oLAbd,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.activity-2oLAbd.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.activity-2oLAbd:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/activity.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.travel-2FeozN,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.travel-2FeozN.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.travel-2FeozN:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/travel.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.objects-ktZjG4,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.objects-ktZjG4.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.objects-ktZjG4:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/objects.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.symbols-3xtDtJ,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.symbols-3xtDtJ.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.symbols-3xtDtJ:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/symbols.svg) !important
}
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.flags-3peqg9,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.flags-3peqg9.selected-39BZ4S,
.emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq.flags-3peqg9:hover {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/emojiCategory/flags.svg) !important
}
#app-mount .sadImage-2ph8SI {
background: url(https://ellexidecodes.github.io/Discord-Themes/assets/sadDiscord.png) center/100% no-repeat;
}
/* I. Game Preview */
#app-mount .gamePreview-9weYR2,
#app-mount .container-jGk-CT {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
.news-2KwXHF,
#app-mount .body-1SVoBw,
#app-mount .news-2KwXHF {
background: transparent;
}
.newsLink-38Naqi:hover {
background: var(--sheer);
}
#app-mount .popout-3sVMXz .container-jGk-CT {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .popout-3sVMXz .news-2KwXHF,
#app-mount .emptyPlayers-dx3qig,
#app-mount .players-1zg2l8,
#app-mount .footer-3J5oP4 {
background-color: transparent;
}
#app-mount .player-3zB-0D:hover {
background-color: var(--sheer);
}
/* J. Add Roles Popout & Roles Overflow */
#app-mount .autocompleteArrow-Zxoy9H,
#app-mount .autocompleteHeaderBackground-30T70q {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .container-VSDcQc .sectionTag-pXyto9 {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .overflowRolesPopout-140n9i {
background: linear-gradient(var(--blurple-sheer), var(--blurple-sheer)), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .row-rrHHJU.selected-1pIgLL {
background: var(--blurple-sheer) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .overflowRolesPopoutArrow-2O66oH {
background: linear-gradient(var(--blurple-sheer), var(--blurple-sheer)), var(--quatro);
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%) rotate(45deg);
box-shadow: none;
-webkit-box-shadow: none;
}
/* K. RTC Connection */
#app-mount .container-2x5lvQ {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .popout-2GtBL-:after {
border-top-color: var(--quatro);
}
#app-mount .container-2x5lvQ header,
#app-mount .container-2x5lvQ section {
background: transparent;
}
/* X. Modals */
/* A. User Modal */
#app-mount .inner-1ilYF7 .root-SR8cQa,
#app-mount .slide-2pHaq5,
#app-mount .root-1gCeng {
background: linear-gradient(transparent, var(--uno) 90%), var(--quatro) var(--stars) top left fixed;
border-radius: 10px;
}
#app-mount .topSectionNormal-2-vo2m,
#app-mount .body-3ND3kc,
#app-mount .topSectionPlaying-1J5E4n,
#app-mount .topSectionXbox-3fWLjS,
#app-mount .topSectionSpotify-1lI0-P,
#app-mount .topSectionStreaming-1Tpf5X{
background: transparent;
}
#app-mount [class*="topSection"] .wrapper-3t9DeA[user_by_bdfdb]::before {
display: none !important;
}
#app-mount .topSectionPlaying-1J5E4n {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
}
#app-mount .topSectionXbox-3fWLjS,
#app-mount .topSectionSpotify-1lI0-P {
background: linear-gradient(var(--online-sheer), transparent 80%), var(--stars) top left fixed;
}
#app-mount .topSectionStreaming-1Tpf5X {
background: linear-gradient(var(--streaming-sheer), transparent 80%), var(--stars) top left fixed;
}
/* B. Upload Modal */
.uploadModal-2ifh8j,
#app-mount .addGamePopout-2RY8Ju,
#app-mount .inner-1JeGVc .container-3qKHyN,
#app-mount .keyboardShortcutsModal-3piNz7,
#app-mount .uploadModalIn-1z07Bv .uploadDropModal-2kTwbc .bgScale-1otPtc {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
border-radius: 10px;
}
.uploadModal-2ifh8j .inner-3nWsbo,
.uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j {
border-color: var(--sheer)
}
.uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j:hover {
width: 93%;
height: 160%;
margin-top: -95px;
}
.uploadModal-2ifh8j .footer-3mqk7D {
background: transparent;
}
.lookInverted-2D7oAl.colorBrand-3pXr91,
#app-mount .checked-3_4uQ9,
.theme-brand .inner-zqa7da,
.uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j,
#app-mount .resultFocused-3aIoYe {
background-color: var(--sheer);
transition: all .2s ease-in-out;
}
.lookInverted-2D7oAl.colorBrand-3pXr91:hover,
#app-mount .input-2VB9rf,
#app-mount .container-2XeR5Z {
background-color: var(--veil);
}
#app-mount .modal-3HD5ck,
#app-mount .modal-3v8ziU {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .footer-2yfCgX,
#app-mount .quickswitcher-3JagVE,
#app-mount .footer-1FPmkC,
#app-mount .footer-30ewN8 {
background: transparent;
box-shadow: none;
-webkit-box-shadow: none;
}
#app-mount .scrollerOuter-3FLELE {
margin-top: 0px;
}
/* C. Join Guild Modal */
#app-mount .action-1lSjCi{
background: var(--veil) var(--stars) top left !important;
background-attachment: fixed;
}
#app-mount .slide-2pHaq5 .footer-3rDWdC {
background: transparent;
box-shadow: inset 0 1px 0 var(--blurple-sheer);
}
#app-mount .create-3jownz .actionIcon-2IISM_ {
position: relative;
background-image: none;
background-color: var(--blurple);
-webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/add-btn.svg) center/112px 78px no-repeat;
}
.create-3jownz .actionIcon-2IISM_::after {
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: rgb(255, 255, 255);
opacity: .4;
-webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/add-btn-two.svg) center/112px 78px no-repeat;
}
#app-mount .join-33Tr-7 .actionIcon-2IISM_ {
background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/join-btn.png);
}
#app-mount .or-3THJsp {
-webkit-mask: url('https://ellexidecodes.github.io/Discord-Themes/assets/or.svg');
-webkit-mask-position: center;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: 52px 52px;
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
color: var(--blurple);
}
#app-mount .theme-light .wrapper-2ZbzR9 {
background: transparent;
}
.avatar-21196O {
border-color: var(--greyple)
}
.avatarUploaderInner-3UNxY3 {
background-color: var(--blurple-sheer);
}
.regionSelectModal-12e-57 {
background: var(--quatro) var(--stars) top left !important;
background-attachment: fixed;
}
.regionSelectModal-12e-57 .regionSelectModalOption-2DSIZ3 {
background: var(--sheer);
border-color: var(--sheer);
transition: all .2s ease-in-out;
}
#app-mount .input-1mgnkM {
color: rgb(187, 187, 187);
}
/* D. Messages Modal, Games Download Modal, Screenshare */
#app-mount .message-2qRu38,
#app-mount .tiles-2aXG_k {
background: var(--sheer) var(--stars) top left !important;
background-attachment: fixed;
box-shadow: none;
}
#app-mount .installSize-1eXbBX {
background-color: var(--blurple-sheer);
}
/* E. Incoming Call & Phone Verification */
#app-mount .incomingCallInner-2VmFiR {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left no-repeat fixed;
border-color: var(--blurple-sheer);
border-radius: 10px;
}
#app-mount .lookFilled-1Gx00P.colorTransparent-1ewNp9 {
background: var(--veil);
}
#app-mount .incomingCallInner-2VmFiR .lookFilled-1Gx00P.colorTransparent-1ewNp9 {
background: var(--dnd-sheer);
transition: background-color .2s ease-in-out;
}
#app-mount .incomingCallInner-2VmFiR .lookFilled-1Gx00P.colorTransparent-1ewNp9:hover {
background: var(--dnd);
}
.lookFilled-1Gx00P.colorGreen-29iAKY {
background: var(--online-sheer);
transition: background-color .2s ease-in-out;
}
.lookFilled-1Gx00P.colorGreen-29iAKY:hover {
background: var(--online);
}
#app-mount .phoneField-38N1bJ,
#app-mount .input-3yHnCz {
background: var(--sheer) var(--stars) top left fixed;
}
#app-mount .phoneField-38N1bJ .countryButton-3xq3Ts {
background: var(--veil) var(--stars) top left fixed;
}
#app-mount .phoneField-38N1bJ .inputField-aNPXsv {
background: transparent;
}
/* F. Reactions Modal & Server Invite Modal */
#app-mount .sidebar-1-SQro,
#app-mount .reactors-Blmlhw {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--sheer) var(--stars) top left fixed;
}
#app-mount #app-mount .reactors-Blmlhw {
background: linear-gradient(var(--blurple-sheer), transparent 80%);
}
#app-mount .contentWrapper-3WC1ID {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
}
#app-mount .contentWrapper-3WC1ID .pill-1dHPfk:nth-child(2) {
background: var(--offline-sheer);
}
#app-mount .contentWrapper-3WC1ID .pill-1dHPfk:nth-child(1) {
background: var(--online-sheer);
}
/* G. Gift Modal */
#app-mount .modal-yWgWj-,
#app-mount .inner-1ilYF7 {
background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
border-radius: 5px;
}
#app-mount .footer-3rDWdC {
background: transparent;
}
#app-mount .tierMarker-5HkGJ_[style*="background-image: linear-gradient(to right, rgb(32, 34, 37), rgb(32, 34, 37));"] {
background: linear-gradient(to right, var(--quatro), var(--veil)) !important;
}
/* H. Quick Switcher & Keyboard Shortcuts */
#app-mount .keybindShortcut-1BD6Z1 span {
background-color: var(--blurple);
}
/* XI. Keyframes */
@keyframes fadeIn {
to {
display: block;
opacity: 1 !important;
}
}
@keyframes slide-up {
from {
transform: translate(0, 100%);
}
}
@keyframes slide-down {
from {
transform: translate(0, -100%);
}
}
@keyframes slide-left {
from {
transform: translate(-100);
}
}
@keyframes slide-right {
from {
transform: translate(100%);
}
}
@keyframes show-status {
from {
transform: translateY(100%) translateX(0%) translateZ(0px);
}
}
@keyframes status {
from {
transform: scale(0);
opacity: 0
}
}
@keyframes context-open-invertY {
0% {
padding-top: 0px;
padding-bottom: 0px;
margin-top: 0px;
}
}
@keyframes context-open-new {
0% {
transform: scale(1, 0.8);
}
}
@keyframes context-open {
0% {
padding-top: 0px;
padding-bottom: 0px;
}
}
@keyframes popoutanim-inner {
0% {
transform: scale(2);
}
100% {
transform: scale(1);
}
}
@keyframes popoutanim {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes popoutanim-status {
0% {
transform: scale(0) translateY(-100%);
}
100% {
transform: scale(1) translateY(-100%);
}
}
@keyframes popoutanim-min {
0% {
transform: translateX(-50%) scale(0);
}
100% {
transform: translateX(-50%) scale(1);
}
}
@keyframes fadeFromTop {
0% {
opacity: 0;
transform: translateY(-50%)
}
100% {
opacity: 0.9;
transform: none
}
}
@keyframes fadeFromRight {
0% {
opacity: 0;
transform: translateX(50%)
}
100% {
opacity: 0.9;
transform: none
}
}
@keyframes fadeFromBottom {
0% {
opacity: 0;
transform: translateY(50%)
}
100% {
opacity: 0.9;
transform: none
}
}
@keyframes fadeFromLeft {
0% {
opacity: 0;
transform: translateX(-50%)
}
100% {
opacity: 0.9;
transform: none
}
}
/* XII. Custom CSS */
.contentRegion-3nDuYy #bd-customcss-attach-controls,
#bd-customcss-detach-container #bd-customcss-attach-controls {
background: transparent;
box-shadow: none;
}
.standardSidebarView-3F1I7i #bd-customcss-attach-controls button,
.bd-detached-css-editor #bd-customcss-attach-controls button {
background: var(--online-sheer);
}
.bd-detached-editor .chat .title-3qD0b- > div:last-child,
.bd-detached-editor .headerBar-UHpsPw > div:last-child {
margin-right: 0 !important;
}
#bd-customcss-detach-container #bd-customcss-attach-controls{
display: flex;
flex-flow: column;
align-items: center;
}
#bd-customcss-attach-controls {
display: flex;
flex-flow: column;
align-items: center;
}
#bd-customcss-detach-controls-button > span {
font-size: 0 !important;
display: flex;
flex-flow: column;
align-items: center;
}
#bd-customcss-attach-controls .checkbox-group {
order: 1;
}
/* Main CSS Box */
.contentColumnDefault-1VQkGM .ace-monokai {
background-color: var(--sheer);
color: rgb(255, 255, 255);
border-radius: 10px;
}
/* Gutter Line */
.ace-monokai .ace_gutter {
background: var(--tres) var(--stars) top left/cover fixed;
border-radius: 10px 0 0 10px;
color: var(--streaming);
}
/* Shorter Highlight Line */
.ace-monokai .ace_gutter-active-line {
background-color: var(--quatro);
}
/* When Clicking and Dragging through the codes to highlight them */
.ace-monokai .ace_marker-layer .ace_selection {
background: var(--blurple-sheer);
}
/* Long Highlight Line */
.ace-monokai .ace_marker-layer .ace_active-line {
background: var(--offline-sheer);
}
/* Bracket Border */
.ace-monokai .ace_marker-layer .ace_bracket {
margin: -1px 0 0 -1px;
border: 1px solid var(--greyple-sheer);
}
/* Comment Code */
.ace-monokai .ace_comment {
color: var(--online);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment