gitea
/
Koha-clms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bug 30190: Green buttons turn blue for a second when clicking them 

This patch adds additional CSS to better cover various states of buttons
in the OPAC.

To test, apply the patch and rebuild the OPAC CSS:
https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client

- In the OPAC, test various green buttons in varous states: default,
  hover, and active (the appearance when the button is clicked but
  before the mouse button is released).
- The button should be styled in various shades of green in all cases.
- Test a disabled button by performing a catalog search.
- On the results page, before any checkboxes are checked, the "Save"
  button should look correct.

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
This commit is contained in:
Owen Leonard 2022-03-02 14:23:36 +00:00 committed by Fridolin Somers
parent 849561896f
commit 7ffd3e4015
2 changed files with 38 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
koha-tmpl/opac-tmpl/bootstrap/css/src/_common.scss
View File

@ -203,6 +203,44 @@ caption {
&:focus {
box-shadow: 0 0 0 2px lighten($base-theme-color, 10%);
}
&.disabled,
&:disabled {
background-color: lighten($base-theme-color, 5%);
border-color: lighten($base-theme-color, 5%);
box-shadow: none;
color: #fff;
cursor: not-allowed;
&:hover,
&.hover {
background-color: lighten($base-theme-color, 5%);
border-color: lighten($base-theme-color, 5%);
box-shadow: none;
color: #fff;
cursor: not-allowed;
}
}
&:not(:disabled):not(.disabled):active:focus,&
&:not(:disabled):not(.disabled).active:focus {
box-shadow: 0 0 0 0.2rem lighten($base-theme-color, 10%);
}
&:not(:disabled):not(.disabled).active,
&:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled):focus,
&:not(:disabled):not(.disabled).focus {
background-color: lighten($base-theme-color, 5%);
border-color: lighten($base-theme-color, 10%);
}
}
.show > .btn-primary.dropdown-toggle {
background-color: lighten($base-theme-color, 5%);
border-color: lighten($base-theme-color, 10%);
&:focus {
box-shadow: 0 0 0 0.2rem lighten($base-theme-color, 10%);
}
}
.btn-danger {
@ -948,15 +986,11 @@ button {
.btn.disabled,
.btn[disabled] {
&:hover {
color: #333;
filter: alpha(opacity=65);
opacity: 0.65;
}
i {
&.fa,
&.fa:hover {
color: #333;
filter: alpha(opacity=65);
opacity: 0.65;
}
}

2
koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
View File

@ -500,14 +500,12 @@ th {
&.disabled,
&[disabled] {
color: #333;
filter: alpha(opacity=65);
opacity: 0.65;
&:hover {
i {
&.fa {
color: #333;
filter: alpha(opacity=65);
opacity: 0.65;
}
}