Fix horizontal scrollbar and style slim themed scrollbars for Chrome/Edge

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-04-14 13:18:02 +01:00
parent 0e7f34edc7
commit 798c8e7f50
1 changed files with 23 additions and 1 deletions
--- a/vue/src/assets/styles.css
+++ b/vue/src/assets/styles.css
@@ -101,8 +101,30 @@
 /* ELEMENTS */
 body {
    margin: 0 auto;
-    width: 100vw;
+    width: 100%;
    height: 100vh;
+    overflow-x: hidden;
+    scrollbar-width: thin;
+    scrollbar-color: var(--primary) var(--bg_secondary);
+}
+
+/* Chrome/Edge scrollbar styling */
+::-webkit-scrollbar {
+    width: 6px;
+    height: 6px;
+}
+
+::-webkit-scrollbar-track {
+    background: var(--bg_secondary);
+}
+
+::-webkit-scrollbar-thumb {
+    background: var(--quaternary);
+    border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: var(--primary);
 }

 input {