Refine local rule delete animation and bump Harbor versions
All checks were successful
Build and Deploy Gateway / build-and-push (push) Successful in 16s
Build and Deploy Gateway / deploy (push) Successful in 7s

This commit is contained in:
2026-07-12 11:00:54 +03:00
parent d4897e5dcf
commit ba15a25c89
4 changed files with 10 additions and 40 deletions

View File

@@ -983,16 +983,6 @@ p {
height: 2px;
background: oklch(0.68 0.15 28);
clip-path: polygon(0 24%, 100% 50%, 0 76%);
filter: drop-shadow(0 0 3px oklch(0.68 0.15 28 / 0.38));
}
.client-delete-strike::before {
content: '';
position: absolute;
inset: 32% 0;
background: oklch(0.68 0.15 28 / 0.32);
clip-path: polygon(0 46%, 20% 8%, 100% 50%, 20% 92%, 0 54%);
filter: blur(3px);
}
.client-deletable-row.is-removing > .client-delete-strike {
@@ -1008,11 +998,6 @@ p {
animation: client-delete-content-dim 820ms ease-out both;
}
.client-deletable-row.is-removing > .client-local-rule-enabled {
z-index: 101;
color: oklch(0.68 0.15 28);
}
.client-local-rule-enabled {
width: 24px;
height: 32px;
@@ -1048,14 +1033,6 @@ p {
transition: opacity 160ms ease, stroke-dashoffset 360ms cubic-bezier(0.16, 1, 0.3, 1);
}
.client-rule-delete-cross {
stroke-width: 1.6;
opacity: 0;
transform: rotate(-35deg) scale(0.55);
transform-origin: center;
transition: opacity 160ms ease, transform 240ms cubic-bezier(0.16, 1, 0.3, 1);
}
.client-local-rule-enabled[aria-checked='true'] {
color: var(--client-accent);
}
@@ -1078,11 +1055,6 @@ p {
opacity: 0;
}
.client-deletable-row.is-removing .client-rule-delete-cross {
opacity: 1;
transform: rotate(0) scale(1);
filter: drop-shadow(0 0 3px oklch(0.68 0.15 28 / 0.55));
}
.client-rule-type {
position: relative;
@@ -1350,15 +1322,15 @@ p {
}
@keyframes client-delete-strike {
0% { opacity: 1; transform: scaleX(0); transform-origin: left center; }
42%, 52% { opacity: 1; transform: scaleX(1); transform-origin: left center; }
53% { opacity: 1; transform: scaleX(1); transform-origin: right center; }
0% { opacity: 0.58; transform: scaleX(0); transform-origin: left center; }
42%, 52% { opacity: 0.58; transform: scaleX(1); transform-origin: left center; }
53% { opacity: 0.58; transform: scaleX(1); transform-origin: right center; }
100% { opacity: 0; transform: scaleX(0); transform-origin: right center; }
}
@keyframes client-delete-content-dim {
0%, 42% { opacity: 0.58; filter: brightness(0.55) saturate(0.65) blur(0.7px); }
62%, 100% { opacity: 0.28; filter: brightness(0.42) saturate(0.5) blur(1.5px); }
0%, 52% { opacity: 0.58; filter: brightness(0.55) saturate(0.65) blur(1.4px); }
100% { opacity: 0; filter: brightness(0.42) saturate(0.5) blur(2.6px); }
}
@keyframes client-local-rules-notice {