holy shit the responsiveness

axum_server/styles/input.css

@@ -76,10 +76,6 @@ strong {
   @apply font-medium;
 }
 
-img[height] {
-  height: revert-layer;
-}
-
 .article-body {
   h1 {
     @apply px-4 text-2xl font-semibold text-blue-900 mb-3 mt-4 max-w-read mx-auto md:text-4xl lg:text-5xl;

axum_server/styles/output.css

@@ -654,6 +654,18 @@ video {
   grid-row: span 3 / span 3;
 }
 
+.float-start {
+  float: inline-start;
+}
+
+.clear-left {
+  clear: left;
+}
+
+.clear-both {
+  clear: both;
+}
+
 .m-0 {
   margin: 0px;
 }
@@ -710,11 +722,6 @@ video {
   margin-bottom: 1.25rem;
 }
 
-.my-4 {
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
-
 .mb-1 {
   margin-bottom: 0.25rem;
 }
@@ -739,6 +746,30 @@ video {
   margin-top: 0.75rem;
 }
 
+.ml-1 {
+  margin-left: 0.25rem;
+}
+
+.mr-1 {
+  margin-right: 0.25rem;
+}
+
+.mr-2 {
+  margin-right: 0.5rem;
+}
+
+.mb-4 {
+  margin-bottom: 1rem;
+}
+
+.mr-4 {
+  margin-right: 1rem;
+}
+
+.mr-3 {
+  margin-right: 0.75rem;
+}
+
 .block {
   display: block;
 }
@@ -787,6 +818,18 @@ video {
   height: 240px;
 }
 
+.h-auto {
+  height: auto;
+}
+
+.h-\[236px\] {
+  height: 236px;
+}
+
+.max-h-\[236px\] {
+  max-height: 236px;
+}
+
 .min-h-full {
   min-height: 100%;
 }
@@ -807,6 +850,11 @@ video {
   width: 180px;
 }
 
+.w-fit {
+  width: -moz-fit-content;
+  width: fit-content;
+}
+
 .max-w-\[32rem\] {
   max-width: 32rem;
 }
@@ -819,22 +867,6 @@ video {
   max-width: 64rem;
 }
 
-.max-w-sm {
-  max-width: 24rem;
-}
-
-.max-w-96 {
-  max-width: 24rem;
-}
-
-.max-w-\[30rem\] {
-  max-width: 30rem;
-}
-
-.max-w-md {
-  max-width: 28rem;
-}
-
 .max-w-xl {
   max-width: 36rem;
 }
@@ -1161,10 +1193,6 @@ strong {
   font-weight: 500;
 }
 
-img[height] {
-  height: revert-layer;
-}
-
 .article-body {
   h1 {
     margin-left: auto;
@@ -1808,14 +1836,49 @@ article a:visited {
 }
 
 @media (min-width: 640px) {
+  .sm\:float-none {
+    float: none;
+  }
+
+  .sm\:clear-none {
+    clear: none;
+  }
+
   .sm\:my-4 {
     margin-top: 1rem;
     margin-bottom: 1rem;
   }
 
-  .sm\:mx-auto {
-    margin-left: auto;
-    margin-right: auto;
+  .sm\:ml-0 {
+    margin-left: 0px;
+  }
+
+  .sm\:mb-0 {
+    margin-bottom: 0px;
+  }
+
+  .sm\:mt-0 {
+    margin-top: 0px;
+  }
+
+  .sm\:grid {
+    display: grid;
+  }
+
+  .sm\:grid-flow-col {
+    grid-auto-flow: column;
+  }
+
+  .sm\:grid-cols-\[max-content_1fr\] {
+    grid-template-columns: max-content 1fr;
+  }
+
+  .sm\:grid-rows-\[max-content_1fr_max-content\] {
+    grid-template-rows: max-content 1fr max-content;
+  }
+
+  .sm\:gap-4 {
+    gap: 1rem;
   }
 
   .sm\:py-4 {
@@ -1830,11 +1893,6 @@ article a:visited {
     margin-bottom: 2rem;
   }
 
-  .md\:mx-auto {
-    margin-left: auto;
-    margin-right: auto;
-  }
-
   .md\:grid {
     display: grid;
   }