Redesign of stats by days

Author: Stigmatoz

src/scripts/common.js

@@ -111,6 +111,7 @@ function getArrayTime(summaryTime) {
     var mins = Math.floor(totalSeconds / 60);
     var seconds = totalSeconds % 60;
 
+    days = zeroAppend(days);
     hours = zeroAppend(hours);
     mins = zeroAppend(mins);
     seconds = zeroAppend(seconds);

src/scripts/ui.js

@@ -320,7 +320,8 @@ class UI {
                 var label = this.createElement('label', ['day-block', 'lbl-toggle']);
                 label.setAttribute('for', days[i].date);
                 var span = this.createElement('span', ['day'], new Date(days[i].date).toLocaleDateString());
-                var spanTime = this.createElement('span', ['day-time'], convertSummaryTimeToString(days[i].total));
+                var spanTime = this.createElement('span', ['day-time']);
+                this.createElementsForTotalTime(days[i].total, TypeListEnum.ByDays, spanTime);
 
                 label = this.appendChild(label, [span, spanTime]);
                 parent = this.appendChild(parent, [check, label]);

src/style/webact.css

@@ -103,6 +103,10 @@ body {
   color: rgb(0, 0, 0);
 }
 
+.day-time .span-active-time{
+  color: rgb(0, 0, 0);
+}
+
 .margin-left-auto{
   margin-left: auto;
 }
@@ -216,14 +220,17 @@ p.table-header{
     width: 415px;
     font-size: 13px;
     padding-left:5px;
-    margin:auto;
+    margin: 0 0 0 5px;
     font-weight: 600;
 }
 
 .day-time{
     width: 80px;
-    margin:auto;
+    margin-left:auto;
+    margin-right: 10px;
     font-weight: 650;
+    font-size: 13px;
+    color:#c5c3c3;
 }
 
 .header-title-day{
@@ -246,12 +253,6 @@ p.table-header{
     cursor: pointer;
   }
 
-  .lbl-toggle:hover {
-    font-size: 13px;
-    font-weight: 650;
-    color: rgb(27, 27, 27);
-  }
-  
   .lbl-toggle::before {
     content: '    ';
     display: table;
@@ -260,8 +261,7 @@ p.table-header{
     border-bottom: 5px solid transparent;
     border-left: 5px solid currentColor;
     vertical-align: middle;
-    margin-right: 3px;
-    transform: translateY(6px);
+    transform: translateY(3px);
 
     transition: transform .2s ease-out;
   }