m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Fix checkbox color when checked or indeterminate (#8552)

Browse Source 
The checkbox color was sometimes incorrect after it was checked. I'm
not sure how to consistently reproduce this issue, but I was able to
make this happen most of the time if I clicked the checkbox while some
text was highlighted.

It seems that the `:checked` and `:indeterminate` pseudo-selectors were
not being applied right away for some reason. Either that or React
wasn't setting the `checked` state of the `input` element right away.

This problem has been worked around by using CSS classes instead of
pseudo-selectors. I am no longer able to reproduce the issue now.
This commit is contained in:
Mark Stacey 2020-05-07 23:25:19 -03:00 committed by GitHub
parent 5e5215f907
commit 0688426b7c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
ui/app/components/ui/check-box/check-box.component.js
View File

@ -26,8 +26,8 @@ const CheckBox = ({ className, disabled, id, onClick, checked }) => {
checked={checked === CHECKBOX_STATE.CHECKED}
className={classnames('check-box', className, {
'far fa-square': checked === CHECKBOX_STATE.UNCHECKED,
'fa fa-check-square': checked === CHECKBOX_STATE.CHECKED,
'fa fa-minus-square': checked === CHECKBOX_STATE.INDETERMINATE,
'fa fa-check-square check-box__checked': checked === CHECKBOX_STATE.CHECKED,
'fa fa-minus-square check-box__indeterminate': checked === CHECKBOX_STATE.INDETERMINATE,
})}
disabled={disabled}
id={id}

2
ui/app/components/ui/check-box/index.scss
View File

@ -10,7 +10,7 @@
border-radius: 2px;
display: flex;
&:checked, &:indeterminate {
&__checked, &__indeterminate {
color: $curious-blue;
border-color: $curious-blue;
}