Merge pull request #2587 from Dawnkai/main

Deque Analysis Color Contrast fixes
This commit is contained in:
Tim Donohue
2024-01-16 16:01:50 -06:00
committed by GitHub
7 changed files with 179 additions and 37 deletions

View File

@@ -1,3 +1,9 @@
.close:focus {
.close {
opacity: 0.75;
&:focus {
outline: none !important;
}
}
button.close {
opacity: 0.6;
}

View File

@@ -5,7 +5,8 @@
}
.close {
outline: none !important
outline: none !important;
opacity: 0.8;
}
.notification-icon {

View File

@@ -37,4 +37,10 @@
margin: 0 calc(-1 * (var(--ds-slider-handle-width) / 2));
width: calc(100% + var(--ds-slider-handle-width));
}
.noUi-handle {
border-color: var(--ds-slider-handle-color);
&::before, &::after {
background-color: var(--ds-slider-handle-color);
}
}
}

View File

@@ -34,10 +34,9 @@ $green: #94BA65 !default;
$cyan: #006666 !default;
$yellow: #ec9433 !default;
$red: #CF4444 !default;
$teal: #1F7293 !default;
$dark: darken($blue, 17%) !default;
$theme-colors: (
primary: $blue,
secondary: $gray-700,
@@ -49,7 +48,7 @@ $theme-colors: (
dark: $dark
) !default;
/* Fonts */
$link-color: map-get($theme-colors, info) !default;
$link-color: $teal !default;
$navbar-dark-color: rgba(white, .5) !default;
$navbar-light-color: rgba(black, .5) !default;

View File

@@ -81,12 +81,13 @@
--ds-home-news-background-color: #{$gray-200};
--ds-breadcrumb-bg: #{$gray-200} !important;
--ds-breadcrumb-link-color: #{$cyan};
--ds-breadcrumb-link-color: #{darken($cyan, 10%)};
--ds-breadcrumb-link-active-color: #{darken($cyan, 30%)};
--ds-breadcrumb-max-length: 200px;
--ds-slider-color: #{$green};
--ds-slider-color: #{darken($green, 20%)};
--ds-slider-handle-width: 18px;
--ds-slider-handle-color: #{darken($blue, 17%)};
--ds-search-form-scope-max-width: 150px;

View File

@@ -232,7 +232,7 @@ ds-dynamic-form-control-container.d-none {
}
.badge-archived {
background-color: #{map-get($theme-colors, success)};
background-color: darken($green, 25);
}
.badge-workflow {
@@ -316,6 +316,135 @@ ul.dso-edit-menu-dropdown > li .nav-item.nav-link {
padding-bottom: 0.125rem !important;
}
.btn {
&:focus {
outline-offset: 2px !important;
outline-style: solid !important;
outline-width: 2px !important;
box-shadow: none !important;
}
&:disabled {
opacity: 0.7;
}
&.btn-success {
background-color: darken($success, 20%);
border-color: darken($success, 20%);
&:hover {
background-color: darken($success, 30%);
border-color: darken($success, 30%);
}
&:focus {
outline-color: darken($success, 20%);
}
}
&.btn-outline-success {
border-color: darken($success, 20%);
color: darken($success, 20%);
&:hover {
background-color: darken($success, 30%);
color: $white;
}
&:focus {
outline-color: darken($success, 20%);
}
}
&.btn-warning {
background-color: darken($warning, 20%);
&:hover {
background-color: darken($warning, 30%);
}
&:disabled {
background-color: transparent;
}
&:focus {
outline-color: darken($warning, 22%);
}
}
&.btn-outline-warning {
border-color: darken($warning, 20%);
color: darken($warning, 20%);
&:hover {
background-color: darken($warning, 30%);
color: $white;
}
&:disabled {
background-color: transparent;
&:hover {
color: darken($warning, 20%);
}
}
:focus {
outline-color: darken($warning, 22%);
}
&:not(:disabled):hover {
background-color: darken($warning, 22%);
}
}
&.btn-secondary {
&:focus {
outline-color: darken($secondary, 20%);
}
}
&.btn-danger:focus, &.btn-outline-danger:focus {
outline-color: darken($danger, 20%);
}
&.btn-primary:focus, &.btn-outline-primary:focus {
outline-color: darken($primary, 5%);
}
}
dynamic-ng-bootstrap-checkbox .custom-control-input:focus ~ .custom-control-label::before {
outline: 2px solid $gray-700 !important;
box-shadow: none !important;
outline-offset: 2px !important;
}
dynamic-ng-bootstrap-checkbox .custom-control-label::before {
border-color: $gray-700;
}
.text-warning {
color: darken($warning, 10%) !important;
}
.text-success {
color: darken($success, 11%) !important;
}
ngb-accordion {
a.close {
opacity: 0.75;
}
a.close:not(:disabled):not(.disabled):hover {
opacity: 0.9;
}
}
.form-control, .page-link {
&:disabled::placeholder {
color: lighten($gray-700, 10%);
}
&:focus {
box-shadow: none;
outline: 2px solid lighten($gray-700, 10%);
outline-offset: 2px !important;
}
}
.alert-success {
color: darken($success, 22%);
}
.alert-danger {
color: darken($danger, 22%);
}
// Margin utility classes based on DSpace content spacing
.mt-cs { margin-top: var(--ds-content-spacing); }
.mb-cs { margin-bottom: var(--ds-content-spacing); }

View File

@@ -12,7 +12,7 @@ $navbar-dark-color: #FFFFFF;
/* Reassign color vars to semantic color scheme */
$blue: #2b4e72 !default;
$green: #92C642 !default;
$cyan: #207698 !default;
$cyan: #1e6f90 !default;
$yellow: #ec9433 !default;
$red: #CF4444 !default;
$dark: #43515f !default;