mirror of https://gitlab.com/Cynosphere/xmc.git
6872 lines
206 KiB
CSS
6872 lines
206 KiB
CSS
/* ==UserStyle==
|
|
@name XMC
|
|
@namespace gitlab.com/Cynosphere/xmc
|
|
@description Modular theme originally inspired by XMC Windows visual style.
|
|
@author Cynosphere
|
|
@homepageURL https://gitlab.com/Cynosphere/xmc
|
|
@updateURL https://xmc.c7.pm/xmc.user.css
|
|
@preprocessor uso
|
|
@version 0.0.0
|
|
@license MIT
|
|
|
|
@var select xmc_overwrite_colors 'Overwrite Colors' {
|
|
'Off': "",
|
|
'On*': `:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--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;
|
|
--text-normal: var(--text, var(--primary-dark-200)) !important;
|
|
--text-muted: var(--highlight, var(--primary-dark-330)) !important;
|
|
--text-link: var(--link, var(--link-500)) !important;
|
|
--text-brand: var(--accent);
|
|
--channels-default: var(--text, var(--primary-dark-345)) !important;
|
|
--channel-icon: var(--text, var(--primary-dark-360));
|
|
--interactive-normal: var(--text, var(--primary-dark-300)) !important;
|
|
--interactive-hover: var(--_color15, var(--primary-dark-200)) !important;
|
|
--interactive-active: var(--_color15, var(--white-500)) !important;
|
|
--interactive-muted: var(--highlight, var(--primary-dark-500)) !important;
|
|
--background-primary: var(--primary, var(--primary-dark-600)) !important;
|
|
--background-secondary: var(
|
|
--secondary,
|
|
var(--primary-dark-630)
|
|
) !important;
|
|
--background-secondary-alt: var(
|
|
--secondary-alt,
|
|
var(--secondary, var(--primary-dark-660))
|
|
) !important;
|
|
--background-tertiary: var(--tertiary, var(--primary-dark-700)) !important;
|
|
--background-accent: var(--highlight, var(--primary-dark-500)) !important;
|
|
--background-floating: var(--primary, var(--primary-dark-800)) !important;
|
|
--background-modifier-hover: rgba(var(--highlight-rgb), 0.16) !important;
|
|
--background-modifier-active: rgba(var(--highlight-rgb), 0.2) !important;
|
|
--background-modifier-selected: rgba(var(--highlight-rgb), 0.24) !important;
|
|
--background-modifier-accent: rgba(var(--highlight-rgb), 0.24) !important;
|
|
--background-mentioned: rgba(var(--accent-rgb), 0.05) !important;
|
|
--background-mentioned-hover: rgba(var(--accent-rgb), 0.08) !important;
|
|
--background-message-hover: rgba(4, 4, 5, 0.07) !important;
|
|
--background-help-warning: rgba(250, 166, 26, 0.1) !important;
|
|
--background-help-info: rgba(0, 176, 244, 0.1) !important;
|
|
--scrollbar-thin-thumb: var(--text) !important;
|
|
--scrollbar-thin-track: transparent !important;
|
|
--scrollbar-auto-thumb: var(--text) !important;
|
|
--scrollbar-auto-track: transparent !important;
|
|
--scrollbar-auto-scrollbar-color-thumb: var(--text) !important;
|
|
--scrollbar-auto-scrollbar-color-track: transparent !important;
|
|
--elevation-stroke: 0 0 0 1px rgba(4, 4, 5, 0.15) !important;
|
|
--elevation-low: 0 1px 0 rgba(4, 4, 5, 0.2), 0 1.5px 0 rgba(6, 6, 7, 0.05),
|
|
0 2px 0 rgba(4, 4, 5, 0.05) !important;
|
|
--elevation-medium: 0 4px 4px rgba(0, 0, 0, 0.16) !important;
|
|
--elevation-high: 0 8px 16px rgba(0, 0, 0, 0.24) !important;
|
|
--logo-primary: #fff !important;
|
|
--focus-primary: var(--link) !important;
|
|
--guild-header-text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4) !important;
|
|
--channeltextarea-background: var(
|
|
--secondary,
|
|
var(--primary-dark-560)
|
|
) !important;
|
|
--activity-card-background: var(
|
|
--tertiary,
|
|
var(--primary-dark-700)
|
|
) !important;
|
|
--textbox-markdown-syntax: #8e9297 !important;
|
|
--deprecated-card-bg: rgba(var(--primary-rgb), 0.6) !important;
|
|
--deprecated-card-editable-bg: rgba(var(--primary-rgb), 0.3) !important;
|
|
--deprecated-store-bg: var(--primary) !important;
|
|
--deprecated-quickswitcher-input-background: var(
|
|
--primary,
|
|
--primary-dark-400
|
|
) !important;
|
|
--deprecated-quickswitcher-input-placeholder: hsla(
|
|
0,
|
|
0%,
|
|
100%,
|
|
0.3
|
|
) !important;
|
|
--deprecated-text-input-bg: rgba(0, 0, 0, 0.1) !important;
|
|
--deprecated-text-input-border: rgba(0, 0, 0, 0.3) !important;
|
|
--deprecated-text-input-border-hover: #040405 !important;
|
|
--deprecated-text-input-border-disabled: #181b28 !important;
|
|
--deprecated-text-input-prefix: #dcddde !important;
|
|
--input-background: var(--tertiary, var(--primary-dark-700)) !important;
|
|
--control-brand-foreground: var(--accent) !important;
|
|
--channel-text-area-placeholder: var(--highlight);
|
|
--status-positive-text: var(--text);
|
|
--status-danger-text: var(--text);
|
|
--status-warning-text: var(--text);
|
|
--button-secondary-background: var(--primary);
|
|
--button-secondary-background-hover: var(--highlight);
|
|
--button-secondary-background-active: var(--highlight);
|
|
--button-secondary-background-disabled: var(--secondary);
|
|
--text-danger: var(--_color1);
|
|
--status-danger: var(--_color1);
|
|
--status-danger-background: var(--_color1);
|
|
--button-danger-background: var(--_color1);
|
|
--button-danger-background-hover: var(--_color9);
|
|
--button-danger-background-active: var(--_color9);
|
|
--button-outline-danger-border: var(--_color1);
|
|
--button-outline-danger-border-hover: var(--_color9);
|
|
--button-outline-danger-border-active: var(--_color9);
|
|
--button-outline-danger-background-hover: var(--_color9);
|
|
--button-outline-danger-background-active: var(--_color9);
|
|
--text-positive: var(--_color2);
|
|
--status-positive: var(--_color2);
|
|
--status-positive-background: var(--_color2);
|
|
--button-positive-background: var(--_color2);
|
|
--button-positive-background-hover: var(--_color10);
|
|
--button-positive-background-active: var(--_color10);
|
|
--button-outline-positive-border: var(--_color2);
|
|
--button-outline-positive-border-hover: var(--_color10);
|
|
--button-outline-positive-border-active: var(--_color10);
|
|
--button-outline-positive-background-hover: var(--_color10);
|
|
--button-outline-positive-background-active: var(--_color10);
|
|
--text-warning: var(--_color3);
|
|
--status-warning: var(--_color3);
|
|
--status-warning-background: var(--_color3);
|
|
--status-green-600: var(--status-online) !important;
|
|
--status-yellow-500: var(--status-idle) !important;
|
|
--status-red-500: var(--status-dnd) !important;
|
|
--status-grey-500: var(--status-offline) !important;
|
|
--green-360: var(--status-online) !important;
|
|
--yellow-300: var(--status-idle) !important;
|
|
--red-400: var(--status-dnd) !important;
|
|
--twitch: var(--status-streaming) !important;
|
|
--primary-600: var(--primary);
|
|
}
|
|
|
|
[data-popout-root],
|
|
html {
|
|
--brand-experiment: var(--accent) !important;
|
|
--brand-100: var(--accent) !important;
|
|
--brand-130: var(--accent) !important;
|
|
--brand-160: var(--accent) !important;
|
|
--brand-200: var(--accent) !important;
|
|
--brand-230: var(--accent) !important;
|
|
--brand-260: var(--accent) !important;
|
|
--brand-300: var(--accent) !important;
|
|
--brand-330: var(--accent) !important;
|
|
--brand-360: var(--accent) !important;
|
|
--brand-400: var(--accent) !important;
|
|
--brand-430: var(--accent) !important;
|
|
--brand-460: var(--accent) !important;
|
|
--brand-500: var(--accent) !important;
|
|
--brand-530: var(--accent) !important;
|
|
--brand-560: var(--accent) !important;
|
|
--brand-600: var(--accent) !important;
|
|
--brand-630: var(--accent) !important;
|
|
--brand-660: var(--accent) !important;
|
|
--brand-700: var(--accent) !important;
|
|
--brand-730: var(--accent) !important;
|
|
--brand-760: var(--accent) !important;
|
|
--brand-800: var(--accent) !important;
|
|
--brand-830: var(--accent) !important;
|
|
--brand-860: var(--accent) !important;
|
|
--brand-900: var(--accent) !important;
|
|
--brand-new-100: var(--accent) !important;
|
|
--brand-new-130: var(--accent) !important;
|
|
--brand-new-160: var(--accent) !important;
|
|
--brand-new-200: var(--accent) !important;
|
|
--brand-new-230: var(--accent) !important;
|
|
--brand-new-260: var(--accent) !important;
|
|
--brand-new-300: var(--accent) !important;
|
|
--brand-new-330: var(--accent) !important;
|
|
--brand-new-360: var(--accent) !important;
|
|
--brand-new-400: var(--accent) !important;
|
|
--brand-new-430: var(--accent) !important;
|
|
--brand-new-460: var(--accent) !important;
|
|
--brand-new-500: var(--accent) !important;
|
|
--brand-new-530: var(--accent) !important;
|
|
--brand-new-560: var(--accent) !important;
|
|
--brand-new-600: var(--accent) !important;
|
|
--brand-new-630: var(--accent) !important;
|
|
--brand-new-660: var(--accent) !important;
|
|
--brand-new-700: var(--accent) !important;
|
|
--brand-new-730: var(--accent) !important;
|
|
--brand-new-760: var(--accent) !important;
|
|
--brand-new-800: var(--accent) !important;
|
|
--brand-new-830: var(--accent) !important;
|
|
--brand-new-860: var(--accent) !important;
|
|
--brand-experiment-900: var(--accent) !important;
|
|
--brand-experiment-100: var(--accent) !important;
|
|
--brand-experiment-130: var(--accent) !important;
|
|
--brand-experiment-160: var(--accent) !important;
|
|
--brand-experiment-200: var(--accent) !important;
|
|
--brand-experiment-230: var(--accent) !important;
|
|
--brand-experiment-260: var(--accent) !important;
|
|
--brand-experiment-300: var(--accent) !important;
|
|
--brand-experiment-330: var(--accent) !important;
|
|
--brand-experiment-360: var(--accent) !important;
|
|
--brand-experiment-400: var(--accent) !important;
|
|
--brand-experiment-430: var(--accent) !important;
|
|
--brand-experiment-460: var(--accent) !important;
|
|
--brand-experiment-500: var(--accent) !important;
|
|
--brand-experiment-530: var(--accent) !important;
|
|
--brand-experiment-560: var(--accent) !important;
|
|
--brand-experiment-600: var(--accent) !important;
|
|
--brand-experiment-630: var(--accent) !important;
|
|
--brand-experiment-660: var(--accent) !important;
|
|
--brand-experiment-700: var(--accent) !important;
|
|
--brand-experiment-730: var(--accent) !important;
|
|
--brand-experiment-760: var(--accent) !important;
|
|
--brand-experiment-800: var(--accent) !important;
|
|
--brand-experiment-830: var(--accent) !important;
|
|
--brand-experiment-860: var(--accent) !important;
|
|
--brand-experiment-900: var(--accent) !important;
|
|
--brand-experiment-05a: rgba(var(--accent-rgb), 0.05) !important;
|
|
--brand-experiment-10a: rgba(var(--accent-rgb), 0.1) !important;
|
|
--brand-experiment-15a: rgba(var(--accent-rgb), 0.15) !important;
|
|
--brand-experiment-20a: rgba(var(--accent-rgb), 0.2) !important;
|
|
--brand-experiment-25a: rgba(var(--accent-rgb), 0.25) !important;
|
|
--brand-experiment-30a: rgba(var(--accent-rgb), 0.3) !important;
|
|
--brand-experiment-35a: rgba(var(--accent-rgb), 0.35) !important;
|
|
--brand-experiment-40a: rgba(var(--accent-rgb), 0.4) !important;
|
|
--brand-experiment-45a: rgba(var(--accent-rgb), 0.45) !important;
|
|
--brand-experiment-50a: rgba(var(--accent-rgb), 0.5) !important;
|
|
--brand-experiment-55a: rgba(var(--accent-rgb), 0.55) !important;
|
|
--brand-experiment-60a: rgba(var(--accent-rgb), 0.6) !important;
|
|
--brand-experiment-65a: rgba(var(--accent-rgb), 0.65) !important;
|
|
--brand-experiment-70a: rgba(var(--accent-rgb), 0.7) !important;
|
|
--brand-experiment-75a: rgba(var(--accent-rgb), 0.75) !important;
|
|
--brand-experiment-80a: rgba(var(--accent-rgb), 0.8) !important;
|
|
--brand-experiment-85a: rgba(var(--accent-rgb), 0.85) !important;
|
|
--brand-experiment-90a: rgba(var(--accent-rgb), 0.9) !important;
|
|
--brand-experiment-95a: rgba(var(--accent-rgb), 0.95) !important;
|
|
}
|
|
|
|
[class^="appMount-"],
|
|
[class^="bg-"],
|
|
[class^="layers-"] > [class^="layer-"],
|
|
[class^="app-"] {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
html:not(.overlay) body {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
rect[fill="#43b581"],
|
|
path[fill="#43b581"],
|
|
rect[fill="#3ba55c"],
|
|
path[fill="#3ba55c"],
|
|
rect[fill="#23a55a"],
|
|
path[fill="#23a55a"],
|
|
rect[fill="rgba(67, 181, 129, 1)"],
|
|
rect[fill="rgba(59, 165, 92, 1)"],
|
|
rect[mask="url(#svg-mask-status-online)"][fill="#ffffff"],
|
|
rect[mask="url(#svg-mask-status-online-mobile)"][fill="#ffffff"],
|
|
rect[fill="hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%)"],
|
|
path[fill="hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%)"] {
|
|
fill: var(--status-online);
|
|
}
|
|
|
|
rect[fill="#faa61a"],
|
|
path[fill="#faa61a"],
|
|
rect[fill="#f0b232"],
|
|
path[fill="#f0b232"],
|
|
rect[fill="rgba(250, 166, 26, 1)"],
|
|
rect[mask="url(#svg-mask-status-idle)"][fill="#ffffff"],
|
|
rect[mask="url(#svg-mask-status-idle-mobile)"][fill="#ffffff"],
|
|
rect[fill="hsl(38, calc(var(--saturation-factor, 1) * 95.7%), 54.1%)"],
|
|
path[fill="hsl(38, calc(var(--saturation-factor, 1) * 95.7%), 54.1%)"] {
|
|
fill: var(--status-idle);
|
|
}
|
|
|
|
rect[fill="#f04747"],
|
|
path[fill="#f04747"],
|
|
rect[fill="#ed4245"],
|
|
path[fill="#ed4245"],
|
|
rect[fill="#f23f43"],
|
|
path[fill="#f23f43"],
|
|
rect[fill="rgba(240, 71, 71, 1)"],
|
|
rect[mask="url(#svg-mask-status-dnd)"][fill="#ffffff"],
|
|
rect[mask="url(#svg-mask-status-dnd-mobile)"][fill="#ffffff"],
|
|
rect[fill="hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%)"],
|
|
path[fill="hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%)"] {
|
|
fill: var(--status-dnd);
|
|
}
|
|
|
|
rect[fill="#747f8d"],
|
|
path[fill="#747f8d"],
|
|
rect[fill="#82858f"],
|
|
path[fill="#82858f"],
|
|
rect[fill="#80848e"],
|
|
path[fill="#80848e"],
|
|
rect[mask="url(#svg-mask-status-offline)"][fill="#ffffff"],
|
|
rect[mask="url(#svg-mask-status-offline-mobile)"][fill="#ffffff"],
|
|
rect[fill="hsl(214, calc(var(--saturation-factor, 1) * 9.9%), 50.4%)"] {
|
|
fill: var(--status-offline);
|
|
}
|
|
|
|
rect[fill="#593695"],
|
|
path[fill="#593695"],
|
|
rect[fill="rgba(89, 54, 149, 1)"],
|
|
rect[mask="url(#svg-mask-status-streaming)"][fill="#ffffff"],
|
|
rect[mask="url(#svg-mask-status-streaming-mobile)"][fill="#ffffff"],
|
|
rect[fill="hsl(262, calc(var(--saturation-factor, 1) * 46.8%), 39.8%)"] {
|
|
fill: var(--status-streaming);
|
|
}
|
|
|
|
[class^="containerDefault-"]:not(:hover):not([class*="selected-"])
|
|
[class*="modeUnread-"] svg[class^="icon-"],
|
|
[class^="containerDefault-"]:not(:hover):not([class*="selected-"])
|
|
[class*="modeUnread-"] [class^="name-"] {
|
|
color: var(--accent, var(--brand-new-500));
|
|
}
|
|
[class^="containerDefault-"] [class*="modeUnread-"] [class^="unread-"] {
|
|
background-color: var(--accent, var(--brand-new-500));
|
|
}
|
|
|
|
[class^="containerDefault-"]:not(:hover) [class*="modeSelected-"] svg[class^="icon-"] {
|
|
color: var(--interactive-active);
|
|
}
|
|
|
|
[class^="containerDefault-"]
|
|
[class*="iconVisibility-"]:hover
|
|
svg[class^="icon-"],
|
|
[class^="containerDefault-"]
|
|
[class*="iconVisibility-"]:hover
|
|
[class^="name-"],
|
|
[class^="wrapper-"]:hover
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="iconContainer-"]
|
|
> svg[class^="icon-"] {
|
|
color: var(--interactive-hover) !important;
|
|
}
|
|
|
|
[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-"]),
|
|
[class^="slider-"] [class^="bar-"] [class^="barFill-"],
|
|
[class^="control-"]
|
|
[class^="container-"][style*="background-color: rgb(67, 181, 129);"] {
|
|
background-color: var(--accent, var(--brand-new-500)) !important;
|
|
}
|
|
|
|
[style*="border-color: rgb(114, 137, 218)"],
|
|
[class*="lookOutlined-"][class*="colorBrand-"] {
|
|
border-color: var(--accent, var(--brand-new-500)) !important;
|
|
}
|
|
|
|
[class*="lookOutlined-"][class*="colorBrand-"],
|
|
[class*="colorDefault-"]:not([class*="focused-"]) [class^="checkbox-"],
|
|
[class*="colorDefault-"]:not([class*="focused-"]) [class^="radioSelection-"],
|
|
[class*="colorDefault-"][class*="focused-"] [class^="check-"] {
|
|
color: var(--accent, var(--brand-new-500)) !important;
|
|
}
|
|
|
|
[class*="mentioned-"]:before {
|
|
background-color: var(--accent, var(--brand-new-500));
|
|
}
|
|
|
|
[class^="slider-"] [class^="bar-"],
|
|
[class^="control-"]
|
|
[class^="container-"][style*="background-color: rgb(114, 118, 125);"] {
|
|
background-color: var(--background-secondary) !important;
|
|
}
|
|
|
|
.mention[class*="wrapper-"] {
|
|
color: var(--accent, var(--brand-new-500));
|
|
background: rgba(var(--accent-rgb), 0.1);
|
|
}
|
|
|
|
.mention[class*="wrapper-"]:hover {
|
|
color: #ffffff;
|
|
background: var(--accent, var(--brand-new-500));
|
|
}
|
|
|
|
[class*="mentioned-"] .mention.interactive:hover {
|
|
color: var(--accent, var(--brand-new-500)) !important;
|
|
}
|
|
|
|
[class^="mediaBarGrabber-"],
|
|
[class^="mediaBarProgress-"],
|
|
[class^="mediaBarProgress-"]:after,
|
|
[class^="mediaBarProgress-"]:before {
|
|
background-color: var(--accent, var(--brand-new-500)) !important;
|
|
}
|
|
|
|
[class^="reaction-"] {
|
|
background-color: var(--background-secondary);
|
|
border: none;
|
|
border-radius: 4px !important;
|
|
}
|
|
|
|
[class^="reaction-"]:hover,
|
|
[class^="reaction-"][class*="reactionMe-"] {
|
|
background-color: var(--highlight, var(--primary-dark-500));
|
|
}
|
|
|
|
[class^="reaction-"][class*="reactionMe-"] [class*="reactionCount-"],
|
|
[class^="reaction-"]:hover [class*="reactionCount-"] {
|
|
color: var(--white-500) !important;
|
|
}
|
|
|
|
[class^="reaction-"] [class*="reactionCount-"] {
|
|
color: var(--text, var(--text-normal));
|
|
}
|
|
|
|
[class*="progressBarHeader-"]
|
|
> [class^="container-"]:not([class*="checked-"]),
|
|
[class^="control-"] > [class^="container-"]:not([class*="checked-"]) {
|
|
background-color: var(--highlight) !important;
|
|
}
|
|
[class*="progressBarHeader-"] > [class^="container-"][class*="checked-"],
|
|
[class^="control-"] > [class^="container-"][class*="checked-"] {
|
|
background-color: var(--_color2) !important;
|
|
}
|
|
|
|
[class^="radioBar-"][style*="--radio-bar-accent-color:hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%);"] {
|
|
--radio-bar-accent-color: var(--_color2) !important;
|
|
}
|
|
[class^="radioBar-"][style*="--radio-bar-accent-color:hsl(37, calc(var(--saturation-factor, 1) * 81.2%), 43.9%);"] {
|
|
--radio-bar-accent-color: var(--_color3) !important;
|
|
}
|
|
[class^="radioBar-"][style*="--radio-bar-accent-color:hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%);"] {
|
|
--radio-bar-accent-color: var(--_color1) !important;
|
|
}
|
|
|
|
span[style*="background-color: hsl(235, calc(var(--saturation-factor, 1) * 85.6%), 64.7%);"] {
|
|
background-color: var(--accent, var(--brand-500)) !important;
|
|
}
|
|
span[style*="background-color: hsl(359, calc(var(--saturation-factor, 1) * 82.6%), 59.4%);"] {
|
|
background-color: var(--red, var(--status-red-500)) !important;
|
|
}
|
|
|
|
[class^="updateIconForeground-"] {
|
|
fill: var(--_color2);
|
|
}
|
|
|
|
[class*="tierHeaderLocked-"],
|
|
[class*="tierHeaderUnlocked-"] {
|
|
background-color: var(--background-secondary) !important;
|
|
}
|
|
|
|
[class*="tierAccomplished-"],
|
|
[class*="tierCurrent-"],
|
|
[class*="tierFirst-"] {
|
|
background: var(--_color13) !important;
|
|
}
|
|
|
|
[class^="progressWithSubscriptions-"] > svg > g > rect[class^="background-"] {
|
|
color: var(--background-secondary);
|
|
}
|
|
|
|
[class^="tierIcon-"],
|
|
[class^="unlockedIcon-"],
|
|
[class^="progressWithSubscriptions-"] > svg > g > rect[class^="foreground-"] {
|
|
color: var(--_color13) !important;
|
|
}
|
|
svg[fill="#FF73FA"] {
|
|
fill: var(--_color13) !important;
|
|
}
|
|
|
|
[class^="activeCircle-"] {
|
|
background-color: var(--_color2) !important;
|
|
}
|
|
|
|
[class*="allow-"][class*="selected-"] {
|
|
background-color: var(--status-positive) !important;
|
|
}
|
|
|
|
[class^="item-"][style*="background-color: hsl(139, calc(var(--saturation-factor, 1) * 47.3%), 43.9%);"] {
|
|
background-color: var(--_color2) !important;
|
|
}
|
|
|
|
[class*="unreadBar-"][class*="mention-"],
|
|
[class^="numberBadge-"] {
|
|
background-color: var(--red, var(--status-red-500)) !important;
|
|
}
|
|
|
|
[class*="bar-"][class*="mention-"] {
|
|
background-color: var(--red, var(--status-red-500));
|
|
}
|
|
|
|
a[class^="anchor-"]:not([aria-controls^="popout_"]) {
|
|
color: var(--text-link) !important;
|
|
}
|
|
|
|
.theme-light [class*="button-"][class*="lookFilled-"][class*="colorPrimary-"] {
|
|
color: var(--text) !important;
|
|
}
|
|
|
|
.postnet-repo-wrapper,
|
|
.postnet-expanded-category {
|
|
border-color: var(--background-tertiary) !important;
|
|
background: var(--deprecated-card-bg) !important;
|
|
}
|
|
|
|
[class^="markdown-"] [class^="codeInline-"],
|
|
code.inline,
|
|
.hljs {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
[class^="markdown-"] code,
|
|
.hljs {
|
|
background: var(--background-secondary) !important;
|
|
}
|
|
.hljs-keyword {
|
|
color: var(--_color5) !important;
|
|
}
|
|
.hljs-built_in {
|
|
color: var(--_color6) !important;
|
|
}
|
|
.hljs-type {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-literal {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-number {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-regexp {
|
|
color: var(--_color6) !important;
|
|
}
|
|
.hljs-string {
|
|
color: var(--_color2) !important;
|
|
}
|
|
.hljs-subst {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-symbol {
|
|
color: var(--_color5) !important;
|
|
}
|
|
.hljs-class {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-function {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-title {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-params {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-comment {
|
|
color: var(--highlight) !important;
|
|
}
|
|
.hljs-doctag {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-meta {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-meta-keyword {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-meta-string {
|
|
color: var(--_color2) !important;
|
|
}
|
|
.hljs-section {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-tag {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-name {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-builtin-name {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-attr {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-attribute {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-variable {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-bullet {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-code {
|
|
color: var(--_color2) !important;
|
|
}
|
|
.hljs-emphasis {
|
|
color: var(--_color5) !important;
|
|
}
|
|
.hljs-strong {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-formula {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-link {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-quote {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-selector-tag {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-selector-id {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-selector-class {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-selector-attr {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-selector-pseudo {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-template-tag {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-template-variable {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-addition {
|
|
color: #a6e22e !important;
|
|
background: #384c10 !important;
|
|
}
|
|
.hljs-deletion {
|
|
color: #f92672 !important;
|
|
background: #4c0c23 !important;
|
|
}
|
|
.hljs-operator {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-pattern-match {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-typing {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-constructor {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-module-access {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-module {
|
|
color: var(--_colorFG) !important;
|
|
}
|
|
.hljs-ansi-foreground-black [class^="hljs-ansi-background-"],
|
|
.hljs-ansi-foreground-black {
|
|
color: var(--_color0) !important;
|
|
}
|
|
.hljs-ansi-foreground-red {
|
|
color: var(--_color1) !important;
|
|
}
|
|
.hljs-ansi-foreground-green {
|
|
color: var(--_color2) !important;
|
|
}
|
|
.hljs-ansi-foreground-yellow {
|
|
color: var(--_color3) !important;
|
|
}
|
|
.hljs-ansi-foreground-blue {
|
|
color: var(--_color4) !important;
|
|
}
|
|
.hljs-ansi-foreground-magenta {
|
|
color: var(--_color5) !important;
|
|
}
|
|
.hljs-ansi-foreground-cyan {
|
|
color: var(--_color6) !important;
|
|
}
|
|
.hljs-ansi-foreground-white [class^="hljs-ansi-background-"],
|
|
.hljs-ansi-foreground-white {
|
|
color: var(--_color7) !important;
|
|
}
|
|
.hljs-ansi-foreground-black .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-black.hljs-ansi-style-bold {
|
|
color: var(--_color8) !important;
|
|
}
|
|
.hljs-ansi-foreground-red .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-red.hljs-ansi-style-bold {
|
|
color: var(--_color9) !important;
|
|
}
|
|
.hljs-ansi-foreground-green .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-green.hljs-ansi-style-bold {
|
|
color: var(--_color10) !important;
|
|
}
|
|
.hljs-ansi-foreground-yellow .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-yellow.hljs-ansi-style-bold {
|
|
color: var(--_color11) !important;
|
|
}
|
|
.hljs-ansi-foreground-blue .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-blue.hljs-ansi-style-bold {
|
|
color: var(--_color12) !important;
|
|
}
|
|
.hljs-ansi-foreground-magenta .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-magenta.hljs-ansi-style-bold {
|
|
color: var(--_color13) !important;
|
|
}
|
|
.hljs-ansi-foreground-cyan .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-cyan.hljs-ansi-style-bold {
|
|
color: var(--_color14) !important;
|
|
}
|
|
.hljs-ansi-foreground-white .hljs-ansi-style-bold,
|
|
.hljs-ansi-foreground-white.hljs-ansi-style-bold {
|
|
color: var(--_color15) !important;
|
|
}
|
|
.hljs-ansi-background-black {
|
|
background-color: var(--_color0) !important;
|
|
}
|
|
.hljs-ansi-background-red {
|
|
background-color: var(--_color1) !important;
|
|
}
|
|
.hljs-ansi-background-green {
|
|
background-color: var(--_color2) !important;
|
|
}
|
|
.hljs-ansi-background-yellow {
|
|
background-color: var(--_color3) !important;
|
|
}
|
|
.hljs-ansi-background-blue {
|
|
background-color: var(--_color4) !important;
|
|
}
|
|
.hljs-ansi-background-magenta {
|
|
background-color: var(--_color5) !important;
|
|
}
|
|
.hljs-ansi-background-cyan {
|
|
background-color: var(--_color6) !important;
|
|
}
|
|
.hljs-ansi-background-white {
|
|
background-color: var(--_color7) !important;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_scheme 'Color Scheme: Dark' {
|
|
'Stock': `.theme-dark {
|
|
--_color0: #0d1117;
|
|
--_color1: #ff7b72;
|
|
--_color2: #3fb950;
|
|
--_color3: #d29922;
|
|
--_color4: #58a6ff;
|
|
--_color5: #bc8cff;
|
|
--_color6: #76e3ea;
|
|
--_color7: #b1bac4;
|
|
|
|
--_color8: #161b22;
|
|
--_color9: #ffa198;
|
|
--_color10: #56d364;
|
|
--_color11: #e3b341;
|
|
--_color12: #79c0ff;
|
|
--_color13: #d2a8ff;
|
|
--_color14: #b3f0ff;
|
|
--_color15: #f0f6fc;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #36393f;
|
|
--secondary: #2f3136;
|
|
--tertiary: #202225;
|
|
--primary-rgb: 54, 57, 63;
|
|
--secondary-rgb: 47, 49, 54;
|
|
--tertiary-rgb: 32, 34, 37;
|
|
|
|
--accent: #7289da;
|
|
--accent-rgb: 114, 137, 218;
|
|
--red: #f04747;
|
|
--text: #dcddde;
|
|
--link: #00aff4;
|
|
--highlight: #72767d;
|
|
--highlight-rgb: 114, 118, 125;
|
|
|
|
--status-online: #43b581;
|
|
--status-idle: #faa61a;
|
|
--status-dnd: #f04747;
|
|
--status-offline: #747f8d;
|
|
--status-streaming: #593695;
|
|
|
|
--titlebar-color: var(--highlight);
|
|
}
|
|
|
|
#splash {
|
|
background-color: #36393f;
|
|
}`,
|
|
'XMC*': `.theme-dark {
|
|
--_color0: #0d1117;
|
|
--_color1: #ff7b72;
|
|
--_color2: #3fb950;
|
|
--_color3: #d29922;
|
|
--_color4: #58a6ff;
|
|
--_color5: #bc8cff;
|
|
--_color6: #76e3ea;
|
|
--_color7: #b1bac4;
|
|
|
|
--_color8: #161b22;
|
|
--_color9: #ffa198;
|
|
--_color10: #56d364;
|
|
--_color11: #e3b341;
|
|
--_color12: #79c0ff;
|
|
--_color13: #d2a8ff;
|
|
--_color14: #b3f0ff;
|
|
--_color15: #f0f6fc;
|
|
|
|
--_colorFG: #bbc5ff;
|
|
|
|
--primary: #2c2c2c;
|
|
--secondary: #282828;
|
|
--tertiary: #212121;
|
|
--primary-rgb: 43, 43, 43;
|
|
--secondary-rgb: 41, 41, 41;
|
|
--tertiary-rgb: 33, 33, 33;
|
|
|
|
--accent: #58516d;
|
|
--accent-rgb: 88, 81, 109;
|
|
--red: var(--_color1);
|
|
--text: #d2d2c8;
|
|
--link: var(--_color6);
|
|
--highlight: #404040;
|
|
--highlight-rgb: 64, 64, 64;
|
|
|
|
--status-online: var(--_color4);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: var(--accent);
|
|
}
|
|
|
|
#splash {
|
|
background-color: #2c2c2c;
|
|
}`,
|
|
'Amora': `.theme-dark {
|
|
--_color0: #231d29;
|
|
--_color1: #e83f80;
|
|
--_color2: #a2baa8;
|
|
--_color3: #eacac0;
|
|
--_color4: #9985d1;
|
|
--_color5: #e68ac1;
|
|
--_color6: #aabae7;
|
|
--_color7: #dedbeb;
|
|
|
|
--_color8: #302838;
|
|
--_color9: #f55d8f;
|
|
--_color10: #bfd1c3;
|
|
--_color11: #f0ddd8;
|
|
--_color12: #b4a4de;
|
|
--_color13: #edabd2;
|
|
--_color14: #c4d1f5;
|
|
--_color15: #edebf7;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #302838;
|
|
--secondary: #2a2331;
|
|
--tertiary: #231d29;
|
|
--primary-rgb: 48, 40, 56;
|
|
--secondary-rgb: 42, 35, 49;
|
|
--tertiary-rgb: 35, 29, 41;
|
|
|
|
--accent: var(--_color1);
|
|
--accent-rgb: 232, 63, 128;
|
|
--red: var(--_color6);
|
|
--text: var(--_color7);
|
|
--link: var(--_color10);
|
|
--highlight: #634e75;
|
|
--highlight-rgb: 99, 78, 117;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color5);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color4);
|
|
}
|
|
|
|
#splash {
|
|
background-color: #302838;
|
|
}`,
|
|
'Amora Focus': `.theme-dark {
|
|
--_color0: #2d2d2d;
|
|
--_color1: #e83f80;
|
|
--_color2: #a2baa8;
|
|
--_color3: #eacac0;
|
|
--_color4: #9985d1;
|
|
--_color5: #e68ac1;
|
|
--_color6: #aabae7;
|
|
--_color7: #dedbeb;
|
|
|
|
--_color8: #383838;
|
|
--_color9: #f55d8f;
|
|
--_color10: #bfd1c3;
|
|
--_color11: #f0ddd8;
|
|
--_color12: #b4a4de;
|
|
--_color13: #edabd2;
|
|
--_color14: #c4d1f5;
|
|
--_color15: #edebf7;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #1a1a1a;
|
|
--secondary: #171717;
|
|
--secondary-alt: #151515;
|
|
--tertiary: #141414;
|
|
--primary-rgb: 26, 26, 26;
|
|
--secondary-rgb: 23, 23, 23;
|
|
--secondary-alt-rgb: 21, 21, 21;
|
|
--tertiary-rgb: 20, 20, 20;
|
|
|
|
--accent: #634e75;
|
|
--accent-rgb: 99, 78, 117;
|
|
--red: var(--_color6);
|
|
--text: var(--_color7);
|
|
--link: var(--_color10);
|
|
--highlight: #5c5c5c;
|
|
--highlight-rgb: 92, 92, 92;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color5);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color4);
|
|
|
|
--titlebar-color: var(--accent);
|
|
--wc-bright: #383838;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #1a1a1a;
|
|
}`,
|
|
'Gruvbox': `.theme-dark {
|
|
--_color0: #32302f;
|
|
--_color1: #cc241d;
|
|
--_color2: #98971a;
|
|
--_color3: #d79921;
|
|
--_color4: #458588;
|
|
--_color5: #b16286;
|
|
--_color6: #689d6a;
|
|
--_color7: #a89984;
|
|
|
|
--_color8: #1d2021;
|
|
--_color9: #fb4934;
|
|
--_color10: #b8bb26;
|
|
--_color11: #fabd2f;
|
|
--_color12: #83a598;
|
|
--_color13: #d3869b;
|
|
--_color14: #8ec07c;
|
|
--_color15: #ebdbb2;
|
|
|
|
--_colorFG: #d5c4a1;
|
|
|
|
--primary: #32302f;
|
|
--secondary: #282828;
|
|
--tertiary: #1d2021;
|
|
--primary-rgb: 50, 48, 47;
|
|
--secondary-rgb: 40, 40, 40;
|
|
--tertiary-rgb: 29, 32, 33;
|
|
|
|
--accent: var(--_color5);
|
|
--accent-rgb: 177, 98, 134;
|
|
--red: var(--_color9);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #665c54;
|
|
--highlight-rgb: 102, 92, 84;
|
|
|
|
--status-online: var(--_color10);
|
|
--status-idle: var(--_color11);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color13);
|
|
}
|
|
|
|
#splash {
|
|
background-color: #32302f;
|
|
}`,
|
|
'AMOLED': `.theme-dark {
|
|
--_color0: #484f58;
|
|
--_color1: #f85149;
|
|
--_color2: #3fb950;
|
|
--_color3: #d29922;
|
|
--_color4: #58a6ff;
|
|
--_color5: #bc8cff;
|
|
--_color6: #39c5cf;
|
|
--_color7: #b1bac4;
|
|
|
|
--_color8: #6e7681;
|
|
--_color9: #ff7b72;
|
|
--_color10: #56d364;
|
|
--_color11: #e3b341;
|
|
--_color12: #79c0ff;
|
|
--_color13: #d2a8ff;
|
|
--_color14: #56d4dd;
|
|
--_color15: #f0f6fc;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #000000;
|
|
--secondary: #000000;
|
|
--tertiary: #000000;
|
|
--primary-rgb: 0, 0, 0;
|
|
--secondary-rgb: 0, 0, 0;
|
|
--tertiary-rgb: 0, 0, 0;
|
|
|
|
--accent: #9c4249;
|
|
--accent-rgb: 111, 47, 49;
|
|
--red: #f04747;
|
|
--text: #dcddde;
|
|
--link: #50f148;
|
|
--highlight: #232323;
|
|
--highlight-rgb: 35, 35, 35;
|
|
|
|
--status-online: #43b581;
|
|
--status-idle: #faa61a;
|
|
--status-dnd: #f04747;
|
|
--status-offline: #747f8d;
|
|
--status-streaming: #593695;
|
|
|
|
--titlebar-color: #060606;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #000000;
|
|
}`,
|
|
'Nord': `.theme-dark {
|
|
--_color0: #3b4252;
|
|
--_color1: #bf616a;
|
|
--_color2: #a3be8c;
|
|
--_color3: #ebcb8b;
|
|
--_color4: #81a1c1;
|
|
--_color5: #b48ead;
|
|
--_color6: #88c0d0;
|
|
--_color7: #e5e9f0;
|
|
|
|
--_color8: #4c566a;
|
|
--_color9: #bf616a;
|
|
--_color10: #a3be8c;
|
|
--_color11: #ebcb8b;
|
|
--_color12: #81a1c1;
|
|
--_color13: #b48ead;
|
|
--_color14: #88c0d0;
|
|
--_color15: #eceff4;
|
|
|
|
--_colorFG: #cdd3dd;
|
|
|
|
--primary: #434c5e;
|
|
--secondary: #3b4252;
|
|
--tertiary: #2e3440;
|
|
--primary-rgb: 67, 76, 94;
|
|
--secondary-rgb: 59, 66, 82;
|
|
--tertiary-rgb: 46, 52, 64;
|
|
|
|
--accent: #88c0d0;
|
|
--accent-rgb: 136, 192, 208;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #8fbcbb;
|
|
--highlight-rgb: 143, 188, 187;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #4c566a;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #434c5e;
|
|
}`,
|
|
'lovelace': `.theme-dark {
|
|
--_color0: #282a36;
|
|
--_color1: #f37f97;
|
|
--_color2: #5adecd;
|
|
--_color3: #f2a272;
|
|
--_color4: #8897f4;
|
|
--_color5: #c574dd;
|
|
--_color6: #79e6f3;
|
|
--_color7: #fdfdfd;
|
|
|
|
--_color8: #414458;
|
|
--_color9: #ff4971;
|
|
--_color10: #18e3c8;
|
|
--_color11: #ff8037;
|
|
--_color12: #556fff;
|
|
--_color13: #b043d1;
|
|
--_color14: #3fdcee;
|
|
--_color15: #bebec1;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--secondary: #1d1f28;
|
|
--primary: #282a36;
|
|
--tertiary: #141721;
|
|
--primary-rgb: 29, 31, 40;
|
|
--secondary-rgb: 40, 42, 54;
|
|
--tertiary-rgb: 20, 23, 33;
|
|
|
|
--accent: var(--_color5);
|
|
--accent-rgb: 197, 116, 221;
|
|
--red: var(--_color1);
|
|
--text: var(--_color7);
|
|
--link: var(--_color12);
|
|
--highlight: var(--_color8);
|
|
--highlight-rgb: 65, 68, 88;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color9);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--interactive-hover: var(--_color6) !important;
|
|
--interactive-active: var(--_color7) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #1d1f28;
|
|
}`,
|
|
'Catppuccin Frappe': `.theme-dark {
|
|
--_color0: #51576d;
|
|
--_color1: #e78284;
|
|
--_color2: #a6d189;
|
|
--_color3: #e5c890;
|
|
--_color4: #8caaee;
|
|
--_color5: #f4b8e4;
|
|
--_color6: #81c8be;
|
|
--_color7: #b5bfe2;
|
|
|
|
--_color8: #626880;
|
|
--_color9: #e78284;
|
|
--_color10: #a6d189;
|
|
--_color11: #e5c890;
|
|
--_color12: #8caaee;
|
|
--_color13: #f4b8e4;
|
|
--_color14: #81c8be;
|
|
--_color15: #a5adce;
|
|
|
|
--_colorFG: #c6d0f5;
|
|
|
|
--primary: #303446;
|
|
--secondary: #292c3c;
|
|
--tertiary: #232634;
|
|
--primary-rgb: 48, 52, 70;
|
|
--secondary-rgb: 41, 44, 60;
|
|
--tertiary-rgb: 35, 38, 52;
|
|
|
|
--accent: #8caaee;
|
|
--accent-rgb: 140, 170, 238;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color14);
|
|
--highlight: #a5adce;
|
|
--highlight-rgb: 165, 173, 206;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #414559;
|
|
|
|
--interactive-hover: var(--_color6) !important;
|
|
--interactive-active: var(--_color7) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #303446;
|
|
}`,
|
|
'Catppuccin Macchiato': `.theme-dark {
|
|
--_color0: #494d64;
|
|
--_color1: #ed8796;
|
|
--_color2: #a6da95;
|
|
--_color3: #eed49f;
|
|
--_color4: #8aadf4;
|
|
--_color5: #f5bde6;
|
|
--_color6: #8bd5ca;
|
|
--_color7: #b8c0e0;
|
|
|
|
--_color8: #5b6078;
|
|
--_color9: #ed8796;
|
|
--_color10: #a6da95;
|
|
--_color11: #eed49f;
|
|
--_color12: #8aadf4;
|
|
--_color13: #f5bde6;
|
|
--_color14: #8bd5ca;
|
|
--_color15: #a5adcb;
|
|
|
|
--_colorFG: #cad3f5;
|
|
|
|
--primary: #24273a;
|
|
--secondary: #1e2030;
|
|
--tertiary: #181926;
|
|
--primary-rgb: 36, 39, 58;
|
|
--secondary-rgb: 30, 32, 48;
|
|
--tertiary-rgb: 35, 38, 52;
|
|
|
|
--accent: #8aadf4;
|
|
--accent-rgb: 138, 173, 244;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color14);
|
|
--highlight: #a5adcb;
|
|
--highlight-rgb: 165, 173, 203;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #363a4f;
|
|
|
|
--interactive-hover: var(--_color6) !important;
|
|
--interactive-active: var(--_color7) !important;
|
|
|
|
}
|
|
|
|
#splash {
|
|
background-color: #24273a;
|
|
}`,
|
|
'Catppuccin Mocha': `.theme-dark {
|
|
--_color0: #45475a;
|
|
--_color1: #f38ba8;
|
|
--_color2: #a6e3a1;
|
|
--_color3: #f9e2af;
|
|
--_color4: #89b4fa;
|
|
--_color5: #f5c2e7;
|
|
--_color6: #94e2d5;
|
|
--_color7: #bac2de;
|
|
|
|
--_color8: #585b70;
|
|
--_color9: #f38ba8;
|
|
--_color10: #a6e3a1;
|
|
--_color11: #f9e2af;
|
|
--_color12: #89b4fa;
|
|
--_color13: #f5c2e7;
|
|
--_color14: #94e2d5;
|
|
--_color15: #a6adc8;
|
|
|
|
--_colorFG: #cdd6f4;
|
|
|
|
--primary: #1e1e2e;
|
|
--secondary: #181825;
|
|
--tertiary: #11111b;
|
|
--primary-rgb: 30, 30, 46;
|
|
--secondary-rgb: 24, 24, 37;
|
|
--tertiary-rgb: 17, 17, 27;
|
|
|
|
--accent: #89b4fa;
|
|
--accent-rgb: 137, 180, 250;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color14);
|
|
--highlight: #a6adc8;
|
|
--highlight-rgb: 166, 173, 200;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #313244;
|
|
|
|
--background-mentioned: rgba(137, 180, 250, 0.2) !important;
|
|
--background-mentioned-hover: rgba(137, 180, 250, 0.15) !important;
|
|
--background-modifier-accent: rgba(137, 180, 250, 0.25) !important;
|
|
--background-modifier-active: rgba(205, 214, 244, 0.16) !important;
|
|
--background-modifier-hover: rgba(137, 180, 250, 0.08) !important;
|
|
--background-modifier-selected: rgba(137, 180, 250, 0.24) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #1e1e2e;
|
|
}`,
|
|
'annie/dark': `.theme-dark {
|
|
--_color0: #484f58;
|
|
--_color1: #f85149;
|
|
--_color2: #3fb950;
|
|
--_color3: #d29922;
|
|
--_color4: #58a6ff;
|
|
--_color5: #bc8cff;
|
|
--_color6: #39c5cf;
|
|
--_color7: #b1bac4;
|
|
|
|
--_color8: #6e7681;
|
|
--_color9: #ff7b72;
|
|
--_color10: #56d364;
|
|
--_color11: #e3b341;
|
|
--_color12: #79c0ff;
|
|
--_color13: #d2a8ff;
|
|
--_color14: #56d4dd;
|
|
--_color15: #f0f6fc;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #141414;
|
|
--secondary: #111111;
|
|
--tertiary: #0c0c0c;
|
|
--primary-rgb: 20, 20, 20;
|
|
--secondary-rgb: 17, 17, 17;
|
|
--tertiary-rgb: 12, 12, 12;
|
|
|
|
--accent: #7289da;
|
|
--accent-rgb: 114, 137, 218;
|
|
--red: #f04747;
|
|
--text: #dcddde;
|
|
--link: #00aff4;
|
|
--highlight: #747474;
|
|
--highlight-rgb: 116, 116, 116;
|
|
|
|
--status-online: #43b581;
|
|
--status-idle: #faa61a;
|
|
--status-dnd: #f04747;
|
|
--status-offline: #747f8d;
|
|
--status-streaming: #593695;
|
|
|
|
--titlebar-color: var(--tertiary);
|
|
}
|
|
|
|
#splash {
|
|
background-color: #141414;
|
|
}`,
|
|
'everforest': `.theme-dark {
|
|
--_color0: #7a8478;
|
|
--_color1: #e67e80;
|
|
--_color2: #a7c080;
|
|
--_color3: #dbbc7f;
|
|
--_color4: #7fbbb3;
|
|
--_color5: #d699b6;
|
|
--_color6: #83c092;
|
|
--_color7: #d3c6aa;
|
|
|
|
--_color8: #5c6a72;
|
|
--_color9: #f85552;
|
|
--_color10: #8da101;
|
|
--_color11: #dfa000;
|
|
--_color12: #3a94c5;
|
|
--_color13: #df69ba;
|
|
--_color14: #35a77c;
|
|
--_color15: #9da9a0;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #323c41;
|
|
--secondary: #2b3339;
|
|
--tertiary: #1e2327;
|
|
--primary-rgb: 50, 60, 65;
|
|
--secondary-rgb: 43, 51, 57;
|
|
--tertiary-rgb: 30, 35, 39;
|
|
|
|
--accent: var(--_color2);
|
|
--accent-rgb: 167, 192, 128;
|
|
--red: var(--_color1);
|
|
--text: var(--_color7);
|
|
--link: var(--_color12);
|
|
--highlight: var(--_color0);
|
|
--highlight-rgb: 122, 132, 120;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--interactive-hover: var(--_color6) !important;
|
|
--interactive-active: var(--_color15) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #323c41;
|
|
}`,
|
|
'Tokyo Night': `.theme-dark {
|
|
--_color0: #32344a;
|
|
--_color1: #f7768e;
|
|
--_color2: #9ece6a;
|
|
--_color3: #e0af68;
|
|
--_color4: #7aa2f7;
|
|
--_color5: #ad8ee6;
|
|
--_color6: #449dab;
|
|
--_color7: #787c99;
|
|
|
|
--_color8: #444b6a;
|
|
--_color9: #ff7a93;
|
|
--_color10: #b9f27c;
|
|
--_color11: #ff9e64;
|
|
--_color12: #7da6ff;
|
|
--_color13: #bb9af7;
|
|
--_color14: #0db9d7;
|
|
--_color15: #acb0d0;
|
|
|
|
--_colorFG: #a9b1d6;
|
|
|
|
--primary: #1a1b26;
|
|
--secondary: #16161e;
|
|
--tertiary: #101014;
|
|
--primary-rgb: 26, 27, 38;
|
|
--secondary-rgb: 22, 22, 30;
|
|
--tertiary-rgb: 16, 16, 20;
|
|
|
|
--accent: #3d59a1;
|
|
--accent-rgb: 61, 89, 161;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #565f89;
|
|
--highlight-rgb: 86, 95, 137;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--interactive-hover: var(--_color4) !important;
|
|
--interactive-active: var(--_color15) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #1a1b26;
|
|
}`,
|
|
'Valve': `.theme-dark {
|
|
--_color0: #3c4635;
|
|
--_color1: #aa0000;
|
|
--_color2: #4d7455;
|
|
--_color3: #cf6a32;
|
|
--_color4: #476291;
|
|
--_color5: #8650ac;
|
|
--_color6: #5e98d9;
|
|
--_color7: #837e77;
|
|
|
|
--_color8: #4c5844;
|
|
--_color9: #eb4b4b;
|
|
--_color10: #70b04a;
|
|
--_color11: #ffd700;
|
|
--_color12: #4b69ff;
|
|
--_color13: #8847ff;
|
|
--_color14: #38f3ab;
|
|
--_color15: #b2b2b2;
|
|
|
|
--_colorFG: #ffffff;
|
|
|
|
--primary: #4c5844;
|
|
--secondary: #3c4635;
|
|
--tertiary: #282e22;
|
|
--primary-rgb: 76, 88, 68;
|
|
--secondary-rgb: 60, 70, 53;
|
|
--tertiary-rgb: 40, 46, 34;
|
|
|
|
--accent: #958831;
|
|
--accent-rgb: 150, 137, 49;
|
|
--red: var(--_color9);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #889180;
|
|
--highlight-rgb: 137, 145, 130;
|
|
|
|
--status-online: var(--_color10);
|
|
--status-idle: var(--_color11);
|
|
--status-dnd: var(--_color9);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--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 {
|
|
background-color: #4c5844;
|
|
}`,
|
|
'Source Engine - Tools': `.theme-dark {
|
|
--_color0: #3c4635;
|
|
--_color1: #aa0000;
|
|
--_color2: #4d7455;
|
|
--_color3: #cf6a32;
|
|
--_color4: #476291;
|
|
--_color5: #8650ac;
|
|
--_color6: #5e98d9;
|
|
--_color7: #837e77;
|
|
|
|
--_color8: #4c5844;
|
|
--_color9: #eb4b4b;
|
|
--_color10: #70b04a;
|
|
--_color11: #ffd700;
|
|
--_color12: #4b69ff;
|
|
--_color13: #8847ff;
|
|
--_color14: #38f3ab;
|
|
--_color15: #b2b2b2;
|
|
|
|
--_colorFG: #d9d9d9;
|
|
|
|
--primary: #404040;
|
|
--secondary: #343434;
|
|
--tertiary: #2c2c2c;
|
|
--primary-rgb: 64, 64, 64;
|
|
--secondary-rgb: 52, 52, 52;
|
|
--tertiary-rgb: 44, 44, 44;
|
|
|
|
--accent: #ff9a1e;
|
|
--accent-rgb: 255, 154, 30;
|
|
--red: var(--_color9);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #b5b5b5;
|
|
--highlight-rgb: 181, 181, 181;
|
|
|
|
--status-online: var(--_color10);
|
|
--status-idle: var(--_color11);
|
|
--status-dnd: var(--_color9);
|
|
--status-offline: var(--highlight);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--status-danger: var(--red) !important;
|
|
--interactive-active: var(--white-500) !important;
|
|
--interactive-hover: var(--white-500) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: #404040;
|
|
}`,
|
|
'Custom': `.theme-dark,:root {
|
|
--_color0: var(--xmc-custom-color0);
|
|
--_color1: var(--xmc-custom-color1);
|
|
--_color2: var(--xmc-custom-color2);
|
|
--_color3: var(--xmc-custom-color3);
|
|
--_color4: var(--xmc-custom-color4);
|
|
--_color5: var(--xmc-custom-color5);
|
|
--_color6: var(--xmc-custom-color6);
|
|
--_color7: var(--xmc-custom-color7);
|
|
|
|
--_color8: var(--xmc-custom-color8);
|
|
--_color9: var(--xmc-custom-color9);
|
|
--_color10: var(--xmc-custom-color10);
|
|
--_color11: var(--xmc-custom-color11);
|
|
--_color12: var(--xmc-custom-color12);
|
|
--_color13: var(--xmc-custom-color13);
|
|
--_color14: var(--xmc-custom-color14);
|
|
--_color15: var(--xmc-custom-color15);
|
|
|
|
--_colorFG: var(--xmc-custom-foreground);
|
|
|
|
--primary: var(--xmc-custom-primary);
|
|
--secondary: var(--xmc-custom-secondary);
|
|
--tertiary: var(--xmc-custom-tertiary);
|
|
--primary-rgb: var(--xmc-custom-primary-rgb);
|
|
--secondary-rgb: var(--xmc-custom-primary-rgb);
|
|
--tertiary-rgb: var(--xmc-custom-primary-rgb);
|
|
|
|
--accent: var(--xmc-custom-accent);
|
|
--accent-rgb: var(--xmc-custom-accent-rgb);
|
|
--red: var(--xmc-custom-red);
|
|
--text: var(--xmc-custom-text);
|
|
--link: var(--xmc-custom-link);
|
|
--highlight: var(--xmc-custom-highlight);
|
|
--highlight-rgb: var(--xmc-custom-highlight-rgb);
|
|
|
|
--status-online: var(--xmc-custom-status-online);
|
|
--status-idle: var(--xmc-custom-status-idle);
|
|
--status-dnd: var(--xmc-custom-status-dnd);
|
|
--status-offline: var(--xmc-custom-status-offline);
|
|
--status-streaming: var(--xmc-custom-status-streaming);
|
|
|
|
--interactive-hover: var(--xmc-custom-hover) !important;
|
|
--interactive-active: var(--xmc-custom-active) !important;
|
|
}
|
|
|
|
#splash {
|
|
background-color: var(--xmc-custom-primary, #36393f);
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_scheme_light 'Color Scheme: Light' {
|
|
'Stock': `.theme-light {
|
|
--_color0: #24292f;
|
|
--_color1: #ff8182;
|
|
--_color2: #4ac26b;
|
|
--_color3: #d4a72c;
|
|
--_color4: #54aeff;
|
|
--_color5: #c297ff;
|
|
--_color6: #76e3ea;
|
|
--_color7: #8c959f;
|
|
|
|
--_color8: #32383f;
|
|
--_color9: #ffaba8;
|
|
--_color10: #6fdd8b;
|
|
--_color11: #eac54f;
|
|
--_color12: #80ccff;
|
|
--_color13: #d8b9ff;
|
|
--_color14: #b3f0ff;
|
|
--_color15: #d0d7de;
|
|
|
|
--_colorFG: var(--_color7);
|
|
|
|
--primary: #ffffff;
|
|
--secondary: #f2f3f5;
|
|
--tertiary: #e3e5e8;
|
|
--primary-rgb: 255, 255, 255;
|
|
--secondary-rgb: 242, 243, 245;
|
|
--tertiary-rgb: 227, 229, 232;
|
|
|
|
--accent: #7289da;
|
|
--accent-rgb: 114, 137, 218;
|
|
--red: #f04747;
|
|
--text: #303338;
|
|
--link: #00aff4;
|
|
--highlight: #72767d;
|
|
--highlight-rgb: 114, 118, 125;
|
|
|
|
--status-online: #43b581;
|
|
--status-idle: #faa61a;
|
|
--status-dnd: #f04747;
|
|
--status-offline: #747f8d;
|
|
--status-streaming: #593695;
|
|
|
|
--titlebar-color: var(--highlight);
|
|
|
|
--interactive-active: #060607 !important;
|
|
}`,
|
|
'XMC*': `.theme-light {
|
|
--_color0: #24292f;
|
|
--_color1: #ff8182;
|
|
--_color2: #4ac26b;
|
|
--_color3: #d4a72c;
|
|
--_color4: #54aeff;
|
|
--_color5: #c297ff;
|
|
--_color6: #76e3ea;
|
|
--_color7: #8c959f;
|
|
|
|
--_color8: #32383f;
|
|
--_color9: #ffaba8;
|
|
--_color10: #6fdd8b;
|
|
--_color11: #eac54f;
|
|
--_color12: #80ccff;
|
|
--_color13: #d8b9ff;
|
|
--_color14: #b3f0ff;
|
|
--_color15: #d0d7de;
|
|
|
|
--_colorFG: #373737;
|
|
|
|
--primary: #fcfcf9;
|
|
--secondary: #f4f4f1;
|
|
--tertiary: #dcdace;
|
|
--primary-rgb: 252, 252, 249;
|
|
--secondary-rgb: 244, 244, 241;
|
|
--tertiary-rgb: 220, 218, 206;
|
|
|
|
--accent: #58516d;
|
|
--accent-rgb: 88, 81, 109;
|
|
--red: var(--_color1);
|
|
--text: #373737;
|
|
--link: var(--_color6);
|
|
--highlight: #b0aca5;
|
|
--highlight-rgb: 176, 172, 165;
|
|
|
|
--status-online: var(--_color4);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: var(--accent);
|
|
--interactive-hover: #494949 !important;
|
|
--interactive-active: #7a7a7a !important;
|
|
}`,
|
|
'Gruvbox': `.theme-light {
|
|
--_color0: #f2e5bc;
|
|
--_color1: #cc241d;
|
|
--_color2: #98971a;
|
|
--_color3: #d79921;
|
|
--_color4: #458588;
|
|
--_color5: #b16286;
|
|
--_color6: #689d6a;
|
|
--_color7: #7c6f64;
|
|
|
|
--_color8: #f9f5d7;
|
|
--_color9: #9d0006;
|
|
--_color10: #79740e;
|
|
--_color11: #b57614;
|
|
--_color12: #076678;
|
|
--_color13: #8f3f71;
|
|
--_color14: #427b58;
|
|
--_color15: #3c3836;
|
|
|
|
--_colorFG: #504945;
|
|
|
|
--primary: #f9f5d7;
|
|
--secondary: #fbf1c7;
|
|
--tertiary: #f2e5bc;
|
|
--primary-rgb: 242, 229, 187;
|
|
--secondary-rgb: 251, 241, 199;
|
|
--tertiary-rgb: 250, 246, 214;
|
|
|
|
--accent: var(--_color5);
|
|
--accent-rgb: 177, 98, 134;
|
|
--red: var(--_color9);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #bdae93;
|
|
--highlight-rgb: 189, 174, 147;
|
|
|
|
--status-online: var(--_color10);
|
|
--status-idle: var(--_color11);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color13);
|
|
}`,
|
|
'Nord': `.theme-light {
|
|
--_color0: #e5e9f0;
|
|
--_color1: #bf616a;
|
|
--_color2: #a3be8c;
|
|
--_color3: #ebcb8b;
|
|
--_color4: #81a1c1;
|
|
--_color5: #b48ead;
|
|
--_color6: #88c0d0;
|
|
--_color7: #3b4252;
|
|
|
|
--_color8: #eceff4;
|
|
--_color9: #bf616a;
|
|
--_color10: #a3be8c;
|
|
--_color11: #ebcb8b;
|
|
--_color12: #81a1c1;
|
|
--_color13: #b48ead;
|
|
--_color14: #88c0d0;
|
|
--_color15: #4c566a;
|
|
|
|
--_colorFG: #2e3440;
|
|
|
|
--primary: #eceff4;
|
|
--secondary: #e5e9f0;
|
|
--tertiary: #d8dee9;
|
|
--primary-rgb: 236, 239, 244;
|
|
--secondary-rgb: 229, 233, 240;
|
|
--tertiary-rgb: 216, 222, 233;
|
|
|
|
--accent: #88c0d0;
|
|
--accent-rgb: 136, 192, 208;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color12);
|
|
--highlight: #8fbcbb;
|
|
--highlight-rgb: 143, 188, 187;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #4c566a;
|
|
}`,
|
|
'Catppuccin Latte': `.theme-light {
|
|
--_color0: #bcc0cc;
|
|
--_color1: #d20f39;
|
|
--_color2: #40a02b;
|
|
--_color3: #df8e1d;
|
|
--_color4: #1e66f5;
|
|
--_color5: #ea76cb;
|
|
--_color6: #179299;
|
|
--_color7: #5c5f77;
|
|
|
|
--_color8: #626880;
|
|
--_color9: #d20f39;
|
|
--_color10: #40a02b;
|
|
--_color11: #df8e1d;
|
|
--_color12: #1e66f5;
|
|
--_color13: #ea76cb;
|
|
--_color14: #179299;
|
|
--_color15: #6c6f85;
|
|
|
|
--_colorFG: #4c4f69;
|
|
|
|
--primary: #eff1f5;
|
|
--secondary: #e6e9ef;
|
|
--tertiary: #dce0e8;
|
|
--primary-rgb: 239, 241, 245;
|
|
--secondary-rgb: 230, 233, 239;
|
|
--tertiary-rgb: 220, 224, 232;
|
|
|
|
--accent: #7287fd;
|
|
--accent-rgb: 114, 135, 253;
|
|
--red: var(--_color1);
|
|
--text: var(--_colorFG);
|
|
--link: var(--_color14);
|
|
--highlight: #6c6f85;
|
|
--highlight-rgb: 108, 111, 133;
|
|
|
|
--status-online: var(--_color2);
|
|
--status-idle: var(--_color3);
|
|
--status-dnd: var(--_color1);
|
|
--status-offline: var(--_color8);
|
|
--status-streaming: var(--_color5);
|
|
|
|
--titlebar-color: #414559;
|
|
|
|
--interactive-hover: var(--_color6) !important;
|
|
--interactive-active: var(--_color7) !important;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_font 'Font' {
|
|
'Default*': " ",
|
|
'Revert Rebrand': `:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--font-display: var(--font-primary) !important;
|
|
}`,
|
|
'Unifont': `@font-face {
|
|
font-family: "Unifont";
|
|
src: local("Unifont"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/unifont-14.0.01.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Unifont";
|
|
src: local("Unifont"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/unifont-14.0.01.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Bold-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: bold;
|
|
font-style: normal;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Bold%20Italic-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: bold;
|
|
font-style: italic;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Italic-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: italic;
|
|
}
|
|
|
|
:root,
|
|
.theme-dark,
|
|
.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;
|
|
}
|
|
|
|
.sjis {
|
|
font-family: "Sazanami Gothic" !important;
|
|
}
|
|
|
|
[class*="menu-"] [class^="item-"],
|
|
[class^="containerDefault-"] [class^="name-"],
|
|
[class^="membersGroup-"] {
|
|
font-size: 16px;
|
|
text-transform: none;
|
|
font-weight: 500;
|
|
}`,
|
|
'Terminus': `@font-face {
|
|
font-family: "Unifont";
|
|
src: local("Unifont"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/unifont-14.0.01.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Bold-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: bold;
|
|
font-style: normal;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Bold%20Italic-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: bold;
|
|
font-style: italic;
|
|
}
|
|
@font-face {
|
|
font-family: "Terminus (TTF)";
|
|
src: local("Terminus (TTF)"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/TerminusTTF-Italic-4.47.0.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: italic;
|
|
}
|
|
|
|
:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--font-primary: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont",
|
|
monospace, Twemoji !important;
|
|
--font-display: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont",
|
|
monospace, Twemoji !important;
|
|
--font-code: "Terminus (TTF) for Windows", "Terminus (TTF)", "Sazanami Gothic", "UnifontBitmap", "Unifont Windows", "Unifont",
|
|
monospace !important;
|
|
|
|
--_font-titlebars: var(--font-primary) !important;
|
|
}
|
|
|
|
[class*="menu-"] [class^="item-"],
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
[class^="name-"] {
|
|
font-size: 16px;
|
|
text-transform: none;
|
|
font-weight: 500;
|
|
}
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"]
|
|
> [class^="mainContent-"]
|
|
[class^="name-"],
|
|
[class^="membersGroup-"],
|
|
[class^="headerContent-"] > [class^="name-"] {
|
|
font-size: 16px;
|
|
text-transform: none;
|
|
font-weight: 600;
|
|
}
|
|
|
|
[class^="reaction-"] [class*="reactionCount-"] {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.hh2-spotify-controls-album-name,
|
|
.showTag-username {
|
|
color: var(--highlight) !important;
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
[class^="sidebar-"]
|
|
> [class^="container-"]
|
|
> [class^="container-"]
|
|
> [class^="header-"]
|
|
> [class^="name-"],
|
|
[class*="heading-md-medium-"],
|
|
[class*="heading-md-normal-"] {
|
|
font-size: 16px !important;
|
|
}
|
|
|
|
[class*="edited-"],
|
|
[class*="botTag-"] [class*="botText-"],
|
|
span[class="role-tag"],
|
|
.antiDelete-deleted-suffix {
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
[class^="latin12CompactTimeStamp-"],
|
|
[class^="latin24CompactTimeStamp-"],
|
|
[class^="asianCompactTimeStamp-"],
|
|
[class^="embedFooterText-"] {
|
|
font-size: 0.75em !important;
|
|
}
|
|
|
|
[class^="codeBlockText-"],
|
|
[class^="codeLine-"],
|
|
[class*="after_inlineCode-"],
|
|
[class*="before_inlineCode-"],
|
|
[class^="inlineCode-"] {
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
.hljs-ansi-style-bold {
|
|
font-weight: 0;
|
|
}
|
|
|
|
[class^="markdown-"] [class^="codeInline-"],
|
|
code.inline,
|
|
.hljs {
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
[class^="markdown-"] code,
|
|
[class^="markdown-"] [class^="codeInline-"],
|
|
code.inline {
|
|
line-height: 12px !important;
|
|
}
|
|
|
|
[class^="markup-"] ol,
|
|
[class^="markup-"] ul {
|
|
margin: 4px 0 0 24px !important;
|
|
}`,
|
|
'The Funny': `@font-face {
|
|
font-family: "Pointfree";
|
|
src: local("Pointfree"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/pointfree.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Untyped";
|
|
src: local("Untyped"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/untyped.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--font-primary: "Comic Sans MS", cursive !important;
|
|
--font-display: "Comic Sans MS", cursive !important;
|
|
--font-code: "Pointfree", "Untyped", monospace !important;
|
|
}`,
|
|
'The Funny (Alternate Monospace)': `@font-face {
|
|
font-family: "Untyped";
|
|
src: local("Untyped"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/untyped.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Pointfree";
|
|
src: local("Pointfree"),
|
|
url(https://cynosphere.gitlab.io/Customizations/discord/assets/pointfree.ttf)
|
|
format("truetype");
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--font-primary: "Comic Sans MS", cursive !important;
|
|
--font-display: "Comic Sans MS", cursive !important;
|
|
--font-code: "Untyped", "Pointfree", monospace !important;
|
|
}`,
|
|
'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;
|
|
}`,
|
|
}
|
|
@var text xmc_font_custom 'Custom Font' ''
|
|
@var text xmc_font_custom_mono 'Custom Monospace Font' ''
|
|
|
|
@var select xmc_stylings 'Visual Styling' {
|
|
'Off': "",
|
|
'XMC*': `:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--_font-titlebars: "Segoe UI", sans-serif;
|
|
}
|
|
|
|
.theme-dark {
|
|
--hover-bg: #3f3f3f;
|
|
--hover-shadow: inset 0 0 0 1px #373737, inset 0 0 0 2px #444444,
|
|
inset 0 0 0 3px #3c3c3c;
|
|
|
|
--button-bg: linear-gradient(to bottom, var(--primary, var(--background-primary)), var(--secondary, var(--background-secondary)));
|
|
--button-shadow: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)),
|
|
inset 0 0 0 2px var(--primary, var(--background-primary)), inset 0 0 0 3px var(--secondary, var(--background-secondary));
|
|
|
|
--scrollbar-shadow: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)), inset 0 0 0 2px #404040,
|
|
inset 0 0 0 3px var(--primary, var(--background-primary)), inset 0 0 0 4px var(--secondary, var(--background-secondary));
|
|
--scrollbar-shadow-hover: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)),
|
|
inset 0 0 0 2px #646464, inset 0 0 0 3px var(--primary, var(--background-primary)),
|
|
inset 0 0 0 4px var(--secondary, var(--background-secondary));
|
|
}
|
|
|
|
.theme-light {
|
|
--hover-bg: #ebeadf;
|
|
--hover-shadow: inset 0 0 0 1px #dfdcd2, inset 0 0 0 2px #fafaf8,
|
|
inset 0 0 0 3px #d1cec6;
|
|
|
|
--button-bg: linear-gradient(to bottom, var(--primary, var(--background-primary)), var(--secondary, var(--background-secondary)));
|
|
--button-shadow: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)),
|
|
inset 0 0 0 2px var(--primary, var(--background-primary)), inset 0 0 0 3px var(--secondary, var(--background-secondary));
|
|
|
|
--scrollbar-shadow: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)), inset 0 0 0 2px #404040,
|
|
inset 0 0 0 3px var(--primary, var(--background-primary)), inset 0 0 0 4px var(--secondary, var(--background-secondary));
|
|
--scrollbar-shadow-hover: inset 0 0 0 1px var(--tertiary, var(--background-tertiary)),
|
|
inset 0 0 0 2px #646464, inset 0 0 0 3px var(--primary, var(--background-primary)),
|
|
inset 0 0 0 4px var(--secondary, var(--background-secondary));
|
|
}
|
|
|
|
[class*="button-"][class*="lookFilled-"],
|
|
section[class^="panels-"]
|
|
[class^="container-"]
|
|
[class^="flex-"]
|
|
button[class^="button-"],
|
|
[class^="toolbar-"] [class*="iconWrapper-"] {
|
|
border-radius: 0;
|
|
color: var(--text) !important;
|
|
background: var(--button-bg) !important;
|
|
box-shadow: var(--button-shadow) !important;
|
|
}
|
|
|
|
[class^="containerDefault-"][class*="selected-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"],
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"][class*="modeSelected-"]
|
|
> [class^="content-"],
|
|
nav[class^="sidebar-"] div[class^="item-"][class*="selected-"],
|
|
[class^="member-"][aria-expanded="true"] > [class^="layout-"],
|
|
[class^="channel-"] [class^="interactive-"][class*="selected-"] {
|
|
border-radius: 0;
|
|
background: var(--button-bg) !important;
|
|
box-shadow: var(--button-shadow) !important;
|
|
}
|
|
|
|
[class^="containerDefault-"] [class^="iconVisibility-"]:hover [class^="content-"],
|
|
nav[class^="sidebar-"] div[class^="item-"]:not([class*="selected-"]):hover,
|
|
[class^="member-"]:not([aria-expanded="true"]):hover > [class^="layout-"],
|
|
[class^="channel-"] [class^="interactive-"]:not([class*="selected-"]):hover {
|
|
border-radius: 0;
|
|
background: var(--hover-bg) !important;
|
|
box-shadow: var(--hover-shadow) !important;
|
|
}
|
|
|
|
[class^="scroller-"]::-webkit-scrollbar-thumb,
|
|
[class*="scrollerBase-"]::-webkit-scrollbar-thumb {
|
|
border-radius: 0;
|
|
background: transparent;
|
|
box-shadow: var(--scrollbar-shadow);
|
|
}
|
|
|
|
[class^="channelTextArea-"] > [class^="scrollableContainer-"] {
|
|
border: 1px solid var(--background-tertiary);
|
|
border-radius: 0;
|
|
}
|
|
|
|
[class^="toolbar-"] [class*="iconWrapper-"] {
|
|
margin: 0;
|
|
width: 32px;
|
|
height: 32px;
|
|
}
|
|
|
|
[class^="toolbar-"] [class*="iconWrapper-"] > svg {
|
|
margin: 4px;
|
|
}
|
|
|
|
[class^="toolbar-"] > [class^="search-"] {
|
|
margin: 0;
|
|
}
|
|
|
|
[class^="toolbar-"] > [class^="search-"] [class^="searchBar-"] {
|
|
background-color: var(--background-primary);
|
|
border: 1px solid var(--background-tertiary);
|
|
border-radius: 0;
|
|
height: 32px;
|
|
justify-content: center;
|
|
}
|
|
|
|
[class^="toolbar-"]
|
|
> [class^="search-"]
|
|
[class^="searchBar-"]
|
|
> .DraftEditor-root,
|
|
[class^="toolbar-"]
|
|
> [class^="search-"]
|
|
[class^="searchBar-"]
|
|
> [class^="icon-"] {
|
|
height: 24px;
|
|
margin-top: 2px;
|
|
}
|
|
|
|
[class*="recentMentionsPopout-"]
|
|
> [class^="header-"]
|
|
> [class^="tabBar-"]
|
|
> [class^="tab-"] {
|
|
margin: 0;
|
|
border-radius: 0;
|
|
background: var(--button-bg) !important;
|
|
box-shadow: var(--button-shadow) !important;
|
|
font-weight: 100;
|
|
font-size: 12px !important;
|
|
}
|
|
|
|
[class*="recentMentionsPopout-"]
|
|
> [class^="header-"]
|
|
> [class^="tabBar-"]
|
|
> [class^="tab-"]:hover,
|
|
[class*="recentMentionsPopout-"]
|
|
> [class^="header-"]
|
|
> [class^="tabBar-"]
|
|
> [class^="tab-"][class*="active-"] {
|
|
background: var(--hover-bg) !important;
|
|
box-shadow: var(--hover-shadow) !important;
|
|
}
|
|
|
|
[class^="reaction-"] {
|
|
background-color: var(--button-bg);
|
|
box-shadow: var(--button-shadow);
|
|
border-radius: 0;
|
|
}
|
|
|
|
[class^="reaction-"]:hover,
|
|
[class^="reaction-"][class*="reactionMe-"] {
|
|
background-color: var(--hover-bg);
|
|
box-shadow: var(--hover-shadow);
|
|
}`,
|
|
'Windows Classic': `.theme-dark {
|
|
--wc-frame: inset -1px -1px 0 0 var(--tertiary), inset 1px 1px 0 0 var(--primary),
|
|
inset -2px -2px 0 0 var(--secondary), inset 2px 2px 0 0 var(--wc-bright, var(--highlight));
|
|
|
|
--wc-outer-edge: inset -1px -1px 0 0 var(--tertiary), inset 1px 1px 0 0 var(--wc-bright, var(--highlight)),
|
|
inset -2px -2px 0 0 var(--secondary), inset 2px 2px 0 0 var(--primary) !important;
|
|
|
|
--wc-inner-edge: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), inset 1px 1px 0 0 var(--secondary),
|
|
inset -2px -2px 0 0 var(--primary), inset 2px 2px 0 0 var(--tertiary);
|
|
}
|
|
.theme-light {
|
|
--wc-frame: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), inset 1px 1px 0 0 var(--primary),
|
|
inset -2px -2px 0 0 var(--tertiary), inset 2px 2px 0 0 var(--secondary);
|
|
|
|
--wc-outer-edge: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), inset 1px 1px 0 0 var(--secondary),
|
|
inset -2px -2px 0 0 var(--primary), inset 2px 2px 0 0 var(--tertiary);
|
|
|
|
--wc-inner-edge: inset -1px -1px 0 0 var(--secondary), inset 1px 1px 0 0 var(--tertiary),
|
|
inset -2px -2px 0 0 var(--primary), inset 2px 2px 0 0 var(--wc-bright, var(--highlight));
|
|
}
|
|
|
|
[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) !important;
|
|
}
|
|
[class*="button-"][class*="lookFilled-"]:active,
|
|
section[class^="panels-"]
|
|
[class^="container-"]
|
|
[class^="flex-"]
|
|
button[class^="button-"]:active {
|
|
box-shadow: var(--wc-inner-edge) !important;
|
|
}
|
|
[class*="button-"][class*="lookFilled-"]:not([class*="color"]),
|
|
[class^="toolbar-"] [class*="iconWrapper-"] {
|
|
background-color: var(--primary);
|
|
}
|
|
|
|
[class^="chat-"] > [class^="content-"] > [class^="container-"] > [class^="membersWrap-"] {
|
|
padding: 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-"] {
|
|
padding: 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);
|
|
border-radius: 0;
|
|
}
|
|
|
|
[class^="chat-"] > [class^="content-"]:before {
|
|
display: none !important;
|
|
}
|
|
|
|
[class^="standardSidebarView-"] > [class^="sidebarRegion-"] > [class^="sidebarRegionScroller-"],
|
|
[class^="standardSidebarView-"] > [class^="contentRegion-"] [class^="contentTransitionWrap-"] {
|
|
padding: 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-"] {
|
|
border-left: 2px solid var(--primary);
|
|
}
|
|
|
|
[class*="guilds-"] [class^="guildSeparator-"] {
|
|
height: 0;
|
|
border-bottom: 1px solid var(--wc-bright, var(--highlight));
|
|
border-top: 1px solid var(--secondary);
|
|
border-radius: 0;
|
|
}
|
|
|
|
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;
|
|
padding: 2px;
|
|
box-shadow: var(--wc-frame);
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] {
|
|
padding: 1px 1px 4px 1px !important;
|
|
margin-right: -4px
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] {
|
|
border-radius: 0 !important;
|
|
margin: 1px 0;
|
|
padding: 0 2px !important;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="customItem-"][id^="message-quickreact-"] > [class^="button-"] {
|
|
border-radius: 0 !important;
|
|
box-shadow: var(--wc-outer-edge);
|
|
}
|
|
[class*="menu-"] [class^="scroller-"] [class^="separator-"] {
|
|
margin: 4px 1px;
|
|
border-bottom: 1px solid var(--wc-bright, var(--highlight));
|
|
border-top: 1px solid var(--secondary);
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] {
|
|
min-height: 16px !important;
|
|
font-size: 12px;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"]:not(:has(> [class^="iconContainer-"] > [class^="icon-"])):not(:has(> [class^="iconContainerLeft-"])) {
|
|
padding-inline-start: 20px !important;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"]:has(> [class^="iconContainer-"] > [class^="icon-"]) {
|
|
flex-direction: row-reverse;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="iconContainer-"]:has(> [class^="icon-"]),
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="iconContainerLeft-"] {
|
|
margin-left: 0;
|
|
margin-right: 2px;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="label-"] > [class^="subtext-"] {
|
|
line-height: 12px;
|
|
margin-top: 0;
|
|
}
|
|
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="iconContainer-"],
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="iconContainer-"] > svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][aria-haspopup="true"] > [class^="iconContainer-"] > [class^="caret-"] {
|
|
display: none;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][aria-haspopup="true"] > [class^="iconContainer-"]:before {
|
|
content:"";
|
|
position: absolute;
|
|
right: -2px;
|
|
top: 0px;
|
|
width: 16px;
|
|
height: 16px;
|
|
background-color: var(--text);
|
|
mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAmSURBVBhXY4CC/1AaKwBJ4lQAk8SqAFkSQwFOCRDAKQECWCQYGACCnQ/xc1GbJAAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
-webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAmSURBVBhXY4CC/1AaKwBJ4lQAk8SqAFkSQwFOCRDAKQECWCQYGACCnQ/xc1GbJAAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
-webkit-mask-repeat: no-repeat;
|
|
-webkit-mask-position: center;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemcheckbox"] > [class^="iconContainer-"] > svg[class^="icon-"]{
|
|
display: none;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemcheckbox"][aria-checked="true"] > [class^="iconContainer-"]:before {
|
|
content:"";
|
|
position: absolute;
|
|
right: 0px;
|
|
top: 1px;
|
|
width: 16px;
|
|
height: 16px;
|
|
background-color: var(--text);
|
|
mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAArSURBVBhXY8AD/kNpDACSAEuiq4BJwCVhClAkQABZAEUCBnBKwACaBAMDANZXFOzc7AnWAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
-webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAArSURBVBhXY8AD/kNpDACSAEuiq4BJwCVhClAkQABZAEUCBnBKwACaBAMDANZXFOzc7AnWAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
-webkit-mask-repeat: no-repeat;
|
|
-webkit-mask-position: center;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemradio"] > [class^="iconContainer-"] > svg[class^="icon-"]{
|
|
display: none;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemradio"][aria-checked="true"] > [class^="iconContainer-"]:before {
|
|
content:"";
|
|
position: absolute;
|
|
right: -1px;
|
|
top: 0px;
|
|
width: 16px;
|
|
height: 16px;
|
|
background-color: var(--text);
|
|
mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAiSURBVBhXY4CC/2gYDNAFYRirIAhjFQRhrIIgDAZoggwMACftH+F43ykVAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
-webkit-mask-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAiSURBVBhXY4CC/2gYDNAFYRirIAhjFQRhrIIgDAZoggwMACftH+F43ykVAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
mask-repeat: no-repeat;
|
|
mask-position: center;
|
|
-webkit-mask-repeat: no-repeat;
|
|
-webkit-mask-position: center;
|
|
}
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][aria-haspopup="true"]:hover > [class^="iconContainer-"]:before,
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemcheckbox"][aria-checked="true"]:hover > [class^="iconContainer-"]:before,
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][role="menuitemradio"][aria-checked="true"]:hover > [class^="iconContainer-"]:before {
|
|
background-color: white;
|
|
}
|
|
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][aria-disabled="true"] > [class^="label-"],
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"][aria-disabled="true"] > [class^="label-"] > [class^="subtext-"] {
|
|
color: var(--secondary);
|
|
text-shadow: 1px 1px 0 var(--wc-bright, var(--highlight));
|
|
}
|
|
[class^="submenu-"] > [class^="scroller-"] > [class^="listHeight-"][a=a] {
|
|
height: unset !important;
|
|
}
|
|
[class^="submenuPaddingContainer-"] {
|
|
padding: 0;
|
|
margin: -4px;
|
|
}
|
|
|
|
[class*="menu-"] > [class^="scroller-"] [class^="item-"] > [class^="label-"] > [class^="roleRow-"] > [class^="roleCircle-"] {
|
|
width: 12px;
|
|
height: 12px;
|
|
border-radius: 0;
|
|
border-top: 1px solid var(--text);
|
|
border-left: 1px solid var(--text);
|
|
margin: 0;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
[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:single-button,
|
|
[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button {
|
|
border-radius: 0;
|
|
background: var(--primary);
|
|
box-shadow: var(--wc-frame);
|
|
border: none;
|
|
}
|
|
|
|
[class^="scroller-"][class*="fade-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button,
|
|
[class*="scrollerBase-"][class*="fade-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button {
|
|
visibility: hidden;
|
|
}
|
|
[class^="scroller-"][class*="fade-"]:not([class*="thin-"]):hover::-webkit-scrollbar-button:single-button,
|
|
[class*="scrollerBase-"][class*="fade-"]:not([class*="thin-"]):hover::-webkit-scrollbar-button:single-button {
|
|
visibility: visible;
|
|
}
|
|
|
|
[class^="scroller-"]::-webkit-scrollbar-button:single-button:active,
|
|
[class*="scrollerBase-"]::-webkit-scrollbar-button:single-button:active {
|
|
box-shadow: inset 1px 1px var(--secondary), inset -1px -1px var(--secondary);
|
|
}
|
|
[class^="scroller-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:decrement,
|
|
[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:decrement {
|
|
background-repeat: no-repeat !important;
|
|
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNSIgaGVpZ2h0PSIxNSIgdmlld0JveD0iMCAwIDE1IDE1Ij4NCgk8cmVjdCBoZWlnaHQ9IjEiIHdpZHRoPSI3IiB5PSI4IiB4PSIzIiBmaWxsPSJtZW51dGV4dCIvPjxyZWN0IGhlaWdodD0iMSIgd2lkdGg9IjUiIHg9IjQiIHk9IjciIGZpbGw9Im1lbnV0ZXh0Ii8+PHJlY3QgaGVpZ2h0PSIxIiB3aWR0aD0iMyIgeT0iNiIgeD0iNSIgZmlsbD0ibWVudXRleHQiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB5PSI1IiB4PSI2IiBmaWxsPSJtZW51dGV4dCIvPg0KCQ0KCQ0KPC9zdmc+") !important;
|
|
background-position: center center !important;
|
|
}
|
|
[class^="scroller-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:increment,
|
|
[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:increment {
|
|
background-repeat: no-repeat !important;
|
|
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTUiIHdpZHRoPSIxNSIgdmlld0JveD0iMCAwIDE1IDE1Ij4NCgk8cmVjdCBoZWlnaHQ9IjEiIHdpZHRoPSI3IiB4PSIzIiB5PSI1IiBmaWxsPSJtZW51dGV4dCIvPjxyZWN0IGhlaWdodD0iMSIgd2lkdGg9IjUiIHk9IjYiIHg9IjQiIGZpbGw9Im1lbnV0ZXh0Ii8+PHJlY3QgaGVpZ2h0PSIxIiB3aWR0aD0iMyIgeD0iNSIgeT0iNyIgZmlsbD0ibWVudXRleHQiLz48cmVjdCB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4PSI2IiB5PSI4IiBmaWxsPSJtZW51dGV4dCIvPg0KCQ0KCQ0KPC9zdmc+") !important;
|
|
background-position: center center !important;
|
|
}
|
|
|
|
[class^="scroller-"]::-webkit-scrollbar-button:single-button,
|
|
[class*="scrollerBase-"]::-webkit-scrollbar-button:single-button {
|
|
}
|
|
[class^="scroller-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:decrement,
|
|
[class*="scrollerBase-"]:not([class*="thin-"])::-webkit-scrollbar-button:single-button:vertical:decrement {
|
|
border-width: 0 8px 8px 8px;
|
|
border-color: transparent transparent var(--text) transparent;
|
|
}
|
|
|
|
.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);
|
|
}
|
|
[class^="colorSwatch-"] > [class^="swatch-"] {
|
|
border: none !important;
|
|
border-radius: 0 !important;
|
|
box-shadow: var(--wc-outer-edge);
|
|
}
|
|
|
|
[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);
|
|
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);
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
[class^="select-"][class*="lookFilled-"][class*="open-"] > [class^="icons-"] > svg {
|
|
box-shadow: var(--wc-inner-edge);
|
|
}
|
|
[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);
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_custom_bg 'Transparency for custom background' {
|
|
'Off*': "",
|
|
'On': `.theme-dark,
|
|
:root {
|
|
--transparent_background-primary: rgba(
|
|
var(--primary-rgb),
|
|
var(--primary-alpha)
|
|
) !important;
|
|
--transparent_background-secondary: rgba(
|
|
var(--secondary-rgb),
|
|
var(--secondary-alpha)
|
|
) !important;
|
|
--transparent_background-secondary-alt: rgba(
|
|
var(--secondary--alt-rgb, --secondary-rgb),
|
|
var(--secondary-alpha)
|
|
) !important;
|
|
--transparent_background-tertiary: rgba(
|
|
var(--tertiary-rgb),
|
|
var(--tertiary-alpha)
|
|
) !important;
|
|
}
|
|
|
|
[class^="appMount-"] {
|
|
background: var(--custom-background), var(--primary) !important;
|
|
background-repeat: no-repeat !important;
|
|
background-size: cover !important;
|
|
}
|
|
|
|
[class^="chat-"] > [class^="content-"] > [class^="chatContent-"],
|
|
[class^="chat-"] > [class^="title-"],
|
|
[class^="markup-"] code,
|
|
[class*="embedFull-"],
|
|
[class^="chat-"] > [class^="title-"] [class^="searchBar-"],
|
|
[class^="content-"]
|
|
> [class^="sidebar-"]
|
|
> [class^="privateChannels-"]
|
|
> [class^="searchBar-"]
|
|
> [class^="searchBarComponent-"],
|
|
[class^="standardSidebarView-"] > [class^="contentRegion-"],
|
|
[class^="accountProfileCard-"],
|
|
[class^="base-"] > [class^="content-"] > [class^="wrapper-"],
|
|
[class^="perksModal-"],
|
|
[class^="base-"] > [class^="content-"] > [class^="container-"],
|
|
[class^="gameUpdates-"],
|
|
[class^="applicationStore-"],
|
|
[class^="pageWrapper-"],
|
|
.messageLinkPreview-container {
|
|
background-color: var(--transparent_background-primary) !important;
|
|
}
|
|
[class^="channelTextArea-"],
|
|
[class^="content-"] > [class^="sidebar-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="container-"],
|
|
[class^="standardSidebarView-"]
|
|
> [class^="sidebarRegion-"]
|
|
[class^="sidebarRegionScroller-"] {
|
|
background: var(--transparent_background-secondary) !important;
|
|
}
|
|
nav[class*="guilds-"],
|
|
body > #app-mount > .platform-web > [class^="popout-"] > [class^="content-"] > [class^="wrapper-"] {
|
|
background: var(--transparent_background-tertiary) !important;
|
|
}
|
|
|
|
[class^="chat-"],
|
|
[class^="content-"] > [class^="sidebar-"] > [class^="container-"],
|
|
[class^="content-"] > [class^="sidebar-"] > [class^="privateChannels-"],
|
|
[class^="content-"]
|
|
> [class^="sidebar-"]
|
|
> [class^="privateChannels-"]
|
|
> [class^="scroller-"],
|
|
nav[class*="guilds-"] > ul > [class^="scroller-"],
|
|
[class^="content-"] > [class^="sidebar-"] > [class^="panels-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> div,
|
|
[class^="channelTextArea-"] > [class^="scrollableContainer-"],
|
|
[class^="chat-"] > [class^="title-"] [class^="children-"]:after,
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="chatContent-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="chatContent-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="wrapper-"],
|
|
[class^="standardSidebarView-"],
|
|
[class^="standardSidebarView-"]
|
|
> [class^="contentRegion-"]
|
|
[class^="contentRegionScroller-"],
|
|
[class^="base-"]
|
|
> [class^="content-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="navigationBar-"],
|
|
[class^="peopleColumn-"],
|
|
[class^="base-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class*="container-"],
|
|
[class^="base-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class^="scroller-"],
|
|
[class^="base-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class*="container-"]
|
|
> [class^="table-"]
|
|
> [class*="header-"],
|
|
[class^="applicationStore-"] [class^="headerBar-"],
|
|
[class^="applicationStore-"] [class^="scroller-"],
|
|
#gm-settings-inject,
|
|
[class^="base-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> section
|
|
> section[class^="headerBarContainer-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class^="membersWrap-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> div,
|
|
body > #app-mount > .platform-web > [class^="popout-"] > [class^="content-"] > [class^="wrapper-"] > [class^="callContainer-"] {
|
|
background: transparent !important;
|
|
}
|
|
|
|
#gm-settings-inject [class^="auto-"]::-webkit-scrollbar-track,
|
|
#gm-settings-inject[class^="auto-"]::-webkit-scrollbar-track {
|
|
background: transparent !important;
|
|
border: none;
|
|
}
|
|
#gm-settings-inject [class^="auto-"]::-webkit-scrollbar-thumb,
|
|
#gm-settings-inject[class^="auto-"]::-webkit-scrollbar-thumb {
|
|
background: var(--interactive-normal);
|
|
border: none;
|
|
}
|
|
#gm-settings-inject [class^="auto-"]::-webkit-scrollbar,
|
|
#gm-settings-inject[class^="auto-"]::-webkit-scrollbar {
|
|
width: 12px !important;
|
|
height: 12px !important;
|
|
}`,
|
|
}
|
|
@var text xmc_cbg_alpha_primary 'Primary Alpha' "0.7"
|
|
@var text xmc_cbg_alpha_secondary 'Secondary Alpha' "0.8"
|
|
@var text xmc_cbg_alpha_tertiary 'Tertiary Alpha' "0.9"
|
|
@var text xmc_cbg_background 'Custom Background (full access to background, use url() for URLs)' ""
|
|
|
|
@var select xmc_square_avatars 'Square Avatars' {
|
|
'Off': `[class*="avatar-"],
|
|
[class*="avatar-"] [class*="image-"],
|
|
[class*="callAvatar-"],
|
|
[class*="callAvatar-"] [class*="speaking-"],
|
|
[class*="avatarDefault-"],
|
|
[class*="avatarSpeaking-"],
|
|
[class*="avatar-"] [class*="inner-"],
|
|
[class*="callAvatarVoice-"],
|
|
[class*="callAvatarWrapper-"] [class*="speaking-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="header-"]
|
|
[class*="avatar-"]
|
|
[class*="large-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="header-"]
|
|
[class*="avatar-"]
|
|
[class*="wrapper-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="contents-"]
|
|
[class*="avatar-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="wrapper-"]
|
|
[class*="contents-"]
|
|
[class*="avatar-"],
|
|
[class^="messageGroupCozy-"] [class*="contents-"] [class*="avatar-"],
|
|
[class*="autocomplete-"]
|
|
[class*="autocompleteInner-"]
|
|
[class*="autocompleteRow-"]
|
|
[class*="content-"]
|
|
[class*="wrapper-"],
|
|
[class*="guildsWrapper-"]
|
|
[class*="guilds-"]
|
|
[class*="guild-"]
|
|
[class*="guildInner-"],
|
|
div[class^="listItem-"] foreignObject img,
|
|
div[class^="listItem-"] foreignObject a[class^="button-"],
|
|
div[class^="listItem-"] foreignObject [class^="childWrapper-"],
|
|
div[class^="listItem-"] foreignObject [class^="folder-"],
|
|
div[class^="listItem-"] div[class^="wrapperSimple-"],
|
|
[class^="circleIconButton-"],
|
|
[class^="avatarContainer-"],
|
|
[class^="executedCommandAvatar-"] {
|
|
border-radius: 50% !important;
|
|
}
|
|
|
|
div[class^="listItem-"] foreignObject img,
|
|
div[class^="listItem-"] foreignObject [class*="selected-"] > img {
|
|
transition: border-radius 0.35s ease;
|
|
}
|
|
|
|
div[class^="listItem-"] foreignObject [class*="selected-"] > img {
|
|
border-radius: 25% !important;
|
|
}
|
|
|
|
[class^="folderIconWrapper-"]
|
|
> [class^="closedFolderIconWrapper-"]
|
|
> [class^="icon-"] {
|
|
border-radius: 50% !important;
|
|
}
|
|
|
|
[class*="avatarMasked-"],
|
|
[class*="maskProfile-"],
|
|
[class*="mask-"],
|
|
[class*="avatar-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="avatarWrapper-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="avatarHint-"] > foreignObject,
|
|
[class*="wrapper-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="callAvatarWrapper-"] svg[class*="callAvatarMask-"] > foreignObject,
|
|
div[class^="listItem-"] [class^="wrapper-"] > svg > foreignObject,
|
|
[class^="bannerSVGWrapper-"] > foreignObject,
|
|
[class^="avatarDecoration-"] > foreignObject {
|
|
mask: none !important;
|
|
mask-image: none !important;
|
|
-webkit-mask-image: none !important;
|
|
}
|
|
|
|
[class*="avatarHint-"],
|
|
[class*="avatarNormal-"],
|
|
[class*="avatarWrapper-"] [class*="wrapper-"],
|
|
[class*="avatarWrapper-"] [class*="image-"],
|
|
[class*="replyAvatar-"] {
|
|
border: none;
|
|
border-radius: 10% !important;
|
|
}`,
|
|
'On*': `[class*="avatar-"],
|
|
[class*="avatar-"] [class*="image-"],
|
|
[class*="callAvatar-"],
|
|
[class*="callAvatar-"] [class*="speaking-"],
|
|
[class*="avatarDefault-"],
|
|
[class*="avatarSpeaking-"],
|
|
[class*="avatar-"] [class*="inner-"],
|
|
[class*="callAvatarVoice-"],
|
|
[class*="callAvatarWrapper-"] [class*="speaking-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="header-"]
|
|
[class*="avatar-"]
|
|
[class*="large-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="header-"]
|
|
[class*="avatar-"]
|
|
[class*="wrapper-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="message-"]
|
|
[class*="contents-"]
|
|
[class*="avatar-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
[class^="wrapper-"]
|
|
[class*="contents-"]
|
|
[class*="avatar-"],
|
|
[class^="messageGroupCozy-"] [class*="contents-"] [class*="avatar-"],
|
|
[class*="autocomplete-"]
|
|
[class*="autocompleteInner-"]
|
|
[class*="autocompleteRow-"]
|
|
[class*="content-"]
|
|
[class*="wrapper-"],
|
|
[class*="guildsWrapper-"]
|
|
[class*="guilds-"]
|
|
[class*="guild-"]
|
|
[class*="guildInner-"],
|
|
div[class^="listItem-"] foreignObject img,
|
|
div[class^="listItem-"] foreignObject a[class^="button-"],
|
|
div[class^="listItem-"] foreignObject [class^="childWrapper-"],
|
|
div[class^="listItem-"] foreignObject [class^="folder-"],
|
|
div[class^="listItem-"] div[class^="wrapperSimple-"],
|
|
[class^="circleIconButton-"],
|
|
[class^="folderIconWrapper-"],
|
|
[class^="avatarContainer-"],
|
|
[class^="executedCommandAvatar-"] {
|
|
border-radius: 10% !important;
|
|
}
|
|
|
|
[class^="folderIconWrapper-"]
|
|
> [class^="closedFolderIconWrapper-"]
|
|
> [class^="icon-"] {
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
[class*="avatarMasked-"],
|
|
[class*="maskProfile-"],
|
|
[class*="mask-"],
|
|
[class*="avatar-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="avatarWrapper-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="avatarHint-"] > foreignObject,
|
|
[class*="wrapper-"] svg[class*="mask-"] > foreignObject,
|
|
[class*="callAvatarWrapper-"] svg[class*="callAvatarMask-"] > foreignObject,
|
|
div[class^="listItem-"] [class^="wrapper-"] > svg > foreignObject,
|
|
[class^="bannerSVGWrapper-"] > foreignObject,
|
|
[class^="avatarDecoration-"] > foreignObject {
|
|
mask: none !important;
|
|
mask-image: none !important;
|
|
-webkit-mask-image: none !important;
|
|
}
|
|
|
|
[class*="avatarHint-"],
|
|
[class*="avatarNormal-"],
|
|
[class*="avatarWrapper-"] [class*="wrapper-"],
|
|
[class*="avatarWrapper-"] [class*="image-"],
|
|
[class*="replyAvatar-"] {
|
|
border: none;
|
|
border-radius: 10% !important;
|
|
}
|
|
|
|
[class^="userPopout-"] [class*="avatarWrapper-"] > [class^="avatarHint-"] {
|
|
display: none;
|
|
}
|
|
|
|
[class^="userPopout-"]
|
|
[class*="avatarWrapper-"]
|
|
> [class^="avatar-"]
|
|
> svg
|
|
> foreignObject {
|
|
x: 8px;
|
|
}
|
|
|
|
[class^="userPopout-"]
|
|
[class*="avatarWrapper-"]
|
|
> [class^="avatar-"]
|
|
> svg
|
|
> rect {
|
|
x: 0;
|
|
y: 0;
|
|
width: 8px;
|
|
height: 100%;
|
|
mask: none !important;
|
|
}
|
|
|
|
[class^="accountProfileCard-"] [class^="avatar-"] {
|
|
border: 0;
|
|
background-color: transparent;
|
|
}
|
|
|
|
[class^="numberBadge-"] {
|
|
border-radius: 4px !important;
|
|
}`
|
|
}
|
|
|
|
@var select xmc_9x_bot_tag '9x Bot Tag' {
|
|
'Off*': "",
|
|
'On': `[class*="botTag-"] {
|
|
font-size: 0%;
|
|
padding: 0 !important;
|
|
background: none !important;
|
|
}
|
|
|
|
[class*="botTag-"]:not([class*="botTagCompact-"]) {
|
|
margin-left: 6px;
|
|
}
|
|
|
|
[class*="botTag-"] [class*="botText-"] {
|
|
font-size: 0;
|
|
display: none;
|
|
}
|
|
|
|
:not([class^="repliedMessage-"]) [class*="botTagCompact-"] {
|
|
margin-right: -6px !important;
|
|
}
|
|
[class^="repliedMessage-"] [class*="botTagCompact-"] {
|
|
margin-right: 4px !important;
|
|
margin-left: 4px !important;
|
|
}
|
|
|
|
[class*="botTag-"] svg[class^="botTagVerified-"] {
|
|
width: 16px;
|
|
height: 16px;
|
|
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABlSURBVDhPzY5RCsAwCEM9+m6+TYsj2ujaj8EePGitCZXfchKXGMsHcaGIB7NNCQ/cOnYvCqYQ6jwzUhICqBPmnxY4+Rx8+0EG30xSoIQlB2dmEVbmZWZToIyFOtiGEQxsBTcRuQCANOfCY5uAHgAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
}
|
|
|
|
[class*="botTag-"] svg[class^="botTagVerified-"] > path {
|
|
display: none;
|
|
}
|
|
|
|
[class*="botTag-"]:after {
|
|
visibility: visible;
|
|
content: "";
|
|
width: 16px;
|
|
height: 16px;
|
|
vertical-align: middle;
|
|
position: relative;
|
|
top: 0;
|
|
margin-left: 0;
|
|
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAABxSURBVDhP1Y9RDgARDEQd3dHczHayyog22v3bSV5QPFU4tdYeZVxZQbG1dgUZgiVBIRrq4BTgBVm6YD8o6AbvF38jwIGTkOCGK8ggV3ScUWMIFs32MzEF1n/5VQV1VyDLTcDgHM83wRdGRzNayCAp5QETRCGPhz4v+gAAAABJRU5ErkJgggAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
background-size: 16px 16px;
|
|
}
|
|
|
|
[class*="message-"] [class*="botTag-"]:after {
|
|
top: 4px !important;
|
|
}
|
|
|
|
[class*="message-"][class*="compact-"] [class*="botTag-"]:after {
|
|
top: 3px !important;
|
|
}
|
|
|
|
[class^="repliedMessage-"] [class*="botTagCompact-"]:after {
|
|
top: 1px !important;
|
|
}`,
|
|
}
|
|
@var select xmc_nyantro 'Nyantro Progress Bar' {
|
|
'Off*': "",
|
|
'On': `[class^="progressBarContainer-"] {
|
|
background: url("data:image/gif;base64,R0lGODlhMAAMAIAAAAxBd////yH/C05FVFNDQVBFMi4wAwEAAAAh+QQECgAAACwAAAAAMAAMAAACJYSPqcvtD6MKstpLr24Z9A2GYvJ544mhXQmxoesElIyCcB3dRgEAIfkEBAoAAAAsAQACAC0ACgAAAiGEj6nLHG0enNQdWbPefOHYhSLydVhJoSYXPO04qrAmJwUAIfkEBAoAAAAsBQABACkACwAAAiGEj6nLwQ8jcC5ViW3evHt1GaE0flxpphn6BNTEqvI8dQUAIfkEBAoAAAAsAQABACoACwAAAiGEj6nLwQ+jcU5VidPNvPtvad0GfmSJeicUUECbxnK0RgUAIfkEBAoAAAAsAAAAACcADAAAAiCEj6mbwQ+ji5QGd6t+c/v2hZzYiVpXmuoKIikLm6hXAAAh+QQECgAAACwAAAAALQAMAAACI4SPqQvBD6NysloTXL480g4uX0iW1Wg21oem7ismLUy/LFwAACH5BAQKAAAALAkAAAAkAAwAAAIghI8Joe0Po0yBWTaz3g/z7UXhMX7kYmplmo0rC8cyUgAAIfkEBAoAAAAsBQAAACUACgAAAh2Ejwmh7Q+jbIFZNrPeEXPudU74IVa5kSiYqOtRAAAh+QQECgAAACwEAAAAIgAKAAACHISPELfpD6OcqTGKs4bWRp+B36YFi0mGaVmtWQEAIfkEBAoAAAAsAAAAACMACgAAAh2EjxC36Q+jnK8xirOW1kavgd+2BYtJhmnpiGtUAAAh+QQECgAAACwAAAAALgALAAACIYSPqcvtD+MKicqLn82c7e6BIhZQ5jem6oVKbfdqQLzKBQAh+QQECgAAACwCAAIALAAJAAACHQx+hsvtD2OStDplKc68r2CEm0eW5uSN6aqe1lgAADs=");
|
|
}
|
|
|
|
[class^="progressBarContainer-"] [class^="progressBar-"] {
|
|
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAMCAIAAAAs6UAAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QUNCQzIyREQ0QjdEMTFFMzlEMDM4Qzc3MEY0NzdGMDgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QUNCQzIyREU0QjdEMTFFMzlEMDM4Qzc3MEY0NzdGMDgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpBQ0JDMjJEQjRCN0QxMUUzOUQwMzhDNzcwRjQ3N0YwOCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpBQ0JDMjJEQzRCN0QxMUUzOUQwMzhDNzcwRjQ3N0YwOCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PovDFgYAAAAmSURBVHjaYvjPwMAAxjMZmBhA9H8INv4P4TPM/A+m04zBNECAAQBCWQv9SUQpVgAAAABJRU5ErkJggg==");
|
|
background-size: contain;
|
|
}
|
|
|
|
[class^="progressBarContainer-"] [class^="progressBar-"]:after {
|
|
content: "";
|
|
background: url("data:image/gif;base64,R0lGODlhIgAVAKIHAL3/9/+Zmf8zmf/MmZmZmf+Z/wAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpDMkJBNjY5RTU1NEJFMzExOUM4QUM2MDAwNDQzRERBQyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCREIzOEIzMzRCN0IxMUUzODhEQjgwOTYzMTgyNTE0QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCREIzOEIzMjRCN0IxMUUzODhEQjgwOTYzMTgyNTE0QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChXaW5kb3dzKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkM1QkE2NjlFNTU0QkUzMTE5QzhBQzYwMDA0NDNEREFDIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkMyQkE2NjlFNTU0QkUzMTE5QzhBQzYwMDA0NDNEREFDIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Af/+/fz7+vn49/b19PPy8fDv7u3s6+rp6Ofm5eTj4uHg397d3Nva2djX1tXU09LR0M/OzczLysnIx8bFxMPCwcC/vr28u7q5uLe2tbSzsrGwr66trKuqqainpqWko6KhoJ+enZybmpmYl5aVlJOSkZCPjo2Mi4qJiIeGhYSDgoGAf359fHt6eXh3dnV0c3JxcG9ubWxramloZ2ZlZGNiYWBfXl1cW1pZWFdWVVRTUlFQT05NTEtKSUhHRkVEQ0JBQD8+PTw7Ojk4NzY1NDMyMTAvLi0sKyopKCcmJSQjIiEgHx4dHBsaGRgXFhUUExIREA8ODQwLCgkIBwYFBAMCAQAAIfkECQcABwAsAAAAACIAFQAAA6J4umv+MDpG6zEj682zsRaWFWRpltoHMuJZCCRseis7xG5eDGp93bqCA7f7TFaYoIFAMMwczB5EkTzJllEUttmIGoG5bfPBjDawD7CsJC67uWcv2CRov929C/q2ZpcBbYBmLGk6W1BRY4MUDnMvJEsBAXdlknk2fCeRk2iJliAijpBlEmigjR0plKSgpKWvEUheF4tUZqZID1RHjEe8PsDBBwkAIfkECQcABwAsAAAAACIAFQAAA6B4umv+MDpG6zEj682zsRaWFWRpltoHMuJZCCRseis7xG5eDGp93TqS40XiKSYgTLBgIBAMqE/zmQSaZEzns+jQ9pC/5dQJ0VIv5KMVWxqb36opxHrNvu9ptPfGbmsBbgSAeRdydCdjXWRPchQPh1hNAQF4TpM9NnwukpRyi5chGjqJEoSOIh0plaYsZBKvsCuNjY5ptElgDyFIuj6+vwcJACH5BAkHAAcALAAAAAAiABUAAAOfeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMd8MbAiUu802flYGIhwaCAQDKpQ86nUoWqF6dP00wIby572SXE6vyMrlmhuu9GKifWaddvNQAtszXYCxgR/Zy5jYTFeXmSDiIZGdQEBd06QSBQ5e4cEkE9nnZQaG2J4F4MSLx8rkqUSZBeurhlTUqsLsi60DpZxSWBJugcJACH5BAkHAAcALAAAAAAiABUAAAOgeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMd8MbAiUu802flYGIhwaCAQDKpQ86nUoWqF6dP00wIby572SXE6vyMrlmhuu9GuifWaddvNwMkZtmY7AWMEgGcKY2ExXl5khFMVc0Z1AQF3TpJShDl8iASST2efloV5JTyJFpgOch8dgW9KZxexshGNLqgLtbW0SXFwvaJfCQAh+QQJBwAHACwAAAAAIgAVAAADoXi63P7wmUmrnVGOzbvfRsYYXGGe6MmF4kEOaSGYMwq2LizHfDGwIlLPNKGZfi6gZmggEAy2iVPZEKZqzakq+1xUFFYe90lxTsHmim6HGpvf3eR7skYJ3PC5tyystc0AboFnVXQ9XFJTZIQOYUYFTQEBeWaSVF4bbCeRk1meBJYSL3WbaReMIxQfHXh6jaYXsbEQni6oaF21ERR7l0ksvA0JACH5BAkHAAcALAAAAAAiABUAAAOeeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMfFlA4hTITEMxkIBMOuADwmhzqeM6mashTCXKw2TVKQyKuTRSx2wegnNkyJ1ozpOFiMLqcEU8BZHx6NYW8nVlZefQ1tZgQBAXJIi1eHUTRwi0lhl48QL0sogxaGDhMlUo2gh14fHhcVmnOrrxNqrU9joX21Q0IUElm7DQkAIfkECQcABwAsAAAAACIAFQAAA6J4umv+MDpG6zEj682zsRaWFWRpltoHMuJZCCRseis7xG5eDGp93bqCA7f7TFaYoIFAMMwczB5EkTzJllEUttmIGoG5bfPBjDawD7CsJC67uWcv2CRov929C/q2ZpcBbYBmLGk6W1BRY4MUDnMvJEsBAXdlknk2fCeRk2iJliAijpBlEmigjR0plKSgpKWvEUheF4tUZqZID1RHjEe8PsDBBwkAIfkECQcABwAsAAAAACIAFQAAA6B4umv+MDpG6zEj682zsRaWFWRpltoHMuJZCCRseis7xG5eDGp93TqS40XiKSYgTLBgIBAMqE/zmQSaZEzns+jQ9pC/5dQJ0VIv5KMVWxqb36opxHrNvu9ptPfGbmsBbgSAeRdydCdjXWRPchQPh1hNAQF4TpM9NnwukpRyi5chGjqJEoSOIh0plaYsZBKvsCuNjY5ptElgDyFIuj6+vwcJACH5BAkHAAcALAAAAAAiABUAAAOfeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMd8MbAiUu802flYGIhwaCAQDKpQ86nUoWqF6dP00wIby572SXE6vyMrlmhuu9GKifWaddvNQAtszXYCxgR/Zy5jYTFeXmSDiIZGdQEBd06QSBQ5e4cEkE9nnZQaG2J4F4MSLx8rkqUSZBeurhlTUqsLsi60DpZxSWBJugcJACH5BAkHAAcALAAAAAAiABUAAAOgeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMd8MbAiUu802flYGIhwaCAQDKpQ86nUoWqF6dP00wIby572SXE6vyMrlmhuu9GuifWaddvNwMkZtmY7AWMEgGcKY2ExXl5khFMVc0Z1AQF3TpJShDl8iASST2efloV5JTyJFpgOch8dgW9KZxexshGNLqgLtbW0SXFwvaJfCQAh+QQJBwAHACwAAAAAIgAVAAADoXi63P7wmUmrnVGOzbvfRsYYXGGe6MmF4kEOaSGYMwq2LizHfDGwIlLPNKGZfi6gZmggEAy2iVPZEKZqzakq+1xUFFYe90lxTsHmim6HGpvf3eR7skYJ3PC5tyystc0AboFnVXQ9XFJTZIQOYUYFTQEBeWaSVF4bbCeRk1meBJYSL3WbaReMIxQfHXh6jaYXsbEQni6oaF21ERR7l0ksvA0JACH5BAkHAAcALAAAAAAiABUAAAOeeLrc/vCZSaudUY7Nu99GxhhcYZ7oyYXiQQ5pIZgzCrYuLMfFlA4hTITEMxkIBMOuADwmhzqeM6mashTCXKw2TVKQyKuTRSx2wegnNkyJ1ozpOFiMLqcEU8BZHx6NYW8nVlZefQ1tZgQBAXJIi1eHUTRwi0lhl48QL0sogxaGDhMlUo2gh14fHhcVmnOrrxNqrU9joX21Q0IUElm7DQkAOw==");
|
|
background-size: contain;
|
|
width: 25px !important;
|
|
height: 15px !important;
|
|
position: absolute;
|
|
right: -12px;
|
|
top: -6px;
|
|
}
|
|
|
|
[class^="progressBarContainer-"] [class^="tadaIcon-"] {
|
|
display: none;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_textarea 'Text area style' {
|
|
'Default': "",
|
|
'Typing Above*': `[class*="chat-"] [class*="chatContent-"] form {
|
|
position: relative;
|
|
margin: 0;
|
|
}
|
|
|
|
[class*="chat-"] form [class*="typing-"] {
|
|
position: absolute;
|
|
top: -2px;
|
|
left: 10px;
|
|
}
|
|
|
|
[class*="channelTextArea-"] {
|
|
margin-bottom: 10px !important;
|
|
margin-top: 24px !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
[class*="channelTextArea-"] [class*="inner-"] {
|
|
border-radius: 6px;
|
|
}
|
|
|
|
[class*="sansAttachButton-"] {
|
|
padding-left: 10px !important;
|
|
}
|
|
|
|
.typing .ellipsis,
|
|
[class*="typing-"] span[class*="ellipsis-"] {
|
|
display: none;
|
|
}
|
|
|
|
form [class*="typing-"] {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
[class^="scrollerSpacer-"] {
|
|
height: 4px !important;
|
|
}
|
|
|
|
[class^="chatContent-"] > form:before {
|
|
display: none !important;
|
|
}`,
|
|
'Mobile': `[class*="chat-"] [class*="chatContent-"] form {
|
|
position: relative;
|
|
margin: 0;
|
|
}
|
|
|
|
[class*="chat-"] form [class*="typing-"] {
|
|
position: absolute;
|
|
top: -2px;
|
|
left: 10px;
|
|
}
|
|
|
|
[class*="channelTextArea-"] {
|
|
margin-bottom: 10px !important;
|
|
margin-top: 24px !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
[class*="channelTextArea-"] [class*="inner-"] {
|
|
border-radius: 6px;
|
|
}
|
|
|
|
[class*="sansAttachButton-"] {
|
|
padding-left: 10px !important;
|
|
}
|
|
|
|
.typing .ellipsis,
|
|
[class*="typing-"] span[class*="ellipsis-"] {
|
|
display: none;
|
|
}
|
|
|
|
form [class*="typing-"] {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
[class^="scrollerSpacer-"] {
|
|
height: 4px !important;
|
|
}
|
|
|
|
[class^="chatContent-"] > form:before {
|
|
display: none !important;
|
|
}
|
|
|
|
[class^="channelTextArea-"],
|
|
[class^="channelTextArea-"] > [class^="scrollableContainer-"] {
|
|
background-color: transparent !important;
|
|
}
|
|
[class^="channelTextArea-"] > [class^="scrollableContainer-"] {
|
|
overflow: hidden !important;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"] {
|
|
padding-left: 0 !important;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="attachWrapper-"] {
|
|
margin-right: 10px;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="attachWrapper-"]
|
|
> [class^="attachButton-"] {
|
|
margin-left: 0 !important;
|
|
padding: 10px;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"] {
|
|
margin-right: 10px;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]
|
|
> div {
|
|
padding-left: 10px;
|
|
margin-left: 4px;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> * {
|
|
width: 44px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="buttonContainer-"]
|
|
> button,
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> .expression-picker-chat-input-button
|
|
> * {
|
|
width: 44px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="attachWrapper-"],
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"],
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> * {
|
|
background-color: var(--background-secondary);
|
|
border-radius: 22px 22px 22px 22px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"]:before {
|
|
display: none;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"]
|
|
> [class^="buttonContainer-"]
|
|
> button {
|
|
width: 44px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"]
|
|
> [class^="buttonContainer-"]
|
|
> button
|
|
> [class^="contents-"] {
|
|
margin-left: 4px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"]
|
|
> [class^="buttonContainer-"]
|
|
> button
|
|
> [class^="contents-"]
|
|
> [class*="activeButtonChild-"] {
|
|
color: var(--interactive-active);
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="buttons-"]
|
|
> [class^="separator-"]
|
|
> [class^="buttonContainer-"]
|
|
> button:not([disabled]) {
|
|
background-color: var(--brand-experiment);
|
|
border-radius: 22px 22px 22px 22px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> div:not([class]) {
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
[class^="channelTextArea-"] > [class^="attachedBars-"] {
|
|
background: var(--background-primary) !important;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"] {
|
|
max-height: 128px;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]::-webkit-scrollbar {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]::-webkit-scrollbar-corner {
|
|
background-color: transparent;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]::-webkit-scrollbar-thumb {
|
|
background-color: var(--scrollbar-auto-thumb);
|
|
min-height: 40px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]::-webkit-scrollbar-thumb,
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]::-webkit-scrollbar-track {
|
|
border: 4px solid transparent;
|
|
background-clip: padding-box;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="attachWrapper-"] {
|
|
max-height: 44px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"] {
|
|
align-items: center;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]
|
|
> div
|
|
> [class^="placeholder-"] {
|
|
left: 14px;
|
|
}`,
|
|
'Fullwidth': `[class*="chat-"] [class*="chatContent-"] form {
|
|
position: relative;
|
|
margin: 0;
|
|
}
|
|
|
|
[class*="chat-"] form [class*="typing-"] {
|
|
position: absolute;
|
|
top: -2px;
|
|
left: 10px;
|
|
}
|
|
|
|
[class*="channelTextArea-"] {
|
|
margin-bottom: 10px !important;
|
|
margin-top: 24px !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
[class*="channelTextArea-"] [class*="inner-"] {
|
|
border-radius: 6px;
|
|
}
|
|
|
|
[class*="sansAttachButton-"] {
|
|
padding-left: 10px !important;
|
|
}
|
|
|
|
.typing .ellipsis,
|
|
[class*="typing-"] span[class*="ellipsis-"] {
|
|
display: none;
|
|
}
|
|
|
|
form [class*="typing-"] {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
[class^="scrollerSpacer-"] {
|
|
height: 4px !important;
|
|
}
|
|
|
|
[class^="chatContent-"] > form:before {
|
|
display: none !important;
|
|
}
|
|
|
|
[class^="chatContent-"] > form {
|
|
padding: 0 !important;
|
|
bottom: 0;
|
|
}
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] {
|
|
border-radius: 0 !important;
|
|
border: 0 !important;
|
|
}
|
|
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="textArea-"],
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="buttons-"],
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="attachWrapper-"],
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="attachWrapper-"] > [class^="attachButton-"] {
|
|
min-height: 53px;
|
|
}
|
|
[class^="chatContent-"] > form [class^="channelTextArea"] > [class^="scrollableContainer-"] > [class^="inner-"] > [class^="textArea-"] > div > [class*="fontSize16Padding-"] {
|
|
padding-top: 15px !important;
|
|
padding-bottom: 15px !important;
|
|
}
|
|
[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' {
|
|
'Off': "",
|
|
'On*': `[class^="member-"] [class^="avatar-"] [class*="wrapper-"] > svg,
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"],
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"],
|
|
[class^="channel-"] [class^="avatar-"] [class*="wrapper-"] > svg,
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"],
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"],
|
|
[class^="autocompleteRowIcon-"] > [class^="wrapper-"] > svg,
|
|
[class^="userInfo-"] [class^="avatar-"] > svg,
|
|
[class^="panels-"] [class*="avatar-"] > svg > svg,
|
|
[class^="modal-"] > [class^="inner-"] [class^="avatar-"] > svg,
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class^="root-"]
|
|
[class^="avatar-"]
|
|
> svg,
|
|
[class^="userPopoutInner-"]
|
|
[class^="avatarHoverTarget-"]
|
|
> [class^="wrapper-"]
|
|
> svg {
|
|
overflow: visible;
|
|
contain: none !important;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> rect,
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> rect,
|
|
[class^="modal-"]
|
|
> [class^="inner-"]
|
|
[class^="avatar-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> rect {
|
|
x: -18.5;
|
|
y: -17;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle,
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle {
|
|
cx: -20.1;
|
|
r: 1.5;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(1),
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(1) {
|
|
cy: -16;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(2),
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(2) {
|
|
cy: -8;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class^="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(3),
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> svg[class^="dots-"]
|
|
circle:nth-child(3) {
|
|
cy: 0;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> rect[fill^="var(--status-"],
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
> svg[class^="cursorDefault-"]
|
|
> rect[fill^="#"] {
|
|
mask: none !important;
|
|
x: -18.5;
|
|
y: -17;
|
|
width: 4px;
|
|
height: 32px;
|
|
}
|
|
|
|
[class^="panels-"]
|
|
[class*="avatar-"]
|
|
> svg
|
|
> rect[mask^="url(#svg-mask-status"] {
|
|
mask: none !important;
|
|
x: 32;
|
|
y: 0;
|
|
width: 4px;
|
|
height: 32px;
|
|
}
|
|
[class^="panels-"] [class*="avatar-"] > svg > svg > rect[fill^="var(--status-"],
|
|
[class^="panels-"] [class*="avatar-"] > svg > svg > rect[fill^="#"] {
|
|
mask: none !important;
|
|
x: 17.5;
|
|
y: -17;
|
|
width: 4px;
|
|
height: 32px;
|
|
}
|
|
|
|
[class^="member-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"],
|
|
[class^="channel-"]
|
|
[class^="avatar-"]
|
|
[class*="wrapper-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"] {
|
|
mask: none !important;
|
|
width: 4px;
|
|
height: 32px;
|
|
x: -4;
|
|
y: 0;
|
|
}
|
|
|
|
[class^="autocompleteRowIcon-"]
|
|
> [class^="wrapper-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"] {
|
|
mask: none !important;
|
|
width: 4px;
|
|
height: 24px;
|
|
x: -4;
|
|
y: 0;
|
|
}
|
|
|
|
[class^="userInfo-"]
|
|
[class^="avatar-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"] {
|
|
mask: none !important;
|
|
width: 4px;
|
|
height: 32px;
|
|
x: 32;
|
|
y: 0;
|
|
}
|
|
|
|
[class^="userProfileModalInner-"]
|
|
[class^="header-"]
|
|
[class*="avatar-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"] {
|
|
mask: none !important;
|
|
width: 8px;
|
|
height: 120px;
|
|
x: 120;
|
|
y: 0;
|
|
}
|
|
|
|
[class^="userPopoutInner-"]
|
|
[class^="avatarHoverTarget-"]
|
|
> [class^="wrapper-"]
|
|
> svg
|
|
circle,
|
|
[class^="userPopoutInner-"]
|
|
[class^="avatarHoverTarget-"]
|
|
> [class^="wrapper-"]
|
|
> svg
|
|
> rect[fill="black"],
|
|
[class^="userProfileModalInner-"]
|
|
[class^="header-"]
|
|
[class^="wrapper-"]
|
|
> svg
|
|
circle,
|
|
[class^="userProfileModalInner-"]
|
|
[class^="header-"]
|
|
[class^="wrapper-"]
|
|
> svg
|
|
> rect[fill="black"] {
|
|
display: none;
|
|
}
|
|
|
|
[class^="accountProfileCard-"]
|
|
[class*="avatar-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"],
|
|
[class^="userPopoutInner-"]
|
|
[class^="avatarHoverTarget-"]
|
|
> [class^="wrapper-"]
|
|
> svg
|
|
rect[mask^="url(#svg-mask-status-"] {
|
|
mask: none !important;
|
|
width: 8px;
|
|
height: 80px;
|
|
x: 80;
|
|
y: 0;
|
|
}`,
|
|
}
|
|
@var select xmc_cozy_compact 'Cozy Compact Hybrid' {
|
|
'Off': "",
|
|
'On*': `html:not(.a11y-font-scaled-down)
|
|
[class*="message-"]:not([class*="systemMessage-"]):not([class*="compact-"]),
|
|
html:not(.a11y-font-scaled-down)
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"],
|
|
html:not(.a11y-font-scaled-down)
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="container-"]:not([class*="systemMessage-"]):not([class*="compact-"]) {
|
|
padding: 0 !important;
|
|
padding-left: 16px !important;
|
|
}
|
|
|
|
[class*="message-"]:not([class*="systemMessage-"]):not([class*="compact-"]),
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]:not([class*="systemMessage-"]):not([class*="compact-"]),
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="container-"]:not([class*="systemMessage-"]):not([class*="compact-"]) {
|
|
padding-left: 16px !important;
|
|
}
|
|
|
|
[class*="message-"][class*="systemMessage-"] {
|
|
padding-left: 32px !important;
|
|
}
|
|
|
|
[class*="message-"][class*="systemMessage-"] [class^="iconContainer-"] {
|
|
margin-right: 0;
|
|
width: 24px;
|
|
}
|
|
|
|
html:not(.a11y-font-scaled-down)
|
|
[class*="message-"]:not([class*="compact-"])
|
|
> [class^="contents-"]
|
|
> [class^="header-"],
|
|
html:not(.a11y-font-scaled-down)
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]:not([class*="compact-"])
|
|
> [class^="contents-"]
|
|
> [class^="header-"],
|
|
html:not(.a11y-font-scaled-down)
|
|
[class*="message-"]:not([class*="compact-"])
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"]
|
|
> [class^="header-"] {
|
|
padding-left: 0 !important;
|
|
margin-left: 24px;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
.a11y-font-scaled-down
|
|
[class*="message-"]:not([class*="compact-"])
|
|
> [class^="contents-"]
|
|
> [class^="header-"],
|
|
.a11y-font-scaled-down
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]:not([class*="compact-"])
|
|
> [class^="contents-"]
|
|
> [class^="header-"]
|
|
.a11y-font-scaled-down
|
|
[class*="message-"]:not([class*="compact-"])
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"]
|
|
> [class^="header-"] {
|
|
margin-left: calc(24px - 4.5rem);
|
|
}
|
|
|
|
[class*="message-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"]
|
|
[class^="avatar-"],
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"]
|
|
[class^="avatar-"],
|
|
[class*="message-"] > [class^="contents-"] [class^="avatar-"] {
|
|
width: 20px;
|
|
height: 20px;
|
|
left: 16px;
|
|
}
|
|
|
|
[class*="message-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"]
|
|
[class^="avatar-"] {
|
|
left: 0 !important;
|
|
}
|
|
|
|
[class^="messagesWrapper-"]
|
|
[class^="scrollerInner-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="contents-"],
|
|
[class*="message-"] > [class^="contents-"],
|
|
[class*="message-"] > [class^="wrapper-"] > [class^="contents-"] {
|
|
margin-left: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
[class*="message-"][class*="systemMessage-"] > [class^="container-"] {
|
|
padding: 0;
|
|
}
|
|
|
|
[class*="cozy-"][class*="hasThread-"]::after {
|
|
display: none;
|
|
}
|
|
|
|
[class*="message-"] > [class^="wrapper-"] {
|
|
padding-left: 0;
|
|
}
|
|
|
|
[class^="messagesWrapper-"] [class^="scrollerInner-"]:after {
|
|
height: 4px !important;
|
|
}
|
|
|
|
[class*="message-"]:not([class*="compact-"])
|
|
[class^="contents-"]
|
|
[class*="timestampVisibleOnHover-"] {
|
|
display: none;
|
|
}
|
|
|
|
[class^="messagesWrapper-"] [class^="scrollerInner-"] [class^="divider-"] {
|
|
margin: 4px;
|
|
height: 8px;
|
|
}
|
|
|
|
[class^="messagesWrapper-"] [class^="scrollerInner-"] [class*="groupStart-"][class*="cozy-"] {
|
|
margin-top: 8px;
|
|
}
|
|
|
|
div[class*="cozyMessage-"] div[class^="repliedMessage-"] {
|
|
margin-left: 33px;
|
|
}
|
|
|
|
div[class*="cozyMessage-"] div[class^="repliedMessage-"]:before {
|
|
--avatar-size: 20px;
|
|
border-left: var(--spine-width) solid var(--interactive-active);
|
|
border-bottom: 0 solid var(--interactive-active);
|
|
border-right: 0 solid var(--interactive-active);
|
|
border-top: var(--spine-width) solid var(--interactive-active);
|
|
}
|
|
|
|
[class*="cozyMessage-"] [class^="avatarDecoration-"] {
|
|
margin-top: calc(24px - 20px * var(--decoration-to-avatar-ratio));
|
|
left: calc(38px - 20px * var(--decoration-to-avatar-ratio));
|
|
width: calc(20px * var(--decoration-to-avatar-ratio));
|
|
height: calc(20px * var(--decoration-to-avatar-ratio));
|
|
}`,
|
|
}
|
|
@var select xmc_unread 'Unread Indicators' {
|
|
'Stock': "",
|
|
'Circles*': `[class^="listItem-"]:hover [class^="pill-"] {
|
|
display: none;
|
|
}
|
|
[class^="listItem-"] [class^="pill-"] {
|
|
width: 52px !important;
|
|
height: 56px !important;
|
|
top: -4px !important;
|
|
left: 11px;
|
|
z-index: 100;
|
|
}
|
|
[class^="listItem-"] [class^="pill-"] > span {
|
|
display: none;
|
|
}
|
|
[class^="listItem-"] [class^="pill-"] > span[style*="height: 8px;"] {
|
|
display: block;
|
|
left: 4px;
|
|
bottom: 2px;
|
|
height: 12px !important;
|
|
width: 12px !important;
|
|
border-radius: 100% !important;
|
|
transform: none !important;
|
|
z-index: 100;
|
|
background: var(--red, var(--status-red-500));
|
|
}
|
|
[class^="listItem-"] [class^="pill-"] > span[style*="height: 40px;"] {
|
|
display: block;
|
|
background: transparent;
|
|
height: 46px !important;
|
|
width: 46px !important;
|
|
right: 4px;
|
|
top: 5px !important;
|
|
border-radius: 10% !important;
|
|
box-shadow: 0 0 0 2.5px var(--accent, var(--brand-500));
|
|
z-index: 100;
|
|
}
|
|
|
|
[class^="listItem-"]:hover [class^="pill-"] span {
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
[class^="listItem-"]:not(:hover) [class^="pill-"] span {
|
|
opacity: 0 !important;
|
|
}
|
|
[class^="listItem-"]:not(:hover) [class^="pill-"] span[style^="opacity: 0.7"],
|
|
[class^="listItem-"]:not(:hover) [class^="pill-"] span[style^="opacity: 1"] {
|
|
opacity: 1 !important;
|
|
}
|
|
|
|
[class^="listItem-"] [class^="upperBadge-"] {
|
|
z-index: 500;
|
|
}`,
|
|
}
|
|
@var select xmc_hide_tag 'Hide account details in sidebar' {
|
|
'Off': "",
|
|
'On': `section[class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
[class*="nameTag-"] {
|
|
display: none;
|
|
}
|
|
|
|
section[class^="panels-"] > [class^="container-"]:last-child {
|
|
position: relative;
|
|
}
|
|
|
|
section[class^="panels-"] > [class^="container-"]:last-child > div:last-child {
|
|
position: absolute;
|
|
right: 0;
|
|
padding-right: 8px;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_titlebars 'Titlebars' {
|
|
'Off': "",
|
|
'XMC*': `[class*="recentMentionsPopout-"],
|
|
[class^="messagesPopoutWrap-"],
|
|
[class^="browser-"] {
|
|
border-radius: 0;
|
|
}
|
|
|
|
[class*="recentMentionsPopout-"] > [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*="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;
|
|
}
|
|
|
|
[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^="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);
|
|
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^="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^="connectedAccounts-"] > [class^="connectedAccountsColumn-"] {
|
|
margin-top: 28px;
|
|
}
|
|
|
|
[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: inset -1px -1px 0 0 var(--tertiary), inset 1px 1px 0 0 var(--primary),
|
|
inset -2px -2px 0 0 var(--secondary), inset 2px 2px 0 0 var(--wc-bright, var(--highlight));
|
|
|
|
--wc-outer-edge: inset -1px -1px 0 0 var(--tertiary), inset 1px 1px 0 0 var(--wc-bright, var(--highlight)),
|
|
inset -2px -2px 0 0 var(--secondary), inset 2px 2px 0 0 var(--primary) !important;
|
|
}
|
|
.theme-light {
|
|
--wc-frame: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), inset 1px 1px 0 0 var(--primary),
|
|
inset -2px -2px 0 0 var(--tertiary), inset 2px 2px 0 0 var(--secondary);
|
|
|
|
--wc-outer-edge: inset -1px -1px 0 0 var(--wc-bright, var(--highlight)), inset 1px 1px 0 0 var(--secondary),
|
|
inset -2px -2px 0 0 var(--primary), inset 2px 2px 0 0 var(--tertiary);
|
|
}
|
|
|
|
.platform-win #app-mount {
|
|
padding: 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;
|
|
padding: 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;
|
|
padding: 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;
|
|
padding: 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' {
|
|
'Discord*': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAFrSURBVDhPnVNNS8NAFMy5Pyd/pgGvCXi0eLT4C7wKJfSkIKjUg3jrRevFo+AHEhRvIuglabHpttnnm5fNsmmiiA8GXmbmTbKbXW+9gij1gzAddKM06YapMkiYHwRR5htbs1js8OCQB4n7H5AS6zGjY8bKYpGHs0lzoB0cMKmF8JvjNuNv4IBhNezj0yphYzOjvf0vOjie09bOVIAeHDQbEMpyfI8bbI4Vrm8Uaa1bAc31YhYBvMMlsb07ax10AY8TkCBAVcTZRS6mj8+CjkY55bkWoAcHbcQeJ0DVAm7vl2IaXy7kOXlZCdCDgwZP5a8C7BKeX1diUkrTw1MZBqAHhx4eJ0CWYDfx9DynotD09l7Q+GpBd49LAXpw0OCxAXw65TdyiCV7/RkdnsztcwVwvf7U4TDDvxHFAf85SLEMozgA9+DPR5nfXD/KKITIlzjLWQeWCg+8ZqxZcrRxnXmHGYp7IAEHzdhMed43/d6Afr0nB7gAAAAASUVORK5CYII=");
|
|
}`,
|
|
'Discord Canary': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGhSURBVDhPlZNdKwRhFMfner6CzXukFE2JlIj4BHLtS/ANKOUDjGnviF3rnV03XJhyIXm92W2Wi+VGKDZSe2ae5zjneZ7ZtEhO/ZrzPOf3n7dmrNoK90cdwg33xwICDNTz3qhjtO8F2WE7zI0kCfwDL8wN2yamC/YGbcgO+WF2COn4K1/mPmdMnE8w4BH4T5I6vNPvEBgTHk2iKO2ieDjG6Hpewb0o7amZ8narvmPBdq8L232ooNuTH48opfwZmqlHiH3KWrDVExDIRFdzPwe/wE7sc9aCTQcIZMTjqZLE8zlGJ1Mo4Y14p34axdOZnpET+5y1YKMLCGRkpayvkl+gdTfK8g1xq/oo7+q7ICf2OWvBemdAICOl0JIAChZ1z3AvKmYtlGugR1jrcAlkxH1OSy8FFMVF/faZ4hLK14Kaibuscg30EjPtDmTaMCY8nMDoYqa6jokuZzE8GK/Zb9efNqy2epBuwX9BGRXmgnSzDakmH1KNSMdf4Fl17nPGxHVBqsGGlXqPwD/w2DWx7wXLCQeW61wiIMDAPe0lan5ny/oEGx2ifF3nCr4AAAAASUVORK5CYII=");
|
|
}`,
|
|
'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 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 {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAB/SURBVDhPxZALCgAhCEQ9ujcvJ1PMggwWduBRijN9CGLm9sIwRWmzzhbyeUCtDooD2ENWAyjPTKvq3wAmahVk1NkCpHJy7b2mMHuQ6iUAZkOs4PyEaPReuAHWJcAMZlr2wZhOB/UAsBhNt4Ackm5xD5iDW8jsnz8xMoZ0zYiIOusbnt1lWQzCAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
}`,
|
|
'mIRC 6 Inverted': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACCSURBVDhPxY7hCsAgCIT9MfbcvrnT0rIbbAmDHRx11X1GJmaWilspq11QwQj5HrCRvdq1PNC9KRdahjde7foZwCRbpukb4JRjGHOciXTzhLkKACuHtekQC+BcDOcf2LoAcFre5yJMrwHSVC+GXgAIgV9sAHwqQvxcZeHJXQOUrCK6ADMZukVNcDDrAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAA==");
|
|
}`,
|
|
'mIRC 7': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAIgSURBVDhPXZAf2PJQGMZ3HRgEwSB4IfjggyAYDAbBIAgGgyAIgsFgMBgEwSAIPhgEQRAEwSB4IQiCweCF4IUXgmAwGASDQff7nNO/b53r+l17nvuc+37OmcSXZkXQ+nceNf8KNv/VL00YH0u11hhvrwLTT+AsMlH70RU9L4EdphhT7Ucl/E1JZ76gmutXiGquxGbHuWAwKzAKC3S9nPpcfN1VASug3s4E+ugMtbd8BbR7C0ouoNsp9GEC1fqENohhOGdxWBsk9KydQGjDE9rd+Sug1Q3hrS+08QNeC4yQJudk/hZ1VTuK+m6nAGMGj2/0v9DqzMQG/960pKK5q4xuGD81sf7qAdwl3ziA1xXN3L9pKWm7pyYdlBqOLfnJnvqoLj/ZPGjImA9veH0dqu7eAnZkuAaNJ5+8n1E9USqsKKT8VlHGCuJ/DFOrfgvgU65uA4XGBKLnYX1WYcH1fIRpj+GyY9hNZARmDdKaNh7wKZzrmALoICdq0lOIxQfdLO2jPLZRHJrI9iomPQpYcsOUDHfEJI9qgwKIWU1Gsafrf/1BebJwORpIlm3M7Q/4Bj1j/jYxJIN4ks5QEgH12Zoh3zL8LJiYKoyPxSdwAz/MmVJfOg3kKpnon4xlhjRq4bys4TRniAMKNRU4+j2ETyjtBjIycCb3Pm2TkfAoIBw1cVxpOG87OEUdxKEGt6PcAvgE/w3nHZpma3WMVKWCJEnSLy2BBAWWLCo4AAAAAElFTkSuQmCC");
|
|
}`,
|
|
'mIRC 7 Inverted': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAMQSURBVDhPTZB7SFRZGMBP5zrThqNzR5tsMhvL1mwnyyyM/KciInXLyoW1ptSslOzFFEY1udqahG2uu2lsZVH0/KMWbTUKtAfLUqwRRJEQ7SPabWzZ3Zyg50zBr3Ovjzzw4/u+33e+7x6uME5pYn1QgYl7UJ5YR4l7X0upu+6RQvV6We3ed2fVmFrdHDZOccIeug6+N6nLuczlnd1mfne/qrM7uFgeGOgbriH3Z4pGVx/vGxdihesrbje+5+DcABfWP+dS+UuOLnxq1ka8URvmXNH/Zm3QOOcPvCP99I0LkT9iK7/Uv2FP5h386a2sG3+IrZObqZ/XZbodaRfZPPE0vpRTA+5L55aPC/JiNtJR+5zt09r5QuWq/i7PsYFLNc9Ml+dYb7hdRhzs+saFWGQvoa3mH8o8ZzFy00UPctGrTZerYr8zcsOZJ8dWyPmqx3jHNZBjKzAbRhxwkStMl61ivzNyw4kJ38QGFRgkG9TGMGbL0AES+hjvs/DDMo3GfI2KuUnk6lm9C5KqdU6/dXLstZPDL+NI+trOlVAsbSEHrYoLimbF6A0RhB96CHV+QudeC7uzNGo+1xJFoj+S8sAoZl3VyWzXce+I5IxaWN1toypgo+KJDf9fNlylknevV1I9SyPUbuWKP4LKeVqLMJ+4uR8rCT4re3tcFNzTWX5XZ1JVBJ9VaiSXabzrySP8IJnQzRheXPewTS0T8apx5FUcTer5hxTxazV8T+LJvOpgZoeDEQWS0DUroXsuwt0LCHdlcqtpLPsLbfhmyusirliy899R5PzqIOuGg7iVkrLfRpL+YxTp56MYni/pOWvhVauV35ssbJutsWmGbNmUIdPMn+j0Stb96WJ6m53prXacSyVr7seSemwoqUetxC6R/PfTOAJHLPx9wEJnhYXK+VZWpcrjRR6pC+NCSddwppwcxpQTw3AslhTfjiKlXiPlWw19oeR7r86DU2k8bcsg0JzBrYZUSqZGUJAiZwt7tgwqiM4a8pH5vUT1EixWXyv0yKAawDtBsixZPlr6qdwlhBAfAJkz9Tuj0O+XAAAAAElFTkSuQmCC");
|
|
}`,
|
|
'mCord': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACJSURBVDhPxVABDoAgELqn388LvHDMrOnW1i060IPMYGXmsYNm8qrFddxCPg9Y01Y+QM6SJljjzGWt+j2AoiE3Ue4DD5BZIXh1cOhJ9xCoZhY85C1AmqyfgJ0BGnQD+bjOjgsEsa9vB4CBz43q4rN9sv4LOoWbnLvWGlkLIHYCpDFfJkEbK4iIOAFjx6/RbabDvAAAAABJRU5ErkJgggAAAAAAAAAAAAAAAA==");
|
|
}`,
|
|
'mCord Inverted': `:root {
|
|
--titlebar-icon: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAACJSURBVDhPxU9bDoAwCOPDeG5ujjwsYcs0IzGR2G2FtptkxczSgZtq+YAamEO+D9jgtzVqEOjZqhqcT5rbGvV7gJEAN+Fu0U/B0ZBTjoSJnniGwAzUkLcA8OEFtlsAhNXg4qkfPV3q7e2AvHVhxJ7ixXz4Bbyimuq58uwhACG7AeCqD1MCgx0Q0QXjX8uT7Jk2OwAAAABJRU5ErkJgggAAAAAAAAAAAAAAAA==");
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_old_roles 'Old Roles' {
|
|
'Off': "",
|
|
'On*': `[class^="role-"] {
|
|
position: relative;
|
|
border-radius: 5%;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleRemoveButton-"] [class^="roleCircle-"],
|
|
[class^="role-"] [class^="roleRemoveButton-"] [class^="roleFlowerStar-"] {
|
|
margin: 0 !important;
|
|
border-radius: 5% !important;
|
|
width: 100% !important;
|
|
height: 22px !important;
|
|
top: 0;
|
|
left: 0;
|
|
position: absolute;
|
|
z-index: 1;
|
|
opacity: 0.25;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleFlowerStar-"] > svg[class^="linkIcon-"] {
|
|
z-index: 7;
|
|
position: absolute;
|
|
right: -2px;
|
|
top: -2px;
|
|
opacity: 5;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleRemoveButton-"] {
|
|
position: absolute;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 22px;
|
|
overflow-x: clip;
|
|
overflow-y: visible;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleIcon-"] {
|
|
z-index: 5;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleName-"] {
|
|
z-index: 2;
|
|
margin-right: 0;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleRemoveIcon-"] {
|
|
display: block;
|
|
position: absolute;
|
|
top: 4px;
|
|
left: 4px;
|
|
z-index: 6;
|
|
}
|
|
|
|
[class^="role-"] [class^="roleRemoveButton-"] [class*="roleDot-"] {
|
|
width: 1em !important;
|
|
height: 1em !important;
|
|
margin-top: 0.25em;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_old_embeds 'Old Embeds' {
|
|
'Off': "",
|
|
'On*': `[class*="embed-"] {
|
|
border-radius: 0 0 0 0;
|
|
border-color: var(--interactive-active);
|
|
}
|
|
[class*="embed-"] [class*="embedInner-"] {
|
|
border-color: transparent;
|
|
}
|
|
[class*="embed-"] [class*="embedAuthorIcon-"] {
|
|
border-radius: 0;
|
|
}
|
|
[class*="embed-"] [class^="grid-"] {
|
|
padding: 8px !important;
|
|
}
|
|
[class*="embed-"] [class*="embedMargin-"] {
|
|
margin-top: 4px !important;
|
|
}
|
|
[class*="embed-"] [class*="embedMedia-"] {
|
|
margin-top: 4px !important;
|
|
}
|
|
[class*="embed-"] [class*="embedTitle-"] {
|
|
font-size: 16px !important;
|
|
font-weight: 200 !important;
|
|
}
|
|
[class*="embed-"] [class*="embedFieldName-"] {
|
|
font-weight: 500 !important;
|
|
}
|
|
[class*="embed-"] [class*="embedDescription-"],
|
|
[class*="embed-"] [class*="embedFieldName-"],
|
|
[class*="embed-"] [class*="embedFieldValue-"] {
|
|
font-size: 16px !important;
|
|
}
|
|
[class*="embed-"] [class*="embedFooterText-"] {
|
|
font-size: 0.8em;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_left_reply 'Left Side Reply Controls' {
|
|
'Off': "",
|
|
'On*': `[class^="channelTextArea-"] > [class^="attachedBars-"] [class^="replyBar-"],
|
|
[class^="channelTextArea-"]
|
|
> [class^="attachedBars-"]
|
|
[class^="threadSuggestionBar-"] {
|
|
background: transparent;
|
|
}
|
|
|
|
[class^="channelTextArea-"] > [class^="attachedBars-"] [class^="replyBar-"] {
|
|
display: flex;
|
|
flex-direction: row-reverse;
|
|
align-self: flex-start;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="attachedBars-"]
|
|
[class^="replyBar-"]
|
|
> [class^="actions-"] {
|
|
flex-direction: row-reverse;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
> [class^="attachedBars-"]
|
|
[class^="replyBar-"]
|
|
[class*="replyLabel-"] {
|
|
margin-left: 12px;
|
|
}
|
|
|
|
[class^="channelTextArea-"]
|
|
> [class^="attachedBars-"]
|
|
[class^="replyBar-"]
|
|
> [class^="actions-"]::after {
|
|
position: relative;
|
|
content: "";
|
|
background-color: var(--background-modifier-accent);
|
|
width: 1px;
|
|
height: 20px;
|
|
left: 100%;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_collapsing_members 'Collapsing Member List' {
|
|
'Off*': "",
|
|
'On': `[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"] > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
|
|
width: 50px !important;
|
|
min-width: 50px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]:hover > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"]:hover {
|
|
width: 240px !important;
|
|
}
|
|
|
|
[class^="chat-"] > [class^="content-"] > [class^="container"] > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
|
|
min-width: 0;
|
|
min-height: 100%;
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"],[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"] {
|
|
width: 58px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]:hover >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]:hover
|
|
> [class^="members-"]{
|
|
width: 240px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"] >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"] {
|
|
height: 0;
|
|
padding-top: 12px;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]:hover >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]:hover
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"] {
|
|
height: 40px;
|
|
padding-top: 24px;
|
|
}`,
|
|
'Dynamic': `@media (width < 1300px) {
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"] > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
|
|
width: 50px !important;
|
|
min-width: 50px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="container-"]:hover > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"]:hover {
|
|
width: 240px !important;
|
|
}
|
|
|
|
[class^="chat-"] > [class^="content-"] > [class^="container"] > [class^="membersWrap-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
|
|
min-width: 0;
|
|
min-height: 100%;
|
|
background-color: var(--background-secondary);
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"],[class^="chat-"]
|
|
> [class^="content-"]
|
|
> [class^="membersWrap-"]
|
|
> [class^="members-"] {
|
|
width: 58px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]:hover >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]:hover
|
|
> [class^="members-"]{
|
|
width: 240px !important;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"] >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"] {
|
|
height: 0;
|
|
padding-top: 12px;
|
|
}
|
|
|
|
[class^="chat-"]
|
|
> [class^="content-"] > [class^="container-"]:hover >
|
|
[class^="membersWrap-"]
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"],
|
|
[class^="chat-"]
|
|
> [class^="content-"] >
|
|
[class^="membersWrap-"]:hover
|
|
> [class^="members-"]
|
|
> [class^="content-"]
|
|
> [class^="membersGroup-"] {
|
|
height: 40px;
|
|
padding-top: 24px;
|
|
}
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_accessible_styles 'Accessible Font Styles' {
|
|
'Off*': "",
|
|
'Italics + Bold': `span[data-slate-leaf="true"][class*="italics-"],
|
|
em {
|
|
font-style: normal;
|
|
display: inline-block;
|
|
transform: skewX(-8deg);
|
|
color: #f80;
|
|
}
|
|
|
|
span[data-slate-leaf="true"][class*="bold-"],
|
|
strong {
|
|
font-weight: 400;
|
|
text-shadow: 0.1px 0.1px, -0.1px -0.1px;
|
|
}`,
|
|
'Just Italics': `span[data-slate-leaf="true"][class*="italics-"],
|
|
em {
|
|
font-style: normal;
|
|
display: inline-block;
|
|
transform: skewX(-8deg);
|
|
color: #f80;
|
|
}`,
|
|
'Just Colored Italics': `span[data-slate-leaf="true"][class*="italics-"],
|
|
em {
|
|
color: #f80;
|
|
}`
|
|
}
|
|
|
|
@var select xmc_compacter_mode 'Compact-er Mode' {
|
|
'Off*': "",
|
|
'On': `[class*="guilds-"] [class^="listItemWrapper-"] > [class^="wrapper-"],
|
|
[class*="guilds-"] [class^="listItemWrapper-"] > [class^="wrapper-"] > svg,
|
|
[class*="guilds-"] [class^="listItem-"] [class^="wrapper-"]:has(> svg),
|
|
[class*="guilds-"] [class^="listItem-"] [class^="wrapper-"]:has(> svg) > svg,
|
|
[class*="guilds-"] [class^="listItem-"] [class^="wrapperSimple-"],
|
|
[class*="guilds-"] [class^="listItem-"] [class^="wrapperSimple-"] > svg {
|
|
width: 32px;
|
|
height: 32px;
|
|
}
|
|
|
|
[class*="guilds-"] [class^="listItem-"] > [class^="pill-"],
|
|
[class*="guilds-"]
|
|
[class^="listItem-"]
|
|
> [class^="pill-"]
|
|
> [class^="item-"][style*="height: 40px;"] {
|
|
height: 32px !important;
|
|
}
|
|
|
|
[class*="guilds-"],
|
|
[class*="guilds-"] [class^="listItem-"],
|
|
[class*="guilds-"]
|
|
[class^="wrapper-"]:has(> [class^="expandedFolderBackground-"]) {
|
|
width: 48px;
|
|
}
|
|
[class*="guilds-"] [class^="unreadMentionsIndicator"] {
|
|
width: 48px;
|
|
height: 16px;
|
|
}
|
|
|
|
[class*="guilds-"] > ul > [class^="scroller-"] {
|
|
padding-top: 8px !important;
|
|
}
|
|
[class*="guilds-"] [class^="listItem-"] {
|
|
margin-bottom: 4px;
|
|
}
|
|
|
|
[class*="guilds-"] ul[id^="folder-items-"] > [class^="listItem-"] {
|
|
width: 32px !important;
|
|
height: 32px !important;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
[class*="guilds-"] [class^="expandedFolderBackground-"] {
|
|
width: 32px;
|
|
left: 8px;
|
|
}
|
|
|
|
[class*="guilds-"] ul[id^="folder-items-"] {
|
|
height: unset !important;
|
|
}
|
|
|
|
[class*="guilds-"] ul[class^="tree-"] > [class^="scroller-"] > div[style*="height: 56px;"] {
|
|
height: unset !important;
|
|
}
|
|
|
|
[class*="guilds-"] ul[id^="folder-items-"] > [class^="listItem-"] > [class^="pill-"] {
|
|
left: -8px;
|
|
}
|
|
|
|
section[class^="panels-"] > [class*="activityPanel-"] [class^="gameIcon-"],
|
|
section[class^="panels-"]
|
|
> [class*="activityPanel-"]
|
|
[class^="actions-"]
|
|
> [class^="panelButtonContainer-"]
|
|
> button,
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class*="directionRow-"]
|
|
> button,
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="actionButtons-"]
|
|
button {
|
|
width: 24px;
|
|
height: 24px;
|
|
min-height: 24px;
|
|
}
|
|
|
|
section[class^="panels-"] > [class^="container-"]:last-child {
|
|
position: relative;
|
|
}
|
|
|
|
section[class^="panels-"] > [class^="container-"]:last-child > div:last-child {
|
|
position: absolute;
|
|
right: 0;
|
|
padding-right: 8px;
|
|
}
|
|
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class*="directionRow-"] {
|
|
position: absolute;
|
|
bottom: 8px;
|
|
right: 8px;
|
|
display: grid;
|
|
grid-gap: 4px;
|
|
grid-auto-flow: column;
|
|
}
|
|
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div {
|
|
padding-left: 20px;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"] {
|
|
position: absolute;
|
|
left: 8px;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]:has(> :nth-child(2)) {
|
|
top: 12px;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]
|
|
> svg[class^="ping-"] {
|
|
margin-right: 0;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]
|
|
> [class^="labelWrapper-"],
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]
|
|
> [class^="labelWrapper-"]
|
|
> button {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]
|
|
> [class^="labelWrapper-"] {
|
|
position: relative;
|
|
left: -16px;
|
|
z-index: 10;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="connection-"]
|
|
> [class^="inner-"]
|
|
> div
|
|
> [class^="rtcConnectionStatus-"]
|
|
> [class^="labelWrapper-"]
|
|
> button
|
|
> [class^="contents-"] {
|
|
display: none;
|
|
}
|
|
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="actionButtons-"]
|
|
button {
|
|
padding: 0;
|
|
background: transparent;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="container-"]
|
|
> [class*="actionButtons-"] {
|
|
grid-gap: 4px;
|
|
padding-top: 0;
|
|
grid-template-columns: repeat(auto-fill, minmax(0, 24px));
|
|
height: 24px;
|
|
}
|
|
|
|
section[class^="panels-"] > [class^="container-"] {
|
|
height: 40px;
|
|
padding: 0 4px;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="container-"]
|
|
> [class^="avatarWrapper-"]
|
|
> [class*="avatar-"] {
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="container-"]
|
|
> [class^="avatarWrapper-"]
|
|
> [class*="avatar-"]
|
|
> svg {
|
|
width: 32px !important;
|
|
height: 32px !important;
|
|
}
|
|
section[class^="panels-"]
|
|
> [class^="container-"]
|
|
> [class*="directionRow-"]
|
|
> button {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
section[class^="panels-"] > [class^="container-"] > [class*="directionRow-"] {
|
|
display: grid;
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
padding-right: 4px !important;
|
|
}
|
|
|
|
.hh2-spotify-controls-player {
|
|
margin: 4px 4px !important;
|
|
height: 32px !important;
|
|
}
|
|
.hh2-spotify-controls-album-image {
|
|
width: 32px !important;
|
|
height: 32px !important;
|
|
}
|
|
button.hh2-spotify-controls-button {
|
|
width: 24px !important;
|
|
}
|
|
.hh2-spotify-controls-info-box {
|
|
margin-left: 4px !important;
|
|
max-width: 112px !important;
|
|
margin-right: 4px !important;
|
|
}
|
|
.hh2-spotify-controls-buttons {
|
|
display: grid !important;
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
}
|
|
.hh2-spotify-controls-track-name {
|
|
font-size: 0.75em;
|
|
}
|
|
.hh2-spotify-controls-album-name span,
|
|
.hh2-spotify-controls-album-name a {
|
|
color: var(--text-muted) !important;
|
|
}
|
|
|
|
[class^="members-"] [class^="member-"] > [class*="layout-"] {
|
|
height: 32px;
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"],
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"]
|
|
> [class^="wrapper-"] {
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"]
|
|
> [class^="wrapper-"]
|
|
> svg[viewBox="0 0 40 40"] {
|
|
width: 32px !important;
|
|
height: 32px !important;
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="avatarDecoration-"] {
|
|
top: calc((.4 - var(--decoration-to-avatar-ratio)/2)*32px);
|
|
left: calc((.475 - var(--decoration-to-avatar-ratio)/2)*32px);
|
|
width: calc(32px * var(--decoration-to-avatar-ratio));
|
|
height: calc(32px * var(--decoration-to-avatar-ratio));
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"]
|
|
> [class^="wrapper-"]
|
|
> svg[viewBox="0 0 32 32"] {
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="avatar-"] {
|
|
margin-right: 8px;
|
|
}
|
|
[class^="members-"] [class^="membersGroup-"] {
|
|
padding: 12px 8px 0 8px !important;
|
|
height: unset;
|
|
}
|
|
[class^="members-"]
|
|
[class^="member-"]
|
|
> [class*="layout-"]
|
|
> [class^="children-"]
|
|
> .presence-icons-wrapper
|
|
> span
|
|
> img {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
[class^="sidebar-"]
|
|
[class^="containerDefault-"]:has(> [class*="clickable-"]) {
|
|
padding-top: 8px;
|
|
}
|
|
[class^="sidebar-"] ul[class^="content-"] > div[style="height: 12px;"] {
|
|
height: 6px !important;
|
|
}
|
|
[class^="sidebar-"] ul[class^="content-"] > div[style="height: 84px;"] {
|
|
height: 100px !important;
|
|
}
|
|
[class^="sidebar-"] ul[class^="content-"] > [class^="sectionDivider-"] {
|
|
margin-top: 6px;
|
|
}
|
|
[class^="sidebar-"]
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"] {
|
|
padding: 0 4px;
|
|
}
|
|
[class^="sidebar-"]
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"],
|
|
[class^="sidebar-"]
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="children-"]
|
|
> [class^="iconItem-"] {
|
|
padding: 3px 0;
|
|
}
|
|
[class^="sidebar-"] [class^="containerDefault-"] [class^="voiceUser-"] [class^="userAvatar-"] {
|
|
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%
|
|
);
|
|
}
|
|
|
|
[class^="animatedBannerHoverLayer-"] {
|
|
top: -32px !important;
|
|
height: 32px !important;
|
|
}
|
|
|
|
[nop=nop] [class^="members-"] > [class^="content-"],
|
|
[nop=nop] [class^="sidebar-"] ul[class^="content-"] {
|
|
height: unset !important;
|
|
padding-bottom: 8px;
|
|
}
|
|
|
|
[class^="sidebar-"] header[class^="header-"] {
|
|
padding: 4px 8px;
|
|
}
|
|
[class^="chat-"] > [class^="title-"] {
|
|
height: 32px;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
> [class^="search-"]
|
|
[class^="searchBar-"] {
|
|
height: 24px !important;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
> [class^="search-"]
|
|
[class^="searchBar-"]
|
|
> .DraftEditor-root,
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
> [class^="search-"]
|
|
[class^="searchBar-"]
|
|
> [class^="icon-"] {
|
|
margin-top: 0 !important;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
[class^="iconWrapper-"] {
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
[class*="iconWrapper-"]
|
|
> svg {
|
|
margin: 0 !important;
|
|
padding: 1px;
|
|
}
|
|
[class^="chat-"] > [class^="title-"] [class^="toolbar-"] {
|
|
display: grid;
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
[class^="toolbar-"]
|
|
> [class^="icon-"]:has(> [class^="text-md-normal-"]) {
|
|
margin-left: 4px;
|
|
margin-right: 0;
|
|
}
|
|
[class^="chat-"] > [class^="title-"] [class^="topic-"] {
|
|
margin-left: 4px;
|
|
}
|
|
[class^="chat-"] > [class^="title-"] [class^="titleWrapper-"] {
|
|
margin-right: 4px;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
> [class^="children-"]
|
|
> [class^="iconWrapper-"],
|
|
[class^="chat-"] > [class^="title-"] [class^="divider-"] {
|
|
margin: 0 4px;
|
|
}
|
|
[class^="chat-"]
|
|
> [class^="title-"]
|
|
> [class^="children-"]
|
|
> [class^="iconWrapper-"]
|
|
> svg {
|
|
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;
|
|
}
|
|
[class^="chatContent-"]
|
|
> form
|
|
[class^="channelTextArea"]
|
|
> [class^="scrollableContainer-"]
|
|
> [class^="inner-"]
|
|
> [class^="textArea-"]
|
|
> div
|
|
> [class*="fontSize16Padding-"] {
|
|
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-"],
|
|
[class^="channelTextArea-"] [class^="attachWrapper-"],
|
|
[class^="channelTextArea-"] [class^="attachButton-"],
|
|
[class^="channelTextArea-"] > [class^="scrollableContainer-"],
|
|
[class^="channelTextArea-"] [class^="inner-"] > [class^="textArea-"] {
|
|
min-height: 40px !important;
|
|
}
|
|
[class^="channelTextArea-"] [class^="buttons-"],
|
|
[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;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
[class^="buttons-"]
|
|
[class*="buttonContainer-"]
|
|
> button:not(:has(> [class*="innerButton-"])) {
|
|
margin: 0;
|
|
}
|
|
[class^="channelTextArea-"] [class^="buttons-"] > [class^="separator-"],
|
|
[class^="channelTextArea-"]
|
|
[class^="buttons-"]
|
|
> [class^="separator-"]
|
|
[class*="innerButton-"] {
|
|
margin-left: 4px;
|
|
}
|
|
[class^="channelTextArea-"]
|
|
[class^="buttons-"]
|
|
> [class^="separator-"]
|
|
[class*="innerButton-"] {
|
|
margin-right: 0;
|
|
}
|
|
|
|
[class*="menu-"] [class^="scroller-"] {
|
|
padding: 4px;
|
|
}
|
|
[class*="menu-"] [class^="scroller-"]::-webkit-scrollbar {
|
|
width: 4px;
|
|
}
|
|
[class*="menu-"] [class^="scroller-"] [class^="item-"] {
|
|
margin: 1px 0;
|
|
padding: 0 4px;
|
|
min-height: 24px;
|
|
}
|
|
[class*="menu-"]
|
|
[class^="scroller-"]
|
|
[class^="customItem-"][id^="message-quickreact-"]
|
|
> [class^="button-"] {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
[class*="menu-"]
|
|
[class^="scroller-"]
|
|
[class^="wrapper-"]:has(
|
|
> [class^="customItem-"][id^="message-quickreact-"]
|
|
) {
|
|
padding: 0;
|
|
margin-bottom: 4px;
|
|
}
|
|
[class*="menu-"]
|
|
[class^="scroller-"]
|
|
[class^="item-"]
|
|
> [class^="labelContainer-"],
|
|
[class*="menu-"]
|
|
[class^="scroller-"]
|
|
[class^="item-"]
|
|
> [class^="sliderContainer-"] {
|
|
padding: 0;
|
|
}
|
|
[class*="menu-"]
|
|
[class^="scroller-"]
|
|
[class^="item-"]
|
|
> [class^="labelContainer-"] {
|
|
min-height: 24px;
|
|
}
|
|
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] {
|
|
height: 36px;
|
|
padding: 0 4px;
|
|
}
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"],
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"] > [class^="wrapper-"] {
|
|
height: 24px !important;
|
|
width: 24px !important;
|
|
}
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"] > [class^="wrapper-"] > svg[viewbox="0 0 40 40"] {
|
|
height: 32px !important;
|
|
width: 32px !important;
|
|
}
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"] > [class^="wrapper-"] > svg[viewbox="0 0 32 32"] {
|
|
height: 24px !important;
|
|
width: 24px !important;
|
|
}
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"] {
|
|
margin-right: 8px;
|
|
}
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class^="channel-"] [class*="layout-"] > [class^="avatar-"]
|
|
> [class^="wrapper-"]
|
|
> [class^="avatarDecoration-"] {
|
|
top: calc((.4 - var(--decoration-to-avatar-ratio)/2)*32px);
|
|
left: calc((.475 - var(--decoration-to-avatar-ratio)/2)*32px);
|
|
width: calc(32px * var(--decoration-to-avatar-ratio));
|
|
height: calc(32px * var(--decoration-to-avatar-ratio));
|
|
}
|
|
|
|
|
|
[class^="sidebar-"] > [class^="privateChannels-"] ul[class^="content-"] > [class*="privateChannelsHeaderContainer-"] {
|
|
padding: 9px 4px 2px 9px;
|
|
height: 24px;
|
|
}
|
|
|
|
[class^="sidebar-"] > [class^="privateChannels-"] > [class^="searchBar-"] {
|
|
height: 32px;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_collapsing_sidebar 'Collapsing Sidebar' {
|
|
'Off*': "",
|
|
'On': `div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
|
|
width: unset;
|
|
z-index: 9;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
|
|
width: 56px;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
|
|
width: 240px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> *:not(:last-child),
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> [class^="avatarWrapper-"]
|
|
> [class^="nameTag-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> div:last-child {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 224px;
|
|
position: relative;
|
|
bottom: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 40px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav
|
|
> [class^="scroller-"] {
|
|
margin-top: 48px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="privateChannels-"]
|
|
> [class^="searchBar-"] {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 240px;
|
|
z-index: 101;
|
|
background: var(--background-secondary);
|
|
padding: 0;
|
|
}
|
|
|
|
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%
|
|
);
|
|
}
|
|
|
|
[class^="animatedBannerHoverLayer-"] {
|
|
top: -48px !important;
|
|
height: 48px !important;
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="chatContent-"]
|
|
> form
|
|
> [class^="channelTextArea"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 184px;
|
|
width: calc(100% - 184px);
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="channelInfo-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"][class*="selected-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="children-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]:not([class*="typeThread-"])
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class^="icons-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class*="username-"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"][class*="typeThread-"]
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"] {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] {
|
|
height: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] > * {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing-indicator,
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) [class^="devBanner-"] {
|
|
display: none;
|
|
}`,
|
|
'Compact-er Support': `div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
|
|
width: unset;
|
|
z-index: 9;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
|
|
width: 56px;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
|
|
width: 240px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> *:not(:last-child),
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> [class^="avatarWrapper-"]
|
|
> [class^="nameTag-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> div:last-child {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 224px;
|
|
position: relative;
|
|
bottom: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 48px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"] {
|
|
padding-top: 32px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="privateChannels-"]
|
|
> [class^="searchBar-"] {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 240px;
|
|
z-index: 101;
|
|
background: var(--background-secondary);
|
|
padding: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"]
|
|
> [class^="animatedContainer-"] {
|
|
height: 32px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"]
|
|
> [class^="animatedContainer-"]
|
|
> [class^="bannerImage-"] {
|
|
height: 32px;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"]
|
|
> [class^="animatedContainer-"]
|
|
> [class^="bannerImage-"]:after {
|
|
content: "";
|
|
height: 32px;
|
|
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;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="chatContent-"]
|
|
> form
|
|
> [class^="channelTextArea"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 184px;
|
|
width: calc(100% - 184px);
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="channelInfo-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"][class*="selected-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="children-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]:not([class*="typeThread-"])
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class^="icons-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class*="username-"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"][class*="typeThread-"]
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"] {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] {
|
|
height: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] > * {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing-indicator,
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) [class^="devBanner-"] {
|
|
display: none;
|
|
}`,
|
|
'Dynamic': `@media (width < 1300px) {
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
|
|
width: unset;
|
|
z-index: 9;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
|
|
width: 56px;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
|
|
width: 240px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> *:not(:last-child),
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> [class^="avatarWrapper-"]
|
|
> [class^="nameTag-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> div:last-child {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 224px;
|
|
position: relative;
|
|
bottom: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 40px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav {
|
|
margin-top: 48px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="privateChannels-"]
|
|
> [class^="searchBar-"] {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 240px;
|
|
z-index: 101;
|
|
background: var(--background-secondary);
|
|
padding: 0;
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="chatContent-"]
|
|
> form
|
|
> [class^="channelTextArea"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 184px;
|
|
width: calc(100% - 184px);
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="channelInfo-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"][class*="selected-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="children-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]:not([class*="typeThread-"])
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class^="icons-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class*="username-"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"][class*="typeThread-"]
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"] {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] {
|
|
height: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] > * {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing-indicator,
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) [class^="devBanner-"] {
|
|
display: none;
|
|
}
|
|
}`,
|
|
'Dynamic + Compact-er Support': `@media (width < 1300px) {
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
|
|
width: unset;
|
|
z-index: 9;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
|
|
width: 56px;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
|
|
width: 240px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> *:not(:last-child),
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> [class^="avatarWrapper-"]
|
|
> [class^="nameTag-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child
|
|
> div:last-child {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 224px;
|
|
position: relative;
|
|
bottom: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="panels-"]
|
|
> [class^="container-"]:last-child {
|
|
width: 40px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav {
|
|
margin-top: 32px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="container-"]
|
|
> [class^="container-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"]))
|
|
> nav[class^="privateChannels-"]
|
|
> [class^="searchBar-"] {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 240px;
|
|
z-index: 101;
|
|
background: var(--background-secondary);
|
|
padding: 0;
|
|
}
|
|
|
|
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%
|
|
);
|
|
}
|
|
|
|
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;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="chatContent-"]
|
|
> form
|
|
> [class^="channelTextArea"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 184px;
|
|
width: calc(100% - 184px);
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
|
|
~ [class^="chat-"]
|
|
[class^="title-"] {
|
|
margin-left: 0;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="channelInfo-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"][class*="selected-"]
|
|
[class^="iconVisibility-"]
|
|
> [class^="content-"]
|
|
> [class^="children-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"]:not([class*="typeThread-"])
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
> [class^="iconVisibility-"][class*="clickable-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class^="icons-"],
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="voiceUser-"]
|
|
> [class^="content-"]
|
|
> [class*="username-"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
[class^="containerDefault-"]
|
|
[class^="iconVisibility-"][class*="typeThread-"]
|
|
> [class^="content-"]
|
|
> [class^="mainContent-"]
|
|
> [class^="name-"] {
|
|
margin-left: 20px;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] {
|
|
height: 0;
|
|
}
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
|
|
> [class^="privateChannels-"]
|
|
ul[class^="content-"]
|
|
> [class*="privateChannelsHeaderContainer-"] > * {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) .channel-typing-indicator,
|
|
div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover) [class^="devBanner-"] {
|
|
display: none;
|
|
}
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_pip 'Disable Picture-in-picture' {
|
|
'Off*': "",
|
|
'On': `[class*="pictureInPicture-"] {
|
|
display: none;
|
|
}`
|
|
}
|
|
|
|
@var select xmc_help_button 'Disable Help Button' {
|
|
'Off': "",
|
|
'On*': `a[href="https://support.discord.com"],
|
|
[class^="toolbar-"] > div:not([class]) > [class^="iconWrapper-"][aria-expanded] {
|
|
display: none;
|
|
}`
|
|
}
|
|
@var select xmc_unmirror 'Unmirror Own Camera' {
|
|
'Off': "",
|
|
'On*': `[class*="mirror-"] {
|
|
transform: none !important;
|
|
}`
|
|
}
|
|
|
|
@var select xmc_wide_settings 'Full-width Settings' {
|
|
'Off': "",
|
|
'On*': `[class*="standardSidebarView-"]
|
|
[class*="contentColumn-"]:not([class*="contentColumnWide-"]) {
|
|
max-width: 100%;
|
|
}
|
|
|
|
[class*="standardSidebarView-"] [class*="sidebarRegion-"] {
|
|
flex: 0;
|
|
}
|
|
|
|
[class^="accountProfileCard-"] {
|
|
max-width: 660px;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_hide_nowplaying 'Hide Friends Activity Sidebar' {
|
|
'Off': "",
|
|
'On*': `[class^="nowPlayingColumn-"] {
|
|
display: none;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_voice_rings 'Outset Voice Rings' {
|
|
'Off': "",
|
|
'On*': `[class*="avatarSpeaking-"],
|
|
[class^="avatar-"][class*="speaking-"] {
|
|
box-shadow: 0 0 0 2px var(--status-online, var(--status-green-600)),
|
|
0 0 0 3px var(--background-secondary) !important;
|
|
}
|
|
|
|
[class^="voiceUsers-"] [class^="avatarContainer-"] {
|
|
overflow: visible;
|
|
}`,
|
|
}
|
|
|
|
@var select xmc_override_titlebar 'Override Titlebar Color' {
|
|
'Off*': "",
|
|
'On': `:root,
|
|
.theme-dark,
|
|
.theme-light {
|
|
--titlebar-color: var(--xmc-titlebar-color) !important;
|
|
}`,
|
|
}
|
|
@var color xmc_titlebar_color 'Titlebar Override' '#72767d'
|
|
|
|
@var color xmc_custom_color0 'Custom Scheme: Unix Black' '#484f58'
|
|
@var color xmc_custom_color1 'Custom Scheme: Unix Red' '#f85149'
|
|
@var color xmc_custom_color2 'Custom Scheme: Unix Green' '#3fb950'
|
|
@var color xmc_custom_color3 'Custom Scheme: Unix Yellow' '#d29922'
|
|
@var color xmc_custom_color4 'Custom Scheme: Unix Blue' '#58a6ff'
|
|
@var color xmc_custom_color5 'Custom Scheme: Unix Magenta' '#bc8cff'
|
|
@var color xmc_custom_color6 'Custom Scheme: Unix Cyan' '#39c5cf'
|
|
@var color xmc_custom_color7 'Custom Scheme: Unix White' '#b1bac4'
|
|
@var color xmc_custom_color8 'Custom Scheme: Unix Bright Black' '#6e7681'
|
|
@var color xmc_custom_color9 'Custom Scheme: Unix Bright Red' '#ff7b72'
|
|
@var color xmc_custom_color10 'Custom Scheme: Unix Bright Green' '#56d364'
|
|
@var color xmc_custom_color11 'Custom Scheme: Unix Bright Yelllow' '#e3b341'
|
|
@var color xmc_custom_color12 'Custom Scheme: Unix Bright Blue' '#79c0ff'
|
|
@var color xmc_custom_color13 'Custom Scheme: Unix Bright Magenta' '#d2a8ff'
|
|
@var color xmc_custom_color14 'Custom Scheme: Unix Bright Cyan' '#56d4dd'
|
|
@var color xmc_custom_color15 'Custom Scheme: Unix Bright White' '#f0f6fc'
|
|
@var color xmc_custom_foreground 'Custom Scheme: Foreground' '#b1bac4'
|
|
@var color xmc_custom_primary 'Custom Scheme: Primary' '#36393f'
|
|
@var text xmc_custom_primary_rgb 'Color Scheme: Primary (R, G, B)' '54, 57, 63'
|
|
@var color xmc_custom_secondary 'Custom Scheme: Secondary' '#2f3136'
|
|
@var text xmc_custom_secondary_rgb 'Color Scheme: Secondary (R, G, B)' '47, 49, 54'
|
|
@var color xmc_custom_tertiary 'Custom Scheme: Tertiary' '#202225'
|
|
@var text xmc_custom_tertiary_rgb 'Color Scheme: Tertiary (R, G, B)' '32, 34, 37'
|
|
@var color xmc_custom_accent 'Custom Scheme: Accent' '#7289da'
|
|
@var text xmc_custom_accent_rgb 'Color Scheme: Accent (R, G, B)' '114, 137, 218'
|
|
@var color xmc_custom_highlight 'Custom Scheme: Highlight' '#72767d'
|
|
@var text xmc_custom_highlight_rgb 'Color Scheme: Highlight (R, G, B)' '114, 118, 125'
|
|
@var color xmc_custom_red 'Custom Scheme: Red' '#f04747'
|
|
@var color xmc_custom_text 'Custom Scheme: Text' '#dcddde'
|
|
@var color xmc_custom_link 'Custom Scheme: Link' '#00aff4'
|
|
@var color xmc_custom_status_online 'Custom Scheme: Status - Online' '#43b581'
|
|
@var color xmc_custom_status_idle 'Custom Scheme: Status - Idle' '#faa61a'
|
|
@var color xmc_custom_status_dnd 'Custom Scheme: Status - Do Not Disturb' '#f04747'
|
|
@var color xmc_custom_status_offline 'Custom Scheme: Status - Offline/Invisible' '#747f8d'
|
|
@var color xmc_custom_status_streaming 'Custom Scheme: Status - Streaming' '#593695'
|
|
@var color xmc_custom_hover 'Custom Scheme: Interactive Hover' '#f0f6fc'
|
|
@var color xmc_custom_active 'Custom Scheme: Interactive Active' '#f0f6fc'
|
|
==/UserStyle== */
|
|
|
|
@-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 */
|
|
|
|
[class^="container-"] > [class^="slider-"] > svg {
|
|
display: none;
|
|
}
|
|
|
|
[class*="unreadBar-"] {
|
|
margin: 4px;
|
|
border-radius: 4px !important;
|
|
}
|
|
|
|
[class^="modalTextContainer-"] {
|
|
overflow: scroll !important;
|
|
}
|
|
|
|
[class^="content-"] > [class^="sidebar-"] {
|
|
border-radius: 0;
|
|
}
|
|
|
|
.platform-osx [class*="guilds-"] > ul > [class^="scroller-"] {
|
|
padding-top: 4px;
|
|
}
|
|
|
|
[class^="slider-"] {
|
|
padding-top: 0 !important;
|
|
}
|
|
|
|
.platform-win
|
|
nav[class*="guilds-"]
|
|
> ul[class^="tree-"]
|
|
> [class^="scroller-"] {
|
|
padding-top: 12px !important;
|
|
}
|
|
|
|
[class*="timestampVisibleOnHover-"] {
|
|
opacity: 1 !important;
|
|
}
|
|
|
|
[class^="message-"][class*="compact-"] {
|
|
padding-top: 0 !important;
|
|
padding-bottom: 0 !important;
|
|
}
|
|
|
|
[class*="progressBarHeader-"] > [class^="container-"],
|
|
[class^="control-"] > [class^="container-"] {
|
|
transition: background-color 0.75s linear;
|
|
}
|
|
|
|
[class*="barBase-"] {
|
|
padding-bottom: 0 !important;
|
|
border-radius: 8px;
|
|
margin: 0 4px;
|
|
}
|
|
|
|
[class^="markdown-"] code {
|
|
border-radius: 5%;
|
|
}
|
|
.hljs {
|
|
display: block;
|
|
overflow-x: auto;
|
|
padding: 0.5em;
|
|
}
|
|
|
|
[id^="message-username-"]
|
|
[class^="badge-"]:has(> [class^="badgeVerifiedIcon-"]) {
|
|
display: none;
|
|
}
|
|
|
|
/* remove "dead space"/padding from vc users */
|
|
[class*="containerDefault-"] [class*="listDefault-"] {
|
|
padding-left: 8px !important;
|
|
}
|
|
[class*="containerDefault-"]
|
|
[class*="listDefault-"]
|
|
[class^="avatarContainer-"] {
|
|
margin-left: 6px !important;
|
|
}
|
|
[class*="containerDefault-"] [class*="listDefault-"] > [class^="clickable-"] {
|
|
padding-left: 0 !important;
|
|
}
|
|
[class*="containerDefault-"]
|
|
[class*="listDefault-"]
|
|
> [class^="clickable-"]
|
|
> [class^="content-"] {
|
|
margin-left: 0 !important;
|
|
}
|
|
[class*="containerDefault-"] [class*="listDefault-"] > [class^="separator-"] {
|
|
width: 100% !important;
|
|
margin: 3px !important;
|
|
}
|
|
|
|
/* Change Nickname Modal */
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]:not([class*="carouselModal-"]) {
|
|
background-color: var(--background-primary);
|
|
}
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> form
|
|
> [class^="flex-"]:nth-child(3),
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> [class^="flex-"]:nth-child(3) {
|
|
background: var(--background-secondary);
|
|
}
|
|
|
|
/* Delete Modal */
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> [class^="content-"]
|
|
> [class^="message-"] {
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
/* dropdown menus */
|
|
[class^="css-"][class$="-menu"] {
|
|
z-index: 9999;
|
|
background-color: var(--background-secondary);
|
|
border-color: var(--background-primary);
|
|
}
|
|
|
|
/* listen along */
|
|
[id^="popout_"] [class^="userList-"] {
|
|
border-color: var(--background-primary) !important;
|
|
}
|
|
[id^="popout_"] [class^="userList-"] [class^="header-"] {
|
|
background-color: var(--background-secondary) !important;
|
|
color: var(--header-primary) !important;
|
|
}
|
|
[id^="popout_"] [class^="userList-"] [class^="content-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
|
|
[class*="moreUsers-"] {
|
|
background-color: var(--background-tertiary) !important;
|
|
}
|
|
|
|
/* autocomplete */
|
|
[class^="autocomplete-"] {
|
|
border: none !important;
|
|
background-color: var(--background-floating) !important;
|
|
box-shadow: 0 2px 5px 0 var(--background-secondary) !important;
|
|
}
|
|
|
|
[class^="autocomplete-"] [class*="selectorSelected-"],
|
|
[class^="autocomplete-"] [class*="autocompleteRow-"] [class*="selected-"] {
|
|
background-color: var(--background-secondary) !important;
|
|
}
|
|
|
|
[class^="autocomplete-"] [class*="categoryHeader-"] {
|
|
background-color: var(--background-floating) !important;
|
|
}
|
|
|
|
/* misc color fixes */
|
|
[class^="peopleColumn-"] {
|
|
background: var(--background-primary);
|
|
}
|
|
|
|
[class^="itemCard-"] [class*="inset-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
|
|
[class*="outer-"][class*="interactive-"]:hover {
|
|
background-color: var(--background-modifier-hover) !important;
|
|
}
|
|
|
|
[class^="base-"] > [class^="content-"] > [class^="container-"] {
|
|
background: var(--background-primary);
|
|
}
|
|
|
|
[class*="modal-"][class*="root-"] {
|
|
background-color: var(--background-primary);
|
|
box-shadow: var(--deprecated-card-bg) 0px 0px 0px 1px,
|
|
rgba(0, 0, 0, 0.2) 0px 2px 10px 0px;
|
|
}
|
|
|
|
[class^="perksModal-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
[class^="directoryModal-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
|
|
[class^="layerContainer-"] > [class^="layer-"] > [class^="container-"] {
|
|
background: var(--background-floating);
|
|
}
|
|
[class^="layerContainer-"]
|
|
> [class^="layer-"]
|
|
> [class^="container-"]
|
|
[class^="option-"]:after {
|
|
background: transparent;
|
|
}
|
|
|
|
[class^="layerContainer-"]
|
|
> [class^="layer-"]
|
|
> [class^="container-"]
|
|
[class^="option-"][class*="selected-"] {
|
|
background: var(--background-modifier-hover);
|
|
}
|
|
|
|
[class^="chat-"][class*="background-"],
|
|
[class^="title-"][class*="background-"],
|
|
[class^="chat-"] > [class^="content-"] > [class^="container-"] {
|
|
background-color: var(--background-tertiary) !important;
|
|
}
|
|
|
|
[class*="headerBarInner-"]:after {
|
|
background: transparent !important;
|
|
}
|
|
|
|
[class^="streamPreview-"] {
|
|
background-color: var(--background-secondary) !important;
|
|
}
|
|
[class^="streamPreview-"] > [class^="previewContainer-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
|
|
[class*="messageContent-"].deleted-message {
|
|
color: var(--status-red-500) !important;
|
|
}
|
|
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class^="container-"]
|
|
[class*="footer-"],
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class*="modalSize-"],
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class*="modalSize-"]
|
|
[class*="footer-"],
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class*="modalRoot-"],
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class*="modalRoot-"]
|
|
[class*="footer-"] {
|
|
background-color: var(--background-primary) !important;
|
|
}
|
|
|
|
[class^="layerContainer-"]
|
|
[class^="layer-"]
|
|
[class^="focusLock-"]
|
|
[class^="container-"]
|
|
[class*="footer-"] {
|
|
box-shadow: none;
|
|
}
|
|
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> [class^="scroller-"] {
|
|
background: var(--background-secondary);
|
|
}
|
|
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
[class^="reactors-"] {
|
|
background-color: var(--background-primary);
|
|
}
|
|
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> [class^="scroller-"]
|
|
> [class^="reactionSelected-"] {
|
|
background-color: var(--background-modifier-active);
|
|
}
|
|
|
|
[class^="focusLock-"][aria-modal="true"]
|
|
> [class*="root-"]
|
|
> [class^="scroller-"]
|
|
> [class^="reactionDefault-"]:hover {
|
|
background-color: var(--background-modifier-hover);
|
|
}
|
|
|
|
[class^="contentWarningPopout-"] {
|
|
background: var(--background-primary) !important;
|
|
box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.3) !important;
|
|
}
|
|
|
|
[class^="customColorPicker-"] {
|
|
background: var(--background-primary) !important;
|
|
}
|
|
|
|
/* jane's steam border ext */
|
|
/*.steam-border-message > #border {
|
|
width: 20px !important;
|
|
height: 20px !important;
|
|
left: 0 !important;
|
|
}
|
|
|
|
.steam-border-popout > #border {
|
|
left: 0 !important;
|
|
top: 0 !important;
|
|
}
|
|
|
|
.steam-border-modal > #border {
|
|
left: 1em !important;
|
|
top: -4.25em !important;
|
|
}
|
|
|
|
.steam-border-modal {
|
|
position: absolute;
|
|
}
|
|
|
|
.steam-border-user > .avatarWrapper {
|
|
top: -7.3em !important;
|
|
left: -6.1em !important;
|
|
}*/
|
|
|
|
/* font fixes */
|
|
[class^="markdown-"] [class^="codeInline-"],
|
|
[class^="codeLine-"],
|
|
[class^="codeBlockText-"],
|
|
[class^="durationTimeDisplay-"],
|
|
[class^="durationTimeSeparator-"],
|
|
[class*="after_inlineCode-"],
|
|
[class*="before_inlineCode-"],
|
|
[class^="inlineCode-"],
|
|
code.inline,
|
|
code,
|
|
.hljs {
|
|
font-family: var(--font-code) !important;
|
|
}
|
|
|
|
/* unbreak resizing webms :^) */
|
|
/*[class^="mediaAttachmentsContainer-"] [class^="imageWrapper-"] {
|
|
min-width: 10px;
|
|
min-height: 10px;
|
|
max-width: unset;
|
|
max-height: unset !important;
|
|
width: unset !important;
|
|
height: unset !important;
|
|
object-fit: none !important;
|
|
aspect-ratio: unset !important;
|
|
}
|
|
[class^="mediaAttachmentsContainer-"] [class^="messageAttachment-"] {
|
|
height: unset;
|
|
}
|
|
[class^="mediaAttachmentsContainer-"] [class^="oneByOneGrid-"],
|
|
[class^="mediaAttachmentsContainer-"] [class^="oneByTwoGrid-"] {
|
|
max-height: unset !important;
|
|
}*/
|
|
|
|
/* BASE THEME END */
|
|
|
|
/* USERCSS REPLACEMENTS START */
|
|
|
|
/*[[xmc_overwrite_colors]]*/
|
|
|
|
.theme-dark,
|
|
:root {
|
|
--xmc_custom_font: "/*[[xmc_font_custom]]*/";
|
|
--xmc_custom_font_mono: "/*[[xmc_font_custom_mono]]*/";
|
|
|
|
--primary-alpha: /*[[xmc_cbg_alpha_primary]]*/ ;
|
|
--secondary-alpha: /*[[xmc_cbg_alpha_secondary]]*/ ;
|
|
--tertiary-alpha: /*[[xmc_cbg_alpha_tertiary]]*/ ;
|
|
--custom-background: /*[[xmc_cbg_background]]*/ ;
|
|
|
|
--xmc-titlebar-color: /*[[xmc_titlebar_color]]*/ ;
|
|
|
|
--xmc-custom-color0: /*[[xmc_custom_color0]]*/ ;
|
|
--xmc-custom-color1: /*[[xmc_custom_color1]]*/ ;
|
|
--xmc-custom-color2: /*[[xmc_custom_color2]]*/ ;
|
|
--xmc-custom-color3: /*[[xmc_custom_color3]]*/ ;
|
|
--xmc-custom-color4: /*[[xmc_custom_color4]]*/ ;
|
|
--xmc-custom-color5: /*[[xmc_custom_color5]]*/ ;
|
|
--xmc-custom-color6: /*[[xmc_custom_color6]]*/ ;
|
|
--xmc-custom-color7: /*[[xmc_custom_color7]]*/ ;
|
|
|
|
--xmc-custom-color8: /*[[xmc_custom_color8]]*/ ;
|
|
--xmc-custom-color9: /*[[xmc_custom_color9]]*/ ;
|
|
--xmc-custom-color10: /*[[xmc_custom_color10]]*/ ;
|
|
--xmc-custom-color11: /*[[xmc_custom_color11]]*/ ;
|
|
--xmc-custom-color12: /*[[xmc_custom_color12]]*/ ;
|
|
--xmc-custom-color13: /*[[xmc_custom_color13]]*/ ;
|
|
--xmc-custom-color14: /*[[xmc_custom_color14]]*/ ;
|
|
--xmc-custom-color15: /*[[xmc_custom_color15]]*/ ;
|
|
|
|
--xmc-custom-foreground: /*[[xmc_custom_foreground]]*/ ;
|
|
|
|
--xmc-custom-primary: /*[[xmc_custom_primary]]*/ ;
|
|
--xmc-custom-secondary: /*[[xmc_custom_secondary]]*/ ;
|
|
--xmc-custom-tertiary: /*[[xmc_custom_tertiary]]*/ ;
|
|
--xmc-custom-primary-rgb: /*[[xmc_custom_primary_rgb]]*/ ;
|
|
--xmc-custom-secondary-rgb: /*[[xmc_custom_secondary_rgb]]*/ ;
|
|
--xmc-custom-tertiary-rgb: /*[[xmc_custom_tertiary_rgb]]*/ ;
|
|
|
|
--xmc-custom-accent: /*[[xmc_custom_accent]]*/ ;
|
|
--xmc-custom-accent-rgb: /*[[xmc_custom_accent_rgb]]*/ ;
|
|
--xmc-custom-red: /*[[xmc_custom_red]]*/ ;
|
|
--xmc-custom-text: /*[[xmc_custom_text]]*/ ;
|
|
--xmc-custom-link: /*[[xmc_custom_link]]*/ ;
|
|
--xmc-custom-highlight: /*[[xmc_custom_highlight]]*/ ;
|
|
--xmc-custom-highlight-rgb: /*[[xmc_custom_highlight_rgb]]*/ ;
|
|
|
|
--xmc-custom-status-online: /*[[xmc_custom_status_online]]*/ ;
|
|
--xmc-custom-status-idle: /*[[xmc_custom_status_idle]]*/ ;
|
|
--xmc-custom-status-dnd: /*[[xmc_custom_status_dnd]]*/ ;
|
|
--xmc-custom-status-offline: /*[[xmc_custom_status_offline]]*/ ;
|
|
--xmc-custom-status-streaming: /*[[xmc_custom_status_streaming]]*/ ;
|
|
|
|
--xmc-custom-hover: /*[[xmc_custom_hover]]*/ ;
|
|
--xmc-custom-active: /*[[xmc_custom_active]]*/ ;
|
|
}
|
|
|
|
/*[[xmc_font]]*/
|
|
/*[[xmc_scheme]]*/
|
|
/*[[xmc_scheme_light]]*/
|
|
/*[[xmc_stylings]]*/
|
|
/*[[xmc_custom_bg]]*/
|
|
/*[[xmc_square_avatars]]*/
|
|
/*[[xmc_9x_bot_tag]]*/
|
|
/*[[xmc_nyantro]]*/
|
|
/*[[xmc_titlebars]]*/
|
|
/*[[xmc_titlebar_icon]]*/
|
|
/*[[xmc_old_titlebar]]*/
|
|
/*[[xmc_textarea]]*/
|
|
/*[[xmc_status_icons]]*/
|
|
/*[[xmc_cozy_compact]]*/
|
|
/*[[xmc_unread]]*/
|
|
/*[[xmc_hide_tag]]*/
|
|
/*[[xmc_old_roles]]*/
|
|
/*[[xmc_old_embeds]]*/
|
|
/*[[xmc_left_reply]]*/
|
|
/*[[xmc_collapsing_members]]*/
|
|
/*[[xmc_accessible_styles]]*/
|
|
/*[[xmc_compacter_mode]]*/
|
|
/*[[xmc_collapsing_sidebar]]*/
|
|
/*[[xmc_pip]]*/
|
|
/*[[xmc_help_button]]*/
|
|
/*[[xmc_unmirror]]*/
|
|
/*[[xmc_wide_settings]]*/
|
|
/*[[xmc_hide_nowplaying]]*/
|
|
/*[[xmc_voice_rings]]*/
|
|
/*[[xmc_override_titlebar]]*/
|
|
|
|
/* USERCSS REPLACEMENTS END */
|
|
}
|