diff --git a/examples/webPanel.js b/examples/webPanel.js
index 75a0cf8..1b7e6a0 100644
--- a/examples/webPanel.js
+++ b/examples/webPanel.js
@@ -24,7 +24,7 @@
         c : [1, 2, 3]
     });
 
-    app.listen(8080, function () {
-        console.time().log('Server listening at port 8080');
+    app.listen(3000, function () {
+        console.time().log('Server listening at port 3000');
     });
 }());
diff --git a/lib/logWriter.js b/lib/logWriter.js
index 251ffba..dcea714 100644
--- a/lib/logWriter.js
+++ b/lib/logWriter.js
@@ -1,12 +1,12 @@
 /* jshint -W098 */
-(function () {
+(function() {
 
     'use strict';
 
     var moment = require('moment'),
-        fs     = require('fs'),
+        fs = require('fs'),
         mkdirp = require('mkdirp'),
-        path   = require('path');
+        path = require('path');
 
 
     /**
@@ -27,7 +27,7 @@
      *
      * @param {String}  rootPath    root logs folder
      */
-    var LogWriter = function (rootPath) {
+    var LogWriter = function(rootPath) {
 
         this.rootPath = rootPath || 'logs';
 
@@ -47,20 +47,20 @@
      *
      * Attach and init the history property
      */
-    LogWriter.prototype.initHistory = function () {
+    LogWriter.prototype.initHistory = function() {
 
         this.history = {
-            dates : {}
+            dates: {}
         };
 
         var historyPath = path.join(this.rootPath, 'history.json');
 
-        if (!fs.existsSync(historyPath)) {  //create file if doesn't exist yet
+        if (!fs.existsSync(historyPath)) { //create file if doesn't exist yet
 
             this.writeFile(
                 historyPath,
                 this.history,
-                function (err) {
+                function(err) {
                     if (err) {
                         throw err;
                     }
@@ -71,14 +71,14 @@
 
             var self = this;
 
-            fs.readFile(historyPath, function (err, data) {
+            fs.readFile(historyPath, {
+                "encoding" : "utf-8"
+            }, function(err, data) {
                 if (err) {
                     throw err;
                 } else {
                     try {
-
                         self.history = JSON.parse(data);
-
                     } catch (e) {
                         throw e;
                     }
@@ -95,8 +95,9 @@
      * @param {String}   path     The dir
      * @param {Function} callback
      */
-    LogWriter.prototype.createDir = function (path, callback) {
-        mkdirp(path, function (err) {
+    LogWriter.prototype.createDir = function(path, callback) {
+
+        mkdirp(path, function(err) {
             callback(err);
         });
     };
@@ -110,11 +111,11 @@
      * @param {String}   content
      * @param {Function} callback
      */
-    LogWriter.prototype.appendFile = function (pathToFile, content, callback) {
+    LogWriter.prototype.appendFile = function(pathToFile, content, callback) {
 
         var self = this;
 
-        self.createDir(path.dirname(pathToFile), function (err) {
+        self.createDir(path.dirname(pathToFile), function(err) {
 
             if (err) {
                 callback(err);
@@ -122,7 +123,7 @@
 
                 var newFile = !fs.existsSync(pathToFile);
 
-                fs.appendFile(pathToFile, content, function (err) {
+                fs.appendFile(pathToFile, content, function(err) {
 
                     if (err) {
                         throw err;
@@ -145,17 +146,19 @@
      * @param {String}   content
      * @param {Function} callback
      */
-    LogWriter.prototype.writeFile = function (pathToFile, content, callback) {
+    LogWriter.prototype.writeFile = function(pathToFile, content, callback) {
 
         if (typeof content !== 'string') {
             content = JSON.stringify(content);
         }
 
-        this.createDir(path.dirname(pathToFile), function (err) {
+        this.createDir(path.dirname(pathToFile), function(err) {
             if (err) {
                 callback(err);
             } else {
-                fs.writeFile(pathToFile, content, callback);
+                fs.writeFile(pathToFile, content, {
+                    "encoding" : "utf-8"
+                }, callback);
             }
         });
     };
@@ -167,12 +170,12 @@
      *
      * @param {String}  pathToFile
      */
-    LogWriter.prototype.newFileHistory = function (pathToFile) {
+    LogWriter.prototype.newFileHistory = function(pathToFile) {
 
         var historyPath = path.join(this.rootPath, 'history.json'),
-            self        = this;
+            self = this;
 
-        var today   = moment().startOf('day').valueOf().toString();
+        var today = moment().startOf('day').valueOf().toString();
 
         //Save the path under today key
 
@@ -184,7 +187,7 @@
 
             self.history.dates[today].push(pathToFile);
 
-            self.writeFile(historyPath, self.history, function (err) {
+            self.writeFile(historyPath, self.history, function(err) {
                 if (err) {
                     throw err;
                 }
@@ -200,27 +203,22 @@
      *
      * @return {String}
      */
-    LogWriter.prototype.getUser = function () {
+    LogWriter.prototype.getUser = function() {
 
         var user = '';
 
         try {
 
-            var platformKey     = process.platform === 'win32' ? 'USERPROFILE' : 'HOME',
+            var platformKey = process.platform === 'win32' ? 'USERPROFILE' : 'HOME',
                 platformDivider = process.platform === 'win32' ? '\\' : '/';
 
-
             var userDir = process.env[platformKey].toLowerCase();
             user = userDir.slice(userDir.lastIndexOf(platformDivider) + 1);
 
         } catch (e) {
-
             user = 'user'; //default
-
         } finally {
-
             return user;
-
         }
     };
 
@@ -232,13 +230,13 @@
      *
      * @return {String}             The path to current folder (without rootPath)
      */
-    LogWriter.prototype.getPath = function (opt) {
+    LogWriter.prototype.getPath = function(opt) {
 
         var now = moment();
 
         return path.join(
-                now.format('YYYY'),
-                now.format('MMM')
+            now.format('YYYY'),
+            now.format('MMM')
         );
     };
 
@@ -250,7 +248,7 @@
      *
      * @return {String}             the filname (with extension)
      */
-    LogWriter.prototype.getFile = function (opt) {
+    LogWriter.prototype.getFile = function(opt) {
 
         var now = moment();
 
@@ -268,11 +266,11 @@
      *
      * @return {String}             the full path to file
      */
-    LogWriter.prototype.path = function (opt) {
+    LogWriter.prototype.path = function(opt) {
         return path.join(
-                this.rootPath,
-                this.getPath(opt),
-                this.getFile(opt)
+            this.rootPath,
+            this.getPath(opt),
+            this.getFile(opt)
         );
     };
 
@@ -286,13 +284,17 @@
      * @param {Object}  opt             Options
      * @param {String}  opt.logger      logger options
      */
-    LogWriter.prototype.save = function (log, opt) {
+    LogWriter.prototype.save = function(log, opt) {
 
-        delete log.opt; //we save logger options in rootPath/[logger].json
+        try {
+            delete log.opt; //we save logger options in rootPath/[logger].json
+        } catch(e){
+            // ignore
+        }
 
         var json = JSON.stringify(log);
 
-        this.appendFile(this.path(opt), json + '\n', function (err) {
+        this.appendFile(this.path(opt), json + '\n', function(err) {
             if (err) {
                 throw err;
             }
@@ -306,16 +308,15 @@
      *
      * @param {Object}  logger          Logger options.
      */
-    LogWriter.prototype.saveOpt = function (logger) {
+    LogWriter.prototype.saveOpt = function(logger) {
 
         var filePath = path.join(this.rootPath, logger.name + '.json');
 
-        this.writeFile(filePath, JSON.stringify(logger), function (err) {
+        this.writeFile(filePath, JSON.stringify(logger), function(err) {
             if (err) {
                 throw err;
             }
         });
-
     };
 
     /**
@@ -326,15 +327,14 @@
      *
      * @param {Object}  logger  Console2 logger options
      */
-    LogWriter.prototype.addLogger = function (logger) {
-
+    LogWriter.prototype.addLogger = function(logger) {
         this.saveOpt(logger);
     };
 
 
     module.exports = {
-        LogWriter : LogWriter,
-        folders   : rootPaths
+        LogWriter: LogWriter,
+        folders: rootPaths
     };
 
 }());
diff --git a/lib/webPanel.js b/lib/webPanel.js
index 1fbaa68..f3d1d94 100644
--- a/lib/webPanel.js
+++ b/lib/webPanel.js
@@ -1,13 +1,12 @@
 /* jshint -W098 */
-(function () {
+(function() {
 
     'use strict';
 
-    var express     = require('express'),
+    var express = require('express'),
         serveStatic = require('serve-static'),
-        path        = require('path'),
-        fs          = require('fs');
-
+        path = require('path'),
+        fs = require('fs');
 
     /**
      * map
@@ -19,10 +18,11 @@
      * @param  {Function} callback
      * @return {Array}
      */
-    var map = function (arr, callback) {
+    var map = function(arr, callback) {
 
         var result = arr.map(callback);
-        return result.filter(function (item) {
+
+        return result.filter(function(item) {
             return item !== undefined && item !== null;
         });
     };
@@ -38,13 +38,13 @@
      *
      * @return {Express Router}
      */
-    var initWebPanel = function (consoles) {
+    var initWebPanel = function(consoles) {
 
         var webPanel = express.Router();
 
         //Static files
 
-        webPanel.use('/', serveStatic('./static'));
+        webPanel.use('/', serveStatic(path.join(__dirname, '..', 'static')));
 
         //API
 
@@ -56,18 +56,18 @@
          * @param {String}      dirPath     A path
          * @param {Function}    callback    Function to chain with result array
          */
-        var readDir = function (dirPath, callback) {
+        var readDir = function(dirPath, callback) {
 
             if (!dirPath || typeof dirPath !== 'string') {
                 callback("dirPath must be a string");
             } else {
-                fs.readdir(dirPath, function (err, list) {
+                fs.readdir(dirPath, function(err, list) {
                     var dir = [];
 
                     if (err) {
                         callback(err, null);
                     } else {
-                        list.forEach(function (item) {
+                        list.forEach(function(item) {
                             dir.push(readNode(path.join(dirPath, item)));
                         });
 
@@ -90,7 +90,7 @@
          * @return {String} name
          * @return {String} path        @see params
          */
-        var readNode = function (itemPath) {
+        var readNode = function(itemPath) {
 
             var info = fs.statSync(itemPath),
                 item = {};
@@ -107,8 +107,9 @@
          *
          * @return {Array}  logs folder in use
          */
-        var getLogFolders = function () {
-            return map(consoles, function (elem) {
+        var getLogFolders = function() {
+
+            return map(consoles, function(elem) {
                 return elem.logWriter.rootPath || undefined;
             });
         };
@@ -120,10 +121,11 @@
          *
          * @return {LogWriter|false}    If false, no logWriter with rootPath set to logFolder
          */
-        var getLogWriter = function (logFolder) {
+        var getLogWriter = function(logFolder) {
+
             var logWriter;
 
-            return consoles.some(function (item) {
+            return consoles.some(function(item) {
                 if (item.logWriter && item.logWriter.rootPath === logFolder) {
                     logWriter = item.logWriter;
                     return true;
@@ -138,7 +140,7 @@
          *
          * Send logWriters
          */
-        webPanel.get('/api', function (req, res) {
+        webPanel.get('/api', function(req, res) {
 
             var path = req.query.path;
 
@@ -150,11 +152,11 @@
          *
          * Send path content info
          */
-        webPanel.get('/api/folderExplorer', function (req, res) {
+        webPanel.get('/api/folderExplorer', function(req, res) {
 
             var path = req.query.path;
 
-            readDir(path, function (err, dir) {
+            readDir(path, function(err, dir) {
                 if (err) {
                     res.status(400).end();
                 } else {
@@ -169,10 +171,10 @@
          * Send files according to history dates
          * With pagination
          */
-        webPanel.get('/api/dateExplorer', function (req, res) {
+        webPanel.get('/api/dateExplorer', function(req, res) {
 
-            var from      = req.query.from || Date.now(),
-                length    = req.query.length || 10,
+            var from = req.query.from || Date.now(),
+                length = req.query.length || 10,
                 logFolder = req.query.logFolder;
 
             var logWriter = getLogWriter(logFolder);
@@ -182,27 +184,24 @@
             } else {
 
                 //Find the good dates
-
-                var nb     = 0,
+                var nb = 0,
                     result = [],
-                    dates  = Object.keys(logWriter.history.dates).filter(function (date) {
+                    dates = Object.keys(logWriter.history.dates).filter(function(date) {
+                        if (date < from && nb <= length) {
+                            nb++;
+                            return date;
+                        } else {
+                            return null;
+                        }
+                    });
 
-                    if (date < from && nb <= length) {
-                        nb++;
-                        return date;
-                    } else {
-                        return null;
-                    }
-
-                });
-
-                dates.forEach(function (date) {
+                dates.forEach(function(date) {
                     result.push({
-                        date  : date,
-                        files : map(logWriter.history.dates[date], function (item) {
+                        date: date,
+                        files: map(logWriter.history.dates[date], function(item) {
                             return {
-                                name : path.basename(item),
-                                path : item
+                                name: path.basename(item),
+                                path: item
                             };
                         })
                     });
@@ -217,33 +216,29 @@
          *
          * Send stream of file content
          */
-        webPanel.get('/api/log', function (req, res) {
+        webPanel.get('/api/log', function(req, res) {
 
             var path = req.query.path;
 
             if (fs.existsSync(path)) {
                 var stream = fs.createReadStream(path);
 
-                    res.writeHead(200, {
-                        'Content-Length': fs.statSync(path).size,
-                        'Content-Type'  : 'text/plain'
-                    });
-
-                    res.status(200);
-                    stream.pipe(res);
+                res.writeHead(200, {
+                    'Content-Length': fs.statSync(path).size,
+                    'Content-Type': 'text/plain'
+                });
 
+                res.status(200);
+                stream.pipe(res);
             } else {
                 res.status(400).send("Can't read path");
             }
         });
 
-
         return webPanel;
 
     };
 
-
     module.exports = initWebPanel;
 
-
 }());
diff --git a/static/fonts/fontello.eot b/static/fonts/fontello.eot
new file mode 100644
index 0000000..ace1fbc
Binary files /dev/null and b/static/fonts/fontello.eot differ
diff --git a/static/fonts/fontello.svg b/static/fonts/fontello.svg
new file mode 100644
index 0000000..e4ac19e
--- /dev/null
+++ b/static/fonts/fontello.svg
@@ -0,0 +1,16 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg xmlns="http://www.w3.org/2000/svg">
+<metadata>Copyright (C) 2014 by original authors @ fontello.com</metadata>
+<defs>
+<font id="fontello" horiz-adv-x="1000" >
+<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
+<missing-glyph horiz-adv-x="1000" />
+<glyph glyph-name="left-open" unicode="&#x3c;" d="m653 682l-296-296 296-297q11-10 11-25t-11-25l-92-93q-11-10-25-10t-25 10l-414 415q-11 10-11 25t11 25l414 414q10 10 25 10t25-10l92-93q11-10 11-25t-11-25z" horiz-adv-x="714.3" />
+<glyph glyph-name="right-open" unicode="&#x3e;" d="m618 361l-414-415q-11-10-25-10t-26 10l-92 93q-11 11-11 25t11 25l296 297-296 296q-11 11-11 25t11 25l92 93q11 10 26 10t25-10l414-414q10-11 10-25t-10-25z" horiz-adv-x="714.3" />
+<glyph glyph-name="arrows-ccw" unicode="&#x4f;" d="m186 140l116 116 0-292-276 16 88 86q-116 122-114 290t120 288q100 100 240 116l4-102q-100-16-172-88-88-88-90-213t84-217z m332 598l276-16-88-86q116-122 114-290t-120-288q-96-98-240-118l-2 104q98 16 170 88 88 88 90 213t-84 217l-114-116z" horiz-adv-x="820" />
+<glyph glyph-name="doc-text" unicode="&#xe800;" d="m819 638q16-16 27-42t11-50v-642q0-23-15-38t-38-16h-750q-23 0-38 16t-16 38v892q0 23 16 38t38 16h500q22 0 49-11t42-27z m-248 136v-210h210q-5 16-12 23l-175 175q-6 7-23 12z m215-853v572h-232q-23 0-38 15t-16 38v233h-429v-858h715z m-572 483q0 7 5 12t13 5h393q8 0 13-5t5-12v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36z m411-125q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z m0-143q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z" horiz-adv-x="857.1" />
+<glyph glyph-name="folder-empty" unicode="&#xe801;" d="m857 118v393q0 22-15 38t-38 15h-393q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-536q0-22 16-38t38-16h679q22 0 38 16t15 38z m72 393v-393q0-51-37-88t-88-37h-679q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h375q51 0 88-37t37-88z" horiz-adv-x="928.6" />
+</font>
+</defs>
+</svg>
\ No newline at end of file
diff --git a/static/fonts/fontello.ttf b/static/fonts/fontello.ttf
new file mode 100644
index 0000000..43e26a1
Binary files /dev/null and b/static/fonts/fontello.ttf differ
diff --git a/static/fonts/fontello.woff b/static/fonts/fontello.woff
new file mode 100644
index 0000000..dd799bf
Binary files /dev/null and b/static/fonts/fontello.woff differ
diff --git a/static/index.html b/static/index.html
index 37751f0..91fe95a 100644
--- a/static/index.html
+++ b/static/index.html
@@ -7,10 +7,11 @@
 
         <title>{{title}} - ScribeJS</title>
 
-        <link 
+        <link
             href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700'
             rel='stylesheet'
             type='text/css'>
+        <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro:300,400,700' rel='stylesheet' type='text/css'>
         <link rel="stylesheet" href="lib/ng-toggle.css" type="text/css">
         <link rel="stylesheet" href="lib/autocomplete.css" type="text/css">
         <link href="style.css" rel="stylesheet" type="text/css">
@@ -18,23 +19,23 @@
     </head>
 
     <body>
-        
+
         <header class="header">
-        
+
             <div class="header__menu-button" ng-click="sidebar = !sidebar"></div>
-            <p class="header__title a" ng-click="back()">{{title}}</p>
+            <p class="header__title a" ng-click="back()">{{path}}</p>
             <div class="header__mode">
-                Mode : {{mode}}
+                {{mode}}
                 <ng-toggle ng-true-val="'dates'" ng-false-val="'folder'" ng-model="mode"></ng-toggle>
             </div>
             <a class="header__logo" href="/logs"></a>
-        
+
         </header>
 
-        <ng-view></ng-view>
+        <ng-view ng-class="{lowerScope: controller == 'logsController', higherScope: controller == 'dateController' }"></ng-view>
 
         <div class="mask" ng-show="sidebar" ng-click="sidebar = false"></div>
-    
+
         <script type="text/javascript" src="lib/angular.min.js"></script>
         <script type="text/javascript" src="lib/angular-route.min.js"></script>
         <script type="text/javascript" src="lib/angular-resource.min.js"></script>
@@ -42,13 +43,13 @@
         <script type="text/javascript" src="lib/autocomplete.js"></script>
 
         <script type="text/javascript" src="js/app.js"></script>
-        
+
         <script type="text/javascript" src="js/directives/block.js"></script>
         <script type="text/javascript" src="js/directives/sidebarLoggers.js"></script>
         <script type="text/javascript" src="js/directives/sidebarLogs.js"></script>
         <script type="text/javascript" src="js/directives/log.js"></script>
         <script type="text/javascript" src="js/directives/menu.js"></script>
-        
+
         <script type="text/javascript" src="js/services/scribeAPI.js"></script>
         <script type="text/javascript" src="js/services/logs.js"></script>
 
diff --git a/static/js/app.js b/static/js/app.js
index 270d37a..0579364 100644
--- a/static/js/app.js
+++ b/static/js/app.js
@@ -47,9 +47,10 @@
                             var from      = $location.search().from || Date.now(), //timestamp
                                 length    = $location.search().length || 10,       //number of dates to show
                                 logWriter = $location.search().path;               //which log writer to use ?
-                            
+
                             $rootScope.title = logWriter + ' dates';
-                            
+                            $rootScope.path = logWriter + ' · dates';
+
                             //Get dates
                             return ScribeAPI.dateExplorer({
                                 logFolder : logWriter,
@@ -64,7 +65,7 @@
             .when('/folder/', {
                 templateUrl : 'partials/folder.html',
                 controller  : 'folderController',
-                
+
                 //resolve folder content
                 resolve : {
                     folder : [
@@ -72,11 +73,12 @@
                         '$rootScope',
                         '$location',
                         function (ScribeAPI, $rootScope, $location) {
-                            
+
                             //folder path
                             var path = $location.search().path;
 
                             $rootScope.title = path;
+                            $rootScope.path = path;
 
                             //Get folder content
                             return ScribeAPI.folderExplorer({
@@ -102,6 +104,12 @@
         'ScribeAPI',
         function ($rootScope, $location, $q, $window, $document, ScribeAPI) {
 
+            $rootScope.$on('$routeChangeSuccess', function(ev,data) {
+                if (data.$$route && data.$$route.controller){
+                    $rootScope.controller = data.$$route.controller;
+                }
+            });
+
             /**
              * getAllLogsFiles
              *
@@ -115,7 +123,7 @@
 
                 var deferred       = $q.defer(),
                     loggersHistory = [];
-                
+
                 //First, get all history files
                 loggers.forEach(function (logger) {
                     loggersHistory.push(ScribeAPI.log({
@@ -156,13 +164,13 @@
              *
              * Page title
              *
-             * @type {String} 
+             * @type {String}
              */
             $rootScope.title = "ScribeJS";
 
             /**
              * $rootScope.sidebar
-             * 
+             *
              * Open/close sidebar
              *
              * @type {Boolean}
@@ -233,6 +241,6 @@
         }
     ]);
 
-    
+
 
 }());
diff --git a/static/js/controllers/logsController.js b/static/js/controllers/logsController.js
index c8f917f..f1bada7 100644
--- a/static/js/controllers/logsController.js
+++ b/static/js/controllers/logsController.js
@@ -15,7 +15,6 @@
 
             //reset
             $rootScope.sidebar = false;
-
             /**
              * attachCurrentFiles
              *
@@ -43,7 +42,7 @@
             var getCurrentLogs = function () {
 
                 $scope.currentFiles.forEach(function (file) {
-                    
+
                     $scope.lines = [];
 
                     if (file.selected) {
@@ -79,10 +78,10 @@
 
             //ng-toggle values
             //3 states : 1 / null / 0
-            $scope.showFile = null;
-            $scope.showTime = 1;
-            $scope.showDate = 0;
-            $scope.showTags = null;
+            $scope.showFile = 0;
+            $scope.showTime = 0;
+            $scope.showDate = 1;
+            $scope.showTags = 1;
 
             //Stores all lines (a line = a log)
             $scope.lines = [];
@@ -96,7 +95,7 @@
              * $scope.addFile
              *
              * Add a file to current files
-             * 
+             *
              * @param {String} path     Its path (with logWriter dir)
              * @type  {Function}
              */
@@ -117,7 +116,7 @@
                 attachCurrentFiles(logs.getLogs());
                 getCurrentLogs();
             };
-        
+
             $scope.reload();
 
 
@@ -132,7 +131,7 @@
                     getCurrentLogs();
                 }
             }, true);
-    
+
             //watch selectAll checkbox
             //to select all current files
             $scope.$watch('selectAll', function (value, old) {
diff --git a/static/lib/autocomplete.css b/static/lib/autocomplete.css
index d83ba43..7dee209 100644
--- a/static/lib/autocomplete.css
+++ b/static/lib/autocomplete.css
@@ -6,9 +6,13 @@
 }
 
 .autocomplete input{
-  font-size: 1.2em;
+  font-size: 10px;
   width: 100%;
-  padding:0.4em;
+  padding: 8px;
+  background: #222;
+  border: 1px solid #2C2C2C;
+  color: #FFF;
+  font-family: "Open Sans";
 }
 
 .autocomplete ul{
@@ -25,8 +29,11 @@
   text-align: left;
   list-style:none;
   width: 100%;
-  padding:0.4em;
-  background-color: #fff;
+  padding: 7px;
+  background: #333;
+  font-family: "Open Sans";
+  font-size: 10px;
+  color: #FFF;
 }
 
 .autocomplete li.active{
diff --git a/static/lib/ng-toggle.css b/static/lib/ng-toggle.css
index 4f83100..4e57f66 100644
--- a/static/lib/ng-toggle.css
+++ b/static/lib/ng-toggle.css
@@ -2,7 +2,7 @@
     display: inline-block;
     margin: 3px;
     position: relative;
-    width: 62px;
+    width: 46px;
     height: 36px;
     -webkit-backface-visibility: hidden;
     -webkit-transform: translateZ(0) scale(1.0, 1.0);
@@ -36,10 +36,10 @@
     cursor: pointer;
 }
 .ng-toggle-switch.true {
-    background-color: #68C527;
+    background-color: #21ce99;
 }
 .ng-toggle-switch.false {
-    background-color: #ff4d35;
+    background-color: #323232;
 }
 .ng-toggle-false {
     position: absolute;
@@ -59,7 +59,7 @@
     border-radius: 100%;
     background-color: white;
     position: absolute;
-    top: 3px;
+    top: 1px;
     left: 16px;
     -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15);
@@ -70,7 +70,7 @@
     left: 29px;
 }
 .ng-toggle-switch.false .ng-toggle-handle {
-    left: 3px;
+    left: 2px;
 }
 .ng-toggle-tooltip {
     display: inline-block;
diff --git a/static/partials/elements/blocks.html b/static/partials/elements/blocks.html
index 9e8b115..4afc6e6 100644
--- a/static/partials/elements/blocks.html
+++ b/static/partials/elements/blocks.html
@@ -1,9 +1,9 @@
-<div 
+<div
     class="block"
     ng-class="{'block--date' : type == 'date', 'block--file': forceFile}"
-    style="background: {{ color() }}"
+    style="/*box-shadow:inset 10px 0 0 {{ color() }}*/"
     >
     <p class="block__message block__message--top" ng-if="messageTop">{{messageTop}}</p>
     <p class="block__message block__message--middle" ng-if="message">{{message}}</p>
-    <p class="block__message block__message--bottom" ng-if="messageBottom">{{messageBottom}}</p>
+    <p class="block__message block__message--bottom" ng-if="messageBottom">&middot;&nbsp; {{messageBottom}}</p>
 </div>
diff --git a/static/partials/elements/log.html b/static/partials/elements/log.html
index b6345c9..7d65706 100644
--- a/static/partials/elements/log.html
+++ b/static/partials/elements/log.html
@@ -1,10 +1,10 @@
 <p class="log">
 
     <span class="log__item log__time">
-        <span ng-if="showDate != 0 && (showDate == 1 || log.show.date)">
+        <span ng-if="showDate != 0 && (showDate == 1 || log.show.date)" class="log__time__higher">
             {{log.context.time | date: 'EEE MMM dd yyyy'}}
         </span>
-        <span ng-if="showTime != 0 && (showTime == 1 || log.show.time)">
+        <span ng-if="showTime != 0 && (showTime == 1 || log.show.time)"  class="log__time__lower">
             {{log.context.time | date: 'yyyy-MM-ddTHH:mm:ss:Z'}}
         </span>
     </span>
diff --git a/static/partials/elements/menu.html b/static/partials/elements/menu.html
index 37e2c0c..7a0fa2d 100644
--- a/static/partials/elements/menu.html
+++ b/static/partials/elements/menu.html
@@ -2,31 +2,31 @@
 
     <ul class="actions">
 
-        <li class="action action--reload a" ng-click="reload()">⟳</li>
+        <li class="action action--reload a" ng-click="reload()">Refresh</li>
 
         <li class="action">
-            <h4 class="title">Date :</h4>
-            <ng-toggle tri-toggle ng-model="showDate"></ng-toggle>
+            <h4 class="title">Date</h4>
+            <ng-toggle ng-model="showDate"></ng-toggle>
         </li>
 
         <li class="action">
-            <h4 class="title">Time :</h4>
-            <ng-toggle tri-toggle ng-model="showTime"></ng-toggle>
+            <h4 class="title">Time</h4>
+            <ng-toggle ng-model="showTime"></ng-toggle>
         </li>
 
         <li class="action">
-            <h4 class="title">Tags :</h4>
-            <ng-toggle tri-toggle ng-model="showTags"></ng-toggle>
+            <h4 class="title">Tags</h4>
+            <ng-toggle ng-model="showTags"></ng-toggle>
         </li>
 
         <li class="action">
-            <h4 class="title">File :</h4>
-            <ng-toggle tri-toggle ng-model="showFile"></ng-toggle>
+            <h4 class="title">File</h4>
+            <ng-toggle ng-model="showFile"></ng-toggle>
         </li>
 
         <li class="action">
 
-            <h4 class="title">Order by :</h4>
+            <h4 class="title">Order by</h4>
 
             <select ng-model="order">
                 <option value="context.time">Time</option>
@@ -39,11 +39,11 @@
                 <input type="checkbox" id="reverseOrder" ng-model="reverse">
                 <label class="title tiny" for="reverseOrder">Reverse</label>
             </form>
-            
+
         </li>
 
         <li class="action action--search pull-right">
-            <h4 class="title">Filter :</h4>
+            <h4 class="title">Filter</h4>
             <form action="">
                 <input type="text" class="input" ng-model="search">
             </form>
diff --git a/static/partials/elements/sidebarLogs.html b/static/partials/elements/sidebarLogs.html
index 7f6a89f..f94e060 100644
--- a/static/partials/elements/sidebarLogs.html
+++ b/static/partials/elements/sidebarLogs.html
@@ -11,14 +11,14 @@
     </h3>
 
     <ul class="content">
-       
+
         <li ng-repeat="file in currentFiles" class="sidebar__item">
             <form action="">
                 <input type="checkbox" id="check{{$id}}" ng-model="file.selected">
                 <label for="check{{$id}}">{{file.name}}</label>
             </form>
         </li>
-    
+
     </ul>
 
     <h3 class="sidebar__title">Add a file</h3>
@@ -28,7 +28,7 @@
         on-select="addFile"
         ng-keyup="$event.keyCode == 13 && addFile(fileToAdd)"
         click-activation="true"
-        attr-placeholder="A path"
+        attr-placeholder="File Path"
         attr-input-class="input"
         class="sidebar__block"></autocomplete>
 
diff --git a/static/partials/logs.html b/static/partials/logs.html
index 0404b69..4aa221a 100644
--- a/static/partials/logs.html
+++ b/static/partials/logs.html
@@ -1,11 +1,11 @@
 <div class="page">
 
     <sidebar-logs files="currentFiles" open="sidebar"></sidebar-logs>
-    
+
     <menu></menu>
 
     <div class="logs__wrapper">
-        <log 
+        <log
             ng-repeat="line in lines | orderBy : order : reverse | filter : search track by $index"
             log="line"
             show-file="showFile"
@@ -16,8 +16,8 @@
     </div>
 
     <div class="logs__empty" ng-if="lines.length == 0">
-        <h1>No file selected</h1>
-        <h2>← Open menu</h2>
+        <h1>Select file(s) from</h1>
+        <h1>sidebar to display</h1>
     </div>
 
 </div>
diff --git a/static/style.css b/static/style.css
index 679c454..c8c8a04 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,11 +1,21 @@
 
+@font-face {
+  font-family: 'Fontello';
+  src: url('fonts/fontello.eot'); /* IE9 Compat Modes */
+  src: url('fonts/fontello.eot?#fontello') format('embedded-opentype'), /* IE6-IE8 */
+       url('fonts/fontello.woff2') format('woff2'), /* Super Modern Browsers */
+       url('fonts/fontello.woff') format('woff'), /* Pretty Modern Browsers */
+       url('fonts/fontello.ttf')  format('truetype'), /* Safari, Android, iOS */
+       url('fonts/fontello.svg#svgFontName') format('svg'); /* Legacy iOS */
+}
+
 /*
  * Scribe.js style
  */
 
 * {
     box-sizing: border-box;
-    font-family: Consolas, Menlo, Monaco, Lucida Console,
+    font-family: "Source Code Pro", Consolas, Menlo, Monaco, Lucida Console,
                  Liberation Mono, DejaVu Sans Mono,
                  Bitstream Vera Sans Mono, Courier New, monospace, serif;
 }
@@ -18,7 +28,7 @@ body {
     padding: 0;
     overflow: hidden;
     border: 0;
-    background: #161d25;
+    background: #222;
     font-size: 12px;
 }
 
@@ -31,6 +41,10 @@ body {
 }
 .pull-right {
     float: right;
+    margin-right: 8px;
+    border-right: none !important;
+    border-left: 1px solid #222;
+    padding-left: 12px !important;
 }
 .clear {
     clear: both;
@@ -38,30 +52,31 @@ body {
 
 .tiny {
     font-size: 9px;
+    position: relative;
+    top: -3px;
 }
 
 .input {
-    border-radius: 2px;
+    border-radius: 4px;
     border: none;
+    outline: none;
 }
 
 .bck-tag {
-    background: #04c25f;
-    border-radius: 3px;
-    color: #000;
-    margin-right: 2px;
-    padding: 2px 4px;
+    padding: 0px 0px;
     text-transform: uppercase;
     font-size: 9px;
-    letter-spacing: 1px;
-    font-weight: 700;
+    color: #21ce99;
+    font-family: "Open Sans";
+    /* font-weight: bold; */
+    /* letter-spacing: 1px; */
 }
 
 .page {
     width: 100%;
     height: 100%;
-    padding-top: 50px;
     overflow-y: auto;
+    background: #111;
 }
 
 .mask {
@@ -77,48 +92,59 @@ body {
  * Header
  */
 .header {
-    position : absolute;
+    position: fixed;
     left: 0;
     top: 0;
     z-index: 4;
-    width: 100%;
+    /* width: 100%; */
     height: 50px;
-    background: #34495e;
-    box-shadow: #101 0px 0px 6px;
+    background: #222;
+    /* border-bottom: 1px solid #222; */
+    /* box-shadow: 0 1px 5px #111; */
+    right: 0;
+    left: 0;
+    border-bottom: 1px solid #2A2A2A;
 }
     .header__menu-button {
         position: absolute;
         left: 10px;
-        top: 9px;
+        top: 10px;
         height: 30px;
         width: 40px;
 
-        border-radius: 3px;
+        border-radius: 4px;
         background: url("img/menu.png") center center no-repeat;
-        background-size: 67%;
-        cursor: pointer;
-        background-color: #2980b9;
-        border: 1px solid rgba(255, 255, 255, 0.05)
-    }
+        background-size: 85%;
+        cursor: pointer;}
     .header__title {
         position: absolute;
-        top: 2px;
+        top: 5px;
         left: 70px;
         height: 30px;
         width: 500px;
-        font-size: 9px;
-        line-height: 33px;
+        font-size: 11px;
+        line-height: 40px;
         font-weight: 300;
         text-transform: uppercase;
         letter-spacing: 1px;
-        color: #fff;
-    }
+        color: #FFF;
+
+        font-family: "Open Sans";
+        margin: 0;
+}
     .header__mode {
         position: absolute;
         top: 5px;
         right: 180px;
         color: #e2e2e2;
-    }
+
+        text-transform: uppercase;
+        font-family: "Open Sans";
+        font-weight: normal;
+        line-height: 40px;
+        font-size: 10px;
+        letter-spacing: 1px;
+}
         .header__mode > * {
             display: inline-block;
             vertical-align: middle;
@@ -144,21 +170,28 @@ body {
     z-index: 3;
     overflow-y: auto;
     width: 300px;
-    padding-top: 50px;
-    background: #111;
+    background: #222;
     color: #fff;
     transform: translate3d(-360px, 0, 0);
     transition: transform 0.5s ease;
+    border-right: 1px solid #2A2A2A;
 }
 .sidebar--open {
-    box-shadow: #111 0 0 20px 0;
+    box-shadow: 1px 0 3px #000;
     transform: translate3d(0,0,0);
 }
     .sidebar__title {
-        font-size: 18px;
+        font-size: 13px;
         padding: 0 22px;
         margin: 22px 0;
-    }
+
+        font-family: "Open Sans";
+        text-transform: uppercase;
+        letter-spacing: 1px;
+        margin-bottom: 0;
+        color: #999;
+        font-weight: normal;
+}
     .sidebar__block {
         list-style: none;
         width: 100%;
@@ -166,38 +199,54 @@ body {
     .sidebar__item {
         list-style: none;
         width: 100%;
-        padding-left: 22px;
-        font-size: 18px;
-    }
+        font-size: 12px;
+
+        font-family: "Open Sans";
+        text-transform: uppercase;
+        letter-spacing: 1px;
+}
         .sidebar__item a {
             color: #fff;
             text-decoration: none;
-        }
+
+            font-family: "Open Sans";
+            text-transform: uppercase;
+            color: #FFF;
+            letter-spacing: 1px;
+            font-size: 17px;
+            font-weight: bold;
+}
 
 /**
  * Blocks
  */
 .block {
     display: inline-block;
-    height: 200px;
-    width: 200px;
-    margin: 10px;
+    height: 44px;
     margin-right: 0;
 
-    color: rgba(255, 255, 255, 0.39);
+    color: #FFF;
     font-family: "Open Sans";
-    font-size: 53px;
+    font-size: 0;
     text-align: center;
-    line-height: 49px;
+    line-height: 30px;
     font-weight: 300;
     text-transform: uppercase;
     letter-spacing: 1px;
 
     background: #393e41;
-    border: 1px solid rgba(255, 255, 255, 0.05);
+    border: none;
     cursor: pointer;
 
     overflow: hidden;
+    background: #111 !important;
+    border-bottom: 1px solid #222;
+    border-radius: 0;
+    padding-left: 20px;
+    width: 100%;
+    text-align: left;
+
+    transition: box-shadow 250ms;
 }
 .block:hover {
     background: #595e50;
@@ -206,17 +255,28 @@ body {
         margin: 0;
         font-family: "Open Sans";
         text-align: center;
-        font-size: 18px;
-        font-weight: normal;
-    }
+        font-size: 11px;
+        font-weight: bold;
+
+        letter-spacing: 0px;
+        position: relative;
+        top: 6px;
+}
     .block__message--top {
-        padding-top: 6px;
+        padding-top: 0;
     }
     .block__message--middle {
         width: 100%;
-        height: 100%;
-        line-height: 200px;
-    }
+
+        text-align: left;
+        padding: 0;
+        position: relative;
+        height: auto;
+        font-size: 14px;
+        top: 6px;
+        font-weight: normal;
+        letter-spacing: 2px;
+}
     .block__message--top + .block__message--middle {
         height: auto;
         line-height: 32px;
@@ -237,41 +297,57 @@ body {
     }
 .block--date {}
     .block--date .block__message--top {
-        letter-spacing: 2px;
         font-weight: 700;
-    }
+
+        color: #FFF;
+        display: inline-block;
+        width: auto;
+}
     .block--date .block__message--middle {
-        font-size: 92px;
+        font-size: 11px;
         color: #fff;
-        font-weight: 300;
-        line-height: 93px;
-    }
+        font-weight: bold;
+
+        display: inline-block;
+        width: auto;
+        margin-left: 3px;
+}
     .block--date .block__message--bottom {
-        letter-spacing: 2px;
         font-weight: 300;
-    }
+
+        color: #888;
+        display: inline-block;
+        width: auto;
+        margin-left: 4px;
+        letter-spacing: 0px;
+}
 
 /**
  * Nav
  */
 .nav {
-    position: absolute;
+    position: fixed;
     bottom: 0;
     left: 0;
     width: 100%;
+    background: #222;
+    border-top: 1px solid #2A2A2A;
 }
     .nav > .btn {
         display: inline-block;
-        padding: 4px 14px;
-        background: rgba(255, 255, 255, 0.2);
-        box-shadow: #101 0px 0px 6px;
-        border-radius : 4px;
-        font-size: 38px;
+        padding: 7px 12px !important;
+        font-size: 13px;
         color: #e2e2e2;
-    }
+
+        font-family: "Fontello";
+        margin-right: 0  !important;
+
+        transition: background 250ms;
+
+}
     .nav > .btn:hover {
         cursor: pointer;
-        background: rgba(255, 255, 255, 0.3);
+        background: rgba(255, 255, 255, 0.1);
     }
 
 /**
@@ -281,25 +357,44 @@ body {
     width: 100%;
     height: 40px;
     background: rgba(255, 255, 255, 0.2);
-    margin-bottom: 14px;
+    background: #222;
+    border-bottom: 1px solid #2A2A2A;
+    /* box-shadow: 0 1px 3px #000; */
+    position: fixed;
+    z-index: 5;
+    top: 49px;
 }
     .actions {
         margin: 0;
-        padding: 0 6px;
-    }
+
+        height: 40px;
+        padding-left: 17px;
+}
         .action {
             display: inline-block;
             vertical-align: middle;
             list-style: none;
-        }
+
+            height: 40px;
+            padding-left: 6px;
+            margin-right: 5px;
+}
             .action > * {
                 display: inline-block;
                 vertical-align: middle;
             }
             .action .title {
-                color: #e2e2e2;
+                color: #888;
                 font-weight: 400;
-            }
+
+                font-family: "Open Sans";
+                text-transform: uppercase;
+                font-size: 9px;
+                font-weight: bold;
+                height: 40px;
+                margin: 0;
+                line-height: 39px;
+}
             .action--search > * {
                 display: inline-block;
                 vertical-align: middle;
@@ -308,13 +403,27 @@ body {
                 height: 24px;
                 min-width: 190px;
                 font-size: 14px;
-            }
+
+                background: #222;
+                outline: none;
+                background: #222;  font-size: 11px;  padding: 8px;  color: #FFF;  border: 1px solid #2C2C2C;
+}
         .action--reload {
-            color: #e2e2e2;
-            font-size: 24px;
-            font-weight: 700;
-            margin-right: 8px;
-        }
+            color: #888;
+            font-size: 9px;
+
+            font-family: "Open Sans";
+            text-align: center;
+            line-height: 20px;
+            text-transform: uppercase;
+            font-weight: bold;
+            background: #333;
+            height: 20px;
+            width: 62px;
+            padding-left: 0;
+            color: #AAA;
+            border-radius: 3px;
+}
 
 /**
  * Log
@@ -322,59 +431,86 @@ body {
 .logs__wrapper {
     display: table;
     table-layout: fixed;
-    max-width: 100%;
+    max-width: 85%;
+    /* width: 100%; */
+    text-align: left;
+    padding: 15px;
 }
 .log {
     display: table-row;
     height: auto;
     width: 100%;
-    font-size: 11px;
-    line-height: 20px;
+    font-size: 9px;
+    line-height: 17px;
     color: #bebebe;
+    margin: 0;
 }
     .log__item {
         display: table-cell;
         padding: 0 6px;
-    }
+
+        padding-right: 3px;
+        text-align: left;
+}
     .log__tags {}
         .log__tag {}
     .log__time {}
     .log__location {}
         .log__location > span {
-            background: #2980b9;
+            color: #2980b9;
         }
     .log__message {
         white-space: pre;
-    }
+
+        color: #FFF;
+        line-height: 13px;
+        /* margin-top: -10px; */
+        position: relative;
+        /* top: -10px; */
+        /* border-left: 1px solid #222; */
+        /* box-shadow: inset 2px 0 2px -2px #000; */
+}
     .log__json {
         white-space: pre-wrap;
     }
 .logs__empty {
     text-align: center;
     width: 100%;
-    color: #e2e2e2
+    color: #e2e2e2;
+    position:relative;
+    top:50%;
+    margin:0 auto;
+    margin-top:-30px;
 }
     .logs__empty > * {
         font-weight: 400;
-    }
+
+        font-family: "Open Sans";
+        color: #333;
+        text-transform: uppercase;
+        font-weight: bold;
+        font-size: 16px;
+        line-height: 8px;
+}
 
 /**
  * ngToggle
  */
 .ng-toggle-wrap {
-    margin: 2px;
+    margin: 0px;
+    margin-left: -7px;
 }
     .ng-toggle-switch {
-        width: 42px;
-        height: 22px;
+        width: 36px;
+        height: 17px;
     }
         .ng-toggle-handle {
-            width: 16px;
-            height: 16px;
+            width: 15px;
+            height: 15px;
             left: 12px;
         }
         .ng-toggle-switch.true .ng-toggle-handle {
-            left: 22px;
+            left: 20px;
         }
 
 /**
@@ -389,10 +525,84 @@ body {
     }
     .sidebar__block > .autocomplete {
         padding: 0 22px;
-    }
+
+        margin-top: 10px;
+}
     .sidebar__block > .autocomplete > ul {
         left: 22px;
         right: 22px;
         width: auto;
-    }
 
+        border-color: #333;
+        border-radius: 4px;
+        margin-top: 5px;
+        overflow: hidden;
+}
+
+
+.log__time__higher {
+    font-family: "Open Sans";
+
+
+    font-weight: normal;
+    margin-right: 5px;
+    text-transform: uppercase;
+}
+
+.log__time__lower {
+    font-family: "Open Sans";
+
+    /* font-style: italic; */
+    color: #555;
+    font-weight: normal;
+}
+
+ng-view.ng-scope {
+    position: absolute;
+    top: 50px;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
+label {
+    position: relative;
+    top: -3px;
+    font-size: 9px;
+}
+
+form.ng-pristine.ng-valid {
+    position: relative;
+}
+
+.toggle-button {
+    background: #444;
+    color:#FFF;
+    border: none;
+    padding: 5px 20px;
+    border-radius: 3px;
+    font-family: "Open Sans";
+    text-align: center;
+    text-transform: uppercase;
+    font-weight: bold;
+    font-size: 8px;
+    letter-spacing: 1px;
+    outline: none;
+    border: 1px solid #444;
+    border-bottom-width: 3px;
+}
+
+button.toggle-button.active {
+    background: rgb(33, 206, 153);
+    border-color: rgb(33, 206, 153);
+}
+
+.block:hover {
+    box-shadow: inset 10px 0 0 #21ce99;
+}
+
+.lowerScope {
+    top:89px !important;
+}
+.higherScope {
+    bottom: 29px !important;
+}