feat: re-design site so the new console works better

Redesigned the site, so, the console works better. Switched to using custom js based resize handles for the editor section. Updated deps, fixed bugs.

.gitpod.yml

@@ -4,7 +4,7 @@ image:
 # List the ports you want to expose and what to do when they are served. See https://www.gitpod.io/docs/43_config_ports/
 ports:
   - port: 3000
-    onOpen: open-preview
+    onOpen: ignore
   - port: 3001
     onOpen: ignore
 

env.js

@@ -1,2 +1,2 @@
-export const ENABLE_SW = true;
-export const USE_SHAREDWORKER = true;
+export const ENABLE_SW = false;
+export const USE_SHAREDWORKER = false;

package.json

@@ -73,7 +73,7 @@
         "hastscript": "^7.0.2",
         "husky": "^7.0.4",
         "jstransformer-markdown-it": "^2.1.0",
-        "postcss": "^8.4.6",
+        "postcss": "^8.4.7",
         "postcss-csso": "^6.0.0",
         "postcss-scss": "^4.0.3",
         "posthtml-parser": "^0.10.2",
@@ -83,7 +83,7 @@
         "rehype-external-links": "^1.0.1",
         "rehype-highlight": "^5.0.2",
         "rehype-slug": "^5.0.1",
-        "sass": "^1.49.8",
+        "sass": "^1.49.9",
         "standard-version": "^9.3.2",
         "tailwindcss": "^3.0.23",
         "tiny-glob": "^0.2.9",

src/css/app.scss

@@ -173,7 +173,7 @@ main {
     }
 
     header {
-        @apply p-6 text-center;
+        @apply py-6 text-center;
 
         h1 {
             @apply text-5xl font-bold mb-2;
@@ -214,11 +214,11 @@ main {
         // my-8
     }
 
-    h3#console {
-        @apply text-xl pb-0;
+    .tab-style {
+        // @apply text-lg;
         text-decoration: underline;
         text-decoration-style: wavy;
-        text-underline-offset: 0.4rem;
+        text-underline-offset: 0.2rem;
     }
 
     h2#faq {