No description
Find a file
isUnknown 3bd6c7ca19 fix: close Coloris picker on iframe clicks and improve editor styling
Add click handler on iframe to close Coloris color picker when user clicks
in the preview area. Also improve editor panel spacing and styling consistency.

Coloris Close Fix:
- Import Coloris in App.vue
- Add click listener on iframe document to call Coloris.close()
- Fixes issue where Coloris remained open when clicking in preview iframe
  (clicks in iframes don't bubble to parent document)

Editor Styling Improvements:
- Increase EditorPanel width from 30rem to 35rem for better readability
- Add CSS variable --space-xs (0.5rem) for consistent spacing
- Improve form field spacing with gaps and better padding
- Add row-gap to margins subsection
- Fix input-with-color width and button height (1.1rem)
- Add gap to unit-toggle buttons
- Better visual hierarchy with margins on h2 and h3

CSS Changes:
- _forms.scss: Consistent spacing, better input padding, gap utilities
- _variables.scss: Add --space-xs variable
- Compiled CSS updated with new styles

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-12-04 16:14:50 +01:00
.vscode init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00
public fix: close Coloris picker on iframe clicks and improve editor styling 2025-12-04 16:14:50 +01:00
src fix: close Coloris picker on iframe clicks and improve editor styling 2025-12-04 16:14:50 +01:00
.gitignore init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00
claude.md init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00
index.html init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00
package-lock.json feat: integrate Coloris color picker for background field 2025-12-04 15:03:29 +01:00
package.json feat: integrate Coloris color picker for background field 2025-12-04 15:03:29 +01:00
README.md init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00
vite.config.js init with kirby, vue and pagedjs interactive 2025-11-24 14:01:48 +01:00

Vue 3 + Vite

This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 <script setup> SFCs, check out the script setup docs to learn more.

Learn more about IDE Support for Vue in the Vue Docs Scaling up Guide.