Add user profile page with Vue Router navigation

[Copilot]

Implements a user profile page component for the CodeStyle landing site, adding client-side routing to support navigation between the landing page and profile view.

Changes

New Components

• UserProfile.vue - Profile page with editable user info, stats dashboard (projects/templates/teammates), activity feed, and code preferences
• Supports edit/save toggle for profile fields with reactive form state

Routing Infrastructure

• Added Vue Router 4 with / (home) and /profile routes
• Created views/ layer: HomePage.vue wraps existing landing sections, UserProfilePage.vue wraps profile component
• Updated App.vue to use <router-view> instead of hardcoded sections

Navigation Updates

• Logo links to home route
• Primary CTA button changed from "立即开始" to "个人中心" linking to profile

Housekeeping

• Added .gitignore for node_modules and dist
• Removed build artifacts from git tracking

Example Usage

<!-- Navigate to profile -->
<router-link to="/profile">个人中心</router-link>

<!-- Profile component with edit state -->
<script setup>
const isEditing = ref(false)
const userProfile = ref({ name: '张三', email: '...', ... })
</script>

The profile component follows existing patterns: Composition API, Tailwind utilities (hover-lift, gradient-text), lucide-vue-next icons, and the primary-blue/purple color scheme.

Original prompt

你好

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Review	Updated (UTC)
codestyle	Ready	Preview, Comment	Dec 13, 2025 4:40am