diff --git a/extension/libs/charts.css b/extension/libs/charts.css
index db6f023..eaaf51e 100644
--- a/extension/libs/charts.css
+++ b/extension/libs/charts.css
@@ -10,10 +10,6 @@
     text-align: center;
   }
 
-  #chart rect:hover {
-    fill: rgb(255, 157, 0);
-  }
-
   svg:not(:root) {
     overflow: initial;
 }
\ No newline at end of file
diff --git a/extension/stats/index.css b/extension/stats/index.css
index 485acae..201f0cb 100644
--- a/extension/stats/index.css
+++ b/extension/stats/index.css
@@ -1,54 +1,57 @@
 * {
-    margin: 0;
-    padding: 0;
+  margin: 0;
+  padding: 0;
 }
 li {
-    list-style: none;
+  list-style: none;
 }
 .logo {
-    padding: 40px;
-    font-family: "Alfa Slab One", serif;
-    font-size: 32px;
-    text-align: center;
-    display: flex;
+  padding: 40px;
+  font-family: "Alfa Slab One", serif;
+  font-size: 32px;
+  text-align: center;
+  display: flex;
 }
 .logo img {
-    width: 60px;
-    margin: 0 25px;
+  width: 60px;
+  margin: 0 25px;
 }
 .flex-layout {
-    display: flex;
-    justify-content: center;
-    align-items: center;
+  display: flex;
+  justify-content: center;
+  align-items: center;
 }
 
 .show:not(:first-child) {
-    border-left: 1px solid #ffffff;
+  border-left: 1px solid #ffffff;
 }
-.lang-stats-graph {
-    border-bottom-right-radius: 3px;
-    border-top-right-radius: 3px;
-    border-bottom-left-radius: 3px;
-    border-top-left-radius: 3px;
+.searching-stats-graph {
+  border-bottom-right-radius: 3px;
+  border-top-right-radius: 3px;
+  border-bottom-left-radius: 3px;
+  border-top-left-radius: 3px;
 }
 .show:first-child {
-    border-bottom-left-radius: 3px;
-    border-top-left-radius: 3px;
+  border-bottom-left-radius: 3px;
+  border-top-left-radius: 3px;
 }
 .show:last-child {
-    border-bottom-right-radius: 3px;
-    border-top-right-radius: 3px;
+  border-bottom-right-radius: 3px;
+  border-top-right-radius: 3px;
 }
 .color-block {
-    display: inline-block;
-    width: 8px;
-    height: 8px;
-    border-radius: 50%;
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
 }
 .showText li {
-    display: flex;
-    align-items: center;
+  display: flex;
+  align-items: center;
 }
 .showText span {
-    padding: 3px;
-}
\ No newline at end of file
+  padding: 3px;
+}
+#chart rect:hover {
+  fill: rgb(255, 157, 0);
+}
diff --git a/extension/stats/index.html b/extension/stats/index.html
index 5ae84ad..fb7cdaf 100644
--- a/extension/stats/index.html
+++ b/extension/stats/index.html
@@ -30,7 +30,7 @@
             </div>
             <div id="chart">
                 <div style="padding: 30px 0;">
-                    <div class="lang-stats-graph" style=" height: 8px; width: 100%; display: flex;">
+                    <div class="searching-stats-graph" style=" height: 8px; width: 100%; display: flex;">
                     </div>
                     <div class="showText" style=" padding: 10px;">
                         <ol style="display: flex; justify-content: space-around;">
@@ -38,17 +38,17 @@
                     </div>
                 </div>
 
-                <div class="flex-layout char-histogram">
+                <div class="flex-layout">
                     <div class="chart-histogram-week" style="position: relative;"></div>
                 </div>
-                <div class="flex-layout char-histogram">
+                <div class="flex-layout">
                     <div class="chart-histogram-date" style="position: relative;"></div>
                 </div>
-                <div class="flex-layout char-histogram">
+                <div class="flex-layout">
                     <div class="chart-histogram-hour" style="position: relative;"></div>
                 </div>
 
-                <div  class="flex-layout">
+                <div class="flex-layout">
                     <div class="bar-chart" style="position: relative;box-sizing: border-box;">
                     </div>
                 </div>
diff --git a/extension/stats/index.js b/extension/stats/index.js
index 5a09025..874d9f4 100644
--- a/extension/stats/index.js
+++ b/extension/stats/index.js
@@ -1,9 +1,9 @@
 let history = JSON.parse(localStorage.getItem("history"));
 let chartColor = "#F9BB2D";
 let weeks = { "Sun": 0, "Mon": 0, "Tue": 0, "Wed": 0, "Thu": 0, "Fri": 0, "Sat": 0 };
-let dates = num(1, 31);
-let hours = num(0, 23);
-function num(start, end, initial = 0) {
+let dates = makeNumericKeyObject(1, 31);
+let hours = makeNumericKeyObject(0, 23);
+function makeNumericKeyObject(start, end, initial = 0) {
     return Array.from({ length: end + 1 - start }).fill(initial)
         .reduce((obj, current, index) => {
             obj[start + index] = current;
@@ -22,7 +22,7 @@ let stats = [
     { name: "Std docs", prefix: "", value: 0, color: "#ffa600" },
 ];
 let calendarData = [];
-let barChartObj = {}; //bar-chart(url)
+let topCratesData = {}; //bar-chart(url)
 
 let w = Object.keys(weeks);
 let d = Object.keys(dates);
@@ -49,10 +49,10 @@ history.forEach(({ query, content, time }) => {
         let url = new URL(content);
         let pathname = url.pathname.replace("/crates/", "/").slice(1);
         let [crate, _] = pathname.split("/");
-        if (barChartObj[crate]) {
-            barChartObj[crate] += 1;
+        if (topCratesData[crate]) {
+            topCratesData[crate] += 1;
         } else {
-            barChartObj[crate] = 1;
+            topCratesData[crate] = 1;
         }
     }
 });
@@ -101,7 +101,7 @@ histogram({
     ...histogramConfig,
 });
 
-let spans = document.querySelector(".lang-stats-graph");
+let spans = document.querySelector(".searching-stats-graph");
 let showText = document.querySelector(".showText");
 let ol = showText.querySelector("ol");
 function byField(key) {
@@ -113,12 +113,11 @@ function byField(key) {
         }
     }
 }
-let sort = stats.sort(byField("value"));
-let sum = sort.reduce((item, { value }) => {
+let sum = stats.sort(byField("value")).reduce((item, { value }) => {
     return item + value
 }, 0);
 
-sort.forEach(({ name, color, value }) => {
+stats.forEach(({ name, color, value }) => {
     let li = document.createElement("li");
     li.innerHTML = `<span class="color-block" style="background-color:${color}"></span>
                             <span class="">${name}</span>
@@ -130,21 +129,20 @@ sort.forEach(({ name, color, value }) => {
     }
 })
 
-let barChartArr = [];
-Object.entries(barChartObj).map(([key, value]) => {
-    barChartArr.push({
+topCratesData = Object.entries(topCratesData).map(([key, value]) => {
+    return {
         name: key,
         value
-    });
+    };
 });
-let barChartData = barChartArr.sort(byField("value"));
-barChartData.splice(10);
+topCratesData.sort(byField("value"));
+topCratesData.splice(10);
 barChart({
     margin: ({ top: 30, right: 0, bottom: 10, left: 30 }),
     height: 320,
     barHeight: 25,
     width: 750,
-    data: barChartData,
+    data: topCratesData,
     selector: ".bar-chart",
     color: "#F9BB2D",
 });
\ No newline at end of file