fix: improve Coloris color picker visibility and button clickability
All checks were successful
Deploy / Build and Deploy to Production (push) Successful in 16s

- Fix grid layout: add second column for input (grid-template-columns: var(--input-h) 1fr)
- Ensure color picker button is clickable with cursor pointer and pointer-events auto
- Set color picker z-index to 10000 to display above all UI elements
- Add global styles to ensure Coloris button is always clickable

Fixes issues where:
- Color picker appeared behind ElementPopup
- Button was not consistently clickable
- Grid layout was missing second column definition

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-01-09 16:54:10 +01:00
parent 9127520ff7
commit 83455b7098
4 changed files with 58 additions and 62 deletions

View file

@ -675,6 +675,19 @@ onMounted(async () => {
height: 1.5rem;
}
/* Coloris color picker - ensure it's always on top */
:deep(.clr-picker) {
z-index: 10000 !important;
}
/* Coloris button - ensure it's clickable and visible */
:deep(.clr-field button) {
pointer-events: auto !important;
cursor: pointer !important;
position: relative;
z-index: 1;
}
/* Hide UI elements when printing */
@media print {
#editor-panel,