From d2edfde1a3d9cddc595e5ce95b34994dab671c00 Mon Sep 17 00:00:00 2001
From: KeziahMoselle <keziahmoselle@protonmail.com>
Date: Mon, 26 Feb 2018 23:46:56 +0100
Subject: [PATCH] (v0.7.2) UI improvements

---
 README.md                | 1 +
 package.json             | 2 +-
 src/assets/css/index.css | 5 +++++
 src/index.html           | 9 ++++++---
 src/renderer.js          | 9 ++++-----
 5 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/README.md b/README.md
index 73ce899..502b93c 100644
--- a/README.md
+++ b/README.md
@@ -35,6 +35,7 @@
 * [x] Hot images
 * [x] Blacklist (Exclude tags)
 * [ ] Favorites
+* [ ] Endless scrolling
 
 ## Installing
 
diff --git a/package.json b/package.json
index 3dcd271..c91f8c8 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "gelbooru-client",
-  "version": "0.7.1",
+  "version": "0.7.2",
   "description": "You already know what it is.",
   "main": "main.js",
   "dependencies": {
diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index fc7d3b8..4bf2f39 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -140,6 +140,11 @@ div#loading {
   margin-top: 2rem;
 }
 
+.sidenav-form {
+  margin: 0;
+  padding: 0 32px;
+}
+
 /*
 * MATERIALIZE CSS
 */
diff --git a/src/index.html b/src/index.html
index c859f5c..97e0135 100644
--- a/src/index.html
+++ b/src/index.html
@@ -48,16 +48,19 @@
           <div class="user-view">
             <div class="background"></div>
             <span class="white-text name">Gelbooru Client</span>
-            <span class="white-text email">v0.7.1</span>
+            <span class="white-text email">v0.7.2</span>
           </div>
         </li>
-        <li><a class="subheader">Settings</a></li>
+        <li><a class="subheader">Pages</a></li>
         <li><a onclick="clickActualize()" class="waves-effect"><i class="material-icons left">home</i>All</a></li>
         <li><a onclick="searchTop()" class="waves-effect"><i class="material-icons left">star</i>Top</a></li>
         <li><a onclick="searchHot()" class="waves-effect"><i class="material-icons left">whatshot</i>Hot</a></li>
         <li><a class="waves-effect disabled"><i class="material-icons left">favorite</i>Favorites</a></li>
         <li><a onclick="openBlacklistModal()" class="waves-effect"><i class="material-icons left">label</i>Exclude tags</a></li>
-        <li><a onclick="handleTheme()" id="displayTheme" class="waves-effect"><i class="material-icons left">invert_colors</i>Enable light theme</a></li>
+        <li><div class="divider"></div></li>
+        <li><a class="subheader">Settings</a></li>
+        <li><p class="sidenav-form"><label><input id="checkboxTheme" onclick="handleTheme()" type="checkbox" class="filled-in" /><span>Light theme</span></label></p></li>
+        <li><p class="sidenav-form"><label><input type="checkbox" class="filled-in" disabled /><span>Endless scrolling</span></label></p></li>
         <li><div class="divider"></div></li>
         <li><a class="subheader">Links</a></li>
         <li><a class="waves-effect" href="https://gelbooru.com/"><i class="material-icons">open_in_new</i>Gelbooru</a></li>
diff --git a/src/renderer.js b/src/renderer.js
index b402330..6fd0aa1 100644
--- a/src/renderer.js
+++ b/src/renderer.js
@@ -17,10 +17,10 @@
         displayPid = document.getElementById('displayPid'), // Display chip
         displayTheme = document.getElementById('displayTheme'), // Display actual theme
         tagsResults = document.getElementById('tagsResults'), // Displays popular tags
-        sidenavImg = document.getElementById('sidenavImg'),
         sidenavImageSource = document.getElementById('sidenavImageSource'),
         sidenavImageTagsParent = document.getElementById('sidenavImageTagsParent'),
-        chips = document.querySelector('.chips');
+        chips = document.querySelector('.chips'),
+        checkboxTheme = document.getElementById('checkboxTheme');
 
   // Value
   var tags,
@@ -334,7 +334,7 @@ function clickLimit()
     if (lastTheme === 'light-mode')
     {
       root.classList.add('light-mode');
-      displayTheme.innerHTML = '<i class="material-icons left">invert_colors</i> Enable dark theme';
+      checkboxTheme.setAttribute('checked', 'checked');
       console.log('Theme : Light mode enabled.');
     }
 
@@ -342,17 +342,16 @@ function clickLimit()
     function handleTheme()
     {
       var actualTheme = store.get('theme');
+      console.log(actualTheme);
       if (actualTheme === 'light-mode')
       { // Actual theme = Light Mode -> Switch on Dark Mode
         root.classList.remove('light-mode');
-        displayTheme.innerHTML = '<i class="material-icons left">invert_colors</i> Enable light theme';
         M.toast({html: 'Dark theme activated'});
         store.set('theme','dark-mode');
       }
       else
       { // Actual theme = Dark Mode -> Switch on Light Mode
         root.classList.add('light-mode');
-        displayTheme.innerHTML = '<i class="material-icons left">invert_colors</i> Enable dark theme';
         M.toast({html: 'Light theme activated'});
         store.set('theme','light-mode');
       }