InfStarMC/infstarweb
1
0
Fork 0
mirror of https://github.com/Coldsmiles/infstarweb.git synced 2026-04-23 02:30:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement dynamic subtitle rotation in hero section

Browse Source
This commit is contained in:
zhangyuheng
2026-03-12 13:47:23 +08:00
parent 5857b551c3
commit 71387a1039
3 changed files with 87 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
css/style.css
View File

@@ -172,6 +172,46 @@ body {
text-shadow: 0 2px 5px rgba(0,0,0,0.3);
}
.hero-subtitle-container {
margin-bottom: 15px;
}
.subtitle-prefix, .subtitle-suffix {
white-space: nowrap;
}
.subtitle-dynamic {
white-space: nowrap;
margin: 0 8px;
position: relative;
display: inline-block;
min-width: 40px;
text-align: center;
}
/* Fade animation for dynamic subtitle */
.fade-enter {
opacity: 0;
transform: translateY(10px);
}
.fade-enter-active {
opacity: 1;
transform: translateY(0);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.fade-exit {
opacity: 1;
transform: translateY(0);
}
.fade-exit-active {
opacity: 0;
transform: translateY(-10px);
transition: opacity 0.5s ease, transform 0.5s ease;
}
.server-runtime {
font-size: 18px;
color: rgba(255, 255, 255, 0.85);