Fix bar chart color for dark mode Stigmatoz#79

- Return dark mode to color #121212

Author: Stigmatoz

src/scripts/chart/chart-core.js

@@ -245,7 +245,7 @@ function donutChart() {
     return chart;
 }
 
-function barChart(data) {
+function barChart(data, darkMode) {
     var margin = { top: 25, right: 5, bottom: 25, left: 5 },
         width = 555,
         height = 160;
@@ -298,10 +298,17 @@ function barChart(data) {
     // add the x Axis
     svg.append("g")
         .attr("transform", "translate(0," + height + ")")
+        .style("stroke", darkMode ? "white" : "")
+        .style("stroke-width", darkMode ? "0.5px" : "")
         .call(d3.axisBottom(x));
 
     if (data.length > 9)
         document.querySelectorAll('#barChart g.tick ').forEach(element => { element.remove() });
+
+    if (darkMode){
+        document.querySelector("#barChart path").setAttribute("stroke", "white");
+        document.querySelectorAll('#barChart g.tick line').forEach(element => { element.setAttribute("stroke", "white") });
+    }
 }
 
 function drawIntervalChart(data) {

src/scripts/ui.js

@@ -112,7 +112,7 @@ class UI {
 
     drawBarChart(days) {
         d3.select('#barChart').datum(days);
-        barChart(days);
+        barChart(days, setting_dark_mode);
     }
 
     addTableHeader(currentTypeOfList, counterOfSite, totalTime, totalDays) {

src/style/webact.css

@@ -531,7 +531,7 @@ input[type='checkbox'] {
 
 .dark-mode {
     color: #ffffff !important;
-    background-color: #474747 !important;
+    background-color: #121212 !important;
 }
 
 .dark-mode .span-active-time {
@@ -563,6 +563,14 @@ input[type='checkbox'] {
     color: #ffffff;
 }
 
+.dark-mode .inline-flex .p-visits {
+    color: #ffffff;
+}
+
+.dark-mode .inline-flex:hover .p-visits {
+    color: #ffffff;
+}
+
 .dark-mode .span-time {
     color: #a5a5a5;
 }