@import "~bootstrap";
@import "~bootstrap-icons";

.notes {
    .note {
        position: relative;
        background: #eee;
        .content {
            font-size: 1rem;
            padding-right: 10%;
        }
        .time {
            font-size: .5rem;
            text-align: right;
        }
        .delete-wrapper {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            width: 10%;
            height: 100%;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            &:hover {
                display: flex;
            }
            .bg {
                background: red;
                opacity: .7;
                width: 100%;
                height: 100%;
            }
            .delete {
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
                color: white;
                font-weight: bold;
                font-size: 1.2rem;
            }
        }

    }
}