fix: Color-Picker-Cursor erreicht jetzt den rechten und unteren Rand

updateUI verwendete svCanvas.width (HTML-Attribut, 220px) statt der
tatsächlich gerenderten Breite. Wenn CSS den Canvas größer rendert,
stoppte der Cursor vor dem rechten Rand. Jetzt wird getBoundingClientRect()
verwendet, konsistent mit handleSV.
This commit is contained in:
Scarriffle
2026-04-13 09:18:03 +02:00
parent 5c7a74e221
commit d6e67a97c8

View File

@@ -128,11 +128,14 @@ export function openColorPicker(anchorEl, currentColor = '#4285f4') {
function updateUI() { function updateUI() {
const [r, g, b] = hsvToRgb(h, s, v); const [r, g, b] = hsvToRgb(h, s, v);
const hex = rgbToHex(r, g, b); const hex = rgbToHex(r, g, b);
// Use rendered size so cursor matches the visible palette area
const svRect = svCanvas.getBoundingClientRect();
const hueRect = hueCanvas.getBoundingClientRect();
// SV cursor position // SV cursor position
svCursor.style.left = (s * svCanvas.width) + 'px'; svCursor.style.left = (s * svRect.width) + 'px';
svCursor.style.top = ((1 - v) * svCanvas.height) + 'px'; svCursor.style.top = ((1 - v) * svRect.height) + 'px';
// Hue thumb position // Hue thumb position
hueThumb.style.left = (h / 360 * hueCanvas.width) + 'px'; hueThumb.style.left = (h / 360 * hueRect.width) + 'px';
// Preview + hex // Preview + hex
preview.style.background = hex; preview.style.background = hex;
hexInput.value = hex.toUpperCase(); hexInput.value = hex.toUpperCase();