1
0
mirror of https://github.com/chinchang/web-maker.git synced 2025-03-24 12:39:51 +01:00

add scroll animation on hero img;

This commit is contained in:
Kushagra Gour 2023-08-18 12:08:41 +05:30
parent 317d803a18
commit 6ad63526c7

View File

@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
@ -48,6 +48,7 @@
html {
font-size: var(--base-font-size);
scroll-timeline: --root-scroll block;
}
body {
@ -60,6 +61,7 @@
margin: 0;
color: #3a3a3a;
-webkit-font-smoothing: antialiased;
}
body.docs {
max-width: 70ch;
@ -483,6 +485,20 @@
.people-say-bottom .say {
--shadow-y: -5px;
}
@keyframes hero-img-progress {
from {
transform: rotateX(4deg) rotateY(-6deg);
}
to {
transform: rotateX(-40deg) rotateY(100deg);
}
}
.screenshot {
animation: hero-img-progress auto linear;
animation-timeline: --root-scroll;
}
</style>
</head>