Koha-community/Koha
13
7
Fork 0
Code Issues Releases Wiki Activity

Bug 30952: Fix color contrast so we are at least WCAG AA compliant

Browse source 
Issue #10

Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Nick Clemens <nick@bywatersolutions.com>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
This commit is contained in:
Julian Maurice 2022-09-28 09:22:44 +02:00 committed by Tomas Cohen Arazi
parent 6ea413ed75
commit 7ae2978dcb
Signed by: tomascohen
GPG key ID: 0A272EA1B2F3C15F
3 changed files with 35 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
koha-tmpl/intranet-tmpl/prog/css/src/_header.scss
View file

@ -44,9 +44,9 @@ a.navbar-toggle {
}
#header_search {
background-color: #418940;
background-color: $background-color-primary;
border-radius: 0;
border: 1px solid #418940;
border: 1px solid $background-color-primary;
display: flex;
padding: 0 .8em;
@ -69,7 +69,7 @@ a.navbar-toggle {
display: flex;
align-items: center;
color: white;
background-color: #418940;
background-color: $background-color-primary;
z-index: 2;
flex-grow: 1;
@ -105,7 +105,7 @@ a.navbar-toggle {
.form-title {
padding: 0 16px 0 0;
background-color: #418940;
background-color: $background-color-primary;
border-radius: 0 16px 16px 0;
display: flex;
align-items: center;
@ -153,7 +153,7 @@ a.navbar-toggle {
background-color: white;
padding: 1em;
border-radius: 0 0 8px 8px;
border: 1px solid #418940;
border: 1px solid $background-color-primary;
border-top: 0 none;
box-shadow: 0 2px 2px 1px #00000030;
z-index: 1;
@ -208,7 +208,7 @@ a.navbar-toggle {
#lastborrower-window {
display: none;
background-image: linear-gradient(to left, #418940, #71B443);
background-color: $background-color-primary;
box-shadow: 1px 1px 1px 0 #999;
color: #FFFFFF;
padding: .2em;

2
koha-tmpl/intranet-tmpl/prog/css/src/_variables.scss
View file

@ -1,5 +1,5 @@
$green-text-color: #006100;
$background-color-primary: #418940;
$background-color-primary: #408540;
// Copied from Bootstrap 5 without system-ui because of
// https://infinnie.github.io/blog/2017/systemui.html

58
koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
View file

@ -5,7 +5,7 @@
@import "fonts";
::selection {
background: #418940;
background: $background-color-primary;
color: #FFFFFF;
}
@ -64,7 +64,7 @@ a {
}
&.clear_date {
color: #418940;
color: $green-text-color;
font-size: 130%;
vertical-align: middle;
@ -95,14 +95,14 @@ a {
}
&:hover {
color: #418940;
color: $green-text-color;
text-decoration: none;
font-weight: bold;
i, img {
border-color: #418940;
border-color: $background-color-primary;
background-color: transparent;
color: #418940;
color: $green-text-color;
}
}
@ -403,8 +403,8 @@ aside {
&.active > a, a:hover, a.current {
background-color: #F3F4F4;
text-decoration: none;
color: #418940;
border-left: solid 5px #418940;
color: $green-text-color;
border-left: solid 5px $background-color-primary;
font-weight: bold;
}
}
@ -623,7 +623,7 @@ cite {
input,
textarea {
&:focus {
border-color: #418940;
border-color: $background-color-primary;
border-radius: 4px;
}
}
@ -1523,7 +1523,7 @@ i {
}
&.success {
color: #418940;
color: $green-text-color;
}
&.warn {
@ -1791,7 +1791,7 @@ i {
background-color: #FEC32C;
i {
&.fa {
color: #418940;
color: $green-text-color;
}
}
}
@ -2672,7 +2672,7 @@ td.bundle {
.ui-widget-content {
background: #FFFFFF none;
border-radius: 4px;
border: 3px solid #418940;
border: 3px solid $background-color-primary;
color: #222222;
}
@ -2786,7 +2786,7 @@ td.bundle {
.ui-tabs-panel {
background: #FFF none;
border-radius: 4px;
border: 3px solid #418940;
border: 3px solid $background-color-primary;
fieldset {
box-shadow: none;
@ -2800,17 +2800,15 @@ td.bundle {
border-radius: 4px 4px 0 0;
&.ui-tabs-active, &.ui-state-hover {
background-color: #418940;
background-color: $background-color-primary;
border-radius: 4px 4px 0 0;
border: 0;
border-bottom-width: 0;
padding-bottom: 0;
a {
color: #FFF;
color: #000;
}
}
}
}
@ -2833,11 +2831,11 @@ td.bundle {
.ui-state-hover {
a {
color: #418940;
color: $green-text-color;
&:link,
&:visited {
color: #418940;
color: $green-text-color;
}
}
}
@ -2948,7 +2946,7 @@ td.bundle {
font-weight: normal;
padding-bottom: 1px;
background-color: #418940;
background-color: $background-color-primary;
border: 0;
border-bottom-width: 0;
@ -2977,7 +2975,7 @@ td.bundle {
.tabs-container {
background: none repeat scroll 0 0 transparent;
border: 3px solid #418940;
border: 3px solid $background-color-primary;
border-radius: 4px;
color: #222222;
display: block;
@ -2990,7 +2988,7 @@ td.bundle {
.ui-tabs-panel {
background: #FFF none;
border-radius: 4px;
border: 3px solid #418940;
border: 3px solid $background-color-primary;
fieldset {
box-shadow: none;
@ -3162,7 +3160,7 @@ nav {
li {
display: inline;
color : #418940;
color : $green-text-color;
font-style: italic;
&+li::before {
@ -3548,7 +3546,7 @@ code {
.tab-content {
background-color: #fff;
border: 3px solid #418940;
border: 3px solid $background-color-primary;
border-radius: 4px;
padding: 1em;
}
@ -3557,15 +3555,15 @@ code {
> li {
> a {
background-color: #71B443;
color: #FFFFFF;
color: #111;
line-height: 1.42857143;
margin-right: .4em;
padding: .5em 1em;
&:hover, &:focus, &:active {
background-color: #418940;
background-color: $background-color-primary;
border-radius: 4px 4px 0 0;
border: 1px solid #418940;
border: 1px solid $background-color-primary;
padding: .5em 1em;
text-decoration: none;
color: #FFFFFF;
@ -3576,7 +3574,7 @@ code {
a,
a:hover,
a:focus {
background-color: #418940;
background-color: $background-color-primary;
border-radius: 4px 4px 0 0;
color: #FFFFFF;
cursor: default;
@ -3696,7 +3694,7 @@ progress {
#browse-return-to-results {
background-color: #e6e6e6;
border: 1px solid lighten(#418940, 30%);
border: 1px solid lighten($background-color-primary, 30%);
border-bottom-width: 0;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
@ -3707,7 +3705,7 @@ progress {
.browse-button {
background-color: transparent;
border: 1px solid lighten(#418940, 30%);
border: 1px solid lighten($background-color-primary, 30%);
display: block;
overflow: hidden;
padding: .4em .6em;
@ -4285,7 +4283,7 @@ input.renew {
font-weight: bold;
&:hover {
background-color: #418940;
background-color: $background-color-primary;
color: white;
text-decoration: none;
}