Update icon and styles

niksudan · Jun 13, 2019 · a4df751 · a4df751
1 parent ae180b1
commit a4df751
Show file tree

Hide file tree

Showing 4 changed files with 54 additions and 37 deletions.
diff --git a/img/icon.png b/img/icon.png
diff --git a/index.html b/index.html
@@ -1,39 +1,55 @@
 <!DOCTYPE html>
 <html>
-
-<head>
-  <meta charset="utf-8" />
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>Battery Watcher</title>
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <style>
-    body {
-      font-family: sans-serif;
-      text-align: center;
-    }
-  </style>
-</head>
-
-<body>
-  <section>
-    <div>
-      <strong>
-        Battery Watcher
-        <br />
-        <small>v0.2.0</small>
-      </strong>
-      <br />
-      <a href="https://github.com/niksudan/battery-watcher" target="_blank">GitHub</a> | <a href="#" onclick="quit()">Quit</a>
-    </div>
-  </section>
-  <script type="text/javascript">
-    const remote = require('electron').remote;
-    function quit() {
-      if (remote) {
-        remote.app.exit();
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <title>Battery Watcher</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <style>
+      body {
+        font-family: sans-serif;
+        text-align: center;
+      }
+      .heading {
+        font-weight: bold;
       }
-    }
-  </script>
-</body>
+      .version {
+        font-size: 0.9em;
+        color: grey;
+      }
+      .links {
+        font-size: 0.9em;
+        position: absolute;
+        bottom: 10px;
+        left: 0;
+        right: 0;
+      }
+    </style>
+  </head>
 
-</html>
+  <body>
+    <section>
+      <div>
+        <img src="./img/icon.png" alt="" />
+        <div class="heading">
+          Battery Watcher
+        </div>
+        <div class="version">v0.2.0</div>
+        <div class="links">
+          <a href="https://github.com/niksudan/battery-watcher" target="_blank"
+            >GitHub</a
+          >
+          | <a href="#" onclick="quit()">Quit</a>
+        </div>
+      </div>
+    </section>
+    <script type="text/javascript">
+      const remote = require('electron').remote;
+      function quit() {
+        if (remote) {
+          remote.app.exit();
+        }
+      }
+    </script>
+  </body>
+</html>
diff --git a/src/battery.ts b/src/battery.ts
@@ -2,7 +2,6 @@ const batteryLevel = require('battery-level');
 const isCharging = require('is-charging');
 const notifier = require('node-notifier');
 const randomItem = require('random-item');
-const path = require('path');
 
 const standardWarnings = [
   'Haha, very funny... now plug me in',

diff --git a/src/index.ts b/src/index.ts
@@ -1,5 +1,6 @@
 const menubar = require('menubar');
 const electron = require('electron');
+const path = require('path');
 const checkBattery = require('./battery');
 
 const options = {
@@ -10,7 +11,7 @@ const delay = 1000 * 60 * 5;
 
 var mb = menubar({
   width: 150,
-  height: 75,
+  height: 100,
 });
 
 mb.on('after-create-window', async () => {
@@ -22,6 +23,7 @@ mb.on('after-create-window', async () => {
 
 mb.on('ready', function ready() {
   console.log('Battery Watcher loaded');
+  mb.tray.setImage(path.join(__dirname, '../img/icon.png'));
   checkBattery(options);
   setInterval(() => {
     checkBattery(options);