________ ________ __ ______ ______ ___ ___ ___ ___ ___
/\ ___ `\ /\____ \ / `\ / ____\ /' ____ `\\ - /\ \ /\ \ /\ \\ \
\ \ \ /\ `\/___/ // _ \/\ \___/_/\ \ /\ \\ " .\ \ \ \ \ \ \ \\ \
\ \ \ \ \ \ / // /_\ \_\ ___ `\\ \ \ \ \\ \ . \ \ \ \ \ \ \\ \
\ \ \___\ \/ //\______ __ \_/\ \\ \___\ \\ \ " . \ \ \ \___\ \\ \
\ \________/\__/ \/_____/\__\/\_______/ \________/ \__\ \ \__\ \ \________/ \__\
\/_______/\/_/ \/__/\/______/ \/_______/ \/__/ \/__/ \/_______/ \/__/
- Professional/minimal look/feel
- Optional configurable themes (light, dark, system)
- Optional configurable layouts (horizontal, vertical)
- Optional configurable UI density
- Compatable with all screen sizes
- Desktop keyboard accessible
- Mobile touch/swipe controls
- Fullscreen/Zen mode
- Pure CSS UI Template
- Single Page Application (SPA)
- Progressive Web Application (PWA)
- JAMstack architecture
- W3C/WHATWG standards compliant
- Vanilla (no dependencies)
- Minimal nesting (flat)
- Minimal/no classes
- Data agnostic
- JS Framework agnostic
- Media platform agnostic (responsive)
- Browser agnostic
- No build process
- No compile process
- No server required
- Web Storage API
- Modern CSS:
- :has() pseudo-class
- @layer (optional third party integration)
- container queries
- custom elements
- custom properties
- Minimal clean markup
- Minimal clean look/feel
- Self-aware UI:
- Buttons only fetch, push, and clear data
- UI detects and reacts to when data is present
- Loading animation between button click and data fully loaded
- Least Power:
- Can it be done in HTML?
- Then can it be done in CSS?
- Then can it be done in JS?
- Then use more a powerful language
- Separation of Concerns:
- Air gap separation between UI and related code (HTML/CSS) and data and related code (JS and or optional frameworks AKA Middle-tier)
Meaning: No data/business logic in HTML/CSS - Middle-tier and related code from back-end-tier and related code
- Air gap separation between UI and related code (HTML/CSS) and data and related code (JS and or optional frameworks AKA Middle-tier)