feat: various improvements to styles and bugs

src/css/injected.scss

@@ -1599,19 +1599,10 @@ iframe.userHTML {
 #main > .course > .content > .resources > h2 {
   color: var(--text-primary);
 }
-::-webkit-scrollbar {
-  width: 10px;
-  height: 10px;
-  transition: 1s;
-  border-radius: 16px;
-  //width: 0px !important;
-  //background: none;
-}
-::-webkit-scrollbar-track {
-  background-color: transparent;
-}
-::-webkit-scrollbar-corner {
-  background: none;
+
+/* set button(top and bottom of the scrollbar) */
+body::-webkit-scrollbar-button {
+  display: none !important;
 }
 :root,
 html,
@@ -1620,8 +1611,19 @@ div,
 ol,
 ul {
   scrollbar-width: thin !important;
-  scrollbar-color: var(--better-light) var(--better-sub);
+  scrollbar-color: #babac0 #fff !important;
 }
+
+.dark {
+  body,
+  div,
+  ol,
+  ul {
+    scrollbar-width: thin !important;
+    scrollbar-color: #333 #111 !important;
+  }
+}
+
 .connectedNotificationsWrapper > div > button {
   color: var(--text-primary) !important;
   height: 45px;