Fix tailwind sb-documentation style : max-width + table and image max…

…-width/transform
smartbooster · Aug 2, 2024 · 2f9a3ae · 2f9a3ae
1 parent fc1f1a7
commit 2f9a3ae
Showing 1 changed file with 17 additions and 0 deletions.
diff --git a/assets/styles/_documentation.scss b/assets/styles/_documentation.scss
@@ -17,6 +17,7 @@
 
 // Tailwind custom Smartbooster prose styles
 .sb-documentation {
+  max-width: 100%;
   @apply prose prose-a:text-info prose-a:no-underline hover:prose-a:underline hover:prose-a:text-info max-w-none inline-block;
   h1, h2, h3, h4 {
     a {
@@ -42,4 +43,20 @@
       @apply block;
     }
   }
+  table {
+    @apply border-collapse border border-slate-400 border-solid;
+  }
+  thead th {
+    @apply bg-slate-100 font-semibold;
+  }
+  th, td {
+    @apply px-2 py-2 border border-slate-300 border-solid;
+  }
+  img {
+    height: auto;
+    max-width: 100%;
+    &:hover {
+      transform: scale(1.25);
+    }
+  }
 }