javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 11:41:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(button): apply round property to button sizes in iOS (#18125)

Browse Source 
fixes #18108
This commit is contained in:
Abdelaziz Bennouna
2019-04-25 16:32:23 +01:00
committed by Brandy Carney
parent 3cdab10aa0
commit ae0ecccd2e
2 changed files with 19 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
core/src/components/button/button.ios.scss
View File

@ -71,18 +71,6 @@
}
// iOS Round Button
// --------------------------------------------------
:host(.button-round) {
--border-radius: #{$button-ios-round-border-radius};
--padding-top: #{$button-ios-round-padding-top};
--padding-start: #{$button-ios-round-padding-start};
--padding-end: #{$button-ios-round-padding-end};
--padding-bottom: #{$button-ios-round-padding-bottom};
}
// iOS Button Sizes
// --------------------------------------------------
@ -111,6 +99,18 @@
}
// iOS Round Button
// --------------------------------------------------
:host(.button-round) {
--border-radius: #{$button-ios-round-border-radius};
--padding-top: #{$button-ios-round-padding-top};
--padding-start: #{$button-ios-round-padding-start};
--padding-end: #{$button-ios-round-padding-end};
--padding-bottom: #{$button-ios-round-padding-bottom};
}
// iOS strong Button
// --------------------------------------------------

7
core/src/components/button/test/standalone/index.html
View File

@ -24,6 +24,13 @@
<ion-button fill="clear" expand="block">Block Clear</ion-button>
</p>
<h3>Round button combinations</h3>
<p>
<ion-button shape="round" size="small">Round & Small</ion-button>
<ion-button shape="round" size="large">Round & Large</ion-button>
<ion-button shape="round" fill="outline">Round & Outline</ion-button>
</p>
<h3>Colors</h3>
<p>
<ion-button color="primary">Primary</ion-button>