mmo-app
The application shell: the element the theme builds every document's body into
(MMO\client\Theme::$rootElement), reachable from anywhere as MMO.app.
Usage
One element, three templates, chosen by the host's class. Every region — rail, breadcrumb, page tabs, hero, page header, side panel, table of contents, status bar, footer — exists in the dom, and each template decides which ones take part in its layout. A region no slot fills removes itself, so a page never pays for what it does not use.
The shell is styled with the Simple CSS design system in
src/styles: its tokens are declared once on :root by the document stylesheet
and inherit into the shadow root, which is why a reskin needs no rebuild of the element.
Dossiers
the page
The three templates are shown, full size and on real content, under Application: admin, landing, blog and article.
Examples
Templates and state
Each of these is a class on the host, so a page switches shell, opens the panel or collapses the rail
with classList alone.
References
src/customElements/layouts/mmo-app.jhs— the elementsrc/styles/— the design system it is built ondocs/SCS_DESIGN_SYSTEM.md— how to reskin it