This repository has no description
Something went wrong. Try again.
786 B · 32 lines
CSS
at main
123456789101112131415161718192021222324252627282930313233.arrow-button { @apply transition;
--height: 3rem; --arrow-width: 1.5rem; --arrow-gap: 4.5rem;
--pad: calc(var(--height) / 2 + 0.5px);
position: relative; height: var(--height); padding-block: 0.5rem; padding-left: 0.75rem;
&::before { @apply absolute w-0 h-0 top-0 right-0 border-main-bg border-l-transparent; content: ""; filter: opacity(0.8); transition: border-width 0.2s;
--bg-transition: inherit; border-width: var(--pad) calc(var(--arrow-gap) * (1 - var(--bg-transition))) var(--pad) var(--arrow-width); }
&::after { @apply absolute w-0 h-0 top-0 right-0 border-main-bg border-l-transparent; content: ""; transition: border-width 0.2s; border-width: var(--pad) 0rem var(--pad) var(--arrow-width); }}