Style for overall stats

Author: Stigmatoz

src/index.html

@@ -37,50 +37,46 @@
    <div id="stats" class="hide">
       <p class="table-header">Overall stats</p>
       <div id="statsBlock">
-         <div>
-            <div class="title-block">
-               <span class="stat-description">First day</span>
-               <span class="value-block" id="statFirstDay"></span>
+         <div class="title-block">
+            <div class="block">
+               <div>First day</div>
+               <div class="value-block" id="statFirstDay"></div>
             </div>
-            <div class="inline-block">
-               <span class="stat-description">Last day</span>
-               <span class="value-block" id="statLastDay"></span>
+            <div class="block">
+               <div>Last day</div>
+               <div class="value-block" id="statLastDay"></div>
             </div>
          </div>
-         <div>
-            <div class="title-block">
-               <span class="stat-description">Active days</span>
-               <span class="value-block" id="statActiveDays"></span>
+         <div class="title-block">
+            <div class="block">
+               <div>Active days</div>
+               <div class="value-block" id="statActiveDays"></div>
             </div>
-            <div class="inline-block">
-               <span class="stat-description">Days in total</span>
-               <span class="value-block" id="statTotalDays"></span>
+            <div class="block">
+               <div>Days in total</div>
+               <div class="value-block" id="statTotalDays"></div>
             </div>
          </div>
-         <div>
-            <div class="title-block">
-               <span class="stat-description">Today</span>
-               <span class="span-time" id="statTodayTime"></span>
+         <div class="title-block">
+            <div class="block">
+               <div>Today</div>
+               <div class="span-time" id="statTodayTime"></div>
             </div>
-            <div class="inline-block">
-               <span class="stat-description">All-time</span>
-               <span class="span-time" id="statAllDaysTime"></span>
+            <div class="block">
+               <div>All-time</div>
+               <div class="span-time" id="statAllDaysTime"></div>
             </div>
          </div>
-         <div>
-            <div class="most-active-days-title">
-               <div class="most-active-days-value">
-                  <span class="stat-description">Most active day</span>
-               </div>
+         <div class="title-block">
+            <div class="block">
+               <div>Most active day</div>
                <div class="inline-block">
                   <div class="value-block" id="statActiveDay"></div>
                   <div class="span-time" id="statActiveDayTime"></div>
                </div>
             </div>
-            <div class="inline-block">
-               <div style="display: inline-block;vertical-align: top;">
-                  <span class="stat-description">Most inactive day</span>
-               </div>
+            <div class="block">
+               <div>Most inactive day</div>
                <div class="inline-block">
                   <div class="value-block" id="statInActiveDay"></div>
                   <div class="span-time" id="statInActiveDayTime"></div>

src/style/webact.css

@@ -399,25 +399,27 @@ p.table-header{
   }
 
   #statsBlock{
-    /* border: 1px solid rgb(195, 194, 194);
-    border-radius: 5px; */
-    /* padding: 7px; */
     color: #9b9b9b;
     font-size: 13px;
   }
+  #statsBlock .block{
+    width: 40%;
+    display: inline-block;
+    text-align: center;
+  }
 
   #statsBlock .span-time{
     font-weight: 600;
+    text-align: center !important;
   }
 
   #statsBlock .span-time-active{
     font-weight: 600;
   }
 
   #statsBlock .title-block{
-    display: inline-block; 
-    width: 40%; 
     margin-left:10%;
+    margin-top: 5px;
   }
 
   #statsBlock .value-block{
@@ -444,9 +446,4 @@ p.table-header{
     color: #9b9b9b;
     font-size: 13px;
     text-align: center;
-  }
-
-  .stat-description{
-    float: left;
-    width: 110px;
   }