Posts

Origin story: spotted a Windows gist that wires Claude Code into system notifications↗ , written in PowerShell, useless on a Mac. Rewrote it for macOS, then added a Bark↗ channel — when a long job finishes and you’ve wandered off, the phone in your pocket should be the one that pings.

Rendering verification for T11i. The include-code shortcode reads a file via readFile, wraps it in a fenced code block, and runs it through markdownify so Chroma applies syntax highlighting. This page exercises two languages — python and yaml — switched via the language= parameter. 1. Python (assets/snippets/hello.py) def gcd(a: int, b: int) -> int: """Return the greatest common divisor of a and b.""" while b: a, b = b, a % b return a if __name__ == "__main__": print(gcd(12, 18)) 2. YAML (assets/snippets/config.yaml) server: host: 0.0.0.0 port: 8080 logging: level: info format: json features: - search - rss - sitemap Self-check list Both blocks render as <pre><code class="language-..."> rather than as raw source Python block: keywords like def / if __name__ are colored by Chroma; docstring is colored too YAML block: keys, strings, and numbers are colored per YAML rules (no fallback to plain text) Line-height / font-size / background match every other fenced code block on the site Both blocks remain readable in dark mode (syntax / background contrast holds) Hugo build emits no readFile error

Rendering verification for T11h. The include shortcode runs readFile | safeHTML, dropping a project-root-relative file’s contents into the page as raw HTML. Fixture: assets/snippets/hello.html — a small heading / list / link snippet. 1. Including an HTML snippet The block below is pulled in via the include shortcode: Inkstone include fixture This block was loaded from assets/snippets/hello.html via the include shortcode. Heading rendered as <h3> Inline code rendered as <code> External anchor: example.com Self-check list The block above renders as HTML — not as source (no visible <section> tag characters) The “Inkstone include fixture” heading is rendered as <h3> The three list items render as <li>, with inner <code> adopting the site inline-code style The “example.com” link in the final item is a real link, with target="_blank" on hover Hugo build emits no readFile error

Rendering verification for T11g. The gallery shortcode itself only emits a placeholder div; the shortcode_gallery partial fetches the JSON at runtime, hands it to justifiedGallery for layout, and to lightGallery for the overlay. Fixture: /data/smoke/gallery.json — three placehold.co images. 1. A single gallery Self-check list Browser Network panel: /data/smoke/gallery.json returns 200 CDN injection: jQuery / justifiedGallery / lightGallery (+ thumbnail / zoom plugins) all load DOM: #gallery-1 is replaced at runtime with three <a><img></a> items, laid out on one row by justifiedGallery Clicking any thumbnail opens the lightGallery overlay with arrow navigation across all three images The overlay caption shows the subHtml block (“Smoke fixture #1/2/3”) Background and controls are readable in dark mode No lightGallery / justifiedGallery errors in the console

Rendering verification for T11f. The pullquote shortcode was added in E8; it emits <blockquote class="pullquote"> and is styled by prose.css. This page covers both shapes — with and without an author — and one nested-markdown case. 1. With author The truly brave dare to face a bleak life head-on. — Lu Xun 2. Without author “Good enough” is not the ceiling of taste — it is the ticket of admission. 3. Inner with markdown Good writing precedes style , and precedes tooling. — An editor Self-check list Both shapes adopt prose pullquote styling (large quote glyph / centered or left-aligned / font-size larger than body) With-author variant renders <cite>— Lu Xun</cite> at a smaller size Without-author variant emits no empty <cite> Nested markdown renders correctly (bold / link / inline code) Borders and text remain readable in dark mode

Rendering verification for T11e. The callout shortcode has four supported types — note / tip / warn / danger — wired up in layouts/partials/icon.html and styled in assets/css/components.css. Any other type falls back to an icon-less shell, so this page only exercises the four real ones. 1. All four types, with title Note Default type. 3px grey rule on the left, neutral icon. Tip

Rendering verification for T11d. Demonstrates the three common scenarios where the tab shortcode combines with code blocks. If switching tabs does not switch the code block, the :checked+label+.shortcode-tab-item selector in tab.css isn’t taking effect. 1. Cross-platform command switching (macOS / Windows / Linux) The most common usage — same goal, different shells, different commands. 🍎 macOS podman compose exec openclaw-gateway \ node dist/index.js channels login --channel feishu 🪟 Windows podman compose exec openclaw-gateway ` node dist/index.js channels login --channel feishu 🐧 Linux sudo podman compose exec openclaw-gateway \ node dist/index.js channels login --channel feishu Scan the generated QR code with the companion app to continue configuration.

Rendering verification for T11c. gallery / include / include-code depend on external data/files and are only verified inside real posts. 1. Figure (explicit shortcode form) Placeholder image (explicit figure shortcode) 2. Tab Item 1 Content of the first tab. Item 2 Content of the second tab. 3. Flex Left

Rendering verification for T11b. If any of iframe / video player / swiper / image-compare fails to appear, the corresponding shortcode isn’t wired up. 1. Bilibili 2. Video.js (HTML5 video player) Please enable JavaScript and use a browser that supports HTML5 video to watch this video

Rendering verification for T11a. If you see source instead of a rendered figure, the corresponding shortcode isn’t wired up. 1. MathJax Inline: the mass–energy equation \(E = mc^2\). Display: $$ \int_{-\infty}^{\infty} e^{-x^2},dx = \sqrt{\pi} $$ 2. Mermaid flowchart LR A[content] --> B[markup hook] B --> C[Page.Store hasMermaid] C --> D[scripts.html init] 3. Markmap 4. Pseudocode \begin{algorithm} \caption{Euclid's algorithm (gcd)} \begin{algorithmic} \PROCEDURE{Gcd}{$a, b$} \WHILE{$b \neq 0$} \STATE $t \gets b$ \STATE $b \gets a \bmod b$ \STATE $a \gets t$ \ENDWHILE \RETURN $a$ \ENDPROCEDURE \end{algorithmic} \end{algorithm} 5. AntV G2 (antv-g2 needs a data file to be present; this is just a placeholder call. With no script= attribute it skips the actual chart, but the g2 library should still load correctly.)