angular-material-npfixed
Version:
The Angular Material project is an implementation of Material Design in Angular.js. This project provides a set of reusable, well-tested, and accessible Material Design UI components. Angular Material is supported internally at Google by the Angular.js, M
41 lines (38 loc) • 1.82 kB
HTML
<div ng-controller="DemoCtrl" ng-cloak >
<p>Display 5 font-icons, each with different sizes and colors</p>
<!-- Display font icons from Icomoon.io: -->
<div class="glyph" ng-repeat="font in fonts" layout="row">
<div ng-repeat="it in sizes" flex layout-align="center center" style="text-align: center;" layout="column">
<div flex></div>
<div class="preview-glyphs">
<md-icon md-font-icon="{{ font.name }}"
ng-style="{color: !font.theme && font.color, 'font-size': it.size + 'px', height: it.size + 'px'}"
ng-class="font.theme"
aria-label="{{ font.name + it.size }}"
class="step "></md-icon>
</div>
<div class="preview-scale">
<span class="step" style="padding-left:{{ it.padding }}px">{{ it.size }}px</span>
</div>
</div>
</div>
<!-- For this demo, include the font-faces needed by mdIcon above -->
<style>
@font-face {
font-family:"icomoon";
src:url("https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.eot");
font-weight:normal;
font-style:normal;
}
@font-face {
font-family: 'icomoon';
src:url('https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.eot?-cmq1um');
src:url('https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.eot?#iefix-cmq1um') format('embedded-opentype'),
url('https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.woff?-cmq1um') format('woff'),
url('https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.ttf?-cmq1um') format('truetype'),
url('https://cdn.rawgit.com/angular/material/master/docs/app/fonts/icomoon.svg?-cmq1um#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
</style>
</div>