Animate Harbor brand swap arrow and bump client versions
This commit is contained in:
@@ -529,35 +529,20 @@ p {
|
||||
stroke-width: 1.35;
|
||||
transform: translateY(-50%);
|
||||
transition: color 320ms ease, opacity 320ms ease, transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
|
||||
animation: harbor-mode-arrows-discovered 260ms 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
|
||||
}
|
||||
|
||||
.harbor-mode-swap .is-connect {
|
||||
animation: harbor-mode-arrow-right-discovered 300ms 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
|
||||
}
|
||||
|
||||
.harbor-mode-swap .is-gateway {
|
||||
animation: harbor-mode-arrow-left-discovered 300ms 420ms cubic-bezier(0.16, 1, 0.3, 1) both;
|
||||
}
|
||||
|
||||
@keyframes harbor-mode-arrow-right-discovered {
|
||||
@keyframes harbor-mode-arrows-discovered {
|
||||
from {
|
||||
opacity: 0;
|
||||
filter: blur(2px);
|
||||
transform: translateX(-12px);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes harbor-mode-arrow-left-discovered {
|
||||
from {
|
||||
opacity: 0;
|
||||
filter: blur(2px);
|
||||
transform: translateX(12px);
|
||||
}
|
||||
}
|
||||
|
||||
.harbor-mode-swap g {
|
||||
transform-box: view-box;
|
||||
transform-origin: 9px 9px;
|
||||
transform: rotate(var(--harbor-arrow-turn, 0turn));
|
||||
transition: opacity 420ms ease, filter 420ms ease, transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
|
||||
}
|
||||
|
||||
@@ -591,13 +576,11 @@ p {
|
||||
.harbor-brand.is-gateway-active .harbor-mode-swap .is-connect {
|
||||
opacity: 0.28;
|
||||
filter: blur(0.45px);
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.harbor-brand.is-gateway-active .harbor-mode-swap .is-gateway {
|
||||
opacity: 1;
|
||||
filter: none;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
|
||||
.harbor-mode-tooltip {
|
||||
|
||||
Reference in New Issue
Block a user