Skip to content

Conversation

Copy link

Copilot AI commented Nov 6, 2025

Addresses optimization requirements: form beautification, light/dark theme support, bug fixes, and improved code readability.

Theme System

Added global CSS variable-based theming with light/dark mode:

  • /core/styles/theme.css - Color, spacing, typography tokens
  • /core/styles/forms.css - Form component styling using theme variables
  • Theme toggle button in header (toggleTheme exposed via component API)
// App.vue
const currentTheme = ref<'light' | 'dark'>('light');
const toggleTheme = () => {
  currentTheme.value = currentTheme.value === 'light' ? 'dark' : 'light';
  document.documentElement.setAttribute('data-theme', currentTheme.value);
};

Bug Fixes

Import path case sensitivity (13 files)

  • previewpreView in App.vue
  • Iconsicons for SVG imports
  • arrowArrow, dropdownDropdown for components

Data deletion bug in docInfo/formView/index.vue:86

// Before: incorrectly deleted contact when license was empty
if (!license.name) {
  delete data.contact;  // ❌ Wrong property
}

// After:
if (!license.name) {
  delete formData.license;  // ✅ Correct
}

Code Quality

  • getDatagetFormData, saveDatasaveFormData (clearer intent)
  • Removed debug console.log statements

Screenshots

Light Theme
Light Theme

Dark Theme
Dark Theme

Original prompt

对OpenAPI设计器进行优化:
1、美化表单样式,让布局更加精细、美观舒适;
2、定义全局样式,支持浅色和深色两种主题;
3、检查代码bug并修复;
4、优化方法、变量命名提高可读性。


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

Copilot AI and others added 2 commits November 6, 2025 16:03
- Created global theme system with light/dark mode support
- Added CSS variables for colors, spacing, and typography
- Beautified form styles with improved spacing and borders
- Added theme toggle button to UI
- Fixed bug in docInfo: delete data.license instead of data.contact
- Improved variable naming: getData → getFormData, saveData → saveFormData
- Removed debug console.log statements from siderMenu
- Enhanced visual hierarchy and component styling

Co-authored-by: CoderBoyBoy <[email protected]>
Copilot AI changed the title [WIP] Optimize form layout and improve global styles for OpenAPI designer feat: Add theme system, improve form styling, fix import paths and data deletion bug Nov 6, 2025
Copilot AI requested a review from CoderBoyBoy November 6, 2025 16:27
Copilot finished work on behalf of CoderBoyBoy November 6, 2025 16:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants