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

ionicons demo wip

Browse Source
This commit is contained in:
Adam Bradley
2015-08-28 22:09:53 -05:00
parent be539bc5a0
commit 95bc7095c0
2 changed files with 54 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ionic/components/icon/icon.ts
View File

@ -38,13 +38,15 @@ export class Icon {
) { ) {
let ele = elementRef.nativeElement; let ele = elementRef.nativeElement;
this.mode = config.setting('mode'); this.mode = config.setting('iconMode');
this.iconLeft = this.iconRight = this.iconOnly = false; this.iconLeft = this.iconRight = this.iconOnly = false;
this.ariaHidden = true; this.ariaHidden = true;
this.isInactive = ele.hasAttribute('inactive');
this.iconAttr = null; this.iconAttr = null;
for (let i = 0, l = ele.attributes.length; i < l; i++) { for (let i = 0, l = ele.attributes.length; i < l; i++) {
if (ele.attributes[i].value === '') { if (ele.attributes[i].value === '' && /_|item-|inactive|class/.test(ele.attributes[i].name) !== true) {
this.iconAttr = ele.attributes[i].name; this.iconAttr = ele.attributes[i].name;
} }
} }

67
ionic/components/icon/test/basic/main.html
View File

@ -1,28 +1,61 @@
<ion-row> <ion-toolbar>
<ion-col> <ion-title>Icons</ion-title>
</ion-toolbar>
<icon ion-home></icon> <ion-content>
</ion-col> <ion-list>
<ion-col>
<icon name="ion-home"></icon> <ion-item>
<icon ion-home item-left></icon>
<code>
&lt;icon ion-home>&lt;/icon>
</code>
</ion-item>
</ion-col> <ion-item>
<ion-col> <icon inactive ion-home item-left></icon>
<code>
&lt;icon inactive ion-home>&lt;/icon>
</code>
</ion-item>
<icon [name]="homeIcon"></icon> <ion-item>
<icon name="ion-home" item-left></icon>
<code>
&lt;icon name="ion-home">&lt;/icon>
</code>
</ion-item>
</ion-col> <ion-item>
<ion-col> <icon [name]="homeIcon" item-left></icon>
<code>
&lt;icon [name]="homeIcon">&lt;/icon>
</code>
</ion-item>
<icon ios="ion-social-apple" md="ion-social-android"></icon> <ion-item>
<icon ios="ion-social-apple" md="ion-social-android" item-left></icon>
<code>
&lt;icon ios="ion-social-apple" md="ion-social-android">&lt;/icon>
</code>
</ion-item>
</ion-col> <ion-item>
<ion-col> <icon inactive ios="ion-social-apple" md="ion-social-android" item-left></icon>
<code>
&lt;icon inactive ios="ion-social-apple" md="ion-social-android">&lt;/icon>
</code>
</ion-item>
<icon ion-social-twitter></icon> </ion-list>
</ion-col> </ion-content>
</ion-row>
<style>
/*to ensure ng css encapsulation doesn't mess with icon attributes*/
code {
font-size: 0.8em;
}
</style>