mirror of
https://github.com/LemmyNet/lemmy.git
synced 2024-09-09 16:08:49 -06:00
Dynamically loading CSS theme, removing all but darkly from index.html
- Fixes #333
This commit is contained in:
parent
a4033baa4c
commit
408b0efd48
8
ui/src/index.html
vendored
8
ui/src/index.html
vendored
@ -13,15 +13,7 @@
|
|||||||
|
|
||||||
<!-- Styles -->
|
<!-- Styles -->
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/tribute.css" />
|
<link rel="stylesheet" type="text/css" href="/static/assets/css/tribute.css" />
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/litera.min.css" id="litera" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/minty.min.css" id="minty" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/solar.min.css" id="solar" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/united.min.css" id="united" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/cyborg.min.css" id="cyborg" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/darkly.min.css" id="darkly" />
|
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/darkly.min.css" id="darkly" />
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/journal.min.css" id="journal" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/sketchy.min.css" id="sketchy" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/themes/vaporwave.min.css" id="vaporwave" />
|
|
||||||
<link rel="stylesheet" type="text/css" href="/static/assets/css/main.css" />
|
<link rel="stylesheet" type="text/css" href="/static/assets/css/main.css" />
|
||||||
|
|
||||||
<!-- Scripts -->
|
<!-- Scripts -->
|
||||||
|
8
ui/src/services/UserService.ts
vendored
8
ui/src/services/UserService.ts
vendored
@ -17,7 +17,9 @@ export class UserService {
|
|||||||
if (jwt) {
|
if (jwt) {
|
||||||
this.setUser(jwt);
|
this.setUser(jwt);
|
||||||
} else {
|
} else {
|
||||||
setTheme();
|
if (this.user.theme != 'darkly') {
|
||||||
|
setTheme();
|
||||||
|
}
|
||||||
console.log('No JWT cookie found.');
|
console.log('No JWT cookie found.');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -42,7 +44,9 @@ export class UserService {
|
|||||||
|
|
||||||
private setUser(jwt: string) {
|
private setUser(jwt: string) {
|
||||||
this.user = jwt_decode(jwt);
|
this.user = jwt_decode(jwt);
|
||||||
setTheme(this.user.theme);
|
if (this.user.theme != 'darkly') {
|
||||||
|
setTheme(this.user.theme);
|
||||||
|
}
|
||||||
this.sub.next({ user: this.user, unreadCount: 0 });
|
this.sub.next({ user: this.user, unreadCount: 0 });
|
||||||
console.log(this.user);
|
console.log(this.user);
|
||||||
}
|
}
|
||||||
|
18
ui/src/utils.ts
vendored
18
ui/src/utils.ts
vendored
@ -290,12 +290,24 @@ export const themes = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
export function setTheme(theme: string = 'darkly') {
|
export function setTheme(theme: string = 'darkly') {
|
||||||
|
// unload all the other themes
|
||||||
for (var i = 0; i < themes.length; i++) {
|
for (var i = 0; i < themes.length; i++) {
|
||||||
let styleSheet = document.getElementById(themes[i]);
|
let styleSheet = document.getElementById(themes[i]);
|
||||||
if (themes[i] == theme) {
|
if (styleSheet) {
|
||||||
styleSheet.removeAttribute('disabled');
|
|
||||||
} else {
|
|
||||||
styleSheet.setAttribute('disabled', 'disabled');
|
styleSheet.setAttribute('disabled', 'disabled');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Load the theme dynamically
|
||||||
|
if (!document.getElementById(theme)) {
|
||||||
|
var head = document.getElementsByTagName('head')[0];
|
||||||
|
var link = document.createElement('link');
|
||||||
|
link.id = theme;
|
||||||
|
link.rel = 'stylesheet';
|
||||||
|
link.type = 'text/css';
|
||||||
|
link.href = `/static/assets/css/themes/${theme}.min.css`;
|
||||||
|
link.media = 'all';
|
||||||
|
head.appendChild(link);
|
||||||
|
}
|
||||||
|
document.getElementById(theme).removeAttribute('disabled');
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user