A11Y: Improve contrast on the WCAG color schemes (#23692)
A11Y: Improve contrast on WCAG color palette --------- Co-authored-by: Penar Musaraj <pmusaraj@gmail.com>
This commit is contained in:
parent
a11869f8c5
commit
b860c6ec17
|
@ -7,6 +7,10 @@
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--bronze: #d38f42 !important;
|
||||||
|
}
|
||||||
|
|
||||||
html.discourse-no-touch {
|
html.discourse-no-touch {
|
||||||
.btn-default:not(.btn-flat, .btn-danger, .btn-primary),
|
.btn-default:not(.btn-flat, .btn-danger, .btn-primary),
|
||||||
.btn-icon:not(.btn-flat, .btn-danger, .btn-primary) {
|
.btn-icon:not(.btn-flat, .btn-danger, .btn-primary) {
|
||||||
|
@ -139,6 +143,14 @@ html {
|
||||||
box-shadow: 0 0 0 2px var(--tertiary);
|
box-shadow: 0 0 0 2px var(--tertiary);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.topic-list .topic-list-item-separator .topic-list-data span {
|
||||||
|
color: var(--danger);
|
||||||
|
}
|
||||||
|
|
||||||
|
.discourse-tag.box {
|
||||||
|
background: var(--primary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
// Posts
|
// Posts
|
||||||
|
|
||||||
.discourse-no-touch .topic-body .actions .fade-out {
|
.discourse-no-touch .topic-body .actions .fade-out {
|
||||||
|
@ -280,7 +292,66 @@ html {
|
||||||
color: var(--primary-medium);
|
color: var(--primary-medium);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Admin
|
.alert.alert-success a {
|
||||||
|
color: var(--primary);
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.latest-topic-list .table-heading,
|
||||||
|
.top-topic-list .table-heading {
|
||||||
|
color: var(--primary-medium);
|
||||||
|
}
|
||||||
|
|
||||||
|
.latest-topic-list-item .topic-last-activity a,
|
||||||
|
.category-list .featured-topic a.last-posted-at,
|
||||||
|
.category-list .featured-topic a.last-posted-at:visited {
|
||||||
|
color: var(--primary-high-or-secondary-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
.category-boxes .description {
|
||||||
|
color: var(--primary-med-or-secondary-med);
|
||||||
|
}
|
||||||
|
|
||||||
|
// User Preferences
|
||||||
|
.user-menu.revamped .quick-access-panel li.unread,
|
||||||
|
.user-menu.revamped .quick-access-panel li.pending {
|
||||||
|
background-color: var(--tertiary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-main .deleted-posts {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-main .flagged-posts {
|
||||||
|
color: dark-light-choose($primary, $secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.uploaded-image-preview
|
||||||
|
.image-upload-controls
|
||||||
|
.image-uploader-lightbox-btn
|
||||||
|
.d-icon {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.settings .setting .setting-value .uploaded-image-preview {
|
||||||
|
background-color: var(--primary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Notifications
|
||||||
|
|
||||||
|
.user-menu.revamped .tabs-list .btn .badge-notification {
|
||||||
|
background-color: dark-light-choose($tertiary-high, $tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-stream .notification.unread {
|
||||||
|
background-color: var(--tertiary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-stream .time {
|
||||||
|
color: var(--primary-very-high);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Admin Settings
|
||||||
|
|
||||||
.admin-controls {
|
.admin-controls {
|
||||||
.nav-pills > li > a:not(.active):hover {
|
.nav-pills > li > a:not(.active):hover {
|
||||||
|
@ -293,6 +364,59 @@ html {
|
||||||
.d-editor-preview mark {
|
.d-editor-preview mark {
|
||||||
background-color: yellow; // resets to browser default
|
background-color: yellow; // resets to browser default
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.settings .setting.overridden h3:before {
|
||||||
|
background-color: var(--tertiary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-controls .controls {
|
||||||
|
background: var(--primary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Dashboard
|
||||||
|
|
||||||
|
.user-metrics .table-cell.user-basic .label,
|
||||||
|
.user-metrics .table-cell.user-member .label,
|
||||||
|
.user-metrics .table-cell.user-leader .label {
|
||||||
|
color: dark-light-choose($primary, $secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-contents.admin-plugins td.version .commit-hash {
|
||||||
|
color: var(--primary-medium);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Search
|
||||||
|
|
||||||
|
.search-container
|
||||||
|
.search-filters
|
||||||
|
details.search-advanced-additional-options
|
||||||
|
> summary {
|
||||||
|
color: var(--highlight-high);
|
||||||
|
}
|
||||||
|
|
||||||
|
.chat-notices__notice,
|
||||||
|
.chat-notices .chat-retention-reminder {
|
||||||
|
background-color: var(--tertiary-very-low);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Review
|
||||||
|
|
||||||
|
.reviewable-item .reviewable-meta-data .created-at a {
|
||||||
|
color: var(--primary-medium);
|
||||||
|
}
|
||||||
|
|
||||||
|
.reviewable-item {
|
||||||
|
background: dark-light-choose($primary-very-low, $secondary-very-high);
|
||||||
|
}
|
||||||
|
|
||||||
|
.reviewable .status span.approved {
|
||||||
|
color: var(--success-hover);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Chat
|
||||||
|
.chat-channel .open-drawer-btn {
|
||||||
|
color: var(--primary-medium);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// chat
|
// chat
|
||||||
|
|
|
@ -113,7 +113,7 @@ class ColorScheme < ActiveRecord::Base
|
||||||
"primary-medium" => "696969",
|
"primary-medium" => "696969",
|
||||||
"primary-low-mid" => "909090",
|
"primary-low-mid" => "909090",
|
||||||
"secondary" => "ffffff",
|
"secondary" => "ffffff",
|
||||||
"tertiary" => "3369FF",
|
"tertiary" => "0033CC",
|
||||||
"quaternary" => "3369FF",
|
"quaternary" => "3369FF",
|
||||||
"header_background" => "ffffff",
|
"header_background" => "ffffff",
|
||||||
"header_primary" => "000000",
|
"header_primary" => "000000",
|
||||||
|
@ -139,8 +139,8 @@ class ColorScheme < ActiveRecord::Base
|
||||||
"highlight" => "3369FF",
|
"highlight" => "3369FF",
|
||||||
"selected" => "0d2569",
|
"selected" => "0d2569",
|
||||||
"hover" => "002382",
|
"hover" => "002382",
|
||||||
"danger" => "BB1122",
|
"danger" => "FF697A",
|
||||||
"success" => "3d854d",
|
"success" => "70B880",
|
||||||
"love" => "9D256B",
|
"love" => "9D256B",
|
||||||
},
|
},
|
||||||
# By @zenorocha
|
# By @zenorocha
|
||||||
|
|
Loading…
Reference in New Issue