Fix "instant" screen switching animation

Signed-off-by: mctaylors <cantsendmails@mctaylors.ru>
This commit is contained in:
Macintxsh 2024-05-03 23:51:25 +05:00
parent a5faada17c
commit 17d09485dd
Signed by: mctaylors
GPG key ID: 7181BEBE676903C1

View file

@ -18,25 +18,29 @@ function close_button(href) {
function details_button() { function details_button() {
play("click"); play("click");
document.getElementById('dialog-content').style.opacity = '0';
document.getElementById('dialog-content').style.display = 'none';
let root = document.documentElement; let root = document.documentElement;
let dialogElement = document.getElementById('dialog'); let dialogElement = document.getElementById('dialog');
let detailsElement = document.getElementById('details');
dialogElement.animate([ dialogElement.animate([
{ {
opacity: 0, opacity: 0,
width: getStyleProperty(root, '--keyframe-hide-dialog-width'), width: getStyleProperty(root, '--keyframe-hide-dialog-width'),
height: getStyleProperty(root, '--keyframe-hide-dialog-height'), paddingBottom: getStyleProperty(root, '--keyframe-hide-dialog-padding-bottom'),
} }
], { ], {
fill: 'forwards', fill: 'forwards',
easing: 'ease-out', easing: 'ease-out',
duration: 250 duration: 250
}); });
dialogElement.style.display = 'none';
let detailsElement = document.getElementById('details'); setTimeout(function(){
detailsElement.style.display = 'inline-block'; dialogElement.style.display = 'none';
detailsElement.style.display = 'inline-block';
}, 250);
detailsElement.animate([ detailsElement.animate([
{ {
opacity: 0, offset: 0.95 opacity: 0, offset: 0.95