toggle-corp/react-store

View on GitHub
v2/Input/NepaliDateInput/styles.scss

Summary

Maintainability
Test Coverage
.nepali-date-input {
    .input-container {
        display: flex;
        align-items: baseline;
        border-bottom: var(--width-separator-thin) solid var(--color-separator);

        .actions {
            flex-shrink: 0;
            padding: 0 var(--spacing-small);
            font-size: var(--font-size-large);

            .calendar-button {
                outline: none;
                padding: 0 var(--spacing-extra-small-alt);
            }

            .today-button {
                outline: none;
                padding: 0 var(--spacing-extra-small-alt);
            }

            .clear-button {
                outline: none;
                padding: 0 var(--spacing-extra-small-alt);
            }
        }
    }

    &:focus-within {
        .input-container {
            border-bottom-color: var(--color-accent);
        }

        .label {
            color: var(--color-accent);
        }
    }
}