.gdg-mnuv029{word-break:break-word;-webkit-touch-callout:default;padding-top:6px}.gdg-mnuv029>*{margin:0}.gdg-mnuv029 :last-child{margin-bottom:0}.gdg-mnuv029 p img{width:100%} .gdg-d19meir1{box-sizing:border-box;--overlay-top:var(--d19meir1-0);left:var(--d19meir1-1);top:var(--d19meir1-0);min-width:var(--d19meir1-2);min-height:var(--d19meir1-3);width:-webkit-max-content;width:max-content;max-width:400px;max-height:calc(100vh - var(--d19meir1-4));font-family:var(--gdg-font-family);font-size:var(--gdg-editor-font-size);text-align:start;flex-direction:column;display:flex;position:absolute;overflow:hidden}@keyframes glide_fade_in-gdg-d19meir1{0%{opacity:0}to{opacity:1}}.gdg-d19meir1.gdg-style{background-color:var(--gdg-bg-cell);box-shadow:0 0 0 1px var(--gdg-accent-color),0px 0px 1px #3e415666,0px 6px 12px #3e415626;border-radius:2px;animation:60ms glide_fade_in-gdg-d19meir1}.gdg-d19meir1.gdg-pad{padding:var(--d19meir1-5)8.5px 3px}.gdg-d19meir1 .gdg-clip-region{border-radius:2px;flex-direction:column;flex-grow:1;display:flex;overflow-x:hidden;overflow-y:auto}.gdg-d19meir1 .gdg-clip-region .gdg-growing-entry{height:100%}.gdg-d19meir1 .gdg-clip-region input.gdg-input{border:0;outline:none;width:100%}.gdg-d19meir1 .gdg-clip-region textarea.gdg-input{border:0;outline:none} .gdg-b1ygi5by{flex-wrap:wrap;margin-top:auto;margin-bottom:auto;display:flex}.gdg-b1ygi5by .boe-bubble{border-radius:var(--gdg-rounding-radius,10px);background-color:var(--gdg-bg-bubble);height:20px;color:var(--gdg-text-dark);justify-content:center;align-items:center;margin:2px;padding:0 8px;display:flex}.gdg-b1ygi5by textarea{opacity:0;width:0;height:0;position:absolute;top:0;left:0} .gdg-n15fjm3e{color:var(--gdg-text-dark);margin:6px 0 3px;display:flex}.gdg-n15fjm3e>input{font-size:var(--gdg-editor-font-size);font-family:var(--gdg-font-family);color:var(--gdg-text-dark);background-color:var(--gdg-bg-cell);padding:0} .gdg-d4zsq0x{flex-wrap:wrap;display:flex}.gdg-d4zsq0x .doe-bubble{background-color:var(--gdg-bg-cell);height:24px;color:var(--gdg-text-dark);border-radius:var(--gdg-rounding-radius,6px);justify-content:center;align-items:center;margin:2px;padding:0 8px;display:flex;box-shadow:0 0 1px #3e415666,0 1px 3px #3e415666}.gdg-d4zsq0x .doe-bubble img{-o-object-fit:contain;object-fit:contain;height:16px;margin-right:4px}.gdg-d4zsq0x textarea{opacity:0;width:0;height:0;position:absolute;top:0;left:0} .gdg-i2iowwq{height:100%;display:flex}.gdg-i2iowwq .gdg-centering-container{justify-content:center;align-items:center;height:100%;display:flex}.gdg-i2iowwq .gdg-centering-container img,.gdg-i2iowwq .gdg-centering-container canvas{max-height:calc(100vh - var(--overlay-top) - 20px);-o-object-fit:contain;object-fit:contain;-webkit-user-select:none;user-select:none}.gdg-i2iowwq .gdg-centering-container canvas{max-width:380px}.gdg-i2iowwq .gdg-edit-icon{width:48px;height:48px;color:var(--gdg-accent-color);cursor:pointer;justify-content:center;align-items:center;display:flex;position:absolute;top:12px;right:0}.gdg-i2iowwq .gdg-edit-icon>*{width:24px;height:24px}.gdg-i2iowwq textarea{opacity:0;width:0;height:0;position:absolute;top:0;left:0} .gdg-u1rrojo{flex-grow:1;align-items:center;min-height:21px;display:flex}.gdg-u1rrojo .gdg-link-area{cursor:pointer;text-overflow:ellipsis;white-space:nowrap;color:var(--gdg-link-color);flex-grow:1;flex-shrink:1;margin-right:8px;overflow:hidden;-webkit-text-decoration:underline!important;text-decoration:underline!important}.gdg-u1rrojo .gdg-edit-icon{width:32px;color:var(--gdg-accent-color);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;display:flex}.gdg-u1rrojo .gdg-edit-icon>*{width:24px;height:24px}.gdg-u1rrojo textarea{opacity:0;width:0;height:0;position:absolute;top:0;left:0} .gdg-m1pnx84e{min-width:var(--m1pnx84e-0);width:100%;color:var(--gdg-text-dark);justify-content:space-between;align-items:flex-start;display:flex;position:relative}.gdg-m1pnx84e .gdg-g1y0xocz{flex-shrink:1;min-width:0}.gdg-m1pnx84e .gdg-spacer{flex:1}.gdg-m1pnx84e .gdg-edit-icon{cursor:pointer;color:var(--gdg-accent-color);width:24px;height:24px;transition:all "0.125s ease";border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex;position:relative}.gdg-m1pnx84e .gdg-edit-icon>*{width:16px;height:16px}.gdg-m1pnx84e .gdg-edit-hover:hover{background-color:var(--gdg-accent-light);transition:background-color .15s}.gdg-m1pnx84e .gdg-checkmark-hover:hover{color:#fff;background-color:var(--gdg-accent-color)}.gdg-m1pnx84e .gdg-md-edit-textarea{opacity:0;width:0;height:0;margin-top:25px;padding:0;position:relative;top:0;left:0}.gdg-m1pnx84e .gdg-ml-6{margin-left:6px} .gdg-s1dgczr6 .dvn-scroller{overflow:var(--s1dgczr6-0);transform:translate(0,0)}.gdg-s1dgczr6 .dvn-hidden{visibility:hidden}.gdg-s1dgczr6 .dvn-scroll-inner{pointer-events:none;display:flex}.gdg-s1dgczr6 .dvn-scroll-inner>*{flex-shrink:0}.gdg-s1dgczr6 .dvn-scroll-inner .dvn-spacer{flex-grow:1}.gdg-s1dgczr6 .dvn-scroll-inner .dvn-stack{flex-direction:column;display:flex}.gdg-s1dgczr6 .dvn-underlay>*{position:absolute;top:0;left:0}.gdg-s1dgczr6 canvas{outline:none}.gdg-s1dgczr6 canvas *{height:0} .gdg-izpuzkl{resize:none;white-space:pre-wrap;width:100%;min-width:100%;height:100%;font-size:var(--gdg-editor-font-size);line-height:16px;font-family:var(--gdg-font-family);-webkit-text-fill-color:var(--gdg-text-dark);color:var(--gdg-text-dark);background-color:#0000;border:0;border-radius:0;margin:0;padding:0;position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden}.gdg-izpuzkl::placeholder{color:var(--gdg-text-light)}.gdg-invalid .gdg-izpuzkl{-webkit-text-decoration:underline #d60606;text-decoration:underline #d60606}.gdg-s69h75o{visibility:hidden;white-space:pre-wrap;word-wrap:break-word;width:-webkit-max-content;width:max-content;min-width:100%;max-width:100%;font-size:var(--gdg-editor-font-size);line-height:16px;font-family:var(--gdg-font-family);color:var(--gdg-text-dark);margin:0;padding:0 0 2px}.gdg-g1y0xocz{margin-top:6px;position:relative} .gdg-seveqep{background-color:var(--gdg-bg-cell);color:var(--gdg-text-dark);border:1px solid var(--gdg-border-color);font-size:var(--gdg-editor-font-size);border-radius:6px;padding:8px;animation:.15s forwards gdg-search-fadein-gdg-seveqep;position:absolute;top:4px;right:20px}.gdg-seveqep.out{animation:.15s forwards gdg-search-fadeout-gdg-seveqep}.gdg-seveqep .gdg-search-bar-inner{display:flex}.gdg-seveqep .gdg-search-status{padding-top:4px;font-size:11px}.gdg-seveqep .gdg-search-progress{background-color:var(--gdg-text-light);height:4px;position:absolute;bottom:0;left:0}.gdg-seveqep input{width:220px;color:var(--gdg-textDark);background-color:var(--gdg-bg-cell);border:0;outline:none}.gdg-seveqep button{cursor:pointer;width:24px;height:24px;color:var(--gdg-text-medium);background:0 0;border:none;outline:none;justify-content:center;align-items:center;padding:0;display:flex}.gdg-seveqep button:hover{color:var(--gdg-text-dark)}.gdg-seveqep button .button-icon{width:16px;height:16px}.gdg-seveqep button:disabled{opacity:.4;pointer-events:none}@keyframes gdg-search-fadeout-gdg-seveqep{0%{transform:translate(0)}to{transform:translate(400px)}}@keyframes gdg-search-fadein-gdg-seveqep{0%{transform:translate(400px)}to{transform:translate(0)}} .gdg-wmyidgi{min-width:10px;max-width:100%;min-height:10px;max-height:100%;width:var(--wmyidgi-0);height:var(--wmyidgi-1);direction:ltr;position:relative;overflow:clip}.gdg-wmyidgi>:first-child{width:100%;height:100%;position:absolute;top:0;left:0} .gdg-r17m35ur{background-color:var(--gdg-bg-header-has-focus);box-shadow:0 0 0 1px var(--gdg-border-color);color:var(--gdg-text-group-header);min-height:var(--r17m35ur-0);font:var(--gdg-header-font-style)var(--gdg-font-family);border:none;border-radius:9px;outline:none;flex-grow:1;padding:0 8px}.gdg-c1tqibwd{background-color:var(--gdg-bg-header);align-items:center;padding:0 8px;display:flex} .react-grid-layout{transition:height .2s;position:relative}.react-grid-item{transition:left .2s,top .2s,width .2s,height .2s}.react-grid-item img{pointer-events:none;-webkit-user-select:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform,width,height}.react-grid-item.resizing{z-index:1;will-change:width,height;transition:none}.react-grid-item.react-draggable-dragging{z-index:3;will-change:transform;transition:none}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{opacity:.2;z-index:2;-webkit-user-select:none;user-select:none;-o-user-select:none;background:red;transition-duration:.1s}.react-grid-item.react-grid-placeholder.placeholder-resizing{transition:none}.react-grid-item>.react-resizable-handle{width:20px;height:20px;position:absolute}.react-grid-item>.react-resizable-handle:after{content:"";border-bottom:2px solid #0006;border-right:2px solid #0006;width:5px;height:5px;position:absolute;bottom:3px;right:3px}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{cursor:sw-resize;bottom:0;left:0;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{cursor:se-resize;bottom:0;right:0}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{cursor:nw-resize;top:0;left:0;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{cursor:ne-resize;top:0;right:0;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{cursor:ew-resize;margin-top:-10px;top:50%}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{cursor:ns-resize;margin-left:-10px;left:50%}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)} .react-resizable{position:relative}.react-resizable-handle{box-sizing:border-box;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);background-position:100% 100%;background-repeat:no-repeat;background-origin:content-box;width:20px;height:20px;padding:0 3px 3px 0;position:absolute}.react-resizable-handle-sw{cursor:sw-resize;bottom:0;left:0;transform:rotate(90deg)}.react-resizable-handle-se{cursor:se-resize;bottom:0;right:0}.react-resizable-handle-nw{cursor:nw-resize;top:0;left:0;transform:rotate(180deg)}.react-resizable-handle-ne{cursor:ne-resize;top:0;right:0;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{cursor:ew-resize;margin-top:-10px;top:50%}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{cursor:ns-resize;margin-left:-10px;left:50%}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)} .react-flow{direction:ltr}.react-flow__container{width:100%;height:100%;position:absolute;top:0;left:0}.react-flow__pane{z-index:1;cursor:grab}.react-flow__pane.selection{cursor:pointer}.react-flow__pane.dragging{cursor:grabbing}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus{outline:none}.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow .react-flow__edges{pointer-events:none;overflow:visible}.react-flow__edge-path,.react-flow__connection-path{stroke:#b1b1b7;stroke-width:1px;fill:none}.react-flow__edge{pointer-events:visibleStroke;cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:.5s linear infinite dashdraw}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus{outline:none}.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge:focus .react-flow__edge-path{stroke:#555}.react-flow__edge:focus-visible .react-flow__edge-path{stroke:#555}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge-textbg{fill:#fff}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;user-select:none}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:.5s linear infinite dashdraw}.react-flow__connectionline{z-index:1001}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{-webkit-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:grab;position:absolute}.react-flow__node.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:0 0;pointer-events:none}.react-flow__nodesselection-rect{pointer-events:all;cursor:grab;position:absolute}.react-flow__handle{pointer-events:none;background:#1a192b;border:1px solid #fff;border-radius:100%;width:6px;min-width:5px;height:6px;min-height:5px;position:absolute}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;bottom:-4px;left:50%;transform:translate(-50%)}.react-flow__handle-top{top:-4px;left:50%;transform:translate(-50%)}.react-flow__handle-left{top:50%;left:-4px;transform:translateY(-50%)}.react-flow__handle-right{top:50%;right:-4px;transform:translateY(-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__panel{z-index:5;margin:15px;position:absolute}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.center{left:50%;transform:translate(-50%)}.react-flow__attribution{background:#ffffff80;margin:0;padding:2px 3px;font-size:10px}.react-flow__attribution a{color:#999;text-decoration:none}@keyframes dashdraw{0%{stroke-dashoffset:10px}}.react-flow__edgelabel-renderer{pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;position:absolute}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus{outline:none}.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-default,.react-flow__node-input,.react-flow__node-output,.react-flow__node-group{color:#222;text-align:center;background-color:#fff;border:1px solid #1a192b;border-radius:3px;width:150px;padding:10px;font-size:12px}.react-flow__node-default.selectable:hover,.react-flow__node-input.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:0 1px 4px 1px #00000014}.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-default.selectable:focus-visible{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-input.selectable:focus-visible{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-output.selectable:focus-visible{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-group.selectable:focus-visible{box-shadow:0 0 0 .5px #1a192b}.react-flow__node-group{background-color:#f0f0f040}.react-flow__nodesselection-rect,.react-flow__selection{background:#0059dc14;border:1px dotted #0059dccc}.react-flow__nodesselection-rect:focus,.react-flow__selection:focus{outline:none}.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__selection:focus-visible{outline:none}.react-flow__controls{box-shadow:0 0 2px 1px #00000014}.react-flow__controls-button{box-sizing:content-box;cursor:pointer;-webkit-user-select:none;user-select:none;background:#fefefe;border:none;border-bottom:1px solid #eee;justify-content:center;align-items:center;width:16px;height:16px;padding:5px;display:flex}.react-flow__controls-button:hover{background:#f4f4f4}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__minimap{background-color:#fff}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{background-color:#3367d9;border:1px solid #fff;border-radius:1px;width:4px;height:4px;transform:translate(-50%,-50%)}.react-flow__resize-control.handle.left{top:50%;left:0}.react-flow__resize-control.handle.right{top:50%;left:100%}.react-flow__resize-control.handle.top{top:0;left:50%}.react-flow__resize-control.handle.bottom{top:100%;left:50%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border:0 solid #3367d9}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;height:100%;top:0;transform:translate(-50%)}.react-flow__resize-control.line.left{border-left-width:1px;left:0}.react-flow__resize-control.line.right{border-right-width:1px;left:100%}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{width:100%;height:1px;left:0;transform:translateY(-50%)}.react-flow__resize-control.line.top{border-top-width:1px;top:0}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%} /* --------------------------------------------------------------------------- * Vazirmatn overlay for the community build. * * Appended to every built CSS chunk so it survives container recreation and * needs no proxy plugin. One variable font file covers weights 100 to 900. * * The * rule is deliberately blunt: Teable is Tailwind-based and sets * font-family explicitly on thousands of elements, so anything gentler loses * the cascade. Monospace and KaTeX are restored afterwards and win on * specificity, not on order. * * This reaches the DOM only. The grid is canvas and takes its font from a JS * string; that is patched separately in the Dockerfile. * ------------------------------------------------------------------------- */ @font-face { font-family: 'Vazirmatn'; src: url('/_next/static/media/vazirmatn.woff2') format('woff2-variations'); font-weight: 100 900; font-style: normal; font-display: swap; } :root { --font-vazir: 'Vazirmatn', Inter, Roboto, system-ui, -apple-system, sans-serif; /* Glide Data Grid reads this for its DOM chrome (overlay editor, headers). */ --gdg-font-family: 'Vazirmatn', Inter, Roboto, system-ui, sans-serif; } * { font-family: var(--font-vazir) !important; } /* Code must stay monospace or formulas and JSON become unreadable. */ code, pre, kbd, samp, [class*="font-mono"], [class*="monospace"], .cm-editor, .cm-editor *, .cm-content, .cm-content * { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace !important; } /* KaTeX ships metrics-critical faces; overriding them breaks math layout. */ .katex, .katex * { font-family: KaTeX_Main, 'Times New Roman', serif !important; } .katex .mathdefault, .katex .mathit { font-family: KaTeX_Math, serif !important; } /* Persian sits better with slightly looser leading than Inter's Latin default. */ body { line-height: 1.6; } /* --------------------------------------------------------------------------- * RTL for the long-text markdown editor and its preview. * * The popup editor is Milkdown (a ProseMirror WYSIWYG), not a textarea, so the * targets are: * .milkdown-editor-wrap .ProseMirror the editable surface * .milkdown-readonly-preview the rendered side * .markdown-body the react-markdown preview used * elsewhere (plugin/template detail) * * `direction: rtl` alone is not enough. Three rules in milkdown.css use * physical sides and would stay pinned to the left: * ul/ol padding-left: 24px * blockquote border-left: 4px * task checkbox margin: 0 8px 0 -24px (negative left pull) * Each is mirrored below rather than left to inherit. * * Code keeps direction: ltr on purpose. RTL code is unreadable: the bidi * algorithm reorders operators and brackets, so `a[0] = b + 1;` renders with * the semicolon and brackets in the wrong places. Same for inline code spans. * ------------------------------------------------------------------------- */ /* The container stays RTL so the furniture sits on the right: list markers, * blockquote rule, table column order, indentation. */ .milkdown-editor-wrap .ProseMirror, .milkdown-readonly-preview, .markdown-body { direction: rtl; text-align: start; } /* Per-block auto direction. * * `unicode-bidi: plaintext` resolves each block's base direction from its own * first strong character instead of inheriting the container's. A Persian * paragraph comes out RTL and right-aligned; an English one, or a heading like * "# Trade Core", comes out LTR and left-aligned. `text-align: start` then * follows whichever direction was resolved, which is the whole reason this * pairing is the standard treatment for mixed-direction user content. * * Applied to blocks, not to the container: on the container it would resolve * once for the entire document and defeat the point. */ .milkdown-editor-wrap .ProseMirror > p, .milkdown-editor-wrap .ProseMirror > h1, .milkdown-editor-wrap .ProseMirror > h2, .milkdown-editor-wrap .ProseMirror > h3, .milkdown-editor-wrap .ProseMirror > h4, .milkdown-editor-wrap .ProseMirror > h5, .milkdown-editor-wrap .ProseMirror > h6, .milkdown-editor-wrap .ProseMirror li, .milkdown-editor-wrap .ProseMirror blockquote p, .milkdown-editor-wrap .ProseMirror th, .milkdown-editor-wrap .ProseMirror td, .milkdown-readonly-preview p, .milkdown-readonly-preview h1, .milkdown-readonly-preview h2, .milkdown-readonly-preview h3, .milkdown-readonly-preview h4, .milkdown-readonly-preview h5, .milkdown-readonly-preview h6, .milkdown-readonly-preview li, .milkdown-readonly-preview blockquote p, .milkdown-readonly-preview th, .milkdown-readonly-preview td, .markdown-body p, .markdown-body h1, .markdown-body h2, .markdown-body h3, .markdown-body h4, .markdown-body h5, .markdown-body h6, .markdown-body li, .markdown-body blockquote p, .markdown-body th, .markdown-body td { unicode-bidi: plaintext; text-align: start; } /* Lists: indentation and markers move to the right. */ .milkdown-editor-wrap .ProseMirror ul, .milkdown-editor-wrap .ProseMirror ol, .milkdown-readonly-preview ul, .milkdown-readonly-preview ol, .markdown-body ul, .markdown-body ol { padding-left: 0 !important; padding-right: 24px !important; } .milkdown-editor-wrap .ProseMirror ul.contains-task-list, .milkdown-readonly-preview ul.contains-task-list, .markdown-body ul.contains-task-list { padding-left: 0 !important; padding-right: 24px !important; } /* Task checkboxes: the -24px pull has to flip sides too, or the box lands outside the text block on the wrong edge. */ .milkdown-editor-wrap .ProseMirror li[data-checked] > input[type='checkbox'], .milkdown-readonly-preview input[type='checkbox'], .markdown-body input[type='checkbox'] { margin: 0 -24px 0 8px !important; } /* Blockquote rule moves to the right edge. */ .milkdown-editor-wrap .ProseMirror blockquote, .milkdown-readonly-preview blockquote, .markdown-body blockquote { border-left: none !important; border-right: 4px solid hsl(var(--border)) !important; } /* Tables: columns read right to left, headers follow. */ .milkdown-editor-wrap .ProseMirror table, .milkdown-readonly-preview table, .markdown-body table { direction: rtl; } /* Cell alignment is handled by the plaintext block above, so nothing is forced * here. Explicit markdown alignment (|---:| and |:---:|) still wins, because * remark emits it as an inline style on the cell. */ /* Code stays left to right. Bidi reordering makes RTL code wrong, not just ugly: brackets and operators visually swap position. */ .milkdown-editor-wrap .ProseMirror pre, .milkdown-editor-wrap .ProseMirror code, .milkdown-readonly-preview pre, .milkdown-readonly-preview code, .markdown-body pre, .markdown-body code, .milkdown-editor-wrap .cm-editor, .milkdown-editor-wrap .cm-editor * { direction: ltr !important; text-align: left !important; unicode-bidi: isolate; } /* Horizontal rules and images need no direction, but keep images from being dragged to the wrong margin by the inherited text-align. */ .milkdown-editor-wrap .ProseMirror img, .milkdown-readonly-preview img, .markdown-body img { margin-inline: 0 auto; } /* The placeholder sits absolutely positioned against the left edge upstream. */ .milkdown-editor-wrap .ProseMirror[data-placeholder]:has(> p:first-child:last-child:empty)::before { left: auto; right: 0; }