toggle-corp/react-store

.marker {
    // align-self: flex-start;
    border-radius: 50%;
    width: var(--width-marker-radius);
    height: var(--width-marker-radius);
}

.list-item {
    display: flex;
    align-items: baseline;
    padding: var(--spacing-extra-small) calc(var(--spacing-small) - var(--spacing-extra-small));

    .icons {
        flex-shrink: 0;
        padding: 0 var(--spacing-extra-small);
    }

    .label {
        flex-grow: 1;
        padding: 0 var(--spacing-extra-small);
    }

    .actions {
        display: flex;
        flex-shrink: 0;
        opacity: 0;
        padding: 0 var(--spacing-extra-small);
    }

    &:hover {
        background-color: var(--color-background-accent-hint);

        .actions {
            opacity: 1;
        }
    }
}