markdownr 0.5.3 → 0.5.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 77751617a0f29c77c283ed5a5861539501bc6e5795af91b83d2f7ca15ff7e19c
-  data.tar.gz: fc0003a34b89f185e567954561d5a367a0a671d085f79719d4a292b82d23270f
+  metadata.gz: d8c9a7eee19198ff1effccac6edfac5938353e964073a25abaf44d90f3fcf9ce
+  data.tar.gz: 85bc3bc0825aceef42b0fe6ecbb5f3b753a0b0b8b3facc084b6e8c25f042439a
 SHA512:
-  metadata.gz: 65dc66819263dd1367b965e3ec480b90dea99581c9e6039e7bf4e171cfd6cfba6d590c19ef9bbfd4e01a440f8e41478a0640734a6552999b9e69aa72672361f6
-  data.tar.gz: 825fe2505eb934401acd0881a8826a2de0b2900ba764b0b3f5e4c5da8a54d06efe567becb87f2d38beb5a2f746c46701272d6c30df95ef3902d8d64596d6738c
+  metadata.gz: b3d9654e8b565eb97ba6571fe742855dd5e7580402dc558526fa445e388b803872d6c23dbbb4e684e8ae7b9276dc8e96d4bebc824c7dfa5c07f99cde2ca6624e
+  data.tar.gz: e81586f4f208d925c453a915b1601b5ccad5a1353ad139e19af984f810a49071a0b952eaf548b74e53159c6d7e1302d6bb86f3ab0814fd9615c5b398b381068d

data/lib/markdown_server/version.rb

@@ -1,3 +1,3 @@
 module MarkdownServer
-  VERSION = "0.5.3"
+  VERSION = "0.5.4"
 end

data/views/layout.erb

@@ -20,10 +20,41 @@
       max-width: 900px;
       margin: 0 auto;
       padding: 1.5rem 2rem 3rem;
+      transition: max-width 0.25s ease, margin-left 0.25s ease;
     }
     .container.has-toc {
       max-width: 1150px;
     }
+    body.wide-mode .container,
+    body.wide-mode .container.has-toc {
+      margin-left: 0 !important;
+      max-width: 100vw !important;
+    }
+    /* When right sidebar has content, shrink container to leave room */
+    body.wide-mode:has(.right-sidebar:not(:empty)) .container,
+    body.wide-mode:has(.right-sidebar:not(:empty)) .container.has-toc {
+      max-width: calc(100vw - 220px) !important;
+    }
+
+    /* Right sidebar — empty placeholder, shown in wide mode only when it has content */
+    .right-sidebar {
+      display: none;
+      position: fixed;
+      right: 0;
+      top: 0;
+      bottom: 0;
+      width: 220px;
+      border-left: 1px solid #e0d8c8;
+      background: #faf8f4;
+      padding: 1rem;
+      overflow-y: auto;
+      z-index: 10;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
+      font-size: 0.8rem;
+    }
+    body.wide-mode .right-sidebar:not(:empty) {
+      display: block;
+    }
 
     /* Breadcrumbs */
     .breadcrumbs {
@@ -230,11 +261,40 @@
     .md-content li { margin-bottom: 0.3rem; }
 
     /* Tables */
+    .table-outer {
+      position: relative;
+      margin: 1rem 0;
+    }
     .table-wrap {
       overflow-x: auto;
-      margin: 1rem 0;
       -webkit-overflow-scrolling: touch;
     }
+    .table-expand-btn {
+      position: fixed;
+      right: 6px;
+      z-index: 50;
+      display: none;
+      background: rgba(250, 248, 244, 0.92);
+      border: 1px solid #ccc;
+      border-radius: 4px;
+      padding: 4px 7px;
+      cursor: pointer;
+      font-size: 1rem;
+      line-height: 1;
+      color: #aaa;
+      box-shadow: 0 1px 4px rgba(0,0,0,0.1);
+      transition: color 0.15s, border-color 0.15s, background 0.15s;
+      transform: translateY(-50%);
+    }
+    .table-expand-btn:hover {
+      color: #555;
+      border-color: #999;
+      background: #fff;
+    }
+    .table-expand-btn.is-expanded {
+      color: #8b6914;
+      border-color: #c8a84b;
+    }
     .md-content table {
       border-collapse: collapse;
       width: 100%;
@@ -944,6 +1004,8 @@
     <%= yield %>
   </div>
 
+  <div class="right-sidebar"></div>
+
   <script>
     // Breadcrumb auto-hide: visible on load for 5s, hides on scroll down,
     // shows for 5s on scroll up then hides again
@@ -1017,16 +1079,71 @@
       });
     })();
 
-    // Wrap tables in scrollable containers
+    // Wrap tables in scrollable containers + add expand buttons
+    var _tableItems = [];
     document.querySelectorAll('.md-content table').forEach(function(table) {
-      if (!table.parentElement.classList.contains('table-wrap')) {
-        var wrapper = document.createElement('div');
-        wrapper.className = 'table-wrap';
-        table.parentNode.insertBefore(wrapper, table);
-        wrapper.appendChild(table);
-      }
+      if (table.closest('.table-wrap')) return;
+
+      var outer = document.createElement('div');
+      outer.className = 'table-outer';
+
+      var wrapper = document.createElement('div');
+      wrapper.className = 'table-wrap';
+
+      table.parentNode.insertBefore(outer, table);
+      outer.appendChild(wrapper);
+      wrapper.appendChild(table);
+
+      var btn = document.createElement('button');
+      btn.className = 'table-expand-btn';
+      btn.title = 'Expand table to full width';
+      btn.setAttribute('aria-label', 'Expand table to full width');
+      btn.innerHTML = '&#x2922;';
+      btn.addEventListener('click', function() {
+        var isOn = document.body.classList.toggle('wide-mode');
+        _tableItems.forEach(function(i) {
+          var active = isOn && i.btn === btn;
+          i.btn.classList.toggle('is-expanded', active);
+          i.btn.innerHTML = active ? '&#x2921;' : '&#x2922;';
+          i.btn.title = active ? 'Collapse table' : 'Expand table to full width';
+          i.btn.setAttribute('aria-label', i.btn.title);
+        });
+        _updateTableBtns();
+      });
+      document.body.appendChild(btn);
+      _tableItems.push({ outer: outer, btn: btn });
     });
 
+    function _updateTableBtns() {
+      var containerEl = document.querySelector('.container');
+      if (!containerEl) return;
+      // Use the container's natural max-width (ignoring wide-mode expansion) so the
+      // button position is stable before and after toggling wide mode.
+      var naturalMaxWidth = containerEl.classList.contains('has-toc') ? 1150 : 900;
+      var naturalWidth = Math.min(naturalMaxWidth, window.innerWidth);
+      // Right gap = space to the right of a centered container of naturalWidth
+      var rightGap = Math.round((window.innerWidth - naturalWidth) / 2);
+      if (rightGap < 60) {
+        _tableItems.forEach(function(item) { item.btn.style.display = 'none'; });
+        return;
+      }
+      _tableItems.forEach(function(item) {
+        var r = item.outer.getBoundingClientRect();
+        var inView = r.top < window.innerHeight - 20 && r.bottom > 55;
+        if (inView) {
+          var visTop = Math.max(r.top, 55);
+          var visBot = Math.min(r.bottom, window.innerHeight);
+          item.btn.style.top = Math.round((visTop + visBot) / 2) + 'px';
+          item.btn.style.display = 'block';
+        } else {
+          item.btn.style.display = 'none';
+        }
+      });
+    }
+    window.addEventListener('scroll', _updateTableBtns, { passive: true });
+    window.addEventListener('resize', _updateTableBtns);
+    _updateTableBtns();
+
     // TOC scroll spy — highlight the nearest heading (sidebar + drawer)
     (function() {
       var sidebarLinks = document.querySelectorAll('.toc-sidebar a');

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: markdownr
 version: !ruby/object:Gem::Version
-  version: 0.5.3
+  version: 0.5.4
 platform: ruby
 authors:
 - Brian Dunn