Merge pull request #59 from zorexsalvo/fix/prose-table-responsiveness

fix: make prose-custom tables horizontally scrollable on narrow screens

Author: zorexsalvo

src/styles/main.css

@@ -451,17 +451,19 @@ body {
   }
 
   .prose-custom table {
+    display: block;
     width: 100% !important;
     height: auto !important;
     border-collapse: collapse !important;
     border-spacing: 0 !important;
     border: none !important;
     border-radius: 1rem;
-    overflow: hidden;
+    overflow-x: auto;
     box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.08);
     margin-bottom: 2rem;
     font-family: "Nunito", sans-serif;
     font-size: 1rem;
+    -webkit-overflow-scrolling: touch;
   }
 
   .prose-custom table th {
@@ -470,17 +472,19 @@ body {
     font-family: 'Bantayog', sans-serif !important;
     font-weight: 700 !important;
     text-align: left !important;
-    padding: 1rem 1.5rem !important;
+    padding: 0.75rem 1rem !important;
     border: none !important;
+    white-space: nowrap;
   }
 
   .prose-custom table td {
-    padding: 1rem 1.5rem !important;
+    padding: 0.75rem 1rem !important;
     border: none !important;
     border-bottom: 1px solid #e8d5c4 !important;
     color: var(--brown-2);
     vertical-align: top !important;
     text-align: left !important;
+    min-width: 120px;
   }
 
   .prose-custom table tbody tr:nth-child(odd) {