deotalandAi/apps/frontend/README.md

Deotaland Frontend (Vue 3 + Element Plus)

This template implements the requested design system, i18n, routing, and performance features.

Stack

• Vue 3 (Vite, JavaScript)
• Element Plus 2.x (auto-import, CSS styles)
• Vue Router 4
• Vue I18n 9.x (zh/en, default zh)
• unplugin-auto-import / unplugin-vue-components / unplugin-icons (Feather icons)
• vue3-lazyload (images)
• vue-virtual-scroller@next (large lists)

Scripts

• npm run dev – start dev server
• npm run build – production build
• npm run preview – preview build

Features

• Design system: primary #6B46C1, accent #A78BFA, text #1F2937, bg #F3F4F6, radius 8px
• 8px spacing grid, card-based layout, subtle shadows, 200ms ease-in-out transitions
• Dark theme: toggle via header switch; relies on Element Plus dark CSS variables
• I18n: language switch persists to localStorage
• Routing: Home and List pages; unknown routes redirect to /
• Performance: lazy-loaded gallery images, virtual scroller rendering 2000+ items smoothly

Structure

• src/styles/ – base.css, theme.css
• src/locales/ – i18n configuration
• src/router/ – router setup
• src/views/ – Home.vue, List.vue
• src/components/ – Gallery.vue

Notes

• Feather icons via unplugin-icons components (e.g., <i-feather-home />)
• Ensure network access for Inter font (Google Fonts); replace with local font if needed