proper home screen

Tym17 · Tym17 · commit d44a4850c6fd · 2018-07-29T18:32:18.000+02:00
diff --git a/index.html b/index.html
@@ -10,8 +10,8 @@
 <body>
   <div class="title">
     <div id="title">SymbiozUtils</div>
-    <button onclick="alert('close')" id="close">X</button>
-    <button onClick="alert('reduce')">_</button>
+    <button onclick="navigator.quit()" id="close">X</button>
+    <button onClick="navigator.reduce()">_</button>
     <div style="clear: both;"></div>
   </div>
   <div class="nav" id="nav">
@@ -24,7 +24,7 @@
     const package = require('./package.json');
     let navigator = new require('./js/navigator.js');
     console.log(navigator);
-    id('title').innerHTML = 'Symbioz Utils v' + package.version;
+    id('title').innerHTML = 'Symbioz Utils v' + package.version + ' - Tym17.com';
     navigator.navigate('home', {version: package.version});
     // You can also require other files to run in this process
     //require('./renderer.js')
diff --git a/js/navigator.js b/js/navigator.js
@@ -1,3 +1,4 @@
+const { shell, remote } = require('electron');
 const Mustache = require('mustache');
 const fs = require('fs');
 
@@ -17,6 +18,20 @@ let Navigator = {
 
     makePath: function(args) {
         console.log(args);
+    },
+
+    url: function(u) {
+        shell.openExternal(u);
+    },
+
+    quit: function() {
+        let window = remote.getCurrentWindow();
+        window.close();
+    },
+
+    reduce: function() {
+        let window = remote.getCurrentWindow();
+        window.minimize();
     }
 }
 
diff --git a/scss/button.scss b/scss/button.scss
@@ -15,4 +15,5 @@ button:hover
 {
     background: $darkorange;
     border-bottom: darken($darkorange, 15) solid 2px;
+    cursor: pointer;
 }
diff --git a/scss/main.scss b/scss/main.scss
@@ -1,6 +1,8 @@
 @import 'colors';
 @import 'button';
 @import 'title';
+@import 'menu';
+@import 'typography';
 
 body
 {
@@ -19,6 +21,6 @@ body
     padding-left: 20px;
     padding-right: 20px;
     padding-top: 10px;
-    padding-bottom: 10px;
+    padding-bottom: 30px;
     box-sizing: border-box;
 }
diff --git a/scss/menu.scss b/scss/menu.scss
@@ -0,0 +1,14 @@
+.menu
+{
+    display: flex;
+    flex-direction: column;
+    width: 50%;
+    margin: auto;
+
+    button
+    {
+        font-size: 17px;
+        margin-top: 3px;
+        margin-bottom: 3px;
+    }
+}
diff --git a/scss/title.scss b/scss/title.scss
@@ -32,6 +32,7 @@
         transition-duration: 0.2s;
         -webkit-app-region: no-drag;
         transition-timing-function: ease-out;
+        border-radius: 0;
     }
     
     button:hover
diff --git a/scss/typography.scss b/scss/typography.scss
@@ -0,0 +1,6 @@
+@import 'colors';
+
+.text-lighter
+{
+    color: $darkbrown;
+}
diff --git a/templates/home.html b/templates/home.html
@@ -1,5 +1,7 @@
-<h1>Symbioz Utils {{version}}</h1>
-<button onclick="alert('hi')">test</button>
-<button onclick="alert('hi')">test</button>
-<button onclick="alert('hi')">test</button>
-<button onclick="alert('hi')">test</button>
+<h1 style="text-align: center;">Symbioz Utils {{version}}</h1>
+<div style="text-align: center; margin-top: -30px; margin-bottom: 20px;" class="text-lighter">Github.com/Tym17</div>
+<div class="menu">
+    <button onclick="navigator.navigate('creator')">Create account</button>
+    <button onclick="navigator.navigate('editacc')">Edit account</button>
+    <button onclick="navigator.navigate('character')">Character editor</button>
+</div>

Original file line number	Diff line number	Diff line change
`@@ -15,4 +15,5 @@ button:hover`
`15`	`15`	`{`
`16`	`16`	`background: $darkorange;`
`17`	`17`	`border-bottom: darken($darkorange, 15) solid 2px;`
	`18`	`+ cursor: pointer;`
`18`	`19`	`}`
Original file line number	Diff line number	Diff line change
`@@ -32,6 +32,7 @@`
`32`	`32`	`transition-duration: 0.2s;`
`33`	`33`	`-webkit-app-region: no-drag;`
`34`	`34`	`transition-timing-function: ease-out;`
	`35`	`+ border-radius: 0;`
`35`	`36`	`}`
`36`	`37`
`37`	`38`	`button:hover`