Skills
.Work. You
Rest

vue-view-generator

Community

Standardize Vue UI creation with consistent layouts and components.

Software Engineering#ui#layout#frontend#components#vue#design-system
AuthorAdrianAVA9
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill streamlines the development of Vue-based user interfaces by enforcing consistent layout structures, spacing rules, and the use of shared components, reducing UI inconsistencies and ensuring a uniform user experience.

Core Features & Use Cases

  • Layout Enforcement: Guides the proper selection and integration of AppLayout and FocusedLayout for different page types.
  • UI Standardization: Ensures internal padding, spacing, and component usage adhere to Fintrack design rules.
  • Component Utilization: Promotes the use of shared components like <LoadingIndicator>, <ConfirmationModal>, <CategorySelector>, <SurfaceCard>, <AmountInputCard>, and <AppButton>.
  • Route Metadata Setup: Assists in configuring route meta properties for header control and layout signals.
  • Best Practices: Provides guidelines on styling, responsive behavior, and accessibility considerations for Vue views.

Quick Start

When creating or restructuring a Vue page, use the shared components to ensure consistency and add the appropriate layout as specified in the project guidelines.

Dependency Matrix

Required Modules

None required

Components

referencesassets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: vue-view-generator
Download link: https://github.com/AdrianAVA9/cero-base/archive/main.zip#vue-view-generator

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.