From 17181f4c1bbc20c36da46dcdf164f4d4665d02db Mon Sep 17 00:00:00 2001
From: Fen Dweller <chemicalcrux@gmail.com>
Date: Thu, 3 Jan 2019 13:21:02 -0600
Subject: [PATCH] Made the scrollbars snazzier

---
 stroll.html |  4 ++--
 style.css   | 42 +++++++++++++++++++++++++++++++++++-------
 2 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/stroll.html b/stroll.html
index a422372..8edd4c1 100644
--- a/stroll.html
+++ b/stroll.html
@@ -190,13 +190,13 @@
       </div>
     </div>
     <div id="log-area">
-      <div id="log">
+      <div class="log" id="log">
         <div>Welcome to Stroll</div>
         <p class="version"></p>
         <div><b>This game features 18+ content</b></div>
         <div>&nbsp;</div>
       </div>
-      <div id="react-log">
+      <div class="log" id="react-log">
         <div>It's a nice day for a walk</div>
         <div>&nbsp;</div>
       </div>
diff --git a/style.css b/style.css
index 862c6c5..be76d20 100644
--- a/style.css
+++ b/style.css
@@ -86,13 +86,7 @@ body.dark div {
   display:none;
 }
 
-#log {
-  overflow: auto;
-  padding: 25px;
-  box-sizing: border-box;
-}
-
-#react-log {
+.log {
   overflow: auto;
   padding: 25px;
   box-sizing: border-box;
@@ -708,3 +702,37 @@ body.dark .meterLabel {
 .intro-text {
   font-size: 18px;
 }
+
+.log::-webkit-scrollbar {
+  width: 3px;
+  height: 2px;
+}
+.log::-webkit-scrollbar-button {
+  width: 0px;
+  height: 0px;
+}
+.log::-webkit-scrollbar-thumb {
+  background: #e1e1e1;
+  border: 0px none #ffffff;
+  border-radius: 50px;
+}
+.log::-webkit-scrollbar-thumb:hover {
+  background: #ffffff;
+}
+.log::-webkit-scrollbar-thumb:active {
+  background: #000000;
+}
+.log::-webkit-scrollbar-track {
+  background: #666666;
+  border: 0px none #ffffff;
+  border-radius: 50px;
+}
+.log::-webkit-scrollbar-track:hover {
+  background: #666666;
+}
+.log::-webkit-scrollbar-track:active {
+  background: #333333;
+}
+.log::-webkit-scrollbar-corner {
+  background: transparent;
+}