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

…-width/transform
smartbooster · Aug 2, 2024 · 4ba24e8 · 4ba24e8
1 parent fc1f1a7
commit 4ba24e8
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 0 deletions.
diff --git a/CHANGELOG_fix_documentation_css.md b/CHANGELOG_fix_documentation_css.md
@@ -0,0 +1,2 @@
+### Fixed
+- Fix tailwind sb-documentation style : max-width + table and image max-width/transform
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);
+    }
+  }
 }
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		### Fixed
		- Fix tailwind sb-documentation style : max-width + table and image max-width/transform