perspective rotation

This commit is contained in:
Adrien MALINGREY 2024-03-20 16:38:26 +01:00
parent 4717ec0877
commit 852394c54c

View File

@ -19,6 +19,17 @@ body {
margin-bottom: 0.5em; margin-bottom: 0.5em;
} }
@keyframes perspective {
from {
transform: rotateX(0deg) perspective(0px);
filter: drop-shadow(0px 00px 0px #0f2437);
}
to {
transform: rotateX(40deg) perspective(150px);
filter: drop-shadow(0px 10px 0px #0f2437);
}
}
#labyShadow { #labyShadow {
width: 230px; width: 230px;
height: 230px; height: 230px;
@ -26,15 +37,13 @@ body {
margin-right: auto; margin-right: auto;
margin-top: 20vh; margin-top: 20vh;
margin-bottom: 5vh; margin-bottom: 5vh;
filter: drop-shadow(0px 10px 0px #0f2437); animation: perspective 60s infinite;
transform: rotateX(40deg) perspective(150px);
} }
@keyframes rotation { @keyframes rotation {
from { from {
transform: rotateZ(0deg); transform: rotateZ(0deg);
} }
to { to {
transform: rotateZ(360deg); transform: rotateZ(360deg);
} }
@ -43,13 +52,14 @@ body {
#labyTable { #labyTable {
border-collapse: collapse; border-collapse: collapse;
animation: rotation 60s infinite; animation: rotation 60s infinite;
border: none;
} }
#labyTable td { #labyTable td {
width: 10px; width: 10px;
height: 10px; height: 10px;
transition: background-color 1s; transition: background-color 1s;
border: 0; border: none;
padding: 0; padding: 0;
} }