From 60b1658135c7f0aafe00fb774350837d8aee367d Mon Sep 17 00:00:00 2001
From: Lucien Cartier-Tilet <lucien@phundrak.com>
Date: Thu, 26 Dec 2019 15:57:18 +0100
Subject: [PATCH] Bettert CSS and Dart code

---
 web/css/main.scss  |  2 +-
 web/dart/main.dart | 39 +++++++++++++++++++++++----------------
 2 files changed, 24 insertions(+), 17 deletions(-)

diff --git a/web/css/main.scss b/web/css/main.scss
index 80b6050..afd5344 100644
--- a/web/css/main.scss
+++ b/web/css/main.scss
@@ -52,7 +52,7 @@ body {
 #content {
     max-width: 1100px;
     margin: 20px auto;
-    padding: 10px;
+    padding: 20px;
     box-shadow: 5px 5px 7px rgba(1, 1, 1, .6);
 }
 
diff --git a/web/dart/main.dart b/web/dart/main.dart
index fae5853..a547f55 100644
--- a/web/dart/main.dart
+++ b/web/dart/main.dart
@@ -4,14 +4,18 @@ library main;
 import 'dart:html';
 
 import 'package:js/js.dart';
+
 import './cookie.dart';
 
 void main() {
   reorganizeHtml();
   createThemeSwitcher();
-  querySelector('.themeBtn').onClick.listen(themeSwitch);
+  themeSwitch(isThemeDark());
+  querySelector('.themeBtn').onClick.listen(themeSwitchMouse);
 }
 
+String cookieThemeName = 'theme';
+
 void createThemeSwitcher() {
   // set the correct CSS depending on the cookie, dark is enabled by default
   var isDark = isThemeDark();
@@ -23,26 +27,13 @@ void createThemeSwitcher() {
 }
 
 bool isThemeDark() {
-  if (Cookies.get('theme') == 'light') {
+  if (Cookies.get(cookieThemeName) == 'light') {
     return false;
   }
-  Cookies.set('theme', 'dark');
+  Cookies.set(cookieThemeName, 'dark');
   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() {
   // Add a <hr> element after the content div
   querySelector('#content').appendHtml('<hr>');
@@ -57,3 +48,19 @@ void reorganizeHtml() {
     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);
+}