@docsector/docsector-reader 0.10.2 → 0.10.4

package/bin/docsector.js

@@ -23,7 +23,7 @@ const packageRoot = resolve(__dirname, '..')
 const args = process.argv.slice(2)
 const command = args[0]
 
-const VERSION = '0.10.2'
+const VERSION = '0.10.4'
 
 const HELP = `
   Docsector Reader v${VERSION}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docsector/docsector-reader",
-  "version": "0.10.2",
+  "version": "0.10.4",
   "description": "A documentation rendering engine built with Vue 3, Quasar v2 and Vite. Transform Markdown into beautiful, navigable documentation sites.",
   "productName": "Docsector Reader",
   "author": "Rodrigo de Araujo Vieira",

package/src/components/DPageSection.vue

@@ -364,10 +364,12 @@ const tokenized = computed(() => {
       v-html="token.content"
     ></ol>
 
-    <table
+    <div
       v-else-if="token.tag === 'table'"
-      v-html="token.content"
-    ></table>
+      class="d-table-wrapper"
+    >
+      <table v-html="token.content"></table>
+    </div>
 
     <p
       v-else-if="token.tag === 'p'"

package/src/css/app.sass

@@ -182,8 +182,9 @@ body.body--dark
     padding: 3px 5px
     margin: 0 2px
     border-radius: 2px
-    white-space: pre-wrap
-    display: inline-block
+    white-space: normal
+    word-break: break-word
+    display: inline
     line-height: 0.85em
 
   a
@@ -283,8 +284,12 @@ body.body--dark
         vertical-align: middle
         width: 280px
         margin-left: 20px
-    table
+    .d-table-wrapper
+      overflow-x: auto
+      -webkit-overflow-scrolling: touch
       max-width: 100%
+    table
+      width: max-content
       border: 1px solid #eee
       border-radius: 4px
       border-spacing: 0
@@ -293,6 +298,9 @@ body.body--dark
         font-weight: bold
         border-bottom: 2px solid #eee
         text-align: left
+        white-space: nowrap
+      td code
+        white-space: nowrap
       tr
         vertical-align: top
       &:not(.js-file-line-container)