16650 button contrast issues (#16845)

* fixed #16650: button contrast issues

* fixed #16650: green bg text contrast issue

* Revert errant JS resource updates

* Revert custom button colors

* Fix indentation

---------

Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local>
Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com>
This commit is contained in:
Andrew Gormley 2024-07-16 19:29:40 +01:00 committed by GitHub
parent d3f0daefdb
commit e5691df666
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 0 deletions

Binary file not shown.

View File

@ -49,7 +49,13 @@ table th.orderable a {
@include color-mode(dark, true) {
--#{$prefix}alert-color: darken(var(--#{$prefix}warning),10%);
--#{$prefix}link-color: #{$bright-teal};
--#{$prefix}link-color-rgb: 0,242,212;
--#{$prefix}link-hover-color-rgb: 0,242,212;
--#{$prefix}secondary: #{$gray-400};
--#{$prefix}primary: #{$bright-teal};
--#{$prefix}primary-fg: #{$rich-black};
--#{$prefix}primary-rgb: 0,242,212;
--#{$prefix}btn-active-color: #{$rich-black};
}
}
@ -70,6 +76,22 @@ table th.orderable a {
color: $rich-black!important;
}
// Add button focus state
.btn:focus {
border: 1px solid var(--tblr-primary-fg);
outline: 2px solid var(--tblr-primary)!important;
}
// Fix secondary combo button contrast
.btn-outline-secondary {
&.active {
color: var(--tblr-primary-fg);
}
&:hover {
color: var(--tblr-primary-fg);
}
}
// Dark mode overrides
body[data-bs-theme=dark] {
@ -86,6 +108,9 @@ body[data-bs-theme=dark] {
table {
a {
color: $bright-teal;
&.dropdown-item {
color: inherit;
}
}
.badge a {
color: inherit;
@ -101,6 +126,9 @@ body[data-bs-theme=dark] {
// Adjusting text colors
.text- {
&bg-primary {
color: $rich-black!important;
}
&muted {
color: var(--#{$prefix}secondary-color) !important;
}