fix(button): do not change border radius if round button in toolbar (#14941)

fixes #7661
This commit is contained in:
Brandy Carney
2018-07-30 15:59:33 -04:00
committed by GitHub
parent c05d672703
commit ad006dd1ee
5 changed files with 9 additions and 10 deletions

View File

@ -107,7 +107,7 @@
</ion-buttons>
<ion-title>Solid</ion-title>
<ion-buttons slot="primary">
<ion-button fill="solid" color="secondary">
<ion-button fill="solid" shape="round" color="secondary">
Help
<ion-icon name="help-circle" slot="end"></ion-icon>
</ion-button>
@ -126,7 +126,7 @@
</ion-buttons>
<ion-title>Solid Activated</ion-title>
<ion-buttons slot="primary">
<ion-button fill="solid" color="secondary" class="activated">
<ion-button fill="solid" shape="round" color="secondary" class="activated">
Help
<ion-icon name="help-circle" slot="end"></ion-icon>
</ion-button>

View File

@ -10,13 +10,16 @@
--pading-bottom: 0;
--padding-start: 5px;
--padding-end: 5px;
--border-radius: #{$toolbar-ios-button-border-radius};
--height: 32px;
font-size: #{$toolbar-ios-button-font-size};
font-weight: 400;
}
::slotted(*) .button:not(.button-round) {
--border-radius: #{$toolbar-ios-button-border-radius};
}
:host-context(.ion-color)::slotted(*) .button {
--ion-color-base: currentColor;
}

View File

@ -13,7 +13,6 @@
--padding-bottom: 0;
--padding-start: 8px;
--padding-end: 8px;
--border-radius: #{$toolbar-md-button-border-radius};
--height: 32px;
--box-shadow: none;
@ -21,6 +20,9 @@
font-weight: 500;
}
::slotted(*) .button:not(.button-round) {
--border-radius: #{$toolbar-md-button-border-radius};
}
// Material Design Toolbar Button Icon
// --------------------------------------------------

View File

@ -30,9 +30,6 @@ $toolbar-ios-button-background-color: $toolbar-ios-background-colo
/// @prop - Background color of the toolbar button when activated
$toolbar-ios-button-background-color-activated: $toolbar-ios-color-active !default;
/// @prop - Border radius of the toolbar button
$toolbar-ios-button-border-radius: 4px !default;
/// @prop - Font weight of the strong toolbar button
$toolbar-ios-button-strong-font-weight: 600 !default;

View File

@ -30,9 +30,6 @@ $toolbar-md-button-background-color: $toolbar-md-background-color !
/// @prop - Background color of the toolbar button when activated
$toolbar-md-button-background-color-activated: $toolbar-md-color-active !default;
/// @prop - Border radius of the toolbar button
$toolbar-md-button-border-radius: 2px !default;
/// @prop - Fill color of the toolbar button icon
$toolbar-md-button-icon-fill-color: currentColor !default;