The home hero image overlapped the hero title on phones: the default theme
pulls the stacked image up with negative margins (-76px -24px -48px), which
only works because it normally sits absolutely positioned inside a fixed
320px box. custom.css lets the image flow to enlarge it, so those margins
made it bleed off-screen and collide with the title. Reset them below 960px,
and hide the image entirely under 640px -- at phone size it is a wall of
unreadable logos that pushes the title, tagline and call-to-action buttons
below the fold.
Also fixes, found while sweeping every page at 360/400/900px:
- Nav bar: the shared Theengs nav has seven top-level entries and the theme
swaps to the desktop nav bar at 768px, where it does not fit. From 768px to
~1180px, Shop, Sponsor, the appearance switch and the GitHub link were
clipped or off-screen and the page scrolled sideways. Keep the hamburger +
full-screen menu until the full menu genuinely fits.
- upload/binaries: indented (non-fenced) code blocks render as a bare <pre>,
which the theme only makes scrollable inside a language-* wrapper, so the
long esptool.py commands pushed the page sideways.
- use/lora: the YouTube embed is raw HTML with width="560", wider than a
phone. Make video embeds fluid at a 16/9 ratio.
- OmgPipeline: stack below a 680px container instead of 480px -- in between,
the "OpenMQTTGateway" label spilled out of its node and over the arrows.
Drop the media query in index.md that meant to do this: it was scoped to
index.md and could never match an element inside the child component.
No horizontal overflow remains on any of the 50 pages at 360px, 400px or
900px; desktop is unchanged.
Claude-Session: https://claude.ai/code/session_01Nj6xa5Mk5wi8XWtgJG7w5D
Co-authored-by: Florian <1technophile@users.noreply.github.com>
Co-authored-by: Claude Opus 5 (1M context) <noreply@anthropic.com>
Getting started:
- New 15-minute Getting Started guide featuring the two most popular
tracks (BLE on esp32dev-ble, RF on lilygo-rtl_433), with broker setup
and a verification step
- Sidebar restructured around the new-user journey; upload options
numbered by ease; Gitpod upload method removed
Home page:
- VitePress hero with clear actions, larger hero image
- How-it-works pipeline diagram shared as a component (responsive via
container queries), use-case grid, bigger video tiles without the
image lightbox, refreshed press coverage list, functions pills
- Support section pointing to Theengs Bridge and
github.com/sponsors/1technophile
Upload flow:
- Decision-oriented upload landing page (journey strip, method cards,
comparison table)
- Pre-flight checklist and driver troubleshooting on the web installer
- Guided environment picker (bridge + hardware wizard) replacing the
filter chips, with manifest-verified recommendations
- Post-flash next-steps card linking to the portal and verification
Board images:
- custom_img key in environments.ini and board photos for all
web-flashable environments (licenses recorded); private prod_env.ini
environments excluded from boards-info.json
Corrections:
- RF frequency coverage stated as 433/315/868/915MHz
- Removed references to the retired compatible.openmqttgateway.com
site (BLE list is decoder.theengs.io), the discontinued Theengs
Plug, and the private sponsor forum
Claude-Session: https://claude.ai/code/session_01TYysQW8tpmt1dWWuzKhTLi
Co-authored-by: Florian <1technophile@users.noreply.github.com>
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
The compatible.openmqttgateway.com site is offline (TLS connection reset),
leaving 38 dead links across the docs and README. Repoint BLE device lists
to the canonical Theengs Decoder devices page already used by the navbar,
point boards/devices/parts references to the corresponding docs pages, and
drop the affiliate-site mentions and 'Where to Buy' links that have no live
equivalent. Also fix a malformed markdown link in docs/use/ble.md.
The VuePress->VitePress migration replaced the `themeConfig.mode === 'dev'`
gate with a heuristic on `site.title`. CI overrides version with a short
SHA (dev) or git tag (prod), so the title never contains "edge"/"dev" and
the banner never renders on live deploys. Surface `meta.mode` in
`themeConfig` and check it directly, mirroring the original behaviour.
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Replace VuePress 1.9.10 with VitePress 1.6.4
- Convert config from CommonJS to ESM TypeScript (config.mts)
- Convert shared Theengs nav config to ESM (commonConfig.mts)
- Rewrite BoardEnvironmentTable in Vue 3 Composition API
- Rewrite FlashEnvironmentSelector in Vue 3 Composition API
- Enable built-in local search and dark mode
- Add medium-zoom for image zoom
- Use VitePress CSS variables for dark mode compatibility
- Update CI script paths from .vuepress to .vitepress
- Update .gitignore for VitePress build artifacts
- Rename README.md files to index.md (VitePress convention)
- Fix markdown compatibility (angle-bracket escaping, image paths)
- Drop PWA plugin (not needed)
Co-authored-by: Florian <1technophile@users.noreply.github.com>
Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
