0 Fork 0

mirror of https://github.com/PR0M3TH3AN/Artstr-Studio.git synced 2026-11-01 19:20:40 +00:00

Files

T

thePR0M3TH3ANandClaude Opus 4.7 23a16c8e89 docs: in-app "Read the docs" modal + per-mode help pages

Adds a 📖 Docs link to the sidebar footer (next to GitHub + artstr.org)
that opens a Read-the-Docs-style two-pane modal: topic sidebar on the
left, rendered markdown on the right.

Content (src/help/*.md, 11 files):
- index.md            — overview + nav
- template.md         — Template tab explainer
- designer.md         — Designer tab explainer
- cover.md            — Case cover wrap
- disc.md             — Disc-label sheet
- jewel.md            — Jewel-case insert
- customart.md        — Custom art
- slide.md            — Slide
- deck.md             — Slide deck
- pixelart.md         — Pixel art
- book.md             — Book Designer (links out to the deeper
                        BOOK_DESIGNER_TUTORIAL.md + spec on GitHub)

Implementation:
- _DOCS_TOPICS registry maps slug → { title, group, file }. Sidebar
  groups headings under "Start here", "App tabs", "Template-mode
  layouts".
- loadDocsTopic(slug) fetches `help/<slug>.md` (force-cache), renders
  via the already-vendored marked, caches the rendered HTML for
  session-instant re-visits, and updates the URL hash via
  history.replaceState so deep links work.
- #/help/<slug> hash route auto-opens the modal at that topic on
  page load + on hashchange.
- Esc closes; backdrop click closes; internal `#/help/foo` links in
  page content load via the dispatcher (no page bounce); external
  http(s) links get target="_blank" + noopener.

Styling:
- Inherits the rest of the modal aesthetic (var(--line),
  var(--accent), system font for chrome, Georgia serif for body
  text). Dark-mode-aware backdrops on code / blockquote / table
  blocks.
- Two-pane layout collapses to a narrower sidebar on <720px viewports.

Files live in src/help/ (not docs/) because Vercel's outputDirectory
is "src" — the production site only serves files under src/. The
canonical deeper docs (BOOK_DESIGNER_TUTORIAL, FEATURE specs) stay
in docs/ and are linked-out from the in-app pages.

Co-Authored-By: Claude Opus 4.7 <[email protected]>

2026-06-04 08:52:34 -04:00

2.2 KiB

Raw Blame History

Artstr Studio docs

Welcome. Artstr Studio is a single-page design tool that publishes everything to Nostr instead of a private server. Pick a topic below.

The two app modes

Template — print + screen artwork (cover wraps, disc labels, jewel inserts, custom-art canvases, slides, decks, pixel art, books). Every artboard publishes as one or more Nostr events that anyone can fork or remix.
Designer — a reusable single-disc design surface. Disc designs publish independently, then drop into any disc slot of a disc-label sheet.

Template-mode layouts

Case cover wrap — front + spine + back wraparound for DVD / Blu-ray / softcover printable cases.
Disc-label sheet — two-up CD/DVD label sheet.
Jewel-case insert — front + tray jewel inserts.
Custom art — any-aspect flat canvas.
Slide — 16:9 standalone slide with speaker notes.
Slide deck — ordered collection of slides.
Pixel art — palette-indexed grid editor with multi-frame animation.
Book — multi-page reflowable book with cover, chapters, masters, PDF export, and Reader Mode.

Working in Nostr

Sign in with a browser extension (Alby, nos2x, etc) using the top- right widget. Without one you can still author and export locally; publishing + browsing the community requires a key.
Every Artstr event is replaceable (NIP-33). Re-publishing under the same d-tag updates the design in place.
Private publishing uses NIP-44 / NIP-04 to encrypt the payload to your own key — only you can decrypt on a fresh device.

Tips

Most modes autosave to localStorage as you edit, so you can close the tab and come back later. Publish to Nostr to share or to back up across devices.
Linked Designs let you reference another author's published design as a layer in yours. Their event is fetched and rendered live; the manifest p-tags the contributors for attribution.
The community browser (top-right Nostr widget) shows feeds you can filter and import from.

2.2 KiB Raw Blame History