dokril/harbor-net
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

Refine client delete animation and local rule button styling
All checks were successful
Build and Deploy Gateway / build-and-push (push) Successful in 14s
Details
Build and Deploy Gateway / deploy (push) Successful in 7s
Details

Browse Source
This commit is contained in:
Dmitriy Petrov
2026-07-12 00:21:21 +03:00
parent 4ed25301db
commit d6ba05ac7d
4 changed files with 17 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/web/styles.css
View File

@@ -967,7 +967,7 @@ p {
bottom: 0;
left: 12px;
z-index: 100;
background: linear-gradient(90deg, oklch(0.68 0.15 28 / 0.3), oklch(0.68 0.15 28 / 0.12) 48%, transparent);
background: transparent;
opacity: 0;
pointer-events: none;
transform: scaleX(0);
@@ -979,11 +979,11 @@ p {
position: absolute;
left: 0;
right: 0;
top: calc(var(--client-delete-strike-y) - 2px);
height: 4px;
top: calc(var(--client-delete-strike-y) - 1px);
height: 2px;
background: oklch(0.68 0.15 28);
clip-path: polygon(0 8%, 100% 50%, 0 92%);
filter: drop-shadow(0 0 2px oklch(0.68 0.15 28 / 0.5));
clip-path: polygon(0 24%, 100% 50%, 0 76%);
filter: drop-shadow(0 0 3px oklch(0.68 0.15 28 / 0.38));
}
.client-deletable-row.is-removing > .client-delete-strike {
@@ -1205,7 +1205,7 @@ p {
text-shadow: 0 0 9px color-mix(in oklch, var(--client-accent) 22%, transparent);
}
.client-local-rule > button:last-child {
.client-local-rule-delete {
width: 28px;
height: 32px;
padding: 0;
@@ -1217,7 +1217,7 @@ p {
transition: color 180ms ease, filter 260ms ease, transform 300ms cubic-bezier(0.16, 1, 0.3, 1);
}
.client-local-rule > button:last-child:hover {
.client-local-rule-delete:hover {
color: oklch(0.68 0.15 28);
filter: drop-shadow(0 0 7px oklch(0.68 0.15 28 / 0.42));
transform: rotate(8deg) scale(1.1);
@@ -1225,7 +1225,7 @@ p {
.client-local-rule-enabled:focus-visible,
.client-rule-type-trigger:focus-visible,
.client-local-rule > button:last-child:focus-visible,
.client-local-rule-delete:focus-visible,
.client-local-rule-add:focus-visible,
.client-local-rules-save:focus-visible,
.client-local-rules-actions button:focus-visible {
@@ -2996,7 +2996,7 @@ p {
grid-row: 1;
}
.client-local-rule > button:last-child {
.client-local-rule-delete {
grid-column: 3;
grid-row: 1;
}
@@ -3080,7 +3080,7 @@ p {
.client-rule-type-list,
.client-rule-type-list button,
.client-local-rule input,
.client-local-rule > button:last-child,
.client-local-rule-delete,
.client-local-rule-add,
.client-local-rule-add-slot > span,
.client-local-rules-save,