remove <icon forward></icon>

This commit is contained in:
Adam Bradley
2015-09-18 15:55:18 -05:00
parent 4a58321beb
commit 00ebfaebfc
15 changed files with 39 additions and 51 deletions

View File

@ -38,27 +38,23 @@
<a ion-item href="#">
<icon wifi item-left></icon>
Card Link Item 1
<icon forward item-right></icon>
</a>
<a ion-item href="#">
<icon wine item-left></icon>
Card Link Item 2
<icon forward item-right></icon>
</a>
<button ion-item>
<icon warning item-left></icon>
Card Button Item 1
<icon forward item-right></icon>
</button>
<button ion-item>
<icon walk item-left></icon>
Card Button Item 2
<icon forward item-right></icon>
</button>
</ion-card>
</ion-content>
</ion-content>

View File

@ -83,11 +83,6 @@ ion-card {
font-size: 1.3rem;
}
icon[forward] {
font-size: 2rem;
color: $item-ios-forward-icon-color;
}
.card-title {
padding: $card-ios-title-padding;
font-size: $card-ios-title-font-size;

View File

@ -38,25 +38,21 @@
<a ion-item href="#">
<icon wifi item-left></icon>
Card Link Item 1
<icon forward item-right></icon>
</a>
<a ion-item href="#">
<icon wine item-left></icon>
Card Link Item 2
<icon forward item-right></icon>
</a>
<button ion-item>
<icon warning item-left></icon>
Card Button Item 1
<icon forward item-right></icon>
</button>
<button ion-item>
<icon walk item-left></icon>
Card Button Item 2
<icon forward item-right></icon>
</button>
</ion-card>

View File

@ -1,4 +1,8 @@
// Icon
// --------------------------------------------------
icon {
display: inline-block;
font-size: 1.2em;

View File

@ -53,10 +53,7 @@ export class Icon {
onInit() {
let ele = this.eleRef.nativeElement;
if (ele.hasAttribute('forward')) {
this.name = this.config.setting('forwardIcon');
} else if (this.mode == 'ios' && this.ios) {
if (this.mode == 'ios' && this.ios) {
this.name = this.ios;
} else if (this.mode == 'md' && this.md) {

View File

@ -0,0 +1,12 @@
// iOS Icon
// --------------------------------------------------
$icon-forward-ios-background-svg: "<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 20'><path d='M2,20l-2-2l8-8L0,2l2-2l10,10L2,20z' fill='fg-color'/></svg>" !default;
@mixin ios-icon-forward($fg-color) {
$svg: str-replace($icon-forward-ios-background-svg, 'fg-color', $fg-color);
@include svg-background-image($svg);
}

View File

@ -77,11 +77,10 @@
</code>
</ion-item>
<ion-item>
<ion-item forward-icon>
<code>
&lt;icon forward>&lt;/icon>
ion-item w/ [forward-icon] attr. text text text text text text
</code>
<icon forward item-right></icon>
</ion-item>
</ion-list>

View File

@ -122,11 +122,6 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
color: $item-ios-note-color;
}
icon[forward] {
font-size: 2rem;
color: $item-ios-forward-icon-color;
}
ion-avatar {
min-width: $item-ios-avatar-size;
@ -148,6 +143,19 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
}
.list,
.card {
button[ion-item]:not([no-forward-icon]),
a[ion-item]:not([no-forward-icon]),
[forward-icon] {
@include ios-icon-forward($item-ios-forward-icon-color);
background-repeat: no-repeat;
background-position: right ($item-ios-padding-right - 4) center;
background-size: 16px 16px;
padding-right: 32px;
}
}
&.hairlines .list .item {
margin-top: -0.5px;
@ -161,4 +169,3 @@ $item-ios-forward-icon-color: $item-ios-border-color !default;
border-top-width: 0.55px;
}
}

View File

@ -136,11 +136,6 @@ $item-md-forward-icon-color: $item-md-border-color !default;
margin-left: $item-md-padding-left + ($item-md-padding-left / 2);
}
icon[forward] {
font-size: 2rem;
color: $item-md-forward-icon-color;
}
ion-avatar {
min-width: $item-md-avatar-size;

View File

@ -4,22 +4,18 @@
<a ion-item href="#">
a[ion-item]
<icon forward item-right></icon>
</a>
<a ion-item class="activated" href="#">
a[ion-item].activated
<icon forward item-right></icon>
</a>
<button ion-item>
button[ion-item]
<icon forward item-right></icon>
</button>
<button ion-item class="activated">
button[ion-item].activated
<icon forward item-right></icon>
</button>
<ion-item>

View File

@ -2,19 +2,16 @@
<ion-list>
<ion-item>
ion-item forward icon
<icon forward item-right></icon>
<ion-item forward-icon>
ion-item [forward-icon] attr
</ion-item>
<a ion-item href="#">
a[ion-item] w/ forward icon
<icon forward item-right></icon>
</a>
<button ion-item>
button[ion-item] w/ forward icon
<icon forward item-right></icon>
</button>
<a ion-item href="#">
@ -37,9 +34,9 @@
button[ion-item] w/ left side icon
</button>
<button ion-item>
<button ion-item no-forward-icon>
<icon flag item-left></icon>
button[ion-item] w/ both side icons
button[ion-item][no-foward-icon]
<icon checkmark item-right></icon>
</button>

View File

@ -13,13 +13,11 @@
<a ion-item href="#">
<icon alarm item-left></icon>
List Link Item 1
<icon forward item-right></icon>
</a>
<a ion-item href="#">
<icon analytics item-left></icon>
List Link Item 2
<icon forward item-right></icon>
</a>
<ion-switch checked="true">
@ -33,13 +31,11 @@
<button ion-item>
<icon boat item-left></icon>
List Button Item 1
<icon forward item-right></icon>
</button>
<button ion-item>
<icon book item-left></icon>
List Button Item 2
<icon forward item-right></icon>
</button>
</ion-list>

View File

@ -13,7 +13,6 @@ IonicConfig.modeConfig('ios', {
backButtonText: 'Back',
backButtonIcon: 'ion-ios-arrow-back',
forwardIcon: 'ion-ios-arrow-forward',
iconMode: 'ios',
tabBarPlacement: 'bottom',
@ -33,7 +32,6 @@ IonicConfig.modeConfig('md', {
backButtonText: '',
backButtonIcon: 'ion-md-arrow-back',
forwardIcon: '',
iconMode: 'md',
tabBarPlacement: 'top',

View File

@ -3,6 +3,7 @@
// iOS Components
@import
"components/icon/modes/ios",
"components/item/modes/ios",
"components/toolbar/modes/ios",
"components/action-sheet/modes/ios",

View File

@ -105,8 +105,7 @@
// --------------------------------------------------
@function url-encode($val) {
$val: str-replace($val, ' ', '%20');
@return $val;
@return str-replace($val, ' ', '%20');
}