# madmaxchow/vlook architecture

> Architecture diagram of the GitHub repository madmaxchow/vlook, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-30). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/madmaxchow/vlook
- Repository: https://github.com/madmaxchow/vlook
- Video tour (about a minute): https://gitdiagram.com/madmaxchow/vlook/video

## Overview

VLOOK is a Typora theme package and Markdown enhancement plugin. A user authors a Markdown document in Typora, applies a VLOOK theme and plugin, then reads or exports the enhanced document. The plugin’s documented capabilities span document layout and content marking, navigation, interactive reading and presentation, with charting described in the README. The repository also includes released theme assets, language packs, and browser-side helper libraries. The runtime bundle is minified and only partially excerpted, so capability links rely on README statements; internal dispatch between plugin features is not asserted.

Main entry points: [`released/plugin-live/V2026.7/vlook-min.js`](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js) (Enhancement plugin), [`src/less/theme`](https://github.com/madmaxchow/vlook/tree/master/src/less/theme) (VLOOK themes), [`released/plugin-live/V2026.7/start.js`](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/start.js) (Plugin startup), [`released/plugin-live/V2026.7/jquery-migrate.js`](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery-migrate.js) (jQuery Migrate)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_authoring["Authoring and export"]
  node_typora["Typora editor"]
  node_markdown["Markdown document"]
  node_rendered["Enhanced document"]
end

subgraph group_themes["Themes and typography"]
  node_themefiles["VLOOK themes"]
  node_typora_styles["Typora styling<br/>[typora.less]"]
  node_fonts["Font styles<br/>[font.less]"]
  node_core_styles["Shared styles<br/>[core.less]"]
end

subgraph group_enhancement["Document enhancement"]
  node_layout["Document layout<br/>[vlook-min.js]"]
  node_marking["Content marking<br/>[vlook-min.js]"]
  node_navigation["Content navigation<br/>[vlook-min.js]"]
  node_reading["Interactive reading<br/>[vlook-min.js]"]
  node_presentation["Presentation tools<br/>[vlook-min.js]"]
  node_charts["Scripted charts<br/>[chart.html]"]
end

subgraph group_runtime["Plugin runtime"]
  node_plugin_core["Enhancement plugin<br/>[vlook-min.js]"]
  node_startup["Plugin startup<br/>[start.js]"]
  node_translations["Language packs<br/>[lang]"]
  node_jquery["jQuery<br/>[jquery.js]"]
  node_jquery_slim["jQuery slim<br/>[jquery-slim.js]"]
  node_jquery_migrate["jQuery Migrate<br/>[jquery-migrate.js]"]
  node_clipboard["Clipboard helper<br/>[clipboard.js]"]
  node_svg["SVG injection<br/>[svg-inject.js]"]
end

node_writer(("Document author"))

node_writer -->|"authors in"| node_typora
node_typora -->|"creates"| node_markdown
node_typora -->|"applies theme"| node_themefiles
node_themefiles -.->|"uses styling"| node_typora_styles
node_themefiles -.->|"uses fonts"| node_fonts
node_typora -->|"enhances document"| node_plugin_core
node_plugin_core -->|"provides"| node_layout
node_plugin_core -->|"provides"| node_marking
node_plugin_core -->|"provides"| node_navigation
node_plugin_core -->|"provides"| node_reading
node_plugin_core -->|"provides"| node_presentation
node_plugin_core -->|"supports"| node_charts
node_plugin_core -->|"enhances output"| node_rendered
node_startup -.->|"starts"| node_plugin_core
node_plugin_core -->|"uses language packs"| node_translations
node_jquery_migrate -->|"patches compatibility"| node_jquery
node_plugin_core -.->|"uses clipboard"| node_clipboard
node_plugin_core -.->|"uses SVG injection"| node_svg

click node_themefiles "https://github.com/madmaxchow/vlook/tree/master/src/less/theme"
click node_typora_styles "https://github.com/madmaxchow/vlook/blob/master/src/less/typora.less"
click node_fonts "https://github.com/madmaxchow/vlook/blob/master/src/less/font.less"
click node_core_styles "https://github.com/madmaxchow/vlook/blob/master/src/less/core.less"
click node_plugin_core "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_startup "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/start.js"
click node_translations "https://github.com/madmaxchow/vlook/tree/master/released/plugin-live/V2026.7/lang"
click node_jquery "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery.js"
click node_jquery_slim "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery-slim.js"
click node_jquery_migrate "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery-migrate.js"
click node_clipboard "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/clipboard.js"
click node_svg "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/svg-inject.js"
click node_layout "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_marking "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_navigation "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_reading "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_presentation "https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js"
click node_charts "https://github.com/madmaxchow/vlook/blob/master/docs/chart.html"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_typora,node_markdown,node_rendered toneBlue
class node_themefiles,node_typora_styles,node_fonts,node_core_styles toneAmber
class node_layout,node_marking,node_navigation,node_reading,node_presentation,node_charts toneMint
class node_plugin_core,node_startup,node_translations,node_jquery,node_jquery_slim,node_jquery_migrate,node_clipboard,node_svg toneRose
class node_writer toneIndigo
```

## Components

### Authoring and export

- **Typora editor**
- **Markdown document**
- **Enhanced document**

### Themes and typography

- [VLOOK themes](https://github.com/madmaxchow/vlook/tree/master/src/less/theme): `src/less/theme`
- [Typora styling](https://github.com/madmaxchow/vlook/blob/master/src/less/typora.less): `src/less/typora.less`
- [Font styles](https://github.com/madmaxchow/vlook/blob/master/src/less/font.less): `src/less/font.less`
- [Shared styles](https://github.com/madmaxchow/vlook/blob/master/src/less/core.less): `src/less/core.less`

### Document enhancement

- [Document layout](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Content marking](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Content navigation](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Interactive reading](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Presentation tools](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Scripted charts](https://github.com/madmaxchow/vlook/blob/master/docs/chart.html): `docs/chart.html`

### Plugin runtime

- [Enhancement plugin](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/vlook-min.js): `released/plugin-live/V2026.7/vlook-min.js`
- [Plugin startup](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/start.js): `released/plugin-live/V2026.7/start.js`
- [Language packs](https://github.com/madmaxchow/vlook/tree/master/released/plugin-live/V2026.7/lang): `released/plugin-live/V2026.7/lang`
- [jQuery](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery.js): `released/plugin-live/V2026.7/jquery.js`
- [jQuery slim](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery-slim.js): `released/plugin-live/V2026.7/jquery-slim.js`
- [jQuery Migrate](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/jquery-migrate.js): `released/plugin-live/V2026.7/jquery-migrate.js`
- [Clipboard helper](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/clipboard.js): `released/plugin-live/V2026.7/clipboard.js`
- [SVG injection](https://github.com/madmaxchow/vlook/blob/master/released/plugin-live/V2026.7/svg-inject.js): `released/plugin-live/V2026.7/svg-inject.js`

### Other components

- **Document author**

## Connections

- Document author → Typora editor: authors in (evidence: `README.md`)
- Typora editor → Markdown document: creates (evidence: `README.md`)
- Typora editor → VLOOK themes: applies theme (evidence: `README.md`)
- VLOOK themes → Typora styling: uses styling
- VLOOK themes → Font styles: uses fonts
- Typora editor → Enhancement plugin: enhances document (evidence: `README.md`)
- Enhancement plugin → Document layout: provides (evidence: `README.md`)
- Enhancement plugin → Content marking: provides (evidence: `README.md`)
- Enhancement plugin → Content navigation: provides (evidence: `README.md`)
- Enhancement plugin → Interactive reading: provides (evidence: `README.md`)
- Enhancement plugin → Presentation tools: provides (evidence: `README.md`)
- Enhancement plugin → Scripted charts: supports (evidence: `README.md`)
- Enhancement plugin → Enhanced document: enhances output (evidence: `README.md`)
- Plugin startup → Enhancement plugin: starts
- Enhancement plugin → Language packs: uses language packs (evidence: `README.md`)
- jQuery Migrate → jQuery: patches compatibility (evidence: `released/plugin-live/V2026.7/jquery-migrate.js`)
- Enhancement plugin → Clipboard helper: uses clipboard
- Enhancement plugin → SVG injection: uses SVG injection