fix(radio-button): ensure change event is emitted when clicking input…

…-label gap (#2123)
telekom · Sep 13, 2023 · 5423cb8 · 5423cb8
1 parent 1b4a771
commit 5423cb8
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/components/src/components/radio-button/radio-button.css b/packages/components/src/components/radio-button/radio-button.css
@@ -40,12 +40,12 @@ scale-radio-button {
   --transition-label: var(--transition);
   --font-weight-label: var(--telekom-typography-font-weight-medium);
   --color-label: var(--color-text);
+  --spacing-label: var(--telekom-spacing-composition-space-04);
 
   /*control*/
   --width-control: var(--telekom-spacing-composition-space-07);
   --height-control: var(--telekom-spacing-composition-space-07);
   --transition-control: var(--transition);
-  --spacing-control: 0 var(--telekom-spacing-composition-space-04) 0 0;
   --background-color-control: var(--telekom-color-ui-base);
   --border-control: var(--telekom-spacing-composition-space-01) solid
     var(--telekom-color-ui-border-standard);
@@ -114,6 +114,7 @@ scale-icon-alert-error {
   font-weight: var(--font-weight-label);
   cursor: pointer;
   line-height: var(--telekom-typography-line-spacing-standard);
+  padding-left: var(--spacing-label);
 }
 .radio-button input {
   width: var(--width-control);
@@ -123,7 +124,7 @@ scale-icon-alert-error {
   -webkit-appearance: none;
   background-color: var(--telekom-color-ui-state-fill-standard);
   border: var(--border-control);
-  margin: var(--spacing-control);
+  margin: 0;
   cursor: pointer;
 }
 

diff --git a/...torybook-vue/stories/components/radio-button-group/RadioButtonGroup.stories.mdx b/...torybook-vue/stories/components/radio-button-group/RadioButtonGroup.stories.mdx
@@ -164,12 +164,12 @@ scale-radio-button {
   --transition-label: var(--transition);
   --font-weight-label: var(--telekom-typography-font-weight-medium);
   --color-label: var(--color-text);
+  --spacing-label: var(--telekom-spacing-composition-space-04);
 
   /*control*/
   --width-control: var(--telekom-spacing-composition-space-07);
   --height-control: var(--telekom-spacing-composition-space-07);
   --transition-control: var(--transition);
-  --spacing-control: 0 var(--telekom-spacing-composition-space-04) 0 0;
   --background-color-control: var(--telekom-color-ui-base);
   --border-control: var(--telekom-spacing-composition-space-01) solid
     var(--telekom-color-ui-border-standard);