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

Merge pull request #44 from ok2/codex/fix-hand-jitter-in-analog-clock-animation

Browse Source 
Fix analog clock hand center alignment
This commit is contained in:
Kiyomichi Kosaka 2025-06-15 14:31:58 +02:00 committed by GitHub
commit 85e5979414
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
clock.js
View File

@ -134,14 +134,14 @@
el.removeEventListener('transitionend', handle); el.removeEventListener('transitionend', handle);
// Snap back without animation // Snap back without animation
el.style.transition = 'none'; el.style.transition = 'none';
el.style.transform = `rotate(${angle}deg)`; el.style.transform = `translateX(-50%) rotate(${angle}deg)`;
void el.offsetWidth; void el.offsetWidth;
el.style.transition = ''; el.style.transition = '';
}; };
el.addEventListener('transitionend', handle, { once: true }); el.addEventListener('transitionend', handle, { once: true });
el.style.transform = `rotate(${target}deg)`; el.style.transform = `translateX(-50%) rotate(${target}deg)`;
} else { } else {
el.style.transform = `rotate(${angle}deg)`; el.style.transform = `translateX(-50%) rotate(${angle}deg)`;
} }
lastAngles[id] = angle; lastAngles[id] = angle;

3
style.css
View File

@ -474,7 +474,8 @@ body.fullscreen-clock .clock-label {
position: absolute; position: absolute;
bottom: 50%; bottom: 50%;
left: 50%; left: 50%;
transform-origin: bottom; transform-origin: bottom center;
transform: translateX(-50%);
transition: transform 0.5s ease-in-out; transition: transform 0.5s ease-in-out;
border-radius: 2px; border-radius: 2px;
z-index: 1; z-index: 1;