use horizontal scroll for pages container

By making small thumbnails and aligning everything horizontally the space on the screen is used better.

src/main/resources/static/css/dark-mode.css

@@ -26,4 +26,9 @@ body {
 }
 
 
-
+#pages-container {
+  --background-color: rgba(255, 255, 255, 0.046) !important;
+  --scroll-bar-color: #4c4c4c !important;
+  --scroll-bar-thumb: #d3d3d3 !important;
+  --scroll-bar-thumb-hover: #ffffff !important;
+}

src/main/resources/static/css/general.css

@@ -31,6 +31,13 @@ html[lang-direction=rtl] * {
     right: 0;
     top: 50%;
 }
+
+.align-center-left {
+    position: absolute;
+    left: 0;
+    top: 50%;
+}
+
 .align-bottom {
     position: absolute;
     bottom: 0;