diff --git a/public/css/style.css b/public/css/style.css index 9400fa4..0fac592 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -5,18 +5,19 @@ body { } .big-info { - padding-bottom: 30px; - padding-top: 30px; - /*border: 1px solid rgba(255,255,255,0.05);*/ + padding-bottom: 15px; + padding-top: 15px; + background: #090909; + border: 1px solid rgba(255,255,255,0.05); } .big-info .icon-full-width i { display: block; - width: 110px; - height: 90px; - font-size: 90px; - line-height: 90px; - margin-right: 20px; + width: 85px; + height: 70px; + font-size: 70px; + line-height: 70px; + margin-right: 15px; } .big-info span { @@ -26,19 +27,18 @@ body { .big-info span.small-title { display: block; font-weight: 700; - font-size: 16px; + font-size: 14px; line-height: 20px; letter-spacing: 1px; text-transform: uppercase; - padding-top: 6px; color: #aaa !important; } .big-info span.big-details { display: block; font-weight: 200; - font-size: 60px; - line-height: 64px; + font-size: 50px; + line-height: 55px; letter-spacing: -4px; } diff --git a/public/js/filters.js b/public/js/filters.js index c7fc4bf..e004fbe 100644 --- a/public/js/filters.js +++ b/public/js/filters.js @@ -118,27 +118,27 @@ angular.module('netStatsApp.filters', []) return function(ms) { var result = 0; - if(ms < 1000){ + if(ms < 1000) { return ms + " ms"; } - if(ms < 1000*60){ + if(ms < 1000*60) { result = ms/1000; - return result.toFixed(1).toString() + " s"; + return result.toFixed(1) + " s"; } - if(ms < 1000*60*60){ + if(ms < 1000*60*60) { result = ms/1000/60; - return result.toFixed(1) + " min"; + return Math.round(result) + " min"; } - if(ms < 1000*60*60*24){ + if(ms < 1000*60*60*24) { result = ms/1000/60/60; - return result.toFixed(1) + " h"; + return Math.round(result) + " h"; } result = ms/1000/60/60/24; - return result.toFixed(1) + " days"; + return Math.round(result) + " days"; }; }) .filter('avgTimeFilter', function() { diff --git a/views/index.jade b/views/index.jade index 07d9d5b..797aa0c 100644 --- a/views/index.jade +++ b/views/index.jade @@ -2,23 +2,31 @@ extends layout block content div.container-fluid(ng-controller='StatsCtrl') - div.row - div.col-lg-7(ng-cloak) - div.col-sm-12 - h1= title + div.row(ng-cloak) + div.col-lg-12 + //- div.col-sm-12 + //- h1= title //- p Welcome to #{title} - div.clearfix + //- div.clearfix - div.col-xs-4.stat-holder + div.col-xs-2.stat-holder div.row.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}") div.pull-left.icon-full-width - i.icon-bulb + i.icon-node div.pull-left span.small-title active nodes span.big-details {{nodesActive}}/{{nodesTotal}} div.clearfix - div.col-xs-5.stat-holder + div.col-xs-2.stat-holder + div.row.big-info.uptime(class="{{ upTimeTotal | upTimeClass }}") + div.pull-left.icon-full-width + i.icon-bulb + div.pull-left + span.small-title up-time + span.big-details {{ upTimeTotal | upTimeFilter }} + div.clearfix + div.col-xs-2.stat-holder div.row.big-info.difficulty.text-info div.pull-left.icon-full-width i.icon-difficulty @@ -26,15 +34,7 @@ block content span.small-title difficulty span.big-details {{ lastDifficulty }} div.clearfix - div.col-xs-3.stat-holder - div.row.big-info.uptime(class="{{ upTimeTotal | upTimeClass }}") - div.pull-left.icon-full-width - i.icon-clock - div.pull-left - span.small-title up-time - span.big-details {{ upTimeTotal | upTimeFilter }} - div.clearfix - div.col-xs-4.stat-holder + div.col-xs-2.stat-holder div.row.big-info.bestblock.text-info div.pull-left.icon-full-width i.icon-block @@ -42,7 +42,7 @@ block content span.small-title best block span.big-details {{"#" + bestBlock}} div.clearfix - div.col-xs-5.stat-holder + div.col-xs-2.stat-holder div.row.big-info.blocktime(class="{{ lastBlock | timeClass }}") div.pull-left.icon-full-width i.icon-time @@ -50,7 +50,7 @@ block content span.small-title last block span.big-details {{ lastBlock | blockTimeFilter }} div.clearfix - div.col-xs-3.stat-holder + div.col-xs-2.stat-holder div.row.big-info.avgblocktime(class="{{ avgBlockTime | timeClass }}") div.pull-left.icon-full-width i.icon-gas @@ -61,14 +61,27 @@ block content div.clearfix - div.col-lg-5 - div.col-xs-12 - nodemap#mapHolder(data="map") + div.col-xs.12 + div.col-lg-8(style="padding-top: 30px;") + //- div.col-xs-3.stat-holder + //- div.row.big-info.nodesactive(class="{{ nodesActive | nodesActiveClass : nodesTotal }}") + //- div.pull-left.icon-full-width + //- i.icon-node + //- div.pull-left + //- span.small-title active nodes + //- span.big-details {{nodesActive}}/{{nodesTotal}} + //- div.clearfix + + div.clearfix + + div.col-lg-4 + div.col-xs-12 + nodemap#mapHolder(data="map") div.clearfix - div.col-sm-12(ng-cloak) - h1 Nodes in detail + div.col-sm-12 + //- h1 Nodes in detail table.table.table-striped thead @@ -78,7 +91,7 @@ block content th i.icon-laptop(data-toggle="tooltip", data-placement="top", title="Node type") th - i.icon-gas(data-toggle="tooltip", data-placement="top", title="Node latency") + i.icon-clock(data-toggle="tooltip", data-placement="top", title="Node latency") th i.icon-mining(data-toggle="tooltip", data-placement="top", title="Is mining") th @@ -93,7 +106,7 @@ block content th i.icon-time(data-toggle="tooltip", data-placement="top", title="Last block time") th - i.icon-clock(data-toggle="tooltip", data-placement="top", title="Propagation time") + i.icon-gas(data-toggle="tooltip", data-placement="top", title="Propagation time") th i.icon-bulb(data-toggle="tooltip", data-placement="top", title="Up-time") tbody