jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Add some colorshift blob animation to dns setup

Browse Source
This commit is contained in:
Johannes Zellner
2025-08-17 17:22:50 +02:00
parent 20fa49f8e4
commit e1a7056ef8
4 changed files with 56 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
dashboard/src/setup.css
View File

@@ -22,3 +22,38 @@ h1 {
background-color: transparent;
cursor: copy;
}
@keyframes rotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes color {
0% {
background-position: 0% 0%;
}
100% {
background-position: 100% 100%;
}
}
.gradient {
--blob-size: 200px;
--speed: 6s;
--easing: cubic-bezier(0.8, 0.2, 0.2, 0.8);
width: var(--blob-size);
height: var(--blob-size);
filter: blur(calc(var(--blob-size) / 5));
animation: rotate var(--speed) var(--easing) alternate infinite, color 5s var(--easing) alternate infinite;
border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
margin-top: 60px;
margin-bottom: 80px;
background-size: 200% 200%;
background-image: linear-gradient(#096dbd, #c340ff, #ffa240);
}