1
0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00

Removing !important statements from theme variables (#1303)

* Removing !important statements from theme vars

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Wait for user store to load

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Fix this reference

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Aligning test with resetTheme() fixes

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev 2020-11-10 15:16:16 +03:00 committed by GitHub
parent 05188ef3cc
commit dd90dcb7f0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 8 additions and 6 deletions

View File

@ -57,11 +57,12 @@ describe("user store tests", () => {
expect(us.preferences.colorTheme).toBe('light') expect(us.preferences.colorTheme).toBe('light')
}) })
it("correctly resets theme to default value", () => { it("correctly resets theme to default value", async () => {
const us = UserStore.getInstance<UserStore>(); const us = UserStore.getInstance<UserStore>();
us.isLoaded = true;
us.preferences.colorTheme = "some other theme"; us.preferences.colorTheme = "some other theme";
us.resetTheme(); await us.resetTheme();
expect(us.preferences.colorTheme).toBe(UserStore.defaultTheme); expect(us.preferences.colorTheme).toBe(UserStore.defaultTheme);
}) })

View File

@ -88,7 +88,8 @@ export class UserStore extends BaseStore<UserStoreModel> {
} }
@action @action
resetTheme() { async resetTheme() {
await this.whenLoaded;
this.preferences.colorTheme = UserStore.defaultTheme; this.preferences.colorTheme = UserStore.defaultTheme;
} }

View File

@ -23,7 +23,6 @@
--font-weight-thin: 300; --font-weight-thin: 300;
--font-weight-normal: 400; --font-weight-normal: 400;
--font-weight-bold: 500; --font-weight-bold: 500;
--mainBackground: #1e2124;
--main-layout-header: 40px; --main-layout-header: 40px;
--drag-region-height: 22px --drag-region-height: 22px
} }

View File

@ -48,6 +48,7 @@ export class ThemeStore {
await this.loadTheme(themeId); await this.loadTheme(themeId);
this.applyTheme(); this.applyTheme();
} catch (err) { } catch (err) {
logger.error(err);
userStore.resetTheme(); userStore.resetTheme();
} }
}, { }, {
@ -79,7 +80,7 @@ export class ThemeStore {
} }
return existingTheme; return existingTheme;
} catch (err) { } catch (err) {
logger.error(`Can't load theme "${themeId}": ${err}`); throw new Error(`Can't load theme "${themeId}": ${err}`);
} }
} }
@ -90,7 +91,7 @@ export class ThemeStore {
document.head.prepend(this.styles); document.head.prepend(this.styles);
} }
const cssVars = Object.entries(theme.colors).map(([cssName, color]) => { const cssVars = Object.entries(theme.colors).map(([cssName, color]) => {
return `--${cssName}: ${color} !important;` return `--${cssName}: ${color};`;
}); });
this.styles.textContent = `:root {\n${cssVars.join("\n")}}`; this.styles.textContent = `:root {\n${cssVars.join("\n")}}`;
// Adding universal theme flag which can be used in component styles // Adding universal theme flag which can be used in component styles