Fix jittering of clock markers

This commit is contained in:
Kiyomichi Kosaka 2025-06-15 14:25:30 +02:00
parent 0a55bba1c9
commit 40a7d87832
2 changed files with 6 additions and 3 deletions

View File

@ -74,8 +74,7 @@
}
// Unified radius based on the actual clock size
const rect = clock.getBoundingClientRect();
const baseRadius = rect.width / 2;
const baseRadius = clock.offsetWidth / 2;
// Tick lengths relative to the clock radius
const lenBig = baseRadius * 0.12;
@ -86,7 +85,7 @@
// Distance from center for the marker digits so they sit just inside big ticks
const markerSize = markers[0] ? markers[0].offsetWidth : 0;
const markerRadius = outerR - lenBig - markerSize * getMarkerOffset(rect.width);
const markerRadius = outerR - lenBig - markerSize * getMarkerOffset(clock.offsetWidth);
markers.forEach((m, i) => {
const angle = (i / 16) * 2 * Math.PI;

View File

@ -454,6 +454,10 @@ body.fullscreen-clock .clock-label {
text-shadow: 0 0 6px rgba(0, 255, 255, 0.9), 0 0 12px rgba(0, 255, 255, 0.7);
box-shadow: none;
transform-origin: center;
font-variant-numeric: tabular-nums;
user-select: none;
pointer-events: none;
will-change: transform;
z-index: 1;
}