Merge pull request #15842 from resilient-tech/fix-checkbox-color

fix: primary color for checkbox and radio
This commit is contained in:
mergify[bot] 2022-02-02 15:08:28 +00:00 committed by GitHub
commit 7f5aa9d841
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 3 deletions

View file

@ -249,6 +249,7 @@
--checkbox-right-margin: var(--margin-xs);
--checkbox-size: 14px;
--checkbox-focus-shadow: 0 0 0 2px var(--gray-300);
--checkbox-gradient: linear-gradient(180deg, #4AC3F8 -124.51%, var(--primary) 100%);
--right-arrow-svg: url("data: image/svg+xml;utf8, <svg width='6' height='8' viewBox='0 0 6 8' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M1.25 7.5L4.75 4L1.25 0.5' stroke='%231F272E' stroke-linecap='round' stroke-linejoin='round'/></svg>");
--left-arrow-svg: url("data: image/svg+xml;utf8, <svg width='6' height='8' viewBox='0 0 6 8' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M7.5 9.5L4 6l3.5-3.5' stroke='%231F272E' stroke-linecap='round' stroke-linejoin='round'></path></svg>");

View file

@ -54,7 +54,7 @@ input[type="radio"] {
}
&:checked::before {
background-color: var(--blue-500);
background-color: var(--primary);
border-radius: 16px;
box-shadow: inset 0 0 0 2px white;
}
@ -85,8 +85,8 @@ input[type="checkbox"] {
}
&:checked {
background-color: var(--blue-500);
background-image: $check-icon, linear-gradient(180deg, #4AC3F8 -124.51%, #2490EF 100%);
background-color: var(--primary);
background-image: $check-icon, var(--checkbox-gradient);
background-size: 57%, 100%;
box-shadow: none;
border: none;