phundrak/langue-phundrak-com
Archived
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Bettert CSS and Dart code

Browse Source
This commit is contained in:
Lucien Cartier-Tilet 2019-12-26 15:57:18 +01:00
parent 6b40058c9f
commit 60b1658135
Signed by: phundrak
GPG Key ID: BD7789E705CB8DCA
2 changed files with 24 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/css/main.scss
View File

@ -52,7 +52,7 @@ body {
#content { #content {
max-width: 1100px; max-width: 1100px;
margin: 20px auto; margin: 20px auto;
padding: 10px; padding: 20px;
box-shadow: 5px 5px 7px rgba(1, 1, 1, .6); box-shadow: 5px 5px 7px rgba(1, 1, 1, .6);
} }

39
web/dart/main.dart
View File

@ -4,14 +4,18 @@ library main;
import 'dart:html'; import 'dart:html';
import 'package:js/js.dart'; import 'package:js/js.dart';
import './cookie.dart'; import './cookie.dart';
void main() { void main() {
reorganizeHtml(); reorganizeHtml();
createThemeSwitcher(); createThemeSwitcher();
querySelector('.themeBtn').onClick.listen(themeSwitch); themeSwitch(isThemeDark());
querySelector('.themeBtn').onClick.listen(themeSwitchMouse);
} }
String cookieThemeName = 'theme';
void createThemeSwitcher() { void createThemeSwitcher() {
// set the correct CSS depending on the cookie, dark is enabled by default // set the correct CSS depending on the cookie, dark is enabled by default
var isDark = isThemeDark(); var isDark = isThemeDark();
@ -23,26 +27,13 @@ void createThemeSwitcher() {
} }
bool isThemeDark() { bool isThemeDark() {
if (Cookies.get('theme') == 'light') { if (Cookies.get(cookieThemeName) == 'light') {
return false; return false;
} }
Cookies.set('theme', 'dark'); Cookies.set(cookieThemeName, 'dark');
return true; return true;
} }
bool setTheme(bool dark) {
Cookies.set('theme', (dark ? 'dark' : 'light'));
return !dark;
}
void themeSwitch(MouseEvent event) {
print('Switch theme');
bool isDark = setTheme(isThemeDark());
querySelector('.fas').className = 'fas fa-' + (isDark ? 'sun' : 'moon');
querySelector('#theme').attributes['href'] =
'/css/' + (isDark ? 'dark' : 'light') + '.css';
}
void reorganizeHtml() { void reorganizeHtml() {
// Add a <hr> element after the content div // Add a <hr> element after the content div
querySelector('#content').appendHtml('<hr>'); querySelector('#content').appendHtml('<hr>');
@ -57,3 +48,19 @@ void reorganizeHtml() {
largetable.children.add(table); largetable.children.add(table);
} }
} }
bool setTheme(bool dark) {
Cookies.set(cookieThemeName, (dark ? 'dark' : 'light'));
return !dark;
}
void themeSwitch(bool isDark) {
querySelector('.fas').className = 'fas fa-' + (isDark ? 'sun' : 'moon');
querySelector('#theme').attributes['href'] =
'/css/' + (isDark ? 'dark' : 'light') + '.css';
}
void themeSwitchMouse(MouseEvent event) {
bool isDark = setTheme(!isThemeDark());
themeSwitch(isDark);
}