mirror of https://gitlab.com/Cynosphere/xmc.git
7452 lines
233 KiB
CSS
7452 lines
233 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 !important;
|
|
--status-idle: #faa61a !important;
|
|
--status-dnd: #f04747 !important;
|
|
--status-offline: #747f8d !important;
|
|
--status-streaming: #593695 !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color5) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color4) !important;
|
|
|
|
--status-warning-text: var(--primary) !important;
|
|
}
|
|
|
|
#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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color5) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color4) !important;
|
|
|
|
--status-warning-text: var(--primary) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color11) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color13) !important;
|
|
}
|
|
|
|
#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 !important;
|
|
--status-idle: #faa61a !important;
|
|
--status-dnd: #f04747 !important;
|
|
--status-offline: #747f8d !important;
|
|
--status-streaming: #593695 !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color9) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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 !important;
|
|
--status-idle: #faa61a !important;
|
|
--status-dnd: #f04747 !important;
|
|
--status-offline: #747f8d !important;
|
|
--status-streaming: #593695 !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color11) !important;
|
|
--status-dnd: var(--_color9) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color11) !important;
|
|
--status-dnd: var(--_color9) !important;
|
|
--status-offline: var(--highlight) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--xmc-custom-status-idle) !important;
|
|
--status-dnd: var(--xmc-custom-status-dnd) !important;
|
|
--status-offline: var(--xmc-custom-status-offline) !important;
|
|
--status-streaming: var(--xmc-custom-status-streaming) !important;
|
|
|
|
--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 !important;
|
|
--status-idle: #faa61a !important;
|
|
--status-dnd: #f04747 !important;
|
|
--status-offline: #747f8d !important;
|
|
--status-streaming: #593695 !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color11) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color13) !important;
|
|
}`,
|
|
'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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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) !important;
|
|
--status-idle: var(--_color3) !important;
|
|
--status-dnd: var(--_color1) !important;
|
|
--status-offline: var(--_color8) !important;
|
|
--status-streaming: var(--_color5) !important;
|
|
|
|
--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 !important;
|
|
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 !important;
|
|
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;
|
|
}
|
|
|
|
.hljs.ansi {
|
|
line-height: 12px !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^="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 !important;
|
|
padding: 2px;
|
|
box-shadow: var(--wc-frame) !important;
|
|
}
|
|
[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_"] > [class^="hintContainer_"] {
|
|
margin-right: 18px;
|
|
}
|
|
[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 !important;
|
|
background: var(--primary) !important;
|
|
box-shadow: var(--wc-frame);
|
|
border: none !important;
|
|
}
|
|
|
|
[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);
|
|
}
|
|
|
|
[class^="userPopoutOuter_"] {
|
|
padding: 2px !important;
|
|
background: var(--primary) !important;
|
|
border-radius: 0 !important;
|
|
box-shadow: var(--wc-outer-edge);
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"],
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class^="userPopoutOverlayBackground_"] {
|
|
background: transparent;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]:before {
|
|
display: none;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class*="avatarWrapper_"] {
|
|
top: 26px;
|
|
left: 8px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class*="avatarWrapper_"]
|
|
> [class^="avatarHoverTarget_"]
|
|
> [class^="wrapper_"] {
|
|
width: 56px !important;
|
|
height: 56px !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class*="avatarWrapper_"]
|
|
[class*="avatarHint_"] {
|
|
width: 48px !important;
|
|
height: 48px !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class*="avatarWrapper_"]
|
|
> [class^="avatarHoverTarget_"]
|
|
> [class^="wrapper_"]
|
|
> svg {
|
|
width: 55px !important;
|
|
height: 55px !important;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterThemed_"]:after {
|
|
position: absolute;
|
|
top: 2px;
|
|
left: 2px;
|
|
content: "";
|
|
width: calc(100% - 4px);
|
|
height: 18px;
|
|
background: linear-gradient(to right, var(--profile-gradient-primary-color), var(--profile-gradient-secondary-color));
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterUnthemed_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class^="banner_"] {
|
|
height: 18px !important;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterThemed_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedWithBanner_"]
|
|
[class^="banner_"] {
|
|
margin-top: 19px;
|
|
border-radius: 0;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterThemed_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedWithBanner_"]
|
|
[class^="banner_"]:after {
|
|
content: "";
|
|
background: linear-gradient(to bottom, transparent 32px, var(--primary) 64px);
|
|
width: 340px;
|
|
height: 120px;
|
|
position: absolute;
|
|
top: 19px;
|
|
left: 0;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterThemed_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedPremiumWithoutBanner_"]
|
|
[class^="banner_"] {
|
|
display: none;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class^="userPopoutOverlayBackground_"] {
|
|
margin: 0 !important;
|
|
overflow: visible;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedWithBanner_"]
|
|
> [class^="userPopoutOverlayBackground_"] {
|
|
margin-top: -72px !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedPremiumWithoutBanner_"]
|
|
> [class^="userPopoutOverlayBackground_"] {
|
|
margin-top: -48px !important;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterUnthemed_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class^="userPopoutOverlayBackground_"] {
|
|
margin-top: -78px !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedWithBanner_"]
|
|
[class*="usernameSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -60px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedPremiumWithoutBanner_"]
|
|
[class*="usernameSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -56px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterUnthemed_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -54px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
> div {
|
|
display: flex;
|
|
flex-direction: row !important;
|
|
align-items: center;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
> div
|
|
> [class^="userText_"]
|
|
> h1 {
|
|
font-size: 16px !important;
|
|
line-height: 16px !important;
|
|
text-shadow: 1px 1px 0 var(--primary);
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div
|
|
> [class*="userTag_"] {
|
|
line-height: 16px;
|
|
width: max-content;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div
|
|
> [class*="userTag_"]
|
|
> span {
|
|
text-shadow: 1px 1px 0 var(--primary);
|
|
font-size: 12px;
|
|
padding-left: 2px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div {
|
|
position: absolute;
|
|
top: -26px;
|
|
left: -62px;
|
|
z-index: 10;
|
|
flex-direction: row-reverse !important;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterUnthemed_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div {
|
|
position: absolute;
|
|
top: -26px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedPremiumWithoutBanner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div {
|
|
position: absolute;
|
|
top: -24px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
[class^="userText_"]
|
|
> div
|
|
.platform-icons-wrapper {
|
|
margin-left: 0 !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="usernameSection_"]
|
|
> div
|
|
> [class*="pronouns_"] {
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
padding-top: 0;
|
|
margin-left: 4px;
|
|
opacity: 0.75;
|
|
text-shadow: 1px 1px 0 var(--primary);
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterThemed_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedWithBanner_"]
|
|
[class*="customStatusSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -38px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"][class*="userProfileOuterUnthemed_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="customStatusSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -30px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"][class*="userProfileInnerThemedPremiumWithoutBanner_"]
|
|
[class*="customStatusSection_"] {
|
|
padding: 0 !important;
|
|
position: absolute;
|
|
top: -32px;
|
|
left: 64px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="customStatusSection_"]
|
|
> [class^="customStatus_"] {
|
|
font-size: 12px;
|
|
line-height: 12px;
|
|
text-shadow: 1px 1px 0 var(--primary);
|
|
display: flex;
|
|
flex-direction: row !important;
|
|
align-items: center;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="customStatusSection_"]
|
|
> [class^="customStatus_"]
|
|
> [class*="customStatusEmoji_"] {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class*="customStatusSection_"]
|
|
> [class^="customStatus_"]
|
|
> [class^="customStatusText_"] {
|
|
max-height: 24px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
[class^="section_"]:has(> .mutual-guilds) {
|
|
padding-top: 0;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class^="profileBadges_"] {
|
|
visibility: hidden;
|
|
height: 30px !important;
|
|
}
|
|
[class^="userPopoutOuter_"]
|
|
> [class^="userPopoutInner_"]
|
|
> [class^="bannerSVGWrapper_"][viewbox$=" 60"] {
|
|
margin-bottom: 60px;
|
|
}
|
|
`,
|
|
}
|
|
|
|
@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^="container"] > [class^="chatContainer_"] > [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^="chat_"] > [class^="content_"] > [class^="chatContent_"],
|
|
[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,
|
|
div[class^="listItem_"] foreignObject [class^="childWrapper_"],
|
|
div[class^="listItem_"] foreignObject [class*="selected_"] > [class^="childWrapper_"] {
|
|
transition: border-radius 0.35s ease;
|
|
}
|
|
|
|
div[class^="listItem_"] foreignObject [class*="selected_"] > img,
|
|
div[class^="listItem_"] foreignObject [class*="selected_"] > [class^="childWrapper_"] {
|
|
border-radius: 20% !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: 8px !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_"]:nth-child(2) > [class^="membersWrap_"],
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:nth-child(2),
|
|
[class^="chat_"] > [class^="content_"] > [class^="membersWrap_"] {
|
|
width: 50px !important;
|
|
min-width: 50px !important;
|
|
}
|
|
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:nth-child(2):hover,
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:hover > [class^="membersWrap_"],
|
|
[class^="chat_"] > [class^="content_"] > [class^="membersWrap_"]:hover {
|
|
width: 240px !important;
|
|
min-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 !important;
|
|
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 !important;
|
|
padding-top: 24px;
|
|
}`,
|
|
'Dynamic': `@media (width < 1300px) {
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:nth-child(2) > [class^="membersWrap_"],
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:nth-child(2),
|
|
[class^="chat_"] > [class^="content_"] > [class^="membersWrap_"] {
|
|
width: 50px !important;
|
|
min-width: 50px !important;
|
|
}
|
|
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:nth-child(2):hover,
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]:hover > [class^="membersWrap_"],
|
|
[class^="chat_"] > [class^="content_"] > [class^="membersWrap_"]:hover {
|
|
width: 240px !important;
|
|
min-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 !important;
|
|
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 !important;
|
|
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 !important;
|
|
}
|
|
[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 !important;
|
|
}
|
|
[class^="chat_"]
|
|
> [class^="content_"]
|
|
> [class^="container_"]
|
|
> [class^="membersWrap_"]:hover
|
|
> [class^="members_"]
|
|
> [class^="content_"]
|
|
> [class^="membersGroup_"] {
|
|
height: unset !important;
|
|
}
|
|
[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: 0px !important;
|
|
}
|
|
[class^="sidebar_"] ul[class^="content_"] > [class^="sectionDivider_"] {
|
|
margin-top: 6px;
|
|
}
|
|
[class^="sidebar_"]
|
|
[class^="containerDefault_"]
|
|
[class^="link_"] {
|
|
padding: 4px;
|
|
}
|
|
[class^="sidebar_"]
|
|
[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^="iconVisibility_"]
|
|
> [class^="content_"]
|
|
> [class^="children_"]
|
|
> [class^="channelInfo_"] {
|
|
margin-top: 0 !important;
|
|
}
|
|
[class^="sidebar_"]
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"]
|
|
> [class^="content_"]
|
|
> [class^="children_"] {
|
|
margin-top: 2px;
|
|
}
|
|
[class^="sidebar_"] [class^="containerDefault_"] [class^="voiceUser_"] [class^="userAvatar_"] {
|
|
margin-left: 4px;
|
|
margin-right: 4px;
|
|
}
|
|
[class^="sidebar_"]
|
|
[class^="containerDefault_"]
|
|
[class^="spine_"] {
|
|
top: 2px;
|
|
}
|
|
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_"],
|
|
[class^="chat_"] > section[class*="container_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] {
|
|
height: 32px !important;
|
|
min-height: 32px !important;
|
|
padding: 0;
|
|
}
|
|
[class^="chat_"] > [class^="title_"][class^="libraryHeader_"]:before,
|
|
[class^="chat_"] > section[class*="container_"][class^="libraryHeader_"]:before,
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"][class^="libraryHeader_"]:before,
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"][class^="libraryHeader_"]:before {
|
|
top: 31px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] {
|
|
height: 32px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] {
|
|
display: grid;
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
margin-right: 4px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="inviteToolbar_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="inviteToolbar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="inviteToolbar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="inviteToolbar_"] {
|
|
display: grid;
|
|
grid-auto-flow: column;
|
|
grid-gap: 4px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] {
|
|
height: 24px !important;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > .DraftEditor-root [class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="search_"] [class^="searchBar_"] > [class^="icon_"] {
|
|
margin-top: 0 !important;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"] {
|
|
width: 24px !important;
|
|
height: 24px !important;
|
|
margin: 0;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"] > svg,
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"] > svg,
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"] > svg,
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] [class^="iconWrapper_"] > svg {
|
|
margin: 0 !important;
|
|
padding: 1px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="icon_"]:has(> [class^="text-md-normal_"]),
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="icon_"]:has(> [class^="text-md-normal_"]),
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="icon_"]:has(> [class^="text-md-normal_"]),
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="toolbar_"] > [class^="icon_"]:has(> [class^="text-md-normal_"]) {
|
|
margin-left: 4px;
|
|
margin-right: 0;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] [class^="topic_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="topic_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="topic_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] [class^="topic_"] {
|
|
margin-left: 4px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] [class^="titleWrapper_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="titleWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="titleWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] [class^="titleWrapper_"] {
|
|
margin-right: 4px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"],
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] [class^="divider_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"],
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="divider_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] [class^="divider_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"],
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] [class^="divider_"] {
|
|
margin: 0 4px;
|
|
}
|
|
[class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"] > svg,
|
|
[class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"] > svg,
|
|
[class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"] > svg,
|
|
[class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class^="children_"] > [class^="iconWrapper_"] > svg {
|
|
padding: 2px;
|
|
}
|
|
[class*="iconWrapper_"] [class^="chat_"] > [class^="title_"] > [class^="upperContainer_"] > [class*="search_"],
|
|
[class*="iconWrapper_"] [class^="chat_"] > section[class*="container_"] > [class^="upperContainer_"] > [class*="search_"],
|
|
[class*="iconWrapper_"] [class^="base_"] > [class^="content_"] > [class^="container_"] > section[class*="container_"] > [class^="upperContainer_"] > [class*="search_"],
|
|
[class*="iconWrapper_"] [class^="base_"] > [class^="content_"] > [class^="applicationStore_"] section[class*="container_"] > [class^="upperContainer_"] > [class*="search_"] {
|
|
margin: 0 !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_"],
|
|
[class^="chatContent_"]
|
|
> form
|
|
[class^="channelTextArea"]
|
|
> [class^="scrollableContainer_"]
|
|
> [class^="inner_"]
|
|
> [class^="textArea_"] {
|
|
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^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="modeSelected_"]
|
|
[class^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="iconVisibility_"]:not([class*="typeThread_"])
|
|
[class^="linkTop_"]
|
|
> [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^="linkTop_"]
|
|
> [class^="icons_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="voiceUser_"]
|
|
[class^="linkTop_"]
|
|
> [class*="username_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="typeThread_"]
|
|
[class^="linkTop_"]
|
|
> [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;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="scroller_"]
|
|
> ul
|
|
> [class*="containerWithMargin_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"] {
|
|
width: 32px !important;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> svg {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class*="unreadBar_"] > span,
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> [class*="barText_"] {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: clip;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="voiceChannelsButton_"] {
|
|
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^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="modeSelected_"]
|
|
[class^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="iconVisibility_"]:not([class*="typeThread_"])
|
|
[class^="linkTop_"]
|
|
> [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^="linkTop_"]
|
|
> [class^="icons_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="voiceUser_"]
|
|
[class^="linkTop_"]
|
|
> [class*="username_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="typeThread_"]
|
|
[class^="linkTop_"]
|
|
> [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;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="scroller_"]
|
|
> ul
|
|
> [class*="containerWithMargin_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"] {
|
|
width: 32px !important;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> svg {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class*="unreadBar_"] > span,
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> [class*="barText_"] {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: clip;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="voiceChannelsButton_"] {
|
|
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^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="modeSelected_"]
|
|
[class^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="iconVisibility_"]:not([class*="typeThread_"])
|
|
[class^="linkTop_"]
|
|
> [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^="linkTop_"]
|
|
> [class^="icons_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="voiceUser_"]
|
|
[class^="linkTop_"]
|
|
> [class*="username_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="typeThread_"]
|
|
[class^="linkTop_"]
|
|
> [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;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="scroller_"]
|
|
> ul
|
|
> [class*="containerWithMargin_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"] {
|
|
width: 32px !important;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> svg {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class*="unreadBar_"] > span,
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> [class*="barText_"] {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: clip;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="voiceChannelsButton_"] {
|
|
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^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="modeSelected_"]
|
|
[class^="linkTop_"]
|
|
> [class^="children_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="iconVisibility_"]:not([class*="typeThread_"])
|
|
[class^="linkTop_"]
|
|
> [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^="linkTop_"]
|
|
> [class^="icons_"],
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="voiceUser_"]
|
|
[class^="linkTop_"]
|
|
> [class*="username_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="containerDefault_"]
|
|
[class^="iconVisibility_"][class*="typeThread_"]
|
|
[class^="linkTop_"]
|
|
> [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;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="scroller_"]
|
|
> ul
|
|
> [class*="containerWithMargin_"] {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"] {
|
|
width: 32px !important;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> svg {
|
|
display: none;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class*="unreadBar_"] > span,
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
> nav[class^="container_"]
|
|
> [class^="container_"][class*="bottom_"]
|
|
> [class^="containerPadding_"]
|
|
> [class^="bar_"]
|
|
> [class*="barText_"] {
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: clip;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
div[class^="sidebar_"]:not(:has(> [class^="side_"])):not(:hover)
|
|
[class^="voiceChannelsButton_"] {
|
|
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;
|
|
}
|
|
|
|
.hljs.ansi {
|
|
line-height: normal !important;
|
|
}
|
|
.hljs.ansi .bcb-lines {
|
|
grid-template-columns: auto;
|
|
}
|
|
.hljs.ansi .bcb-number {
|
|
display: none;
|
|
min-height: unset;
|
|
}
|
|
|
|
/* 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]]*/ !important;
|
|
--xmc-custom-status-idle: /*[[xmc_custom_status_idle]]*/ !important;
|
|
--xmc-custom-status-dnd: /*[[xmc_custom_status_dnd]]*/ !important;
|
|
--xmc-custom-status-offline: /*[[xmc_custom_status_offline]]*/ !important;
|
|
--xmc-custom-status-streaming: /*[[xmc_custom_status_streaming]]*/ !important;
|
|
|
|
--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 */
|
|
}
|