Site update: edit mode, images, links, external editor, window state

site/docs.html

@@ -45,7 +45,61 @@ <h2>Live Reload</h2>
     <h2>Multi-Window</h2>
     <p>Press <code>Cmd+N</code> to open a new window and view multiple files side by side. Each window independently tracks and live-reloads its own file.</p>
 
+    <h2>Edit Mode</h2>
+    <p>Press <code>Cmd+E</code> (or the <strong>Edit</strong> button in the toolbar) to toggle edit mode. The rendered document becomes editable in place — no separate textarea, no syntax view.</p>
+    <p>Each block (paragraph, heading, list, quote, code block) shows a handle on hover. Click the handle to open a menu that lets you convert the block to a different type, duplicate it, move it up or down, or delete it.</p>
+    <p><strong>Formatting</strong> — with text selected:</p>
+    <table>
+      <thead>
+        <tr><th>Shortcut</th><th>Action</th></tr>
+      </thead>
+      <tbody>
+        <tr><td><code>Cmd+B</code></td><td>Bold</td></tr>
+        <tr><td><code>Cmd+I</code></td><td>Italic</td></tr>
+        <tr><td><code>Cmd+Shift+X</code></td><td>Strikethrough</td></tr>
+        <tr><td><code>Cmd+E</code></td><td>Inline code</td></tr>
+        <tr><td><code>Cmd+K</code></td><td>Link</td></tr>
+      </tbody>
+    </table>
+    <p><strong>Navigation and structure:</strong></p>
+    <ul>
+      <li><code>Enter</code> splits the current block at the caret — the new block below gets focus</li>
+      <li><code>Shift+Enter</code> inserts a line break inside the current block</li>
+      <li><code>ArrowUp</code> / <code>ArrowDown</code> at the top or bottom of a block moves the caret to the adjacent block</li>
+      <li><code>Esc</code> commits the edit and exits the block</li>
+    </ul>
+    <p><strong>Toggles:</strong></p>
+    <ul>
+      <li><code>Cmd+/</code> drops the active block into a raw-markdown editor — useful for content the WYSIWYG editor can't represent (e.g. images, footnotes). The next click on the block returns to WYSIWYG.</li>
+      <li><code>Cmd+Shift+F</code> toggles a small floating toolbar with buttons for the formatting actions above. Starts hidden each session.</li>
+    </ul>
+    <p>Blocks containing inline content the editor can't faithfully round-trip (raw HTML, inline images, superscript, etc.) open in the raw-markdown editor automatically so the source is never silently changed.</p>
+
+    <h2>Images</h2>
+    <p>Inline images load directly in the rendered document:</p>
+    <ul>
+      <li><strong>Local paths</strong> — relative (<code>![](images/photo.png)</code>) or absolute (<code>![](/Users/you/Pictures/photo.png)</code>) filesystem paths, served via a dedicated <code>om-asset:</code> protocol restricted to image file types</li>
+      <li><strong>Remote URLs</strong> — <code>https://</code> URLs are loaded by the renderer</li>
+    </ul>
+    <p>Supported image formats: PNG, JPEG, GIF, SVG, WebP, AVIF, ICO, BMP.</p>
+
+    <h2>Links</h2>
+    <p>Links in rendered documents work the way you'd expect:</p>
+    <ul>
+      <li><strong>Hover</strong> a link to see its target URL in the status bar</li>
+      <li><strong>Click</strong> an HTTP/HTTPS link to open it in your default browser</li>
+      <li><strong>Right-click</strong> for a menu with options to copy the URL or open it explicitly</li>
+    </ul>
+
+    <h2>External Editor</h2>
+    <p>If you'd rather make heavier edits in your usual editor, configure an external editor command in <strong>Preferences &rarr; External Editor</strong> (for example, <code>code</code> for VS Code, <code>cursor</code> for Cursor, <code>subl</code> for Sublime). A button in the toolbar then opens the current file in that editor with one click.</p>
+    <p>Live reload picks up the changes as soon as you save in the external editor.</p>
+
+    <h2>Window State</h2>
+    <p>The app remembers each window's size, position, and fullscreen state. When you reopen Open Markdown, your windows come back exactly where they were.</p>
+
     <h2>Keyboard Shortcuts</h2>
+    <p><strong>Global</strong></p>
     <table>
       <thead>
         <tr>
@@ -56,12 +110,36 @@ <h2>Keyboard Shortcuts</h2>
       <tbody>
         <tr><td><code>Cmd+O</code></td><td>Open file</td></tr>
         <tr><td><code>Cmd+N</code></td><td>New window</td></tr>
+        <tr><td><code>Cmd+W</code></td><td>Close window</td></tr>
+        <tr><td><code>Cmd+S</code></td><td>Save</td></tr>
+        <tr><td><code>Cmd+E</code></td><td>Toggle edit mode</td></tr>
         <tr><td><code>Cmd+F</code></td><td>Find in page</td></tr>
         <tr><td><code>Cmd+T</code></td><td>Toggle light/dark theme</td></tr>
         <tr><td><code>Cmd+=</code></td><td>Zoom in</td></tr>
         <tr><td><code>Cmd+-</code></td><td>Zoom out</td></tr>
         <tr><td><code>Cmd+0</code></td><td>Reset zoom</td></tr>
-        <tr><td><code>Cmd+W</code></td><td>Close window</td></tr>
+      </tbody>
+    </table>
+    <p><strong>In edit mode</strong> (with text selected, unless noted)</p>
+    <table>
+      <thead>
+        <tr>
+          <th>Shortcut</th>
+          <th>Action</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr><td><code>Cmd+B</code></td><td>Bold</td></tr>
+        <tr><td><code>Cmd+I</code></td><td>Italic</td></tr>
+        <tr><td><code>Cmd+Shift+X</code></td><td>Strikethrough</td></tr>
+        <tr><td><code>Cmd+E</code></td><td>Inline code</td></tr>
+        <tr><td><code>Cmd+K</code></td><td>Insert link</td></tr>
+        <tr><td><code>Cmd+/</code></td><td>Toggle raw-markdown for the active block</td></tr>
+        <tr><td><code>Cmd+Shift+F</code></td><td>Toggle floating format toolbar</td></tr>
+        <tr><td><code>Enter</code></td><td>Split block at caret, focus the new block below</td></tr>
+        <tr><td><code>Shift+Enter</code></td><td>Insert line break inside the current block</td></tr>
+        <tr><td><code>ArrowUp</code> / <code>ArrowDown</code></td><td>Cross to adjacent block at top/bottom edge</td></tr>
+        <tr><td><code>Esc</code></td><td>Commit and exit the active block</td></tr>
       </tbody>
     </table>
 

site/index.html

@@ -84,6 +84,26 @@ <h3>Pinch to Zoom</h3>
           <h3>Drag &amp; Drop</h3>
           <p>Drop any Markdown file onto the app window or Dock icon to open it immediately.</p>
         </div>
+        <div class="feature-card">
+          <h3>Inline Edit Mode</h3>
+          <p>Press <code>Cmd+E</code> to edit directly in the rendered document. Notion-style block menu, formatting shortcuts (<code>Cmd+B</code>, <code>Cmd+I</code>, <code>Cmd+E</code>, <code>Cmd+K</code>), and a raw-markdown escape hatch when you need it.</p>
+        </div>
+        <div class="feature-card">
+          <h3>Inline Images</h3>
+          <p>Images load directly in the document — both local paths (relative or absolute) and HTTPS URLs. PNG, JPEG, GIF, SVG, WebP, AVIF, ICO, and BMP supported.</p>
+        </div>
+        <div class="feature-card">
+          <h3>Smart Links</h3>
+          <p>Hover any link to preview its target in the status bar. Click to open in your default browser. Right-click for a menu to copy or open the URL.</p>
+        </div>
+        <div class="feature-card">
+          <h3>Window State</h3>
+          <p>The app reopens exactly where you left it — window size, position, and fullscreen state are restored across sessions.</p>
+        </div>
+        <div class="feature-card">
+          <h3>External Editor</h3>
+          <p>One click sends the current file to your favourite editor or IDE. Configure the command once in Preferences and the toolbar button does the rest.</p>
+        </div>
       </div>
     </section>