better sizes for fonts

css/style.css

@@ -30,17 +30,17 @@ body, input {
   font-family: 'Avenir', 'helvetica neue', helvetica, arial, sans-serif;
 }
 
-.age-label {
+.timeLeft-label {
   color: #C5CAE9;
-  font-size: 1.2rem;
+  font-size: 1rem;
   line-height: 1;
   margin: 0 0 20 0px;
 }
 
 .count {
   color: #C5CAE9;
   margin: 0;
-  font-size: 2.4rem;
+  font-size: 2rem;
   line-height: 1;
   font-weight: 600;
 }

dashboard.html

@@ -12,14 +12,14 @@
 
 <div id="app"></div>
 
-<script id="age-template" type="text/x-handlebars-template">
-  <h1 class="age-label">Time left today</h1>
+<script id="timeLeft-template" type="text/x-handlebars-template">
+  <h1 class="timeLeft-label">Time left today</h1>
   <h2 class="count">{{timeLeft}}</h2>
 </script>
 
-<script src="js/handlebars.js"></script>
-<script src="js/countdown.min.js"></script>
-<script src="app/app.js"></script>
+<script src="vendor/handlebars.js"></script>
+<script src="vendor/countdown.min.js"></script>
+<script src="js/app.js"></script>
 
 </body>
 </html>

js/app.js

@@ -0,0 +1,47 @@
+(function(){
+
+var $  = document.getElementById.bind(document);
+var $$ = document.querySelectorAll.bind(document);
+
+var App = function($el){
+  this.$el = $el;
+  this.load();
+};
+
+App.fn = App.prototype;
+
+App.fn.load = function(){
+  this.renderAgeLoop();
+};
+
+App.fn.renderAgeLoop = function(){
+  this.interval = setInterval(this.renderAge.bind(this), 100);
+};
+
+App.fn.renderAge = function(timeLeft){
+  var now = new Date(Date.now());
+  var timeLeft = countdown(new Date(now.getFullYear(), now.getMonth(), now.getDate(), 24)).toString();
+
+  requestAnimationFrame(function(){
+    this.html(this.view('timeLeft')({
+      timeLeft: timeLeft,
+    }));
+  }.bind(this));
+};
+
+App.fn.$$ = function(sel){
+  return this.$el.querySelectorAll(sel);
+};
+
+App.fn.html = function(html){
+  this.$el.innerHTML = html;
+};
+
+App.fn.view = function(name){
+  var $el = $(name + '-template');
+  return Handlebars.compile($el.innerHTML);
+};
+
+window.app = new App($('app'))
+
+})();

manifest.json

@@ -16,5 +16,5 @@
    "manifest_version": 2,
    "name": "Daily Motivation",
    "offline_enabled": true,
-   "version": "0.12"
+   "version": "0.13"
 }