Update to new Discord css variable names
Co-Authored-By: sadan <117494111+sadan4@users.noreply.github.com> Co-Authored-By: Nuckyz <61953774+Nuckyz@users.noreply.github.com>
This commit is contained in:
parent
65f41cb7bd
commit
a25d26e921
25 changed files with 45 additions and 47 deletions
|
|
@ -3,8 +3,8 @@
|
|||
all: unset;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: var(--text-normal);
|
||||
background-color: var(--background-secondary-alt);
|
||||
color: var(--text-default);
|
||||
background-color: var(--background-base-lower-alt);
|
||||
border-radius: 6px;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
background-color: #e7828430;
|
||||
border: 1px solid #e78284;
|
||||
border-radius: 5px;
|
||||
color: var(--text-normal, white);
|
||||
color: var(--text-default, white);
|
||||
|
||||
& a:hover {
|
||||
text-decoration: underline;
|
||||
|
|
|
|||
|
|
@ -94,7 +94,7 @@ function Changes({ updates, repo, repoPending }: CommonProps & { updates: typeof
|
|||
<code><HashLink {...{ repo, hash }} disabled={repoPending} /></code>
|
||||
<span style={{
|
||||
marginLeft: "0.5em",
|
||||
color: "var(--text-normal)"
|
||||
color: "var(--text-default)"
|
||||
}}>{message} - {author}</span>
|
||||
</div>
|
||||
))}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.vc-addon-card {
|
||||
background-color: var(--background-secondary-alt);
|
||||
background-color: var(--background-base-lower-alt);
|
||||
color: var(--interactive-active);
|
||||
border-radius: 8px;
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
|
||||
.vc-settings-quickActions-pill {
|
||||
all: unset;
|
||||
background: var(--background-secondary);
|
||||
background: var(--background-base-lower);
|
||||
color: var(--header-secondary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -26,7 +26,7 @@
|
|||
}
|
||||
|
||||
.vc-settings-quickActions-pill:hover {
|
||||
background: var(--background-secondary-alt);
|
||||
background: var(--background-base-lower-alt);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: var(--elevation-high);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
.vc-settings-theme-links {
|
||||
/* Needed to fix bad themes that hide certain textarea elements for whatever eldritch reason */
|
||||
display: inline-block !important;
|
||||
color: var(--text-normal) !important;
|
||||
color: var(--text-default) !important;
|
||||
padding: 0.5em;
|
||||
border: 1px solid var(--background-modifier-accent);
|
||||
max-height: unset;
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
.vc-settings-theme-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: var(--background-secondary-alt);
|
||||
background-color: var(--background-base-lower-alt);
|
||||
color: var(--interactive-active);
|
||||
border-radius: 8px;
|
||||
padding: 1em;
|
||||
|
|
|
|||
|
|
@ -138,7 +138,7 @@ export default definePlugin({
|
|||
|
||||
borderRadius: "50%",
|
||||
backgroundColor: "var(--interactive-normal)",
|
||||
color: "var(--background-secondary)",
|
||||
color: "var(--background-base-lower)",
|
||||
}}
|
||||
>
|
||||
<PlatformIcon width={14} height={14} />
|
||||
|
|
|
|||
|
|
@ -456,7 +456,7 @@ export default definePlugin({
|
|||
|
||||
<Forms.FormDivider className={Margins.top8} />
|
||||
|
||||
<div style={{ width: "284px", ...profileThemeStyle, marginTop: 8, borderRadius: 8, background: "var(--bg-mod-faint)" }}>
|
||||
<div style={{ width: "284px", ...profileThemeStyle, marginTop: 8, borderRadius: 8, background: "var(--background-mod-faint)" }}>
|
||||
{activity[0] && <ActivityView
|
||||
activity={activity[0]}
|
||||
user={UserStore.getCurrentUser()}
|
||||
|
|
|
|||
|
|
@ -225,7 +225,7 @@ function CloneModal({ data }: { data: Sticker | Emoji; }) {
|
|||
aria-disabled={isCloning}
|
||||
style={{
|
||||
borderRadius: "50%",
|
||||
backgroundColor: "var(--background-secondary)",
|
||||
backgroundColor: "var(--background-base-lower)",
|
||||
display: "inline-flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
|
|
|
|||
|
|
@ -294,7 +294,7 @@ function ChannelMessageEmbedAccessory({ message, channel }: MessageEmbedProps):
|
|||
<Embed
|
||||
embed={{
|
||||
rawDescription: "",
|
||||
color: "var(--background-secondary)",
|
||||
color: "var(--background-base-lower)",
|
||||
author: {
|
||||
name: <Text variant="text-xs/medium" tag="span">
|
||||
<span>{channelLabel} - </span>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
.messagelogger-deleted {
|
||||
--text-normal: var(--status-danger, #f04747);
|
||||
--text-default: var(--status-danger, #f04747);
|
||||
--interactive-normal: var(--status-danger, #f04747);
|
||||
--text-muted: var(--status-danger, #f04747);
|
||||
--embed-title: var(--red-460, #be3535);
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@ function UserPermissionsComponent({ guild, guildMember, closePopout }: { guild:
|
|||
viewBox="0 96 960 960"
|
||||
transform={permissionsSortOrder === PermissionsSortOrder.HighestRole ? "scale(1 1)" : "scale(1 -1)"}
|
||||
>
|
||||
<path fill="var(--text-normal)" d="M440 896V409L216 633l-56-57 320-320 320 320-56 57-224-224v487h-80Z" />
|
||||
<path fill="var(--text-default)" d="M440 896V409L216 633l-56-57 320-320 320 320-56 57-224-224v487h-80Z" />
|
||||
</svg>
|
||||
</div>
|
||||
)}
|
||||
|
|
@ -181,7 +181,7 @@ function UserPermissionsComponent({ guild, guildMember, closePopout }: { guild:
|
|||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path fill="var(--text-normal)" d="M7 12.001C7 10.8964 6.10457 10.001 5 10.001C3.89543 10.001 3 10.8964 3 12.001C3 13.1055 3.89543 14.001 5 14.001C6.10457 14.001 7 13.1055 7 12.001ZM14 12.001C14 10.8964 13.1046 10.001 12 10.001C10.8954 10.001 10 10.8964 10 12.001C10 13.1055 10.8954 14.001 12 14.001C13.1046 14.001 14 13.1055 14 12.001ZM19 10.001C20.1046 10.001 21 10.8964 21 12.001C21 13.1055 20.1046 14.001 19 14.001C17.8954 14.001 17 13.1055 17 12.001C17 10.8964 17.8954 10.001 19 10.001Z" />
|
||||
<path fill="var(--text-default)" d="M7 12.001C7 10.8964 6.10457 10.001 5 10.001C3.89543 10.001 3 10.8964 3 12.001C3 13.1055 3.89543 14.001 5 14.001C6.10457 14.001 7 13.1055 7 12.001ZM14 12.001C14 10.8964 13.1046 10.001 12 10.001C10.8954 10.001 10 10.8964 10 12.001C10 13.1055 10.8954 14.001 12 14.001C13.1046 14.001 14 13.1055 14 12.001ZM19 10.001C20.1046 10.001 21 10.8964 21 12.001C21 13.1055 20.1046 14.001 19 14.001C17.8954 14.001 17 13.1055 17 12.001C17 10.8964 17.8954 10.001 19 10.001Z" />
|
||||
</svg>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
|||
|
|
@ -51,7 +51,7 @@ export function PermissionDefaultIcon() {
|
|||
>
|
||||
<g>
|
||||
<title>Not overwritten</title>
|
||||
<polygon fill="var(--text-normal)" points="12 2.32 10.513 2 4 13.68 5.487 14" />
|
||||
<polygon fill="var(--text-default)" points="12 2.32 10.513 2 4 13.68 5.487 14" />
|
||||
</g>
|
||||
</svg>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -140,10 +140,9 @@
|
|||
|
||||
/* copy pasted from discord cause impossible to webpack find */
|
||||
.vc-permviewer-role-button {
|
||||
border-radius: var(--radius-xs);
|
||||
background: var(--bg-mod-faint);
|
||||
border-radius: var(--radius-sm);
|
||||
color: var(--interactive-normal);
|
||||
border: 1px solid var(--border-faint);
|
||||
border: 1px solid var(--user-profile-border);
|
||||
/* stylelint-disable-next-line value-no-vendor-prefix */
|
||||
width: -moz-fit-content;
|
||||
width: fit-content;
|
||||
|
|
@ -151,9 +150,8 @@
|
|||
padding: 4px
|
||||
}
|
||||
|
||||
.custom-profile-theme .vc-permviewer-role-button {
|
||||
background: rgb(var(--bg-overlay-color)/var(--bg-overlay-opacity-6));
|
||||
border-color: var(--profile-body-border-color)
|
||||
.vc-permviewer-role-button:hover {
|
||||
background-color: var(--user-profile-background-hover);
|
||||
}
|
||||
|
||||
.vc-permviewer-granted-by-container {
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@
|
|||
overflow-y: hidden;
|
||||
margin-top: 1px;
|
||||
margin-bottom: 8px;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -197,7 +197,7 @@ export default definePlugin({
|
|||
const value = `color-mix(in oklab, ${author.colorString} ${messageSaturation}%, var({DEFAULT}))`;
|
||||
|
||||
return {
|
||||
color: value.replace("{DEFAULT}", "--text-normal"),
|
||||
color: value.replace("{DEFAULT}", "--text-default"),
|
||||
"--header-primary": value.replace("{DEFAULT}", "--header-primary"),
|
||||
"--text-muted": value.replace("{DEFAULT}", "--text-muted")
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
.vc-st-date-picker {
|
||||
background-color: var(--input-background);
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
width: 95%;
|
||||
padding: 8px 8px 8px 12px;
|
||||
margin: 1em 0;
|
||||
|
|
|
|||
|
|
@ -68,7 +68,7 @@
|
|||
}
|
||||
|
||||
.vc-gp-server-info-pair {
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.vc-gp-server-info-pair [class^="timestamp"] {
|
||||
|
|
|
|||
|
|
@ -78,12 +78,12 @@ export const Highlighter = ({
|
|||
});
|
||||
|
||||
const themeBase: ThemeBase = {
|
||||
plainColor: currentTheme?.fg || "var(--text-normal)",
|
||||
plainColor: currentTheme?.fg || "var(--text-default)",
|
||||
accentBgColor:
|
||||
currentTheme?.colors?.["statusBar.background"] || (useHljs ? "#7289da" : "#007BC8"),
|
||||
accentFgColor: currentTheme?.colors?.["statusBar.foreground"] || "#FFF",
|
||||
backgroundColor:
|
||||
currentTheme?.colors?.["editor.background"] || "var(--background-secondary)",
|
||||
currentTheme?.colors?.["editor.background"] || "var(--background-base-lower)",
|
||||
};
|
||||
|
||||
let langName;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
.vc-shiki-container {
|
||||
border: 4px;
|
||||
background-color: var(--background-secondary);
|
||||
background-color: var(--background-base-lower);
|
||||
}
|
||||
|
||||
.vc-shiki-root {
|
||||
|
|
|
|||
|
|
@ -22,12 +22,12 @@
|
|||
}
|
||||
|
||||
.vc-shc-heading-nsfw-icon {
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.vc-shc-topic-container {
|
||||
color: var(--text-normal);
|
||||
background: var(--bg-overlay-3, var(--background-secondary));
|
||||
color: var(--text-default);
|
||||
background: var(--bg-overlay-5, var(--background-base-lower));
|
||||
border-radius: 5px;
|
||||
padding: 10px;
|
||||
max-width: 70vw;
|
||||
|
|
@ -37,7 +37,7 @@
|
|||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
background: var(--bg-overlay-3, var(--background-secondary));
|
||||
background: var(--bg-overlay-5, var(--background-base-lower));
|
||||
border-radius: 8px;
|
||||
padding: 0.75em;
|
||||
margin-left: 0.75em;
|
||||
|
|
@ -46,7 +46,7 @@
|
|||
.vc-shc-tags-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--bg-overlay-3, var(--background-secondary));
|
||||
background: var(--bg-overlay-5, var(--background-base-lower));
|
||||
border-radius: 5px;
|
||||
padding: 0.75em;
|
||||
gap: 0.75em;
|
||||
|
|
@ -65,7 +65,7 @@
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: var(--bg-overlay-3, var(--background-secondary));
|
||||
background: var(--bg-overlay-5, var(--background-base-lower));
|
||||
border-radius: 5px;
|
||||
padding: 0.75em;
|
||||
max-width: 70vw;
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.vc-shc-allowed-users-and-roles-container-permdetails-btn {
|
||||
|
|
@ -91,7 +91,7 @@
|
|||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
||||
.vc-shc-allowed-users-and-roles-container > [class^="members"] {
|
||||
|
|
|
|||
|
|
@ -8,11 +8,11 @@
|
|||
}
|
||||
|
||||
.theme-light #vc-spotify-player {
|
||||
background: var(--bg-overlay-3, var(--background-secondary-alt));
|
||||
background: var(--bg-overlay-3, var(--background-base-lower-alt));
|
||||
}
|
||||
|
||||
.theme-dark #vc-spotify-player {
|
||||
background: var(--bg-overlay-1, var(--background-secondary-alt));
|
||||
background: var(--bg-overlay-1, var(--background-base-lower-alt));
|
||||
}
|
||||
|
||||
.vc-spotify-button {
|
||||
|
|
@ -143,7 +143,7 @@
|
|||
|
||||
#vc-spotify-progress-bar {
|
||||
position: relative;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
width: 100%;
|
||||
margin: 0.5em 0;
|
||||
margin-bottom: 5px;
|
||||
|
|
@ -195,5 +195,5 @@
|
|||
|
||||
.vc-spotify-fallback {
|
||||
padding: 0.5em;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
.visual-refresh {
|
||||
#vc-spotify-player {
|
||||
padding: 12px;
|
||||
background: var(--bg-overlay-floating, var(--background-base-low, var(--background-secondary-alt)));
|
||||
background: var(--bg-overlay-floating, var(--background-base-low, var(--background-base-lower-alt)));
|
||||
margin: 0;
|
||||
border-top-left-radius: 10px;
|
||||
border-top-right-radius: 10px;
|
||||
|
|
@ -22,7 +22,7 @@
|
|||
|
||||
#vc-spotify-progress-bar {
|
||||
position: relative;
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,9 +10,9 @@
|
|||
}
|
||||
|
||||
.vc-vmsg-preview {
|
||||
color: var(--text-normal);
|
||||
color: var(--text-default);
|
||||
border-radius: 24px;
|
||||
background-color: var(--background-secondary);
|
||||
background-color: var(--background-base-lower);
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue