collabmd 0.1.46 → 0.1.48

package/src/client/styles/components/scrollbars.css

@@ -2,6 +2,8 @@
 
 .preview-container,
 .cm-scroller,
+.cm-tooltip-autocomplete > ul,
+.presence-panel-list,
 .file-tree,
 .git-panel,
 .diff-scroll,
@@ -25,6 +27,8 @@
 
 .preview-container::-webkit-scrollbar,
 .cm-scroller::-webkit-scrollbar,
+.cm-tooltip-autocomplete > ul::-webkit-scrollbar,
+.presence-panel-list::-webkit-scrollbar,
 .file-tree::-webkit-scrollbar,
 .git-panel::-webkit-scrollbar,
 .diff-scroll::-webkit-scrollbar,
@@ -48,6 +52,8 @@
 
 .preview-container::-webkit-scrollbar-track,
 .cm-scroller::-webkit-scrollbar-track,
+.cm-tooltip-autocomplete > ul::-webkit-scrollbar-track,
+.presence-panel-list::-webkit-scrollbar-track,
 .file-tree::-webkit-scrollbar-track,
 .git-panel::-webkit-scrollbar-track,
 .diff-scroll::-webkit-scrollbar-track,
@@ -70,6 +76,8 @@
 
 .preview-container::-webkit-scrollbar-thumb,
 .cm-scroller::-webkit-scrollbar-thumb,
+.cm-tooltip-autocomplete > ul::-webkit-scrollbar-thumb,
+.presence-panel-list::-webkit-scrollbar-thumb,
 .file-tree::-webkit-scrollbar-thumb,
 .git-panel::-webkit-scrollbar-thumb,
 .diff-scroll::-webkit-scrollbar-thumb,
@@ -93,6 +101,8 @@
 
 .preview-container::-webkit-scrollbar-thumb:hover,
 .cm-scroller::-webkit-scrollbar-thumb:hover,
+.cm-tooltip-autocomplete > ul::-webkit-scrollbar-thumb:hover,
+.presence-panel-list::-webkit-scrollbar-thumb:hover,
 .file-tree::-webkit-scrollbar-thumb:hover,
 .git-panel::-webkit-scrollbar-thumb:hover,
 .diff-scroll::-webkit-scrollbar-thumb:hover,

package/src/client/styles/export-document.css

@@ -63,42 +63,31 @@ body[data-surface='export-document']::-webkit-scrollbar {
   padding-left: 20px;
 }
 
-.export-content {
-  padding: 32px 40px;
-  border: 1px solid var(--color-divider);
-  border-radius: 20px;
-  background: var(--color-surface);
-  box-shadow: var(--shadow-card-strong);
-}
-
-.export-content p,
-.export-content li,
-.export-content blockquote {
-  max-width: none;
-}
-
 .export-content .task-list-item input[type='checkbox'] {
   cursor: default;
 }
 
-.export-content .table-wrapper {
-  overflow: visible;
+.export-directory-toc {
+  margin-bottom: 48px;
 }
 
-.export-content .bases-table-shell,
-.export-content pre {
-  overflow: visible;
+.export-directory-toc ol {
+  columns: 2;
 }
 
-.export-content table {
-  white-space: normal;
+.export-document-section + .export-document-section {
+  margin-top: 64px;
+  padding-top: 48px;
+  border-top: 1px solid var(--color-divider);
 }
 
-.export-content pre code {
-  width: auto;
-  white-space: pre-wrap;
-  word-break: break-word;
-  overflow-wrap: anywhere;
+.export-document-heading {
+  margin-bottom: 32px;
+}
+
+.export-document-heading p {
+  color: var(--color-text-muted);
+  font-size: 13px;
 }
 
 .export-diagram {
@@ -243,19 +232,45 @@ body[data-surface='export-document']::-webkit-scrollbar {
 
   .export-content {
     width: auto;
+    max-width: none;
     padding: 0;
-    border: 0;
-    border-radius: 0;
-    box-shadow: none;
     overflow: visible;
   }
 
+  .export-content p,
+  .export-content li,
+  .export-content blockquote {
+    max-width: none;
+  }
+
+  .export-directory-toc {
+    break-after: page;
+  }
+
+  .export-document-section {
+    break-before: page;
+  }
+
+  .export-document-section:first-of-type {
+    break-before: auto;
+  }
+
+  .export-document-section + .export-document-section {
+    margin-top: 0;
+    padding-top: 0;
+    border-top: 0;
+  }
+
   .export-content pre,
   .export-content .table-wrapper,
   .export-content .bases-table-shell {
     overflow: visible !important;
   }
 
+  .export-content table {
+    white-space: normal;
+  }
+
   .export-content pre code {
     width: auto;
     white-space: pre-wrap;

package/src/client/styles/features/collaboration-presence.css

@@ -9,6 +9,19 @@
   align-items: center;
 }
 
+.toolbar-presence-cluster {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--space-1);
+  flex-shrink: 0;
+}
+
+.toolbar-presence-count {
+  background: transparent;
+  padding-inline: var(--space-1);
+  min-height: auto;
+}
+
 .toolbar-badge-button {
   cursor: pointer;
   transition: background var(--transition-interactive), box-shadow var(--transition-interactive), color var(--transition-interactive);
@@ -68,7 +81,6 @@
   padding: 0 8px 0 6px;
   gap: 4px;
   border-radius: var(--radius-full);
-  box-shadow: var(--shadow-accent-ring);
 }
 
 .user-avatar.is-local + .user-avatar {

package/src/client/styles/features/preview-markdown.css

@@ -1,7 +1,26 @@
 /* ===== PREVIEW / MARKDOWN ===== */
 
 .preview-content {
+  position: relative;
+  min-width: 0;
+  max-width: var(--preview-content-max-width, var(--preview-content-width));
+  margin: 0 auto;
+  overflow: visible;
+  padding: var(--space-6) var(--space-6) var(--space-12);
+  color: var(--color-text);
   font-family: var(--font-prose);
+  font-size: var(--text-sm);
+  line-height: 1.7;
+}
+
+.preview-content[data-render-phase='shell'] {
+  color: var(--color-text-muted);
+}
+
+@media (min-width: 769px) {
+  .preview-content {
+    padding-bottom: calc(var(--space-12) + 96px);
+  }
 }
 
 .preview-content h1,
@@ -52,6 +71,40 @@
   font-weight: 600;
 }
 
+.preview-content .preview-heading-fold-button {
+  margin-inline: 0 var(--space-2);
+  border: 0;
+  border-radius: var(--radius-full);
+  font-size: var(--text-sm);
+  line-height: 1;
+  vertical-align: middle;
+}
+
+.preview-content .preview-heading-fold-button::before {
+  width: 8px;
+  height: 8px;
+  border-right: 2px solid currentColor;
+  border-bottom: 2px solid currentColor;
+  content: '';
+  transform: rotate(-45deg);
+  transition: transform var(--transition-interactive);
+}
+
+.preview-content .preview-heading-fold-button[aria-expanded='true']::before {
+  transform: rotate(45deg);
+}
+
+.preview-content .preview-heading-fold-button:hover {
+  background: color-mix(in oklab, var(--color-primary) 12%, transparent);
+  color: var(--color-primary);
+}
+
+.preview-content .preview-heading-fold-button:focus-visible {
+  box-shadow: var(--shadow-focus-compact);
+  color: var(--color-primary);
+  outline: 0;
+}
+
 .preview-content .preview-heading-link-button {
   display: inline-flex;
   width: 1.18em;
@@ -231,6 +284,7 @@
 }
 
 .preview-content p:has(> .excalidraw-embed-placeholder:only-child),
+.preview-content p:has(> .drawio-embed-placeholder:only-child),
 .preview-content p:has(> .bases-embed-placeholder:only-child),
 .preview-content p:has(> .video-embed-placeholder:only-child),
 .preview-content p:has(> .plantuml-shell:only-child) {
@@ -1026,6 +1080,7 @@
 }
 
 .preview-content pre {
+  position: relative;
   max-width: 100%;
   margin: var(--space-4) 0;
   overflow-x: auto;
@@ -1049,6 +1104,30 @@
   overflow-wrap: normal;
 }
 
+.preview-content .preview-code-block {
+  position: relative;
+}
+
+.preview-content .preview-code-block pre code {
+  padding-right: 84px;
+}
+
+.preview-content .preview-code-actions {
+  position: sticky;
+  top: 0;
+  z-index: 2;
+  height: 0;
+}
+
+.preview-content .preview-code-copy-button {
+  position: absolute;
+  top: calc(var(--space-2) + 1px);
+  right: var(--space-2);
+  background: color-mix(in oklab, var(--color-surface) 90%, transparent);
+  box-shadow: var(--shadow-sm);
+  backdrop-filter: blur(8px);
+}
+
 .preview-content .table-wrapper {
   margin: var(--space-4) 0;
   overflow-x: auto;

package/src/client/styles/features/quick-switcher.css

@@ -78,6 +78,12 @@
   color: var(--color-primary);
 }
 
+.qs-mode-tab:disabled {
+  color: var(--color-text-faint);
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
 .qs-overlay.visible .qs-modal {
   transform: translateY(0) scale(1);
 }
@@ -214,6 +220,8 @@
   max-width: 180px;
   overflow: hidden;
   color: var(--color-text-faint);
+  direction: rtl;
+  text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
   font-size: var(--text-xs);

package/src/client/styles/foundation/themes.css

@@ -141,6 +141,7 @@
   --color-text-muted: #9aa7b4;
   --color-text-faint: #687584;
   --color-text-inverse: #0b0f14;
+  --color-code-text: #abb2bf;
 
   --color-primary: #60a5fa;
   --color-primary-hover: #3b82f6;

package/src/client/styles/foundation/tokens.css

@@ -1,5 +1,13 @@
 /* ===== FOUNDATION / TOKENS ===== */
 
+@font-face {
+  font-display: swap;
+  font-family: 'JetBrains Mono';
+  font-style: normal;
+  font-weight: 400;
+  src: url('../../assets/vendor/jetbrains-mono/JetBrainsMono-Regular.woff2') format('woff2');
+}
+
 :root {
   --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
   --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);