diff --git a/docs/src/pages/components/RatingBar.vue b/docs/src/pages/components/RatingBar.vue index 8b55b2a..bc5475b 100644 --- a/docs/src/pages/components/RatingBar.vue +++ b/docs/src/pages/components/RatingBar.vue @@ -197,7 +197,7 @@
- +
This second example uses Ion Icons
@@ -209,11 +209,38 @@ <div>This first example uses <a href="http://fontawesome.io/icons/" target="fa_icons">Font Awesome Icons</a></div>
<md-rating-bar v-model="rating14" class="md-primary" :md-back-iconset="'fa fa-bell-o'" :md-front-iconset="'fa fa-bell'"></md-rating-bar>
<md-rating-bar v-model="rating14" class="md-warn" :md-size="2" :md-back-iconset="'fa fa-heart-o'" :md-front-iconset="'fa fa-heart'"></md-rating-bar>
+ <style type="text/css"><!-- offset fix to awesome icons-->
+ .fa {
+ font-size: 19px !important;
+ line-height: 1.3em !important;
+ padding-left: 0.1em;
+ }
+ .fa.md-size-2x {
+ font-size: 38px !important;
+ }
+
+ .fa.md-size-3x {
+ font-size: 57px !important;
+ }
+
+ .fa.md-size-4x {
+ font-size: 76px !important;
+ }
+
+ .fa.md-size-5x {
+ font-size: 95px !important;
+ }
+ </style>
<hr/>
- <link rel="stylesheet" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"/>
+ <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css"/>
<div>This second example uses <a href="http://ionicons.com/" target="ion_icons">Ion Icons</a></div>
<md-rating-bar v-model="rating14" class="md-primary" :md-back-iconset="'ion-ios-bell-outline'" :md-front-iconset="'ion-ios-bell'"></md-rating-bar>
- <md-rating-bar v-model="rating14" class="md-warn" :md-size="2" :md-back-iconset="'ion-android-favorite-outline'" :md-front-iconset="'ion-android-favorite'"></md-rating-bar> + <md-rating-bar v-model="rating14" class="md-warn" :md-size="2" :md-back-iconset="'ion-android-favorite-outline'" :md-front-iconset="'ion-android-favorite'"></md-rating-bar>
+ <style type="text/css"> <!-- offset fix to ion icons-->
+ i[class*="ion-"]{
+ padding-left: 0.1em;
+ }
+ </style> @@ -244,3 +271,29 @@ } }; + +