diff --git a/pgml-dashboard/static/css/scss/abstracts/variables.scss b/pgml-dashboard/static/css/scss/abstracts/variables.scss index 41e35b75b..5b770efa0 100644 --- a/pgml-dashboard/static/css/scss/abstracts/variables.scss +++ b/pgml-dashboard/static/css/scss/abstracts/variables.scss @@ -193,6 +193,9 @@ $form-range-thumb-active-bg: #{$primary}; $form-range-thumb-bg: #{$primary}; $form-range-thumb-border: 4px solid #{$neon-tint-100}; $form-range-track-bg: #111213; +$form-feedback-icon-invalid: none; +$form-feedback-icon-valid: none; +$form-feedback-invalid-color: #{$error}; $input-box-shadow: none; $form-switch-checked-color: #{$gray-100}; diff --git a/pgml-dashboard/static/css/scss/components/_forms.scss b/pgml-dashboard/static/css/scss/components/_forms.scss index 14231ce0c..04c5cb190 100644 --- a/pgml-dashboard/static/css/scss/components/_forms.scss +++ b/pgml-dashboard/static/css/scss/components/_forms.scss @@ -257,6 +257,21 @@ caret-color: #{$input-color}; } +.form-control { + &.is-invalid { + &:focus { + box-shadow: none; + border-width: 2px; + } + + padding-right: #{$input-padding-x}; + } +} + +.invalid-feedback { + --bs-danger-text: #{$error}; +} + .hourly-rate { display: flex; flex-direction: row; diff --git a/pgml-dashboard/static/css/scss/layout/_utilities.scss b/pgml-dashboard/static/css/scss/layout/_utilities.scss index 18e9d8855..b3db65eee 100644 --- a/pgml-dashboard/static/css/scss/layout/_utilities.scss +++ b/pgml-dashboard/static/css/scss/layout/_utilities.scss @@ -97,3 +97,9 @@ .min-vw-0 { min-width: 0; } + +.min-vh-lg-100 { + @include media-breakpoint-up(lg) { + min-height: 100vh; + } +}