🚧 [#2245] Changed checkbox template and added multiple

maykinmedia · Mar 24, 2024 · e41eab2 · e41eab2
1 parent a7aca0b
commit e41eab2
Showing 1 changed file with 5 additions and 4 deletions.
diff --git a/src/open_inwoner/scss/components/Form/ChoiceList.scss b/src/open_inwoner/scss/components/Form/ChoiceList.scss
@@ -26,7 +26,7 @@
     margin: 0;
     padding: 0;
     background-color: var(--card-color-background);
-    border: var(--border-width-thin) solid var(--color-gray);
+    border: var(--border-width) solid var(--color-gray);
     border-radius: var(--border-radius);
     box-sizing: border-box;
     display: flex;
@@ -54,6 +54,7 @@
   /// Single selection radiobutton
 
   input[type='radio'] {
+    /// Display for accessibility
     appearance: none;
     opacity: 0;
     padding: 0;
@@ -69,13 +70,13 @@
     box-sizing: border-box;
     width: var(--font-line-height-body-small);
     height: var(--font-line-height-body-small);
-    border: 1px solid var(--color-gray-dark);
+    border: var(--border-width) solid var(--color-gray-dark);
     border-radius: 100%;
     background-color: var(--color-white);
   }
 
   &__item.selected {
-    border: 1px solid var(--color-accent-lighter);
+    border: var(--border-width-thin) solid var(--color-accent-lighter);
   }
 
   &__item.selected &__label:before {
@@ -197,7 +198,7 @@
 
   &-multiple__item.selected {
     // Parent styling
-    border: 1px solid var(--color-accent);
+    border: var(--border-width-thin) solid var(--color-accent);
     border-radius: var(--border-radius);
   }
 }