src/components/user-item/user-item.css

.swipe-top-button {
    text-decoration: none;
    /* letter-spacing: 2px; */
    text-align: center;
    position: relative;
    transition: all .35s;
    overflow: hidden;
}

.swipe-top-button span {
    position: relative;
    z-index: 2;
}

.swipe-top-button:after {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0;
    background: var(--ifm-color-primary);
    transition: all .35s;
}

.swipe-top-button:hover {
    color: #fff;
}

.swipe-top-button:hover:after {
    height: 100%;
}

li.user-story-card::after { background: var(--brand-primary-darker); }
li.user-story-card:focus-visible { outline: 2px solid var(--brand-ink); outline-offset: 3px; }
li.user-story-card:focus-within::after { height: 100%; transition: none; }
li.user-story-card:is(:hover, :focus-within) .user-story-card__details,
li.user-story-card:is(:hover, :focus-within) .user-story-card__details a { color: var(--brand-cream-light); }