diff --git a/packages/core/src/components/item/item.ios.scss b/packages/core/src/components/item/item.ios.scss index e47feca3b2..5e5788e7cd 100644 --- a/packages/core/src/components/item/item.ios.scss +++ b/packages/core/src/components/item/item.ios.scss @@ -91,8 +91,8 @@ @include margin($item-ios-slot-end-margin-top, $item-ios-slot-end-margin-end, $item-ios-slot-end-margin-bottom, $item-ios-slot-end-margin-start); } -.item-ios ion-icon[slot="start"], -.item-ios ion-icon[slot="end"] { +.item-ios > ion-icon[slot="start"], +.item-ios > ion-icon[slot="end"] { @include margin($item-ios-icon-slot-margin-top, $item-ios-icon-slot-margin-end, $item-ios-icon-slot-margin-bottom, $item-ios-icon-slot-margin-start); } @@ -105,7 +105,7 @@ // TODO iOS Item Button // -------------------------------------------------- -.item-ios .item-button { +.item-ios .button-small-ios { @include padding(0, .5em); height: 24px; @@ -113,7 +113,7 @@ font-size: 13px; } -.item-ios .item-button ion-icon[slot="icon-only"] { +.item-ios .button-small-ios ion-icon[slot="icon-only"] { @include padding(0, 1px); } diff --git a/packages/core/src/components/item/item.md.scss b/packages/core/src/components/item/item.md.scss index d4ae439e3b..b4ecde77d4 100644 --- a/packages/core/src/components/item/item.md.scss +++ b/packages/core/src/components/item/item.md.scss @@ -97,13 +97,13 @@ @include margin($item-md-slot-margin-top, $item-md-slot-margin-end, $item-md-slot-margin-bottom, $item-md-slot-margin-start); } -.item-md ion-icon[slot="start"], -.item-md ion-icon[slot="end"] { +.item-md > ion-icon[slot="start"], +.item-md > ion-icon[slot="end"] { @include margin($item-md-icon-slot-margin-top, $item-md-icon-slot-margin-end, $item-md-icon-slot-margin-bottom, $item-md-icon-slot-margin-start); } -.item-md ion-icon[slot="start"] + .item-inner, -.item-md ion-icon[slot="start"] + .item-input { +.item-md > ion-icon[slot="start"] + .item-inner, +.item-md > ion-icon[slot="start"] + .item-input { @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null); } @@ -126,7 +126,7 @@ // TODO Material Design Item Button // -------------------------------------------------- -.item-md .item-button { +.item-md .button-small-md { @include padding(0, .6em); height: 25px; @@ -134,7 +134,7 @@ font-size: 12px; } -.item-md .item-button ion-icon[slot="icon-only"] { +.item-md .button-small-md ion-icon[slot="icon-only"] { @include padding(0); } diff --git a/packages/core/src/components/item/item.scss b/packages/core/src/components/item/item.scss index c1ea3d4f7f..5e746816d2 100644 --- a/packages/core/src/components/item/item.scss +++ b/packages/core/src/components/item/item.scss @@ -101,3 +101,7 @@ ion-input.item { .item-inner > ion-icon { font-size: 1.6em; } + +.item .button { + @include margin(0); +} \ No newline at end of file diff --git a/packages/core/src/components/item/test/buttons/index.html b/packages/core/src/components/item/test/buttons/index.html index 03f89e02d3..a3c2c9ed07 100644 --- a/packages/core/src/components/item/test/buttons/index.html +++ b/packages/core/src/components/item/test/buttons/index.html @@ -17,36 +17,32 @@ - a[ion-item] + a[ion-item] - a[ion-item].activated + a[ion-item].activated - a[ion-item] secondary + a[ion-item] secondary - button[ion-item] tappable click listener - - - - button[ion-item] ONCLICK + button[ion-item] - button[ion-item].activated onClick + button[ion-item].activated - button[ion-item] danger onclick + button[ion-item] danger Default - Inner Buttons + Inner Buttons Outline @@ -55,7 +51,7 @@ Left Icon - disabled left icon buttons + disabled left icon buttons Left Icon @@ -67,7 +63,7 @@ Right Icon - right icon buttons + right icon buttons Right Icon @@ -78,14 +74,14 @@ - icon only buttons default + icon only buttons default - ion-item disabled right icon/text button large + ion-item disabled right icon/text button large Refresh @@ -97,20 +93,22 @@ Settings - ion-item left fill="clear" button small + ion-item left fill="clear" button small - ion-item right fill="clear" button + ion-item right fill="clear" button Edit - This is multiline text that has a - long description of about how the text is really long - and a link. + + This is multiline text that has a + long description of about how the text is really long + and a link. + View @@ -118,7 +116,7 @@ -

ng-for {{i}}

+

ng-for {{i}}

260k