kaizenkodo/CoBiE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #42 from ok2/codex/fix-pixel-jump-in-0-f-markers

Browse Source 
Fix marker jitter in analog clock
This commit is contained in:
Kiyomichi Kosaka 2025-06-15 14:25:50 +02:00 committed by GitHub
commit 4f7f47dc1c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
clock.js
View File

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

4
style.css
View File

@ -447,6 +447,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); text-shadow: 0 0 6px rgba(0, 255, 255, 0.9), 0 0 12px rgba(0, 255, 255, 0.7);
box-shadow: none; box-shadow: none;
transform-origin: center; transform-origin: center;
font-variant-numeric: tabular-nums;
user-select: none;
pointer-events: none;
will-change: transform;
z-index: 1; z-index: 1;
} }