feat: smartin3.de — full 360 rotation from diagonal angle, more depth

This commit is contained in:
m
2026-04-18 21:03:42 +02:00
parent 866d30476d
commit 7d56e6a2fd

View File

@@ -123,18 +123,18 @@
-webkit-text-stroke: 1px rgba(249, 115, 22, 0.3);
}
.text3d-depth:nth-child(2) { transform: translateZ(-2px); }
.text3d-depth:nth-child(3) { transform: translateZ(-4px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.25); }
.text3d-depth:nth-child(4) { transform: translateZ(-6px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.2); }
.text3d-depth:nth-child(5) { transform: translateZ(-8px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.15); }
.text3d-depth:nth-child(6) { transform: translateZ(-10px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.1); }
.text3d-depth:nth-child(7) { transform: translateZ(-12px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.06); }
.text3d-depth:nth-child(8) { transform: translateZ(-14px); -webkit-text-stroke-color: rgba(56, 189, 248, 0.15); }
.text3d-depth:nth-child(9) { transform: translateZ(-16px); -webkit-text-stroke-color: rgba(56, 189, 248, 0.1); }
.text3d-depth:nth-child(2) { transform: translateZ(-4px); }
.text3d-depth:nth-child(3) { transform: translateZ(-8px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.25); }
.text3d-depth:nth-child(4) { transform: translateZ(-12px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.2); }
.text3d-depth:nth-child(5) { transform: translateZ(-16px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.15); }
.text3d-depth:nth-child(6) { transform: translateZ(-20px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.1); }
.text3d-depth:nth-child(7) { transform: translateZ(-24px); -webkit-text-stroke-color: rgba(249, 115, 22, 0.06); }
.text3d-depth:nth-child(8) { transform: translateZ(-28px); -webkit-text-stroke-color: rgba(56, 189, 248, 0.15); }
.text3d-depth:nth-child(9) { transform: translateZ(-32px); -webkit-text-stroke-color: rgba(56, 189, 248, 0.1); }
@keyframes rotateText {
0%, 100% { transform: rotateY(-15deg) rotateX(5deg); }
50% { transform: rotateY(15deg) rotateX(-5deg); }
0% { transform: rotateX(-25deg) rotateY(0deg); }
100% { transform: rotateX(-25deg) rotateY(360deg); }
}
h1 {