From 5e57079014f8cefa8b7d97ff1d3098b5920c027a Mon Sep 17 00:00:00 2001
From: yaemiku <me@yaemiku.dev>
Date: Thu, 1 Jun 2023 23:44:16 +0200
Subject: [PATCH] smaller margins prose h2 and table

---
 static/css/dist/styles.css       | 17 ++++++++--------
 theme/static/css/dist/styles.css | 17 ++++++++--------
 theme/static_src/src/styles.css  | 33 +++++++++++++++++++-------------
 3 files changed, 38 insertions(+), 29 deletions(-)

diff --git a/static/css/dist/styles.css b/static/css/dist/styles.css
index 85bbe62..e41cca9 100644
--- a/static/css/dist/styles.css
+++ b/static/css/dist/styles.css
@@ -1349,10 +1349,6 @@ select {
   margin-top: 0.5rem;
 }
 
-.mb-auto {
-  margin-bottom: auto;
-}
-
 .ml-2 {
   margin-left: 0.5rem;
 }
@@ -1417,10 +1413,6 @@ select {
   max-width: 100%;
 }
 
-.max-w-screen-sm {
-  max-width: 640px;
-}
-
 .max-w-screen-md {
   max-width: 768px;
 }
@@ -1826,6 +1818,15 @@ h4 {
   font-size: 1.25em;
 }
 
+.prose :where(h2):not(:where([class~="not-prose"] *)) {
+  margin-top: 0em;
+}
+
+.prose :where(table):not(:where([class~="not-prose"] *)) {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
 .active\:ring-2:active {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
diff --git a/theme/static/css/dist/styles.css b/theme/static/css/dist/styles.css
index 85bbe62..e41cca9 100644
--- a/theme/static/css/dist/styles.css
+++ b/theme/static/css/dist/styles.css
@@ -1349,10 +1349,6 @@ select {
   margin-top: 0.5rem;
 }
 
-.mb-auto {
-  margin-bottom: auto;
-}
-
 .ml-2 {
   margin-left: 0.5rem;
 }
@@ -1417,10 +1413,6 @@ select {
   max-width: 100%;
 }
 
-.max-w-screen-sm {
-  max-width: 640px;
-}
-
 .max-w-screen-md {
   max-width: 768px;
 }
@@ -1826,6 +1818,15 @@ h4 {
   font-size: 1.25em;
 }
 
+.prose :where(h2):not(:where([class~="not-prose"] *)) {
+  margin-top: 0em;
+}
+
+.prose :where(table):not(:where([class~="not-prose"] *)) {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
 .active\:ring-2:active {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
diff --git a/theme/static_src/src/styles.css b/theme/static_src/src/styles.css
index d7d6e7c..8c76924 100644
--- a/theme/static_src/src/styles.css
+++ b/theme/static_src/src/styles.css
@@ -14,15 +14,22 @@ h4 {
   @apply text-[1.25em] text-center;
 }
 
+.prose :where(h2):not(:where([class~="not-prose"] *)) {
+  margin-top: 0em;
+}
+
+.prose :where(table):not(:where([class~="not-prose"] *)) {
+  margin-top: 0.5em;
+  margin-bottom: 0.5em;
+}
+
 @layer components {
   .btn {
-    @apply transition ease-in-out duration-300
-      inline-block rounded-md shadow-md
-      border no-underline;
+    @apply inline-block no-underline rounded-md border shadow-md transition duration-300 ease-in-out;
   }
 
   .button {
-    @apply btn font-semibold px-3 py-2 leading-6;
+    @apply px-3 py-2 font-semibold leading-6 btn;
   }
 
   .nbutton {
@@ -33,15 +40,15 @@ h4 {
     }
 
     &.home {
-      @apply bg-green-100 hover:bg-green-200 border-green-200 hover:border-green-300 border-b-green-500 hover:border-b-green-600;
+      @apply bg-green-100 border-green-200 hover:bg-green-200 hover:border-green-300 border-b-green-500 hover:border-b-green-600;
 
       &.active {
-        @apply bg-green-300 border-green-300  border-b-green-600;
+        @apply bg-green-300 border-green-300 border-b-green-600;
       }
     }
 
     &.administration {
-      @apply bg-blue-100 hover:bg-blue-200 border-blue-200 hover:border-blue-300 border-b-blue-500 hover:border-b-blue-600;
+      @apply bg-blue-100 border-blue-200 hover:bg-blue-200 hover:border-blue-300 border-b-blue-500 hover:border-b-blue-600;
 
       &.active {
         @apply bg-blue-300 border-blue-300 border-b-4 border-b-blue-600 pb-[7px];
@@ -64,27 +71,27 @@ h4 {
 @layer utilities {
   .color {
     &.pink {
-      @apply border-pink-200 bg-pink-100 hover:border-pink-300 hover:bg-pink-200;
+      @apply bg-pink-100 border-pink-200 hover:border-pink-300 hover:bg-pink-200;
     }
 
     &.rose {
-      @apply border-rose-200 bg-rose-100 hover:border-rose-300 hover:bg-rose-200;
+      @apply bg-rose-100 border-rose-200 hover:border-rose-300 hover:bg-rose-200;
     }
 
     &.sky {
-      @apply border-sky-200 bg-sky-100 hover:border-sky-300 hover:bg-sky-200;
+      @apply bg-sky-100 border-sky-200 hover:border-sky-300 hover:bg-sky-200;
     }
 
     &.green {
-      @apply border-green-200 hover:border-green-300 bg-green-100 hover:bg-green-200;
+      @apply bg-green-100 border-green-200 hover:border-green-300 hover:bg-green-200;
     }
 
     &.indigo {
-      @apply border-indigo-200 bg-indigo-100 hover:border-indigo-300 hover:bg-indigo-200;
+      @apply bg-indigo-100 border-indigo-200 hover:border-indigo-300 hover:bg-indigo-200;
     }
 
     &.red {
-      @apply border-red-200 bg-red-100 hover:border-red-300 hover:bg-red-200;
+      @apply bg-red-100 border-red-200 hover:border-red-300 hover:bg-red-200;
     }
   }
 }