skills.rest
silentbalanceyh
silentbalanceyhCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

r2mo-ui-admin

Generates a frontend shell with layout, navigation, and theming from R2MO specification documents.

2|1|Updated Nov 20, 2025
Search Tags:#layout#frontend#navigation#shell#design-system#r2mo
One-click install
npx skills add https://github.com/silentbalanceyh/r2mo-lain --skill r2mo-ui-admin
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: r2mo-ui-admin
Source: https://github.com/silentbalanceyh/r2mo-lain/tree/main/docs/skills/r2mo-ui-admin
Command: npx skills add https://github.com/silentbalanceyh/r2mo-lain --skill r2mo-ui-admin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill provides a reusable frontend shell (layout, navigation, and theme engine) driven by R2MO specification documents to deliver a polished, consistent UI without implementing login or token storage.

Core Features & Use Cases

  • Global Layout Shell and Navigation: renders shell layout, collapsible sidebar, and header bound to design-system metadata.
  • Dynamic Menu from Specs: builds the navigation tree from parsed module specs in front-matter.
  • Theme Engine & Responsiveness: applies design-system driven theming with responsive behavior and mobile drawer support.

Quick Start

Initialize the frontend shell configured by the R2MO design spec to render layout, navigation, and theming.

Frequently Asked Questions about r2mo-ui-admin

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a frontend shell from R2MO spec documents?▼

To generate a frontend shell from R2MO spec documents, automate the rendering of layout, navigation, and theming by parsing front-matter metadata including spec, layout, theme, primary, grid, i18n, and copyright fields.

Can I build a dynamic navigation menu from module specifications?▼

Yes, you can build a dynamic navigation menu by parsing module specs from front-matter metadata, constructing a navigation tree that renders collapsible sidebars and headers bound to design-system metadata.

Does the frontend layout shell support both Vue and React environments?▼

The frontend layout shell supports both Vue and React environments, applying design-system driven styling, responsive behavior, and mobile drawer support across these frameworks.

How does the theme engine handle responsive behavior and mobile drawers?▼

The theme engine handles responsive behavior by applying design-system driven theming metadata, rendering collapsible sidebars, and exposing a layout store that manages UI state for mobile drawer support.

What front-matter metadata is required to render the shell UI?▼

Rendering the shell UI requires parsing front-matter metadata fields including spec, layout, theme, primary, grid, i18n, and copyright to configure the design-system driven layout and navigation.

Does the frontend shell handle user login and token storage?▼

No, the frontend shell does not handle user login or token storage, focusing solely on delivering a polished, consistent layout, navigation, and theme engine driven by R2MO specification documents.

Related Skills

Explore More Software Engineering Skills→
silentbalanceyhsilentbalanceyh
2

r2mo-ui-route

Generate runtime frontend routing trees and guard configurations from R2MO design specifications.

Community
Advanced
leifericfleifericf
5

write-ui

Generate a serializable view-spec from application state using pure functions.

Community
Advanced
791994545791994545
4

i18n-expert

Automate i18n setup and audit UI code for localization compliance.

Community
Intermediate
Luqman-Ud-DinLuqman-Ud-Din

qa-detect-rtl-layout

Detect RTL layout breakage by scanning DOM elements for overflow and fixed-position issues.

Community
Advanced