website: redesign part 33

2026-07-24 17:38:09 -07:00 · 2026-06-21 17:12:25 +02:00
parent 2e401379a0
commit b3031b3375
31 changed files with 818 additions and 417 deletions
@@ -0,0 +1,62 @@
+main.wallets {
+  .start {
+    .reset {
+      position: relative;
+      isolation: isolate;
+      justify-self: start;
+      overflow: hidden;
+      width: 100%;
+      border-color: transparent;
+      color: color-mix(in oklch, var(--gray) 76%, transparent);
+      background: transparent;
+      font-size: var(--font-size-sm);
+      --reset-progress: 0;
+      --reset-progress-width: 0%;
+
+      &::before,
+      &::after {
+        content: "";
+        position: absolute;
+        inset: 0;
+        opacity: 0;
+      }
+
+      &::before {
+        z-index: -1;
+        background: var(--red);
+        transform: scaleX(var(--reset-progress));
+        transform-origin: left;
+      }
+
+      &::after {
+        content: attr(data-label);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: inherit;
+        color: var(--black);
+        pointer-events: none;
+        white-space: nowrap;
+        clip-path: inset(0 calc(100% - var(--reset-progress-width)) 0 0);
+      }
+
+      span {
+        color: inherit;
+      }
+
+      &:is(:hover, :focus-visible, :active):not(.holding) {
+        color: var(--red);
+        background: transparent;
+      }
+
+      &.active {
+        color: var(--red);
+      }
+
+      &.active::before,
+      &.active::after {
+        opacity: 1;
+      }
+    }
+  }
+}