binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: update classnames according to the new theming structure (#1494)

Browse source 
* chore: store various shades of accent color

* refactor: custom theme selector

* refactor: custom theme selector

* chore: update custom theme input labels

* fix: color generator function logic

* fix: accent color preloaded data

* chore: new theming structure

* chore: update shades calculation logic

* refactor: variable names

* chore: update color scheming

* chore: new color scheming

* refactor: themes folder structure

* chore: update classnames to the new ones

* chore: update static colors

* chore: sidebar link colors

* chore: placeholder color

* chore: update border classnames
This commit is contained in:
Aaryan Khandelwal 2023-07-10 12:47:00 +05:30 • committed by GitHub
parent a14f8c281b
commit 4c2cb2368a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
329 changed files with 2130 additions and 1995 deletions
Download patch file Download diff file Expand all files Collapse all files

2
apps/app/helpers/string.helper.ts
View file

@ -89,7 +89,7 @@ export const cosineSimilarity = (a: string, b: string) => {
};
export const generateRandomColor = (string: string): string => {
if (!string) return "rgb(var(--color-accent))";
if (!string) return "rgb(var(--color-primary-100))";
string = `${string}`;

17
apps/app/helpers/theme.helper.ts
View file

@ -94,6 +94,23 @@ export const applyTheme = (palette: string, isDarkPalette: boolean) => {
document
.querySelector<HTMLElement>("[data-theme='custom']")
?.style.setProperty(`--color-sidebar-text-${shade}`, sidebarTextRgbValues);
if (i >= 100 && i <= 400) {
const borderShade = (shade + 100) as keyof TShades;
document
.querySelector<HTMLElement>("[data-theme='custom']")
?.style.setProperty(
`--color-border-${shade}`,
`${bgShades[borderShade].r}, ${bgShades[borderShade].g}, ${bgShades[borderShade].b}`
);
document
.querySelector<HTMLElement>("[data-theme='custom']")
?.style.setProperty(
`--color-sidebar-border-${shade}`,
`${sidebarBackgroundShades[borderShade].r}, ${sidebarBackgroundShades[borderShade].g}, ${sidebarBackgroundShades[borderShade].b}`
);
}
}
document