ds4/scss/components/shared/_rollable_image.scss

/*
 * SPDX-FileCopyrightText: 2021 Johannes Loher
 *
 * SPDX-License-Identifier: MIT
 */

.ds4-rollable-image {
    position: relative;

    &--rollable {
        cursor: pointer;

        &:hover {
            .ds4-rollable-image__image {
                opacity: 0.25;
            }

            .ds4-rollable-image__overlay {
                opacity: 1;
            }
        }
    }

    &__image {
        border: none;
        transition: 0.1s ease;
    }

    &__overlay {
        border: none;
        bottom: 0;
        left: 0;
        opacity: 0;
        position: absolute;
        right: 0;
        top: 0;
        transition: 0.1s ease;
    }
}