fix(button): update for ios spec (#26864)

BREAKING CHANGE:

Button is updated to align with the design specification for iOS.

**Design tokens**

| Token                              | Previous Value | New Value |
| ---------------------------------- | -------------- | --------- |
| `$button-ios-letter-spacing`       | `-0.03em`      | `0`       |
| `$button-ios-clear-letter-spacing` | `0`            | Removed   |
| `$button-ios-height`               | `2.8em`        | `3.1em`   |
| `$button-ios-border-radius`        | `10px`         | `14px`    |
| `$button-ios-large-height`         | `2.8em`        | `3.1em`   |
| `$button-ios-large-border-radius`  | `12px`         | `16px`    |

BREAKING.md

@@ -17,6 +17,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
   - [Accordion Group](#version-7x-accordion-group)
   - [Action Sheet](#version-7x-action-sheet)
   - [Back Button](#version-7x-back-button)
+  - [Button](#version-7x-button)
   - [Card Header](#version-7x-card-header)
   - [Checkbox](#version-7x-checkbox)
   - [Datetime](#version-7x-datetime)
@@ -88,6 +89,21 @@ This section details the desktop browser, JavaScript framework, and mobile platf
 | ---------- | -------------- | --------- |
 | `--height` | `100%`         | `auto`    |
 
+<h4 id="version-7x-button">Button</h4>
+
+- Button is updated to align with the design specification for iOS.
+
+**Design tokens**
+
+| Token                              | Previous Value | New Value |
+| ---------------------------------- | -------------- | --------- |
+| `$button-ios-letter-spacing`       | `-0.03em`      | `0`       |
+| `$button-ios-clear-letter-spacing` | `0`            | Removed   |
+| `$button-ios-height`               | `2.8em`        | `3.1em`   |
+| `$button-ios-border-radius`        | `10px`         | `14px`    |
+| `$button-ios-large-height`         | `2.8em`        | `3.1em`   |
+| `$button-ios-large-border-radius`  | `12px`         | `16px`    |
+
 <h4 id="version-7x-back-button">Back Button</h4>
 
 - Back Button is updated to align with the design specification for iOS.

core/src/components/button/button.ios.scss

@@ -78,8 +78,6 @@
 
   font-size: #{$button-ios-clear-font-size};
   font-weight: #{$button-ios-clear-font-weight};
-
-  letter-spacing: #{$button-ios-clear-letter-spacing};
 }
 
 

core/src/components/button/button.ios.vars.scss

@@ -28,10 +28,10 @@ $button-ios-padding-bottom:                           $button-ios-padding-top !d
 $button-ios-padding-start:                            $button-ios-padding-end !default;
 
 /// @prop - Height of the button
-$button-ios-height:                                   2.8em !default;
+$button-ios-height:                                   3.1em !default;
 
 /// @prop - Border radius of the button
-$button-ios-border-radius:                            10px !default;
+$button-ios-border-radius:                            14px !default;
 
 /// @prop - Font size of the button text
 $button-ios-font-size:                                16px !default;
@@ -39,9 +39,6 @@ $button-ios-font-size:                                16px !default;
 /// @prop - Font weight of the button text
 $button-ios-font-weight:                              500 !default;
 
-/// @prop - Letter spacing of the button text
-$button-ios-letter-spacing:                           -.03em !default;
-
 /// @prop - Background color of the button
 $button-ios-background-color:                         ion-color(primary, base) !default;
 
@@ -80,10 +77,10 @@ $button-ios-large-padding-bottom:                     $button-ios-large-padding-
 $button-ios-large-padding-start:                      $button-ios-large-padding-end !default;
 
 /// @prop - Height of the large button
-$button-ios-large-height:                             2.8em !default;
+$button-ios-large-height:                             3.1em !default;
 
 /// @prop - Border radius of the large button
-$button-ios-large-border-radius:                      12px !default;
+$button-ios-large-border-radius:                      16px !default;
 
 /// @prop - Font size of the large button
 $button-ios-large-font-size:                          20px !default;
@@ -159,8 +156,8 @@ $button-ios-clear-font-size:                          17px !default;
 /// @prop - Font weight of the clear button
 $button-ios-clear-font-weight:                        normal !default;
 
-/// @prop - Letter spacing of the clear button
+/// @prop - Letter spacing of the button
-$button-ios-clear-letter-spacing:                     0 !default;
+$button-ios-letter-spacing:                     0 !default;
 
 /// @prop - Border color of the clear button
 $button-ios-clear-border-color:                       transparent !default;