fix: checkbox & radio label alignment

kyndryl-design-system · Dec 19, 2024 · 91ba6c5 · 91ba6c5
1 parent 110170a
commit 91ba6c5
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 2 deletions.
diff --git a/src/components/reusable/checkbox/checkbox.scss b/src/components/reusable/checkbox/checkbox.scss
@@ -7,7 +7,6 @@
 
 label {
   display: inline-flex;
-  align-items: center;
   gap: 10px;
   width: 100%;
   position: relative;
@@ -32,6 +31,7 @@ input {
   justify-content: center;
   flex-shrink: 0;
   margin: 0;
+  margin-top: 4px;
   width: 16px;
   height: 16px;
   border: 2px solid var(--kd-color-border-ui);

diff --git a/src/components/reusable/radioButton/radioButton.scss b/src/components/reusable/radioButton/radioButton.scss
@@ -6,7 +6,6 @@
 
 label {
   display: inline-flex;
-  align-items: center;
   gap: 10px;
 
   &[disabled] {
@@ -27,6 +26,7 @@ input {
   align-items: center;
   justify-content: center;
   margin: 0;
+  margin-top: 2px;
   width: 18px;
   height: 18px;
   border: 2px solid var(--kd-color-border-ui);