From 8383a37f9aff830979b27ff480584c98d497b13b Mon Sep 17 00:00:00 2001 From: Cynthia Foxwell Date: Fri, 17 Mar 2023 22:34:03 -0600 Subject: [PATCH] beginnings of windows classic styling --- xmc.user.css | 1367 ++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 987 insertions(+), 380 deletions(-) diff --git a/xmc.user.css b/xmc.user.css index 3740050..ea8b3ce 100644 --- a/xmc.user.css +++ b/xmc.user.css @@ -14,14 +14,6 @@ 'On*': `:root, .theme-dark, .theme-light { - --titlebar-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22), - inset 0 0 0 2px rgba(0, 0, 0, 0.27), 0 0 0 1px var(--background-tertiary), - 0 0 0 2px var(--background-secondary), 0 0 0 3px var(--background-primary); - - --_font-titlebars: var(--font-primary); - - --titlebar-color: var(--highlight); - --mention-background: rgba(var(--accent-rgb), 0.1); --header-primary: var(--text, var(--white-500)) !important; --header-secondary: var(--text, var(--primary-dark-300)) !important; @@ -342,8 +334,8 @@ rect[fill="hsl(262, calc(var(--saturation-factor, 1) * 46.8%), 39.8%)"] { color: var(--interactive-hover) !important; } -[class^="menu-"] [class^="item-"]:active, -[class^="menu-"] [class^="item-"][class*="focused-"], +[class*="menu-"] [class^="item-"]:active, +[class*="menu-"] [class^="item-"][class*="focused-"], [class*="lookFilled-"][class*="colorBrand-"]:not([class*="buttonColor-"]), [class*="lookFilled-"][class*="colorBrandNew-"]:not([class*="buttonColor-"]), [style*="background-color: rgb(114, 137, 218)"]:not([class*="swatch-"]), @@ -876,7 +868,7 @@ code.inline, background-color: #302838; }`, 'Amora Focus': `.theme-dark { - --_color0: #28222d; + --_color0: #2d2d2d; --_color1: #e83f80; --_color2: #a2baa8; --_color3: #eacac0; @@ -885,7 +877,7 @@ code.inline, --_color6: #aabae7; --_color7: #dedbeb; - --_color8: #302838; + --_color8: #383838; --_color9: #f55d8f; --_color10: #bfd1c3; --_color11: #f0ddd8; @@ -920,6 +912,7 @@ code.inline, --status-streaming: var(--_color4); --titlebar-color: var(--accent); + --wc-bright: #383838; } #splash { @@ -1462,7 +1455,14 @@ code.inline, --status-offline: var(--tertiary); --status-streaming: var(--_color5); - --status-danger: var(--red); + --status-danger: var(--red) !important; + --interactive-active: var(--white-500) !important; + --interactive-hover: var(--white-500) !important; + + --titlebar-active: var(--primary); + --titlebar-inactive: var(--primary); + --titlebar-border-active: var(--primary); + --titlebar-border-inactive: var(--primary); } #splash { @@ -1510,7 +1510,9 @@ code.inline, --status-offline: var(--tertiary); --status-streaming: var(--_color5); - --status-danger: var(--red); + --status-danger: var(--red) !important; + --interactive-active: var(--white-500) !important; + --interactive-hover: var(--white-500) !important; } #splash { @@ -1797,8 +1799,9 @@ code.inline, @var select xmc_font 'Font' { 'Default*': " ", - 'Revert Rebrand': `.theme-dark, - :root { + 'Revert Rebrand': `:root, +.theme-dark, +.theme-light { --font-display: var(--font-primary) !important; }`, 'Unifont': `@font-face { @@ -1852,15 +1855,16 @@ code.inline, font-style: italic; } +:root, .theme-dark, - :root { - --font-primary: "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont", monospace, "Twemoji" !important; - --font-display: "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont", monospace, "Twemoji" !important; +.theme-light { + --font-primary: "UnifontBitmap", "Unifont Windows", "Unifont", monospace, "Twemoji" !important; + --font-display: "UnifontBitmap", "Unifont Windows", "Unifont", monospace, "Twemoji" !important; --font-code: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont", monospace !important; } -[class^="menu-"] [class^="item-"], +[class*="menu-"] [class^="item-"], [class^="containerDefault-"] [class^="name-"], [class^="membersGroup-"] { font-size: 16px; @@ -1909,8 +1913,9 @@ code.inline, font-style: italic; } +:root, .theme-dark, - :root { +.theme-light { --font-primary: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont", monospace !important; --font-display: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont", @@ -1921,7 +1926,7 @@ code.inline, --_font-titlebars: var(--font-primary) !important; } -[class^="menu-"] [class^="item-"], +[class*="menu-"] [class^="item-"], [class^="containerDefault-"] > [class^="iconVisibility-"] > [class^="content-"] @@ -2017,8 +2022,9 @@ code.inline { font-style: normal; } +:root, .theme-dark, - :root { +.theme-light { --font-primary: "Comic Sans MS", cursive !important; --font-display: "Comic Sans MS", cursive !important; --font-code: "Pointfree", "Untyped", monospace !important; @@ -2041,14 +2047,16 @@ code.inline { font-style: normal; } +:root, .theme-dark, - :root { +.theme-light { --font-primary: "Comic Sans MS", cursive !important; --font-display: "Comic Sans MS", cursive !important; --font-code: "Untyped", "Pointfree", monospace !important; }`, - 'Custom': `.theme-dark, - :root { + 'Custom': `:root, +.theme-dark, +.theme-light { --font-primary: var(--xmc_custom_font), sans-serif !important; --font-display: var(--font-primary) !important; --font-code: var(--xmc_custom_font_mono), monospace !important; @@ -2059,7 +2067,9 @@ code.inline { @var select xmc_stylings 'Visual Styling' { 'Off': "", - 'XMC*': `:root { + 'XMC*': `:root, +.theme-dark, +.theme-light { --_font-titlebars: "Segoe UI", sans-serif; } @@ -2100,7 +2110,7 @@ section[class^="panels-"] [class^="container-"] [class^="flex-"] button[class^="button-"], -[class^="toolbar-"] [class^="iconWrapper-"] { +[class^="toolbar-"] [class*="iconWrapper-"] { border-radius: 0; color: var(--text) !important; background: var(--button-bg) !important; @@ -2142,13 +2152,13 @@ nav[class^="sidebar-"] div[class^="item-"]:not([class*="selected-"]):hover, border-radius: 0; } -[class^="toolbar-"] [class^="iconWrapper-"] { +[class^="toolbar-"] [class*="iconWrapper-"] { margin: 0; width: 32px; height: 32px; } -[class^="toolbar-"] [class^="iconWrapper-"] > svg { +[class^="toolbar-"] [class*="iconWrapper-"] > svg { margin: 4px; } @@ -2210,6 +2220,287 @@ nav[class^="sidebar-"] div[class^="item-"]:not([class*="selected-"]):hover, [class^="reaction-"][class*="reactionMe-"] { background-color: var(--hover-bg); box-shadow: var(--hover-shadow); +}`, + 'Windows Classic': `.theme-dark { + --wc-frame: -1px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 0px 0 0 var(--wc-bright, var(--highlight)), 0px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--primary), 1px -2px 0 0 var(--primary), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--primary), + -2px 2px 0 0 var(--tertiary); + + --wc-outer-edge: -1px -1px 0 0 var(--primary), + -1px 0px 0 0 var(--primary), 0px -1px 0 0 var(--primary), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--wc-bright, var(--highlight)), 1px -2px 0 0 var(--wc-bright, var(--highlight)), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--wc-bright, var(--highlight)), + -2px 2px 0 0 var(--tertiary); + + --wc-outer-edge-inset: inset -1px -1px 0 0 var(--tertiary), + inset -1px 0px 0 0 var(--tertiary), inset 0px -1px 0 0 var(--tertiary), + inset -1px 1px 0 0 var(--wc-bright, var(--highlight)), inset 1px -1px 0 0 var(--wc-bright, var(--highlight)), + inset 1px 1px 0 0 var(--wc-bright, var(--highlight)), inset 2px 2px 0 0 var(--primary), + inset -2px -2px 0 0 var(--secondary), inset 1px -2px 0 0 var(--secondary), + inset 2px -2px 0 0 var(--primary), inset -2px 1px 0 0 var(--secondary), + inset -2px 2px 0 0 var(--primary); + + --wc-inner-edge: -1px -1px 0 0 var(--tertiary), + -1px 0px 0 0 var(--tertiary), 0px -1px 0 0 var(--tertiary), + -1px 1px 0 0 var(--primary), 1px -1px 0 0 var(--primary), + 1px 1px 0 0 var(--primary), 2px 2px 0 0 var(--wc-bright, var(--highlight)), + -2px -2px 0 0 var(--secondary), 1px -2px 0 0 var(--secondary), + 2px -2px 0 0 var(--wc-bright, var(--highlight)), -2px 1px 0 0 var(--secondary), + -2px 2px 0 0 var(--wc-bright, var(--highlight)); + + --wc-inner-edge-inset: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), + inset -1px 0px 0 0 var(--wc-bright, var(--highlight)), inset 0px -1px 0 0 var(--wc-bright, var(--highlight)), + inset -1px 1px 0 0 var(--secondary), inset 1px -1px 0 0 var(--secondary), + inset 1px 1px 0 0 var(--secondary), inset 2px 2px 0 0 var(--tertiary), + inset -2px -2px 0 0 var(--primary), inset 1px -2px 0 0 var(--primary), + inset 2px -2px 0 0 var(--tertiary), inset -2px 1px 0 0 var(--primary), + inset -2px 2px 0 0 var(--tertiary); +} +.theme-light { + --wc-frame: -1px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 0px 0 0 var(--wc-bright, var(--highlight)), 0px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--primary), 1px -2px 0 0 var(--primary), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--primary), + -2px 2px 0 0 var(--tertiary); + + --wc-outer-edge: -1px -1px 0 0 var(--primary), + -1px 0px 0 0 var(--primary), 0px -1px 0 0 var(--primary), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--wc-bright, var(--highlight)), 1px -2px 0 0 var(--wc-bright, var(--highlight)), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--wc-bright, var(--highlight)), + -2px 2px 0 0 var(--tertiary); + + --wc-outer-edge-inset: inset -1px -1px 0 0 var(--primary), + -1px 0px 0 0 var(--primary), 0px -1px 0 0 var(--primary), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--wc-bright, var(--highlight)), 1px -2px 0 0 var(--wc-bright, var(--highlight)), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--wc-bright, var(--highlight)), + -2px 2px 0 0 var(--tertiary); + + --wc-inner-edge: -1px -1px 0 0 var(--tertiary), + -1px 0px 0 0 var(--tertiary), 0px -1px 0 0 var(--tertiary), + -1px 1px 0 0 var(--wc-bright, var(--highlight)), 1px -1px 0 0 var(--wc-bright, var(--highlight)), + 1px 1px 0 0 var(--wc-bright, var(--highlight)), 2px 2px 0 0 var(--primary), + -2px -2px 0 0 var(--secondary), 1px -2px 0 0 var(--secondary), + 2px -2px 0 0 var(--primary), -2px 1px 0 0 var(--secondary), + -2px 2px 0 0 var(--primary); +} + +[class*="button-"][class*="lookFilled-"], +section[class^="panels-"] + [class^="container-"] + [class^="flex-"] + button[class^="button-"], +[class^="toolbar-"] [class*="iconWrapper-"] { + border-radius: 0; + box-shadow: var(--wc-outer-edge-inset) !important; +} +[class*="button-"][class*="lookFilled-"]:active, +section[class^="panels-"] + [class^="container-"] + [class^="flex-"] + button[class^="button-"]:active { + box-shadow: var(--wc-inner-edge-inset) !important; +} + +[class^="chat-"] > [class^="content-"] > [class^="container-"] > [class^="membersWrap-"] { + margin: 2px; + box-shadow: var(--wc-inner-edge); + height: calc(100% - 4px); + max-height: calc(100% - 4px); +} +[class^="messagesWrapper-"], +[class*="guilds-"], +[class^="sidebar-"] > nav > [class^="scroller-"] { + margin: 2px; + box-shadow: var(--wc-inner-edge); +} +[class^="chat-"] > [class^="content-"] > [class^="container-"], +[class^="chat-"] > [class^="content-"] > [class^="chatContent-"], +[class^="standardSidebarView-"] > [class^="contentRegion-"] { + margin-left: 2px; +} + +[class^="channelTextArea-"] > [class^="scrollableContainer-"], +[class^="chat-"] [class^="toolbar-"] > [class^="search-"] > [class^="search-"] > [class^="searchBar-"] { + box-shadow: var(--wc-inner-edge-inset); + border-radius: 0; +} + +[class^="chat-"] > [class^="content-"]:before { + display: none !important; +} + +[class^="standardSidebarView-"] > [class^="sidebarRegion-"] > [class^="sidebarRegionScroller-"], +[class^="standardSidebarView-"] > [class^="contentRegion-"] [class^="contentTransitionWrap-"] { + margin: 2px; + box-shadow: var(--wc-inner-edge); +} +[class^="standardSidebarView-"] > [class^="contentRegion-"], +[class^="standardSidebarView-"] > [class^="sidebarRegion-"] { + margin-top: 2px; +} +[class^="standardSidebarView-"] > [class^="contentRegion-"] [class^="contentTransitionWrap-"] { + height: calc(100% - 4px); +} + +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] { + height: 48px; +} + +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] + > [class^="bannerImage-"] { + height: 48px; +} +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] + > [class^="bannerImage-"]:after { + content: ""; + height: 48px; + width: 240px; + top: 0; + left: 0; + position: absolute; + background: linear-gradient( + 0deg, + var(--background-secondary) 5%, + transparent 100% + ); +} + +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] + [class^="bannerImg-"] { + top: -67px; + position: relative; +} + +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="scroller-"] + > ul + > div[style="height: 84px;"] { + height: 0 !important; +} + +[class*="menu-"] { + border-radius: 0; + margin: 2px; + box-shadow: var(--wc-frame); +} +[class*="menu-"] > [class^="scroller-"] { + padding: 2px !important; +} +[class*="menu-"] > [class^="scroller-"] [class^="item-"] { + border-radius: 0 !important; + margin: 2px 0; +} +[class*="menu-"] > [class^="scroller-"] [class^="customItem-"][id^="message-quickreact-"] > [class^="button-"] { + border-radius: 0 !important; + box-shadow: var(--wc-outer-edge-inset); +} + +[class^="scroller-"]:not([class*="none-"]):not([class*="thin-"]):not(:not(:hover)[class*="fade-"])::-webkit-scrollbar, +[class*="scrollerBase-"]:not([class*="none-"]):not([class*="thin-"]):not(:not(:hover)[class*="fade-"])::-webkit-scrollbar { + min-width: 16px; + width: 16px; +} + +[class^="scroller-"]:not([class*="thin-"])::-webkit-scrollbar-track, +[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-track { + background-color: var(--wc-bright, var(--highlight)); + border: none; + border-radius: 0; + margin: 0; +} +[class^="scroller-"]::-webkit-scrollbar-thumb, +[class*="scrollerBase-"]::-webkit-scrollbar-thumb, +[class^="scroller-"]:not([class*="thin-"])::-webkit-scrollbar-button, +[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-button { + border-radius: 0; + background: var(--primary); + box-shadow: var(--wc-outer-edge-inset); + border: none; +} + +[class^="scroller-"][class*="fade-"]:not([class*="thin-"])::-webkit-scrollbar-button, +[class*="scrollerBase-"][class*="fade-"]:not([class*="thin-"])::-webkit-scrollbar-button { + visibility: hidden; +} +[class^="scroller-"][class*="fade-"]:not([class*="thin-"]):hover::-webkit-scrollbar-button, +[class*="scrollerBase-"][class*="fade-"]:not([class*="thin-"]):hover::-webkit-scrollbar-button { + visibility: visible; +} + +[class^="scroller-"]::-webkit-scrollbar-button:active, +[class*="scrollerBase-"]::-webkit-scrollbar-button:active { + box-shadow: var(--wc-inner-edge-inset); +} + +.postnet-expanded-category, +.postnet-repo-wrapper, +[class^="inner-"]:has(> input), +[class^="inputWrapper-"] > [class*="input-"], +[class^="colorSwatch-"] > [class^="swatch-"][aria-expanded=true] { + border: none !important; + border-radius: 0 !important; + box-shadow: var(--wc-inner-edge-inset); +} +[class^="colorSwatch-"] > [class^="swatch-"] { + border: none !important; + border-radius: 0 !important; + box-shadow: var(--wc-outer-edge-inset); +} + +[class^="inputWrapper-"] > [class*="input-"] { + padding: 2px 2px 2px 4px; + height: 22px; +} + +[class^="select-"][class*="lookFilled-"] { + border: none !important; + border-radius: 0 !important; + box-shadow: var(--wc-inner-edge-inset); + padding: 2px 2px 2px 4px; +} +[class^="select-"][class*="lookFilled-"] > [class^="icons-"] { + margin: 2px; +} +[class^="select-"][class*="lookFilled-"] > [class^="icons-"] > svg { + background: var(--primary); + box-shadow: var(--wc-outer-edge-inset); + width: 16px; + height: 16px; +} +[class^="select-"][class*="lookFilled-"][class*="open-"] > [class^="icons-"] > svg { + box-shadow: var(--wc-inner-edge-inset); +} +[class^="popout-"][role="listbox"] > [class^="option-"] { + padding: 2px 2px 2px 4px; + margin: 2px 0; +} +[class^="popout-"][role="listbox"] > [class^="option-"]:hover { + background-color: var(--accent); }`, } @@ -2579,106 +2870,10 @@ div[class^="listItem-"] [class^="wrapper-"] > svg > foreignObject, display: none; }`, } -@var select xmc_old_titlebar 'Old Titlebar (no drag areas!)' { - 'Off*': "", - 'On': `[class*="wordmark-"] { - display: none !important; -} -[class*="titleBar-"] { - margin-top: 0; -} -[class*="typeWindows-"] { - height: 0px !important; - margin: 0 !important; - padding: 0 !important; - border: none !important; - box-shadow: none !important; -} -[class*="winButton-"] { - margin-top: 19px; - margin-right: 5px; - opacity: 0.3; -} -[class*="winButton-"]:hover { - opacity: 1; -} - -.platform-win [class*="headerBar-"], -.platform-win [class^="chat-"] > [class^="title-"], -.platform-win [class*="activityFeed-"] > [class*="container-"], -.platform-win [class^="libraryHeader-"], -.platform-win - [class*="spacer-"] - > [class*="container-"] - > [class*="container-"], -.platform-win - [class^="base-"] - > [class^="content-"] - > [class^="container-"] - > [class^="container-"], -.platform-win [class^="videoControls-"] [class^="headerWrapper-"] { - padding-right: 104px !important; -} - -.platform-win [class^="topControls-"] { - top: -4px; - position: relative; -} - -[class*="winButtonClose-"], -[class*="winButtonMinMax-"] { - width: 24px !important; - height: 24px !important; - margin-left: 0 !important; - opacity: 1 !important; - margin-top: 13px !important; - margin-left: 4px !important; - background-color: var(--interactive-normal) !important; -} - -[class*="winButtonClose-"] { - margin-right: 12px; -} - -[class*="winButtonClose-"] svg, -[class*="winButtonMinMax-"] svg { - display: none; -} -[class*="winButtonClose-"] { - mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMjAgNy40MUwxOC41OSA2IDEzIDExLjU5IDcuNDEgNiA2IDcuNDEgMTEuNTkgMTMgNiAxOC41OSA3LjQxIDIwIDEzIDE0LjQxIDE4LjU5IDIwIDIwIDE4LjU5IDE0LjQxIDEzIDIwIDcuNDF6Ii8+PC9nPjwvc3ZnPg==") - no-repeat; - -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMjAgNy40MUwxOC41OSA2IDEzIDExLjU5IDcuNDEgNiA2IDcuNDEgMTEuNTkgMTMgNiAxOC41OSA3LjQxIDIwIDEzIDE0LjQxIDE4LjU5IDIwIDIwIDE4LjU5IDE0LjQxIDEzIDIwIDcuNDF6Ii8+PC9nPjwvc3ZnPg==") - no-repeat; - background-image: none !important; -} -[class*="winButtonMinMax-"]:nth-child(3) { - mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNOCAxM0g2djdoN3YtMkg4di01em0tMiAwaDJWOGg1VjZINnY3em03IDV2Mmg3di03aC0ydjVoLTV6bTAtMTJ2Mmg1djVoMlY2aC03eiIvPjwvZz48L3N2Zz4=") - no-repeat; - -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNOCAxM0g2djdoN3YtMkg4di01em0tMiAwaDJWOGg1VjZINnY3em03IDV2Mmg3di03aC0ydjVoLTV6bTAtMTJ2Mmg1djVoMlY2aC03eiIvPjwvZz48L3N2Zz4=") - no-repeat; - background-image: none !important; -} -[class*="winButtonMinMax-"]:nth-child(4) { - mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTkgMTl2LTJIN3YyaDEyeiIvPjxwYXRoIGQ9Ik0xIDI1aDI0VjFIMXYyNHoiLz48L2c+PC9zdmc+") - no-repeat; - -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTkgMTl2LTJIN3YyaDEyeiIvPjxwYXRoIGQ9Ik0xIDI1aDI0VjFIMXYyNHoiLz48L2c+PC9zdmc+") - no-repeat; - background-image: none !important; -} -[class*="winButtonClose-"]:hover, -[class*="winButtonMinMax-"]:hover { - background-color: var(--interactive-hover) !important; -} - -[class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"], -html.platform-win:not(.app-focused) [class*="winButton-"] { - opacity: 1 !important; -}`, -} @var select xmc_textarea 'Text area style' { 'Default': "", - 'XMC Default*': `[class*="chat-"] [class*="chatContent-"] form { + 'Typing Above*': `[class*="chat-"] [class*="chatContent-"] form { position: relative; margin: 0; } @@ -3043,6 +3238,9 @@ form [class*="typing-"] { } [class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="buttons-"] [class*="emojiButton-"] { max-height: unset; +} +[class^="messagesWrapper-"] { + margin-bottom: 8px; }`, } @var select xmc_status_icons 'EndPwn style status icons' { @@ -3535,42 +3733,15 @@ section[class^="panels-"] > [class^="container-"]:last-child > div:last-child { @var select xmc_titlebars 'Titlebars' { 'Off': "", - 'On*': `[class^="userPopout-"] [class^="headerContainer-"], -[class^="userPopout-"] [class^="bodyTitle-"], -[class^="userPopout-"] [class^="userInfoTitle-"] { - padding: unset !important; -} - - -[class^="userPopout-"] [class^="activityUserPopout-"] [class*="headerTextNormal-"], -[class^="userPopout-"] [class*="bodyTitle-"], -[class^="userPopout-"] [class*="aboutMeTitle-"], -[class^="userPopout-"] [class*="userInfoTitle-"] { - color: var(--text) !important; - padding: 0 10px !important; - background-color: var(--titlebar-color); - box-shadow: var(--titlebar-shadow); - margin-bottom: 0; - width: 100%; - height: 28px; - box-sizing: border-box; - display: flex; - align-items: center; - font-weight: 100; - font-family: var(--_font-titlebars) !important; - font-size: 12px !important; - text-transform: none; -} - -[class*="recentMentionsPopout-"], + 'XMC*': `[class*="recentMentionsPopout-"], [class^="messagesPopoutWrap-"], -[class*="root-"][class*="popout-"] { +[class^="browser-"] { border-radius: 0; } [class*="recentMentionsPopout-"] > [class^="header-"] { color: var(--text) !important; - padding: 0 10px; + padding: 0 4px; background-color: var(--titlebar-color); box-shadow: var(--titlebar-shadow); margin-bottom: 0; @@ -3584,10 +3755,9 @@ section[class^="panels-"] > [class^="container-"]:last-child > div:last-child { font-size: 12px !important; text-transform: none; } - [class*="recentMentionsPopout-"] > [class^="header-"] - > div + > [class^="controls-"] > [class^="button-"] { padding: 0; border-radius: 0; @@ -3597,12 +3767,213 @@ section[class^="panels-"] > [class^="container-"]:last-child > div:last-child { min-height: 16px; background-color: transparent; } +[class*="recentMentionsPopout-"] > [class^="header-"] [class^="tab-"] { + margin-top: 0 !important; +} [class^="messagesPopoutWrap-"] > [class^="header-"] { padding: 0; } +[class^="messagesPopoutWrap-"] > [class^="header-"] > h1 { + color: var(--text) !important; + padding: 0 10px; + background-color: var(--titlebar-color); + box-shadow: var(--titlebar-shadow); + margin-bottom: 0; + height: 28px !important; + box-sizing: border-box; + display: flex; + align-items: center; + font-weight: 100; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + text-transform: none; +} -[class^="messagesPopoutWrap-"] > [class^="header-"] > [class^="wrapper-"] { +[class^="browser-"] > [class^="header-"] { + color: var(--text) !important; + padding: 0 4px; + background-color: var(--titlebar-color); + box-shadow: var(--titlebar-shadow); + margin-bottom: 0; + height: 28px; + min-height: 28px; + box-sizing: border-box; + display: flex; + align-items: center; + font-weight: 100; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + text-transform: none; +} +[class^="browser-"] > [class^="header-"] > h1 { + font-weight: 100; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + text-transform: none; +} +[class^="browser-"] > [class^="header-"] > [class^="threadIcon-"], +[class^="browser-"] > [class^="header-"] > [class^="closeIcon-"] > svg { + width: 16px; + height: 16px; +} +[class^="browser-"] > [class^="header-"] > [class^="threadIcon-"] { + margin-right: 2px; +} +[class^="browser-"] > [class^="header-"] > h1, +[class^="browser-"] > [class^="header-"] > [class^="divider-"], +[class^="browser-"] > [class^="header-"] > [class^="searchBox-"] { + margin-right: 0; +} + +[class^="browser-"] > [class^="header-"] > [class^="divider-"] { + flex-grow: 1; + background-color: transparent; +} + +.platform-win [class*="baseLayer-"] { + top: -32px; + padding-top: 32px; +} +.platform-win [class^="app-"] > [class^="app-"] > [class^="bg-"] { + top: -32px; +} + +[class^="typeWindows-"] { + margin: 3px; + padding: 6px; + height: 10px !important; + background: var(--titlebar-color); + box-shadow: var(--titlebar-shadow); +} + +[class^="typeMacOS-"] { + background-color: var(--background-tertiary); + height: 32px !important; +} + +[class^="macButtons-"] { + padding: 8px !important; +} + +[class*="winButton-"] { + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJVSURBVFhH1ZjtThQxFIa9j81ust+fV8ONIH6AiMgAAgr4A/SavAFioiJBshLxAvjLgXfI25TuTGm7pM00eZJOe872me3szJl9dtcWAoneFr6trokPyLlPjdty0aujY/l//NXK1dGX9KKX+4fy7+CzFcQkF/2790kuP+4LG/rmMWKSi15s78j0w67cXF/noG8eIya56PnGpvzJtnIoRziOmOSiZ+sbcv4+yzFFOY6Y5KKnb9/J2dq6kkPfPP59F5Nc9NfyGzldWVVi6JvHiEku+uPla/n5atkKYpKLniwuyffnL6wgJrmoD8i5T43bsGgIcdt0OpUQarVaVHLRou21QdHJZCLj8dgJxHLRkDwl6lM9UXQ0GslwOHQCsRQNyVOiPtWTLjoYDJwwRYtiipgR9ameKIoz7vf7TiCWoiF5StSneqIozrjX6z2gXq/nmOOIpWhRXhnMU6I+1RNFccbdbjcHHwrBLMtyKMt5xFJUz2s2m+rkCMbMPCXqUz3pop1OZ0bSlEWMKYoxUJbH+RlRn+qJopBot9uFixHMIQaxFGUeKPtGOc88JepTPVEUW9NqtaTRaFhBDGIpyjwXmKdEfaonimJrcPYuIJaiIXlK1Kd6SirqA0X1a+0xyq7Rx3hwjYbARWNRLdGi7bVB0ehbj8Ur82OqzO1pnhu+C092w5/nEUrwDfBphL4+Z7tGXfKU6DxFCcFCfMajr8+VFSXAJU+JzlvmAXNBfc4U1edc8pToUxTO5hbqc7bC2SVPiVbmVaQyL3eVeV32gaLR/4AIgYvGoSa368P/Q8a1fTUAAAAASUVORK5CYII="); + background-size: 42px; + background-repeat: no-repeat; + background-color: transparent !important; + width: 14px !important; + height: 14px !important; + top: -2px !important; + position: relative !important; + margin-left: 30px; +} + +[class*="macButton-"] { + background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJVSURBVFhH1ZjtThQxFIa9j81ust+fV8ONIH6AiMgAAgr4A/SavAFioiJBshLxAvjLgXfI25TuTGm7pM00eZJOe872me3szJl9dtcWAoneFr6trokPyLlPjdty0aujY/l//NXK1dGX9KKX+4fy7+CzFcQkF/2790kuP+4LG/rmMWKSi15s78j0w67cXF/noG8eIya56PnGpvzJtnIoRziOmOSiZ+sbcv4+yzFFOY6Y5KKnb9/J2dq6kkPfPP59F5Nc9NfyGzldWVVi6JvHiEku+uPla/n5atkKYpKLniwuyffnL6wgJrmoD8i5T43bsGgIcdt0OpUQarVaVHLRou21QdHJZCLj8dgJxHLRkDwl6lM9UXQ0GslwOHQCsRQNyVOiPtWTLjoYDJwwRYtiipgR9ameKIoz7vf7TiCWoiF5StSneqIozrjX6z2gXq/nmOOIpWhRXhnMU6I+1RNFccbdbjcHHwrBLMtyKMt5xFJUz2s2m+rkCMbMPCXqUz3pop1OZ0bSlEWMKYoxUJbH+RlRn+qJopBot9uFixHMIQaxFGUeKPtGOc88JepTPVEUW9NqtaTRaFhBDGIpyjwXmKdEfaonimJrcPYuIJaiIXlK1Kd6SirqA0X1a+0xyq7Rx3hwjYbARWNRLdGi7bVB0ehbj8Ur82OqzO1pnhu+C092w5/nEUrwDfBphL4+Z7tGXfKU6DxFCcFCfMajr8+VFSXAJU+JzlvmAXNBfc4U1edc8pToUxTO5hbqc7bC2SVPiVbmVaQyL3eVeV32gaLR/4AIgYvGoSa368P/Q8a1fTUAAAAASUVORK5CYII="); + background-size: 42px; + background-repeat: no-repeat; + background-color: transparent !important; + width: 14px !important; + height: 14px !important; + border-radius: 0; +} + +[class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"], +html.platform-win:not(.app-focused) [class*="winButton-"] { + opacity: 0.4; +} + +[class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"]:hover, +html.platform-win:not(.app-focused) [class*="winButton-"]:hover { + opacity: 1; +} + +[class*="macButton-"] > svg, +[class*="winButton-"] > svg, +[class^="wordmarkWindows-"] > svg { + display: none; +} + +[class*="winButtonClose-"] { + margin-right: 3px; +} + +[class*="macButtonClose-"], +[class*="winButtonClose-"] { + background-position: 0px 0px; +} +[class*="macButtonClose-"]:hover, +[class*="winButtonClose-"]:hover { + background-position: 0px -14px; +} +[class*="macButtonClose-"]:active, +[class*="winButtonClose-"]:active { + background-position: 0px -28px; +} + +[class*="macButtonMaximize-"], +[class*="winButtonMinMax-"]:nth-child(3) { + background-position: -14px 0px; +} +[class*="macButtonMaximize-"]:hover, +[class*="winButtonMinMax-"]:nth-child(3):hover { + background-position: -14px -14px; +} +[class*="macButtonMaximize-"]:active, +[class*="winButtonMinMax-"]:nth-child(3):active { + background-position: -14px -28px; +} + +[class*="macButtonMinimize-"], +[class*="winButtonMinMax-"]:nth-child(4) { + background-position: -28px 0px; +} +[class*="macButtonMinimize-"]:hover, +[class*="winButtonMinMax-"]:nth-child(4):hover { + background-position: -28px -14px; +} +[class*="macButtonMinimize-"]:active, +[class*="winButtonMinMax-"]:nth-child(4):active { + background-position: -28px -28px; +} + +[class^="wordmarkWindows-"] { + width: 16px !important; + height: 16px !important; + top: 6px !important; + left: 7px !important; + padding: 0 !important; + background-image: var(--titlebar-icon); + background-repeat: no-repeat; +} +[class^="wordmarkWindows-"]::after { + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + line-height: 250% !important; + color: var(--text) !important; + font-weight: 0 !important; + content: "Discord"; + position: absolute; + top: -7px; + left: 21px; + height: 17px; + opacity: 1; +} + +html.platform-win:not(.app-focused) [class^="wordmarkWindows-"]::after, +html:not(.platform-win) + #app-mount + > div:not(.app-focused) + [class^="wordmarkWindows-"]::after { + opacity: 0.4; +} + +[class^="focusLock-"][aria-modal="true"] + > [class*="root-"] + > [class^="body-"] + > [class^="infoScroller-"] + > [class^="userInfoSection-"] + > [class*="userInfoSectionHeader-"] { color: var(--text) !important; padding: 0 10px; background-color: var(--titlebar-color); @@ -3618,217 +3989,388 @@ section[class^="panels-"] > [class^="container-"]:last-child > div:last-child { text-transform: none; } -.platform-win [class*="baseLayer-"] { - top: -32px; - padding-top: 32px; - } - .platform-win [class^="app-"] > [class^="app-"] > [class^="bg-"] { - top: -32px; - } - - [class^="typeWindows-"] { - margin: 3px; - padding: 6px; - height: 10px !important; - background: var(--titlebar-color); - box-shadow: var(--titlebar-shadow); - } - - [class^="typeMacOS-"] { - background-color: var(--background-tertiary); - height: 32px !important; - } - - [class^="macButtons-"] { - padding: 8px !important; - } - - [class*="winButton-"] { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJVSURBVFhH1ZjtThQxFIa9j81ust+fV8ONIH6AiMgAAgr4A/SavAFioiJBshLxAvjLgXfI25TuTGm7pM00eZJOe872me3szJl9dtcWAoneFr6trokPyLlPjdty0aujY/l//NXK1dGX9KKX+4fy7+CzFcQkF/2790kuP+4LG/rmMWKSi15s78j0w67cXF/noG8eIya56PnGpvzJtnIoRziOmOSiZ+sbcv4+yzFFOY6Y5KKnb9/J2dq6kkPfPP59F5Nc9NfyGzldWVVi6JvHiEku+uPla/n5atkKYpKLniwuyffnL6wgJrmoD8i5T43bsGgIcdt0OpUQarVaVHLRou21QdHJZCLj8dgJxHLRkDwl6lM9UXQ0GslwOHQCsRQNyVOiPtWTLjoYDJwwRYtiipgR9ameKIoz7vf7TiCWoiF5StSneqIozrjX6z2gXq/nmOOIpWhRXhnMU6I+1RNFccbdbjcHHwrBLMtyKMt5xFJUz2s2m+rkCMbMPCXqUz3pop1OZ0bSlEWMKYoxUJbH+RlRn+qJopBot9uFixHMIQaxFGUeKPtGOc88JepTPVEUW9NqtaTRaFhBDGIpyjwXmKdEfaonimJrcPYuIJaiIXlK1Kd6SirqA0X1a+0xyq7Rx3hwjYbARWNRLdGi7bVB0ehbj8Ur82OqzO1pnhu+C092w5/nEUrwDfBphL4+Z7tGXfKU6DxFCcFCfMajr8+VFSXAJU+JzlvmAXNBfc4U1edc8pToUxTO5hbqc7bC2SVPiVbmVaQyL3eVeV32gaLR/4AIgYvGoSa368P/Q8a1fTUAAAAASUVORK5CYII="); - background-size: 42px; - background-repeat: no-repeat; - background-color: transparent !important; - width: 14px !important; - height: 14px !important; - top: -2px !important; - position: relative !important; - margin-left: 30px; - } - - [class*="macButton-"] { - background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACoAAAAqCAYAAADFw8lbAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAJVSURBVFhH1ZjtThQxFIa9j81ust+fV8ONIH6AiMgAAgr4A/SavAFioiJBshLxAvjLgXfI25TuTGm7pM00eZJOe872me3szJl9dtcWAoneFr6trokPyLlPjdty0aujY/l//NXK1dGX9KKX+4fy7+CzFcQkF/2790kuP+4LG/rmMWKSi15s78j0w67cXF/noG8eIya56PnGpvzJtnIoRziOmOSiZ+sbcv4+yzFFOY6Y5KKnb9/J2dq6kkPfPP59F5Nc9NfyGzldWVVi6JvHiEku+uPla/n5atkKYpKLniwuyffnL6wgJrmoD8i5T43bsGgIcdt0OpUQarVaVHLRou21QdHJZCLj8dgJxHLRkDwl6lM9UXQ0GslwOHQCsRQNyVOiPtWTLjoYDJwwRYtiipgR9ameKIoz7vf7TiCWoiF5StSneqIozrjX6z2gXq/nmOOIpWhRXhnMU6I+1RNFccbdbjcHHwrBLMtyKMt5xFJUz2s2m+rkCMbMPCXqUz3pop1OZ0bSlEWMKYoxUJbH+RlRn+qJopBot9uFixHMIQaxFGUeKPtGOc88JepTPVEUW9NqtaTRaFhBDGIpyjwXmKdEfaonimJrcPYuIJaiIXlK1Kd6SirqA0X1a+0xyq7Rx3hwjYbARWNRLdGi7bVB0ehbj8Ur82OqzO1pnhu+C092w5/nEUrwDfBphL4+Z7tGXfKU6DxFCcFCfMajr8+VFSXAJU+JzlvmAXNBfc4U1edc8pToUxTO5hbqc7bC2SVPiVbmVaQyL3eVeV32gaLR/4AIgYvGoSa368P/Q8a1fTUAAAAASUVORK5CYII="); - background-size: 42px; - background-repeat: no-repeat; - background-color: transparent !important; - width: 14px !important; - height: 14px !important; - border-radius: 0; - } - - [class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"], - html.platform-win:not(.app-focused) [class*="winButton-"] { - opacity: 0.4; - } - - [class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"]:hover, - html.platform-win:not(.app-focused) [class*="winButton-"]:hover { - opacity: 1; - } - - [class*="macButton-"] > svg, - [class*="winButton-"] > svg, - [class^="wordmarkWindows-"] > svg { - display: none; - } - - [class*="winButtonClose-"] { - margin-right: 3px; - } - - [class*="macButtonClose-"], - [class*="winButtonClose-"] { - background-position: 0px 0px; - } - [class*="macButtonClose-"]:hover, - [class*="winButtonClose-"]:hover { - background-position: 0px -14px; - } - [class*="macButtonClose-"]:active, - [class*="winButtonClose-"]:active { - background-position: 0px -28px; - } - - [class*="macButtonMaximize-"], - [class*="winButtonMinMax-"]:nth-child(3) { - background-position: -14px 0px; - } - [class*="macButtonMaximize-"]:hover, - [class*="winButtonMinMax-"]:nth-child(3):hover { - background-position: -14px -14px; - } - [class*="macButtonMaximize-"]:active, - [class*="winButtonMinMax-"]:nth-child(3):active { - background-position: -14px -28px; - } - - [class*="macButtonMinimize-"], - [class*="winButtonMinMax-"]:nth-child(4) { - background-position: -28px 0px; - } - [class*="macButtonMinimize-"]:hover, - [class*="winButtonMinMax-"]:nth-child(4):hover { - background-position: -28px -14px; - } - [class*="macButtonMinimize-"]:active, - [class*="winButtonMinMax-"]:nth-child(4):active { - background-position: -28px -28px; - } - - [class^="wordmarkWindows-"] { - width: 16px !important; - height: 16px !important; - top: 6px !important; - left: 7px !important; - padding: 0 !important; - background-image: var(--titlebar-icon); - background-repeat: no-repeat; - } - [class^="wordmarkWindows-"]::after { - font-family: var(--_font-titlebars) !important; - font-size: 12px !important; - line-height: 250% !important; - color: var(--text) !important; - font-weight: 0 !important; - content: "Discord"; - position: absolute; - top: -7px; - left: 21px; - height: 17px; - opacity: 1; - } - - html.platform-win:not(.app-focused) [class^="wordmarkWindows-"]::after, - html:not(.platform-win) - #app-mount - > div:not(.app-focused) - [class^="wordmarkWindows-"]::after { - opacity: 0.4; - } +[class^="focusLock-"][aria-modal="true"] + > [class*="root-"] + > [class^="body-"] + > [class^="infoScroller-"] + > [class^="connectedAccounts-"]::before { + color: var(--text) !important; + padding: 0 10px; + background-color: var(--titlebar-color); + box-shadow: var(--titlebar-shadow); + margin-bottom: 0; + height: 28px; + width: 100%; + box-sizing: border-box; + display: flex; + align-items: center; + font-weight: 100; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + text-transform: none; + content: "Connected Accounts"; + position: absolute; +} [class^="focusLock-"][aria-modal="true"] - > [class*="root-"] - > [class^="body-"] - > [class^="infoScroller-"] - > [class^="userInfoSection-"] - > [class*="userInfoSectionHeader-"] { - color: var(--text) !important; - padding: 0 10px; - background-color: var(--titlebar-color); - box-shadow: var(--titlebar-shadow); - margin-bottom: 0; - height: 28px; - box-sizing: border-box; - display: flex; - align-items: center; - font-weight: 100; - font-family: var(--_font-titlebars) !important; - font-size: 12px !important; - text-transform: none; - } + > [class*="root-"] + > [class^="body-"] + > [class^="infoScroller-"] + > [class^="connectedAccounts-"] > [class^="connectedAccountsColumn-"] { + margin-top: 28px; +} - [class^="focusLock-"][aria-modal="true"] - > [class*="root-"] - > [class^="body-"] - > [class^="infoScroller-"] - > [class^="connectedAccounts-"]::before { - color: var(--text) !important; - padding: 0 10px; - background-color: var(--titlebar-color); - box-shadow: var(--titlebar-shadow); - margin-bottom: 0; - height: 28px; - width: 100%; - box-sizing: border-box; - display: flex; - align-items: center; - font-weight: 100; - font-family: var(--_font-titlebars) !important; - font-size: 12px !important; - text-transform: none; - content: "Connected Accounts"; - position: absolute; - } +[class^="focusLock-"][aria-modal="true"] + > [class*="root-"] + > [class^="body-"] + > [class^="listScroller-"] + > [class^="activityProfile-"] + [class*="headerTextNormal-"] { + color: var(--text) !important; + padding: 0 10px; + background-color: var(--titlebar-color); + box-shadow: var(--titlebar-shadow); + margin-bottom: 0; + width: 100%; + height: 28px; + box-sizing: border-box; + display: flex; + align-items: center; + font-weight: 100; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + text-transform: none; +}`, + 'Windows Classic': `.theme-dark { + --wc-frame: -1px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 0px 0 0 var(--wc-bright, var(--highlight)), 0px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--primary), 1px -2px 0 0 var(--primary), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--primary), + -2px 2px 0 0 var(--tertiary); - [class^="focusLock-"][aria-modal="true"] - > [class*="root-"] - > [class^="body-"] - > [class^="infoScroller-"] - > [class^="connectedAccounts-"] > [class^="connectedAccountsColumn-"] { - margin-top: 28px; - } + --wc-outer-edge: -1px -1px 0 0 var(--primary), + -1px 0px 0 0 var(--primary), 0px -1px 0 0 var(--primary), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--wc-bright, var(--highlight)), 1px -2px 0 0 var(--wc-bright, var(--highlight)), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--wc-bright, var(--highlight)), + -2px 2px 0 0 var(--tertiary); +} +.theme-light { + --wc-frame: -1px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 0px 0 0 var(--wc-bright, var(--highlight)), 0px -1px 0 0 var(--wc-bright, var(--highlight)), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--primary), 1px -2px 0 0 var(--primary), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--primary), + -2px 2px 0 0 var(--tertiary); - [class^="focusLock-"][aria-modal="true"] - > [class*="root-"] - > [class^="body-"] - > [class^="listScroller-"] - > [class^="activityProfile-"] - [class*="headerTextNormal-"] { - color: var(--text) !important; - padding: 0 10px; - background-color: var(--titlebar-color); - box-shadow: var(--titlebar-shadow); - margin-bottom: 0; - width: 100%; - height: 28px; - box-sizing: border-box; - display: flex; - align-items: center; - font-weight: 100; - font-family: var(--_font-titlebars) !important; - font-size: 12px !important; - text-transform: none; - } + --wc-outer-edge: -1px -1px 0 0 var(--primary), + -1px 0px 0 0 var(--primary), 0px -1px 0 0 var(--primary), + -1px 1px 0 0 var(--secondary), 1px -1px 0 0 var(--secondary), + 1px 1px 0 0 var(--secondary), 2px 2px 0 0 var(--tertiary), + -2px -2px 0 0 var(--wc-bright, var(--highlight)), 1px -2px 0 0 var(--wc-bright, var(--highlight)), + 2px -2px 0 0 var(--tertiary), -2px 1px 0 0 var(--wc-bright, var(--highlight)), + -2px 2px 0 0 var(--tertiary); +} + +.platform-win #app-mount { + margin: 2px; + box-shadow: var(--wc-frame); + width: calc(100% - 6px); + height: calc(100% - 6px); + border: 1px solid var(--titlebar-border-inactive, var(--secondary)); +} +.platform-win.app-focused #app-mount { + border-color: var(--titlebar-border-active, var(--primary)) !important; +} + +[class^="typeWindows-"] { + height: 18px !important; + margin-top: 0; + background: var(--titlebar-inactive, var(--secondary)); + border-bottom: 1px solid var(--titlebar-border-inactive, var(--secondary)); +} +.app-focused [class^="typeWindows-"] { + background: var(--titlebar-active, var(--titlebar-color, var(--accent))) !important; + border-color: var(--titlebar-border-active, var(--primary)) !important; +} + +[class^="winButtonClose-"] > svg, +[class^="winButtonMinMax-"] > svg, +[class^="wordmarkWindows-"] > svg { + display: none; +} + +[class^="wordmarkWindows-"] { + width: 16px !important; + height: 16px !important; + top: 1px !important; + left: 2px !important; + padding: 0 !important; + background-image: var(--titlebar-icon); + background-repeat: no-repeat; +} +[class^="wordmarkWindows-"]::after { + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + color: var(--wc-bright, var(--highlight)) !important; + font-weight: bold !important; + content: "Discord"; + position: absolute; + top: 2px; + left: 18px; + height: 17px; + opacity: 1; +} +.app-focused [class^="wordmarkWindows-"]::after { + color: var(--text) !important; +} + +[class*="winButton-"] { + top: 2px; + width: 12px !important; + height: 10px !important; + margin: 2px; + background: var(--primary) !important; + box-shadow: var(--wc-outer-edge); +} + +[class^="winButtonClose-"] { + right: 2px; +} +[class^="winButtonMinMax-"]:nth-child(3), +[class^="winButtonMinMax-"]:nth-child(4) { + right: 4px; +} + +[class*="winButton-"]::before { + width: 12px !important; + height: 10px !important; + background-color: var(--text); + content: ""; +} +[class^="winButtonClose-"]::before { + -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAwSURBVChTY6AE/IdidIBLHAzQJfEqhgGYIqIUwwBZionShK4IryZckng1URswMAAAIEcZ541Sy3oAAAAASUVORK5CYIIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); + mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAwSURBVChTY6AE/IdidIBLHAzQJfEqhgGYIqIUwwBZionShK4IryZckng1URswMAAAIEcZ541Sy3oAAAAASUVORK5CYIIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); +} +[class^="winButtonMinMax-"]:nth-child(3)::before { + -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAjSURBVChTY4CC/0RgFIBNATpGARgCaGBUAwiABAhhcgADAwD+Vybas8l0mAAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); + mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAjSURBVChTY4CC/0RgFIBNATpGARgCaGBUAwiABAhhcgADAwD+Vybas8l0mAAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); +} +[class^="winButtonMinMax-"]:nth-child(4)::before { + -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZSURBVChTYxgFtAb/cWCcAJtiEKYEMDAAALNwC/VcmzodAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); + mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZSURBVChTYxgFtAb/cWCcAJtiEKYEMDAAALNwC/VcmzodAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); +} + +[class*="recentMentionsPopout-"], +[class^="messagesPopoutWrap-"], +[class^="browser-"] { + border-radius: 0; + margin: 2px; + box-shadow: var(--wc-frame); + border: 1px solid var(--titlebar-border-active, var(--primary)); +} + +[class*="recentMentionsPopout-"] > [class^="header-"] { + padding: 0 4px; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + color: var(--text) !important; + font-weight: bold !important; + height: 18px !important; + min-height: 18px !important; + border-bottom: 1px solid var(--titlebar-border-inactive, var(--secondary)); + background: var(--titlebar-active, var(--titlebar-color, var(--accent))) !important; +} +[class*="recentMentionsPopout-"] + > [class^="header-"] + > [class^="controls-"] + > [class^="button-"] { + padding: 0; + border-radius: 0; + width: 16px; + height: 16px; + min-width: 16px; + min-height: 16px; + background-color: transparent; +} +[class*="recentMentionsPopout-"] > [class^="header-"] [class^="tab-"] { + margin-top: 0 !important; + padding: 0px 2px; + height: 16px; + border-radius: 0; + font-size: 12px; +} + +[class^="messagesPopoutWrap-"] > [class^="header-"] { + padding: 0; +} +[class^="messagesPopoutWrap-"] > [class^="header-"] > h1 { + padding: 0 4px; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + color: var(--text) !important; + font-weight: bold !important; + height: 18px !important; + border-bottom: 1px solid var(--titlebar-border-inactive, var(--secondary)); + background: var(--titlebar-active, var(--titlebar-color, var(--accent))) !important; +} + +[class^="browser-"] > [class^="header-"] { + padding: 0 4px; + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + color: var(--text) !important; + font-weight: bold !important; + height: 18px !important; + min-height: 18px !important; + border-bottom: 1px solid var(--titlebar-border-inactive, var(--secondary)); + background: var(--titlebar-active, var(--titlebar-color, var(--accent))) !important; +} +[class^="browser-"] > [class^="header-"] > h1 { + font-family: var(--_font-titlebars) !important; + font-size: 12px !important; + color: var(--text) !important; + font-weight: bold !important; +} +[class^="browser-"] > [class^="header-"] > [class^="threadIcon-"] { + width: 16px; + height: 16px; +} +[class^="browser-"] > [class^="header-"] > [class^="threadIcon-"] { + margin-right: 2px; +} +[class^="browser-"] > [class^="header-"] > h1, +[class^="browser-"] > [class^="header-"] > [class^="divider-"], +[class^="browser-"] > [class^="header-"] > [class^="searchBox-"] { + margin-right: 0; +} + +[class^="browser-"] > [class^="header-"] > [class^="divider-"] { + flex-grow: 1; + background-color: transparent; +} +[class^="browser-"] > [class^="header-"] > [class^="closeIcon-"] > svg { + display: none; +} +[class^="browser-"] > [class^="header-"] > [class^="closeIcon-"] { + width: 12px !important; + min-width: 12px !important; + height: 10px !important; + min-height: 10px !important; + margin: 2px; + top: 0px; + right: -2px; + position: relative; + background: var(--primary) !important; + box-shadow: var(--wc-outer-edge); +} +[class^="browser-"] > [class^="header-"] > [class^="closeIcon-"]::before { + width: 12px !important; + height: 10px !important; + background-color: var(--text); + content: ""; + position: absolute; + -webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAwSURBVChTY6AE/IdidIBLHAzQJfEqhgGYIqIUwwBZionShK4IryZckng1URswMAAAIEcZ541Sy3oAAAAASUVORK5CYIIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); + mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAKCAYAAACALL/6AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAwSURBVChTY6AE/IdidIBLHAzQJfEqhgGYIqIUwwBZionShK4IryZckng1URswMAAAIEcZ541Sy3oAAAAASUVORK5CYIIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); +} `, + 'Old Discord': `[class*="wordmark-"] { + display: none !important; +} +[class*="titleBar-"] { + margin-top: 0; +} +[class*="typeWindows-"] { + height: 0px !important; + margin: 0 !important; + padding: 0 !important; + border: none !important; + box-shadow: none !important; +} +[class*="winButton-"] { + margin-top: 19px; + margin-right: 5px; + opacity: 0.3; +} +[class*="winButton-"]:hover { + opacity: 1; +} + +.platform-win [class*="headerBar-"], +.platform-win [class^="chat-"] > [class^="title-"], +.platform-win [class*="activityFeed-"] > [class*="container-"], +.platform-win [class^="libraryHeader-"], +.platform-win + [class*="spacer-"] + > [class*="container-"] + > [class*="container-"], +.platform-win + [class^="base-"] + > [class^="content-"] + > [class^="container-"] + > [class^="container-"], +.platform-win [class^="videoControls-"] [class^="headerWrapper-"] { + padding-right: 104px !important; +} + +.platform-win [class^="topControls-"] { + top: -4px; + position: relative; +} + +[class*="winButtonClose-"], +[class*="winButtonMinMax-"] { + width: 24px !important; + height: 24px !important; + margin-left: 0 !important; + opacity: 1 !important; + margin-top: 13px !important; + margin-left: 4px !important; + background-color: var(--interactive-normal) !important; +} + +[class*="winButtonClose-"] { + margin-right: 12px; +} + +[class*="winButtonClose-"] svg, +[class*="winButtonMinMax-"] svg { + display: none; +} +[class*="winButtonClose-"] { + mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMjAgNy40MUwxOC41OSA2IDEzIDExLjU5IDcuNDEgNiA2IDcuNDEgMTEuNTkgMTMgNiAxOC41OSA3LjQxIDIwIDEzIDE0LjQxIDE4LjU5IDIwIDIwIDE4LjU5IDE0LjQxIDEzIDIwIDcuNDF6Ii8+PC9nPjwvc3ZnPg==") + no-repeat; + -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMjAgNy40MUwxOC41OSA2IDEzIDExLjU5IDcuNDEgNiA2IDcuNDEgMTEuNTkgMTMgNiAxOC41OSA3LjQxIDIwIDEzIDE0LjQxIDE4LjU5IDIwIDIwIDE4LjU5IDE0LjQxIDEzIDIwIDcuNDF6Ii8+PC9nPjwvc3ZnPg==") + no-repeat; + background-image: none !important; +} +[class*="winButtonMinMax-"]:nth-child(3) { + mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNOCAxM0g2djdoN3YtMkg4di01em0tMiAwaDJWOGg1VjZINnY3em03IDV2Mmg3di03aC0ydjVoLTV6bTAtMTJ2Mmg1djVoMlY2aC03eiIvPjwvZz48L3N2Zz4=") + no-repeat; + -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMSAxaDI0djI0SDFWMXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNOCAxM0g2djdoN3YtMkg4di01em0tMiAwaDJWOGg1VjZINnY3em03IDV2Mmg3di03aC0ydjVoLTV6bTAtMTJ2Mmg1djVoMlY2aC03eiIvPjwvZz48L3N2Zz4=") + no-repeat; + background-image: none !important; +} +[class*="winButtonMinMax-"]:nth-child(4) { + mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTkgMTl2LTJIN3YyaDEyeiIvPjxwYXRoIGQ9Ik0xIDI1aDI0VjFIMXYyNHoiLz48L2c+PC9zdmc+") + no-repeat; + -webkit-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNiIgaGVpZ2h0PSIyNiI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTkgMTl2LTJIN3YyaDEyeiIvPjxwYXRoIGQ9Ik0xIDI1aDI0VjFIMXYyNHoiLz48L2c+PC9zdmc+") + no-repeat; + background-image: none !important; +} +[class*="winButtonClose-"]:hover, +[class*="winButtonMinMax-"]:hover { + background-color: var(--interactive-hover) !important; +} + +[class^="typeMacOS-"][class*="unfocused-"] [class*="macButton-"], +html.platform-win:not(.app-focused) [class*="winButton-"] { + opacity: 1 !important; +}`, } @var select xmc_titlebar_icon 'Titlebar Icon' { @@ -3841,7 +4383,10 @@ section[class^="panels-"] > [class^="container-"]:last-child > div:last-child { 'Discord Development': `:root { --titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGqSURBVDhPldNNTsJQEAfwt+YUCoUCItAWEFS4hPEz8RDGxBOIXweQ2rhT1xoTwa0VTVR0K1Y8QN0R3NCkjDNDGxE16iS/ZPLmPy9N04rhykwUVaRn80Urmy85fUWLzmjmxb6WlpsKaLnpfQS/MCjrrfVLyUwG1OykieCPTCVT+LgkrRUMRSvAf6S1/D4vp9QJFYFvfnEZjk9O4cK8hPLmDjPNOp/N4Wwwi1SRTGd1BCRXKIFtv0Kv1/uWbduc8fO0KxKpjIWArG9sfbs4aH1jm7MeS4wlVQcBubm941Dj/gFWVteg0+lA5+2N+0bjgWeU8fO0K+IJxUFA2u02hyq6AfFxBZ6fW9BqvXC/W9njGWX8PO2K6FjKQkBct/+YjuOAhcvUE7qo2+1y77ouZz2WkGPjOgJSrZ1z6LHZhIPDI6hfXTPqm80nnp1Va5z16CISTagIfLPzS1DGFzV4Rsqb2zAzuzB83v+0JTluSJE4/JPBy1ShcCyAzFA4Cn+D2Ujs8/8QlOQAMkZDMvxIkoEyQSn6eXmwRkIRdSQY1pGFHA/1+ijOvJhXQrwDgTTB8rXBmzwAAAAASUVORK5CYII="); }`, - 'MSN': `:root { + 'MSN Messenger 1.0': `:root { + --titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACYSURBVDhPpZABDsAgCAN5uk/zZ45OahAnmqxJowi9OWVRKW2yyHDpdSILQQxTtVYCNpAQxnBUDtEGBgZEh1B7HQH+BnoyAbA/AjAwVgN4I7wHQGiaCWHoHKYwRHcxdBH+Lf91dbx+/gtoqiEf9uJD6nSA4FD9PpwFY5j6hrgwB3ZaASjMbGYAaIa4MFYCUGdeAMP9apeW9gDxfcZs7l81ZQAAAABJRU5ErkJggg=="); +}`, + 'MSN Messenger 4.6': `:root { --titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAM6SURBVDhPhZJrUIxRGMePMUiDkUaMmeRSQy7lMijklg+lBg1DG8Nu6EalJFqxU7JtbcnSZd+tbMm2W3RZpdVlG7GpKJemZqKLiC9tYYsti/17rdf0gRm/mWfmzHPO7z/PnHPI/1A9rRKyLu38tPHgiiFZUV4K0/4b3dCAe6ky/nHF3YIspkXiq6kXXHUw8hu5YAv2giyciQsJl+8x22MYjUZzdXMKgD5ESytwX9MROTzyxX7H7QioDSpU9hXiKBWHmZ4cEDNnjIx8ncuov9Hr9Qviyq6hl47YVwbwMjrkD9qfhGzO40L8rhr8xxVwTcrHtD25IDPC0Nun3cqoY4hkcoUlJwdkay0M34zTdZ91y6cd8YB7Bh9bhBLYBJeBuD4EWZAKeuJJjDZGV1c9L+9mCOKTwvGspSHsV48THfmIrFgHs20BIM4iEGspmlq1USbhD/TU4568yO949VZML4cwikH4cFNxRqh839nd62Pv5qydYOsEMscVvuF8DaON8Wagpb2uR43+4Ud0AGCgK6ZkBIt9xThSwkNO23mklPuDFeeBRbuW4kTUqVqd7uMSRick9/UXsNOvQGdoNwW8pCtCVURXKKg3aXg+WghZcyICqVNYH8LGOPs1ILOXoFajuWgKSNR8794dGYAuQyd0tMxrzIJSS0HSI0PRcDmaR8uRUZ8OjjgOm6K4sPHyo/+DB8jyIPT09nFMIfStTvyOH07F3Q0NordZELTU4FglBeVoDao+VICvvg7vNBFcooWwY8diiuMBjN+SDStPSm8K+ENQHR/BVaWwDroKtioZssF7yOkuRnipFLtEFJzOSWDnL4GFy1lMXHUS5t5qI6MSUveqRehZGAur/Zmw2BcK3+p4iDpvQ9Agg+/NbGxPzMbqqDzYBhbAwk2MSY6HMctPAUYn5JIy85lVaBiIbRosD+3Enls8cDWZOHlHDK90MTbEXMey0wWYH3AHZm5yTHY4C/3Xb9aMTj+n9j07LKegrrJxgBtzi6p3SOCAJY+FjzQRrgIRVp6RYN5xOab6lICsVWCt941+Rv03Ta/bg/mq3Kb9qYKBzbykTy7R0n5Wck2roOilQtM2GPj7FCE/Ab+l9dhxypy/AAAAAElFTkSuQmCC"); }`, 'mIRC 6': `:root { @@ -4535,6 +5080,37 @@ button.hh2-spotify-controls-button { margin-left: 4px; margin-right: 4px; } +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] { + height: 32px !important; +} + +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] + > [class^="bannerImage-"] { + height: 32px !important; +} +div[class^="sidebar-"]:not(:has(> [class^="side-"])) + > nav[class^="container-"] + > [class^="container-"][class*="clickable-"] + > [class^="animatedContainer-"] + > [class^="bannerImage-"]:after { + content: ""; + height: 32px !important; + width: 240px; + top: 0; + left: 0; + position: absolute; + background: linear-gradient( + 0deg, + var(--background-secondary) 5%, + transparent 100% + ); +} [nop=nop] [class^="members-"] > [class^="content-"], [nop=nop] [class^="sidebar-"] ul[class^="content-"] { @@ -4617,6 +5193,11 @@ button.hh2-spotify-controls-button { padding: 2px; } +[class^="chat-"] [class^="toolbar-"] [class*="iconWrapper-"], +[class^="chat-"] [class^="toolbar-"] > [class*="search-"] { + margin: 0 !important; +} + [class^="chatContent-"] > form [class^="channelTextArea"] { margin-bottom: 1px !important; } @@ -4631,6 +5212,9 @@ button.hh2-spotify-controls-button { padding-top: 9px !important; padding-bottom: 9px !important; } +[class^="channelTextArea-"] [class^="inner-"] { + padding-left: 0 !important; +} [class^="channelTextArea-"], [class^="channelTextArea-"] [class^="inner-"], [class^="channelTextArea-"] [class^="buttons-"], @@ -4644,6 +5228,13 @@ button.hh2-spotify-controls-button { [class^="channelTextArea-"] [class^="attachWrapper-"] { height: 40px; } +[class^="channelTextArea-"] [class^="attachWrapper-"] { + min-width: 40px; +} +[class^="channelTextArea-"] [class^="attachWrapper-"] [class^="attachButton-"] { + margin-left: 0; + padding-top: 0; +} [class^="channelTextArea-"] [class^="attachButton-"] , [class^="channelTextArea-"] [class^="attachButton-"] > [class^="icon-"] { padding: 5px 8px; @@ -4668,25 +5259,25 @@ button.hh2-spotify-controls-button { margin-right: 0; } -[class^="menu-"] [class^="scroller-"] { +[class*="menu-"] [class^="scroller-"] { padding: 4px; } -[class^="menu-"] [class^="scroller-"]::-webkit-scrollbar { +[class*="menu-"] [class^="scroller-"]::-webkit-scrollbar { width: 4px; } -[class^="menu-"] [class^="scroller-"] [class^="item-"] { +[class*="menu-"] [class^="scroller-"] [class^="item-"] { margin: 1px 0; padding: 0 4px; min-height: 24px; } -[class^="menu-"] +[class*="menu-"] [class^="scroller-"] [class^="customItem-"][id^="message-quickreact-"] > [class^="button-"] { width: 24px; height: 24px; } -[class^="menu-"] +[class*="menu-"] [class^="scroller-"] [class^="wrapper-"]:has( > [class^="customItem-"][id^="message-quickreact-"] @@ -4694,17 +5285,17 @@ button.hh2-spotify-controls-button { padding: 0; margin-bottom: 4px; } -[class^="menu-"] +[class*="menu-"] [class^="scroller-"] [class^="item-"] > [class^="labelContainer-"], -[class^="menu-"] +[class*="menu-"] [class^="scroller-"] [class^="item-"] > [class^="sliderContainer-"] { padding: 0; } -[class^="menu-"] +[class*="menu-"] [class^="scroller-"] [class^="item-"] > [class^="labelContainer-"] { @@ -5359,7 +5950,7 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav[class^="container-"] > [class^="container-"][class*="clickable-"] > [class^="animatedContainer-"] { - height: 32px; + height: 32px !important; } div[class^="sidebar-"]:not(:has(> [class^="side-"])) @@ -5367,7 +5958,7 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])) > [class^="container-"][class*="clickable-"] > [class^="animatedContainer-"] > [class^="bannerImage-"] { - height: 32px; + height: 32px !important; } div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav[class^="container-"] @@ -5375,7 +5966,7 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])) > [class^="animatedContainer-"] > [class^="bannerImage-"]:after { content: ""; - height: 32px; + height: 32px !important; width: 240px; top: 0; left: 0; @@ -5539,8 +6130,10 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing @var select xmc_override_titlebar 'Override Titlebar Color' { 'Off*': "", - 'On': `:root { - --titlebar-color: var(--xmc_titlebar_color) !important; + 'On': `:root, +.theme-dark, +.theme-light { + --titlebar-color: var(--xmc-titlebar-color) !important; }`, } @var color xmc_titlebar_color 'Titlebar Override' '#72767d' @@ -5587,6 +6180,20 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing @-moz-document domain(discord.com) { /* BASE THEME START */ + :root, + .theme-dark, + .theme-light { + --titlebar-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22), + inset 0 0 0 2px rgba(0, 0, 0, 0.27), + 0 0 0 1px var(--tertiary, var(--background-tertiary)), + 0 0 0 2px var(--secondary, var(--background-secondary)), + 0 0 0 3px var(--primary, var(--background-primary)); + + --_font-titlebars: var(--font-primary); + + --titlebar-color: var(--accent); + } + /* i have no idea what half of these are for anymore */ /* most of them are probably now-redundant color fixes */ /* others are things i dont feel like need a toggle at the current moment */ @@ -5955,7 +6562,7 @@ div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing --tertiary-alpha: /*[[xmc_cbg_alpha_tertiary]]*/ ; --custom-background: /*[[xmc_cbg_background]]*/ ; - --xmc_titlebar_color: /*[[xmc_titlebar_color]]*/ ; + --xmc-titlebar-color: /*[[xmc_titlebar_color]]*/ ; --xmc-custom-color0: /*[[xmc_custom_color0]]*/ ; --xmc-custom-color1: /*[[xmc_custom_color1]]*/ ;