Improve startup animation and traffic chart headroom
Build and Deploy Gateway / build-and-push (push) Successful in 13s
Build and Deploy Gateway / deploy (push) Successful in 7s

This commit is contained in:
2026-08-07 22:03:18 +03:00
parent fbf22e0b88
commit b2a2ed7104
6 changed files with 54 additions and 19 deletions
+17 -9
View File
@@ -365,19 +365,21 @@ p {
}
.client-shell.is-intro .harbor-brand-content {
animation: harbor-first-run 1200ms cubic-bezier(0.16, 1, 0.3, 1);
animation: harbor-startup-brand 1200ms cubic-bezier(0.16, 1, 0.3, 1);
}
.client-shell.is-intro .client-form {
animation: harbor-first-run-form 650ms 720ms cubic-bezier(0.16, 1, 0.3, 1) both;
.client-shell.is-intro .client-panel,
.client-shell.is-intro .client-secondary-menu,
.client-shell.is-intro .harbor-versions {
animation: harbor-startup-content 680ms 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes harbor-first-run {
from { transform: translateY(53px) scale(1.59); }
@keyframes harbor-startup-brand {
from { opacity: 0.72; filter: blur(5px); transform: translateY(53px); }
}
@keyframes harbor-first-run-form {
from { opacity: 0; filter: blur(8px); }
@keyframes harbor-startup-content {
from { opacity: 0; filter: blur(10px); }
}
.harbor-brand svg {
@@ -1406,11 +1408,11 @@ p {
}
.client-device-traffic-axis > .is-max {
top: 0;
top: var(--traffic-chart-top);
}
.client-device-traffic-axis > .is-mid {
top: 50%;
top: var(--traffic-chart-mid);
transform: translateY(-50%);
}
@@ -4985,6 +4987,12 @@ p {
animation: none;
}
.client-shell.is-intro .client-panel,
.client-shell.is-intro .client-secondary-menu,
.client-shell.is-intro .harbor-versions {
animation: none;
}
.harbor-mode-stack em,
.harbor-mode-gateway > span,
.harbor-mode-swap g,