tidies up the base template formatting and scrollbars everywhere (#5)

OpenDreamProject · Aug 6, 2024 · 988268d · 988268d
1 parent 80a0b9f
commit 988268d
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 17 deletions.
diff --git a/static/index.css b/static/index.css
@@ -1,5 +1,9 @@
 @import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");
 
+/*
+This file should be edited in styles/index.css, and *not* static/index.css
+*/
+
 /*
 ! tailwindcss v3.4.3 | MIT License | https://tailwindcss.com
 */
@@ -560,6 +564,11 @@ video {
   margin: 0.5rem;
 }
 
+.mx-5{
+  margin-left: 1.25rem;
+  margin-right: 1.25rem;
+}
+
 .ml-1{
   margin-left: 0.25rem;
 }
@@ -624,10 +633,6 @@ video {
   gap: 0.25rem;
 }
 
-.gap-10{
-  gap: 2.5rem;
-}
-
 .gap-2{
   gap: 0.5rem;
 }
@@ -687,11 +692,6 @@ video {
   padding-right: 0.25rem;
 }
 
-.px-3{
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-}
-
 .pl-10{
   padding-left: 2.5rem;
 }
@@ -754,10 +754,6 @@ video {
   color: rgb(239 68 68 / var(--tw-text-opacity));
 }
 
-.underline{
-  text-decoration-line: underline;
-}
-
 .filter{
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -775,7 +771,8 @@ body {
 .left-bar {
   background-color: #1b1b1b;
   border-right: 1px solid #fdfeff;
-  overflow-y: scroll;
+  overflow-y: auto;
+  overflow-x: hidden;
   min-width: -moz-max-content;
   min-width: max-content;
   position: absolute;

diff --git a/styles/index.css b/styles/index.css
@@ -1,3 +1,7 @@
+/*
+This file should be edited in styles/index.css, and *not* static/index.css
+*/
+
 @import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap");
 
 @tailwind base;
@@ -18,7 +22,8 @@ body {
 .left-bar {
     background-color: #1b1b1b;
     border-right: 1px solid #fdfeff;
-    overflow-y: scroll;
+    overflow-y: auto;
+    overflow-x: hidden;
     min-width: max-content;
 
     position: absolute;

diff --git a/templates/base.html b/templates/base.html
@@ -41,7 +41,7 @@
 </head>
 
 <body class="safe-h-screen">
-    <div class="flex gap-10 px-3 h-[100%]">
+    <div class="flex pl-3 h-[100%]">
         <div class="left-bar hidden md:block h-[100%]" id="left-bar">
             <div class="flex flex-row">
                 <div class="flex flex-col justify-center">
@@ -66,7 +66,7 @@
         </div>
 
         <section class="section">
-            <div class="mt-5">
+            <div class="mt-5 mx-5">
                 <div class="flex flex-col gap-5">
                     <div class="flex flex-col-reverse gap-5 md:flex-row justify-between">
                         <div>{% block header %}{% endblock %}</div>