-
Notifications
You must be signed in to change notification settings - Fork 2.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
16648 dashboard contrast issues #16824
16648 dashboard contrast issues #16824
Conversation
@jeremystretch I've also re-implemented a change we took out of #16759 as I discovered it was not redundant and affected the color of table headers on dark mode. Please let me know if you prefer it to stay out of this PR. |
@@ -9,14 +9,14 @@ | |||
gs-id="{{ widget.id }}" | |||
> | |||
<div class="card grid-stack-item-content"> | |||
<div class="card-header text-{{ widget.fg_color }} bg-{{ widget.color|default:"secondary" }} px-2 py-1 d-flex flex-row"> | |||
<div class="card-header {% if widget.color and widget.color != 'gray' %} text-{{ widget.fg_color }} {% endif %} bg-{{ widget.color|default:'default' }} px-2 py-1 d-flex flex-row"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We want to avoid checking against specific values for maintainability reasons. It looks like the root issue might be related to #16385, which is being handled as a bug in the current release. If so, we can probably ignore this issue for now.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The foreground color is explicitly mapped to individual background colors; we can easily change these as needed.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I've removed the 'if gray' statement in order for a better fix with #16385. I've kept in the if statement to see if a color is assigned or not in order for the default header text color to change with the theme. Please let me know if there are any isues with this approach @jeremystretch
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks @andrewgormley!
* 16649 general contrast issues (#16759) * fixes #16647: navigation contrast issues updated * fixes #16651: table contrast issues new * fixed #16649: general contrast issues * fixes #16649: feedback changes --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.broadband> * 16648 dashboard contrast issues (#16824) * fixed #16648: dashboard contrast issues * reinstate amendment to 16649 * fixed #16648: created gridstack override and removed inline bug fix --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> * fixed #16853: accessibility issues * fixed #16847: updated font (#16848) * fixed #16847: updated font * fixed #16847: changed font to local and added current font as fallback * fixed #16847: removed inter and added padding to page header --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * 16849 document hierarchy issues (#16875) * fixed #16849: h elements not in sequential order * fixed #16849: Lists do not contain only li elements * fixed #16849: fixed h hierarchy on rack object pages * Remove standalone h5 classes * Remove unnecessary line breaks --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * 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> * 16907 web UI refresh (#16915) * closes #16907: web ui refresh * closes #16907: changed default widget color to primary color * closes #16907: removed comma * Revert dashboard widget color changes * Rename logo images for consistency * Restore original dashboard widget config * Remove .navbar-brand-autodark from logo * Restore logo file names --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * 16394 distinguish product edition (#16924) * closes #16907: web ui refresh * closes #16907: changed default widget color to primary color * closes #16907: removed comma * closes #16394: distinguish product edition * Revert dashboard changes * Clean up redundant styling (merge error) * removed labs logo and added sub text for all editions * fixed motif bug * Fix "flashing" of side nav under dark mode * Use title case for edition label * altered edition text style --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * Query release features to toggle commercial theme * fixes dark mode primary button contrast issue * fixes #16913: hidden admin nav link (#16978) Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * fixed 16852: misc accessbility problems (#16977) * fixed 16852: misc accessbility problems * Restore tooltip text * Add translation support * Add missing i18n --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * fixes issues in #16850 (#16986) * fixes issues in #16850: issue 3 and 5 * Add link text for 'clear' button on table column * Translate aria label --------- Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Jeremy Stretch <jstretch@netboxlabs.com> * Use alternate footer links for commercial releases * Remove Inter font * Adjust base font weight to 500 * Retain default text color for hyperlinks inside tables * Logo & edition cleanup * Move dashboard styling * Misc cleanup * Remove unused styles * Misc cleanup & refactoring --------- Co-authored-by: Andrew Gormley <andrewgormley91@gmail.com> Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.local> Co-authored-by: Andrew Gormley <Andrew@MacBook-Pro-3.broadband>
Fixes: #16648
I've changed default card header colors to be more in-line with the theme selected as per the design and increased the contrast. Some card header colors still score low on the WCAG scale due to the customizable colors we allow users to select, however in my opinion they are still legible, especially with the ability to select to preference.
The Netbox News sub text was fixed as secondary text color was changed globally on a prior PR.