toggle-corp/react-store

.table-header {
    // border-top: var(--width-separator-thin) solid var(--color-separator);
    padding: var(--spacing-medium);
    overflow: hidden;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: none;

    &.sortable {
        .icon {
            margin-right: var(--spacing-small);
        }

        &:not(.disabled) {
            cursor: pointer;

            &.active {
                color: var(--color-accent);
            }

            &:hover {
                background-color: var(--color-background-hover);
            }
        }
    }

    &.disabled {
        color: var(--color-text-disabled);
    }
}