svthalia/concrexit

View on GitHub
website/thaliawebsite/static/css/_forms.scss

Summary

Maintainability
Test Coverage
// Variables
$form-element-height: 50px;

.form-control, .form-select {
    color: var(--form-text);
    background-color: var(--form-background);
    font-weight: $regular;
    font-size: 14px;
    font-family: $primary-font;
    letter-spacing: $letter-spacing;
    border: 2px solid var(--form-border);
    border-radius: 0;
    padding: 3px 10px;
    min-height: $form-element-height;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    align-items: center;
    display: flex;

    &:focus {
        border-color: var(--primary);
        box-shadow: none;
        color: var(--form-text);
        background-color: var(--form-background);
    }
}

select, input[type="file"] {
    height: $form-element-height;
}

.form-control::file-selector-button {
    height: $form-element-height;
}