From 4465fa4e2dc9d19c5576e6e43c48f8e00b6c4aa4 Mon Sep 17 00:00:00 2001 From: Lev Date: Thu, 2 Nov 2023 09:47:13 -0700 Subject: [PATCH 1/3] Invalid forms style --- .../static/css/scss/abstracts/variables.scss | 3 +++ .../static/css/scss/components/_forms.scss | 13 +++++++++++++ 2 files changed, 16 insertions(+) diff --git a/pgml-dashboard/static/css/scss/abstracts/variables.scss b/pgml-dashboard/static/css/scss/abstracts/variables.scss index 41e35b75b..639545ceb 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: #{$peach-shade-100}; $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..3fd715509 100644 --- a/pgml-dashboard/static/css/scss/components/_forms.scss +++ b/pgml-dashboard/static/css/scss/components/_forms.scss @@ -257,6 +257,19 @@ caret-color: #{$input-color}; } +.form-control { + &.is-invalid { + &:focus { + box-shadow: none; + border-width: 2px; + } + } +} + +.invalid-feedback { + --bs-danger-text: #{$peach-shade-100}; +} + .hourly-rate { display: flex; flex-direction: row; From c25ad58e5bd4353566d7c02b0eb6537472c2fba0 Mon Sep 17 00:00:00 2001 From: Lev Date: Thu, 2 Nov 2023 12:29:13 -0700 Subject: [PATCH 2/3] fixes --- pgml-dashboard/static/css/scss/abstracts/variables.scss | 2 +- pgml-dashboard/static/css/scss/components/_forms.scss | 4 +++- pgml-dashboard/static/css/scss/layout/_utilities.scss | 6 ++++++ 3 files changed, 10 insertions(+), 2 deletions(-) diff --git a/pgml-dashboard/static/css/scss/abstracts/variables.scss b/pgml-dashboard/static/css/scss/abstracts/variables.scss index 639545ceb..5b770efa0 100644 --- a/pgml-dashboard/static/css/scss/abstracts/variables.scss +++ b/pgml-dashboard/static/css/scss/abstracts/variables.scss @@ -195,7 +195,7 @@ $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: #{$peach-shade-100}; +$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 3fd715509..42df4fe9e 100644 --- a/pgml-dashboard/static/css/scss/components/_forms.scss +++ b/pgml-dashboard/static/css/scss/components/_forms.scss @@ -263,11 +263,13 @@ box-shadow: none; border-width: 2px; } + + padding-right: 20px; } } .invalid-feedback { - --bs-danger-text: #{$peach-shade-100}; + --bs-danger-text: #{$error}; } .hourly-rate { 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; + } +} From 7e12cef8a92c1a593272f54181c6e2de58202fc5 Mon Sep 17 00:00:00 2001 From: Lev Date: Thu, 2 Nov 2023 12:30:45 -0700 Subject: [PATCH 3/3] use sass variable --- pgml-dashboard/static/css/scss/components/_forms.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pgml-dashboard/static/css/scss/components/_forms.scss b/pgml-dashboard/static/css/scss/components/_forms.scss index 42df4fe9e..04c5cb190 100644 --- a/pgml-dashboard/static/css/scss/components/_forms.scss +++ b/pgml-dashboard/static/css/scss/components/_forms.scss @@ -264,7 +264,7 @@ border-width: 2px; } - padding-right: 20px; + padding-right: #{$input-padding-x}; } }