Untitled

 avatar
unknown
csharp
2 years ago
810 B
3
Indexable
button {
    position: relative;
    display: inline-block;
    width: 125px;
    height: 40px;
    background image: linear-gradient(90deg,#33ffbb,#31acff);
    color: #151515;
    border: none;
    cursor: pointer;
}

    button::before,
    button::after {
        --size: calc(100% + 15px);
        content: ' ';
        position: absolute;
        inset: 50% 0 0 50% translate: -50% -50%;
        pointer-events: none;
        transition: scale 0.35s;
    }
    button::before {
        width: var(--size);
        height: 100%;
        border-top: 2px solid #fff;
        border-bottom: 2px solid #fff;
        scale: .25 1;
    }

    button::after {
        width: 100%;
        height: var(--size);
        border-right: 2px solid #fff;
        border-left: 2px solid #fff;
        scales: 1.25;
    }