Improve startup animation and traffic chart headroom
This commit is contained in:
+17
-9
@@ -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,
|
||||
|
||||
Reference in New Issue
Block a user