Unverified Commit fe584346 authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3271305 by m4olivei, mherchel, rafuel92, yogeshmpawar, andy-blum,... 

Issue #3271305 by m4olivei, mherchel, rafuel92, yogeshmpawar, andy-blum, cindytwilliams: Claro's radio buttons and checkboxes are unusable in high-contrast / forced colors mode
parent bf76bf15

core/themes/claro/css/components/form--checkbox-radio.css

+8 −1
Original line number Diff line number Diff line
@@ -82,7 +82,6 @@ 
  border: 1px solid var(--input-border-color);

  border-radius: 2px;

  background: var(--input-bg-color) no-repeat 50% 50%;

  background-image: url("data:image/svg+xml,%3csvg width='12' height='10' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M4.182 6.966L1.977 4.649l-.182-.19-.18.19-.796.835-.164.173.164.172L4 9.172l.18.19.182-.19 6.818-7.164.164-.172-.164-.173-.795-.835-.181-.19-.182.19-5.841 6.138z' fill='%23FFF'/%3e%3c/svg%3e");

  background-size: 100% 100%;

  box-shadow: 0 0 0 4px transparent;

  -webkit-appearance: none;
@@ -90,6 +89,14 @@ 
  appearance: none;

}



@media (forced-colors: active) {

  .form-boolean {

    -webkit-appearance: auto;

    -moz-appearance: auto;

    appearance: auto;

  }

}



.form-boolean--type-radio {

  width: 1.1875rem;

  height: 1.1875rem;

core/themes/claro/css/components/form--checkbox-radio.pcss.css

+7 −1
Original line number Diff line number Diff line
@@ -67,11 +67,17 @@ 
  border: 1px solid var(--input-border-color);

  border-radius: 2px;

  background: var(--input-bg-color) no-repeat 50% 50%;

  background-image: url(../../images/icons/ffffff/checkmark.svg);

  background-size: 100% 100%;

  box-shadow: 0 0 0 4px transparent;

  appearance: none;

}



@media (forced-colors: active) {

  .form-boolean {

    appearance: auto;

  }

}



.form-boolean--type-radio {

  width: 19px;

  height: 19px;