From bb5bec6d5cc5b8228bd68c763751f4b24a6696fb Mon Sep 17 00:00:00 2001 From: cameron Date: Wed, 7 Feb 2024 19:24:21 +0000 Subject: [PATCH] updating all colours --- projects/ngds-forms/assets/styles/styles.scss | 41 ++++++------------- 1 file changed, 13 insertions(+), 28 deletions(-) diff --git a/projects/ngds-forms/assets/styles/styles.scss b/projects/ngds-forms/assets/styles/styles.scss index 22e2e4d..ccb3467 100644 --- a/projects/ngds-forms/assets/styles/styles.scss +++ b/projects/ngds-forms/assets/styles/styles.scss @@ -1,5 +1,4 @@ $input-disabled-bg: #e9ecef; -$input-invalid-border-color: #dc3545; $input-border-color: #dee2e6; $dropdown-active-bg-color: #0d6efd; $dropdown-active-text-color: #fff; @@ -19,7 +18,7 @@ $active-invalid-outline: red; } .disabled-input { - background-color: $input-disabled-bg; + background-color: var(--bs-gray-200); } .calendar-cell{ @@ -32,13 +31,13 @@ $active-invalid-outline: red; background-color: transparent; border-radius: 2rem; &:hover { - background-color: $calendar-hover-bg-color; + background-color: var(--bs-gray-300); } &:focus { - background-color: $calendar-active-bg-color; + background-color: var(--bs-gray-400); } &.selected { - background-color: $calendar-active-bg-color; + background-color: var(--bs-gray-400); } } @@ -46,12 +45,12 @@ $active-invalid-outline: red; border: none; background-color: transparent; min-width: 44px; - color: $calendar-inactive-text-color; + color: var(--bs-gray-400); &.valid-date { cursor: pointer; color: black; &:hover { - background-color: $calendar-hover-bg-color !important; + background-color: var(--bs-gray-300) !important; &:not(.in-range){ border-radius: 2rem; } @@ -66,32 +65,18 @@ $active-invalid-outline: red; } &.selected{ font-weight: bold; - background-color: $calendar-active-bg-color !important; + background-color: var(--bs-gray-500) !important; &:hover { - background-color: $calendar-hover-bg-color !important; + background-color: var(--bs-gray-400) !important; } } &.in-range { - background-color: $calendar-in-range-hover-bg-color; + background-color: var(--bs-gray-200); font-weight: bold; } } } -.btn-inline { - height: 100%; - background-color: inherit; - - &:hover { - background-color: $input-disabled-bg; - transition: 0.2s linear; - } - - &:focus { - border: 2px solid $focus-outline-color; - } -} - .multiselect-input { &:focus { outline: none; @@ -113,7 +98,7 @@ $active-invalid-outline: red; position: relative; display: block; padding: 0.3rem 0.75rem; - background-color: $dropdown-bg-color; + background-color: var(--bs-white); } .focus-highlight { @@ -124,11 +109,11 @@ $active-invalid-outline: red; .default-list-group-item.active { z-index: 2; - background-color: $dropdown-hover-bg-color; + background-color: var(--bs-gray-200); &:active { - color: $dropdown-active-text-color; - background-color: $dropdown-active-bg-color; + color: var(--bs-light); + background-color: var(--bs-primary); } }