danak/dpage-editor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

base animation

Browse Source
This commit is contained in:
hamid zarghami
2026-05-12 15:19:44 +03:30
parent 8cfe559fb6
commit 6a8eaab8cb
13 changed files with 548 additions and 122 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/viewer/styles/entranceAnimations.css
+76
View File
@@ -0,0 +1,76 @@
/* PowerPoint-style entrance animations for viewer (keyframes use --ve-* vars from JS) */
@keyframes viewer-entrance-fade {
from {
opacity: 0;
}
to {
opacity: var(--ve-opacity-end, 1);
}
}
@keyframes viewer-entrance-fly-left {
from {
opacity: 0;
transform: translateX(calc(-1 * var(--ve-dist, 48px))) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: translateX(0) rotate(var(--ve-rot, 0deg));
}
}
@keyframes viewer-entrance-fly-right {
from {
opacity: 0;
transform: translateX(var(--ve-dist, 48px)) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: translateX(0) rotate(var(--ve-rot, 0deg));
}
}
@keyframes viewer-entrance-fly-top {
from {
opacity: 0;
transform: translateY(calc(-1 * var(--ve-dist, 48px))) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: translateY(0) rotate(var(--ve-rot, 0deg));
}
}
@keyframes viewer-entrance-fly-bottom {
from {
opacity: 0;
transform: translateY(var(--ve-dist, 48px)) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: translateY(0) rotate(var(--ve-rot, 0deg));
}
}
@keyframes viewer-entrance-zoom-in {
from {
opacity: 0;
transform: scale(0.35) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: scale(1) rotate(var(--ve-rot, 0deg));
}
}
@keyframes viewer-entrance-zoom-out {
from {
opacity: 0;
transform: scale(1.45) rotate(var(--ve-rot, 0deg));
}
to {
opacity: var(--ve-opacity-end, 1);
transform: scale(1) rotate(var(--ve-rot, 0deg));
}
}