Improve the wedditor and generic css

Signed-off-by: Ari Archer <ari.web.xyz@gmail.com>

content/styles/404/main.scss

@@ -1,3 +1,7 @@
+*, *::before, *::after {
+    scroll-behavior: smooth !important;
+}
+
 body,
 html {
     padding: 2.5em;

content/styles/clean/index.css

@@ -8,14 +8,18 @@
     box-sizing: border-box;
 
     scroll-behavior: smooth;
-
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-
     color-scheme: dark;
 }
 
-::-webkit-scrollbar {
+*:not(textarea),
+*:not(textarea)::after,
+*:not(textarea)::before {
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+}
+*:not(textarea)::-webkit-scrollbar,
+*:not(textarea)::after::-webkit-scrollbar,
+*:not(textarea)::before::-webkit-scrollbar {
     display: none;
 }
 

content/styles/editor/main.scss

@@ -32,10 +32,12 @@ $bg3: lighten($bg2, 10%);
     height: 100%;
     padding: 1em;
 
-    word-wrap: break-word;
-
     resize: none;
 
+    white-space: pre;
+    overflow-wrap: normal;
+    overflow: scroll;
+
     outline: none;
     border: none;
 

content/styles/generic/main.scss

@@ -13,16 +13,10 @@
     font-family: $font_default;
     color: $default_content_colour;
 
-    /* scroll-behavior: smooth; */
-    -ms-overflow-style: none; /* for Internet Explorer, Edge */
-    scrollbar-width: none; /* for Firefox */
+    scroll-behavior: auto !important;
     overflow-y: scroll;
 }
 
-::-webkit-scrollbar {
-    display: none; /* for Chrome, Safari, and Opera */
-}
-
 html,
 body {
     background-color: $bg_colour;

index.html

@@ -24,6 +24,7 @@
         <link rel="stylesheet" href="/content/styles/boot/main.min.css" />
         <link rel="stylesheet" href="/content/styles/shell/main.min.css" />
         <link rel="stylesheet" href="/content/styles/editor/main.min.css" />
+        <link rel="stylesheet" href="/content/styles/clean/index.css" />
 
         <link rel="manifest" href="/manifest.json" />
 

page/reset/index.html

@@ -23,6 +23,10 @@
         <link rel="stylesheet" href="/content/styles/noscript/index.css" />
 
         <style>
+            *, *::before, *::after {
+                scroll-behavior: smooth !important;
+            }
+
             .title {
                 text-align: center;
                 margin: 1em;