moved ionicons from vendor/ to scss/

Gruntfile.js

@@ -62,13 +62,6 @@ module.exports = function(grunt) {
         dest: 'dist/js/<%= pkg.name %>-angular.js'
       }
     },
-    copy: {
-      ionicons: {
-        files: [
-          { expand: true, src: ['vendor/ionicons/fonts/*'], dest: 'dist/fonts/', flatten: true}
-        ]
-      }
-    },
     jshint: {
       files: ['Gruntfile.js', 'js/**/*.js', 'test/**/*.js'],
       options: {

dist/css/ionic.css

@@ -1,4 +1,3 @@
-@charset "UTF-8";
 /**
  * Copyright 2013 Drifty Co.
  * http://drifty.com/
@@ -935,8 +934,12 @@ a.subdued {
   .bar-light .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-light .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-stable .button {
   color: #444444;
@@ -952,8 +955,12 @@ a.subdued {
   .bar-stable .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-stable .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-positive .button {
   color: white;
@@ -969,8 +976,12 @@ a.subdued {
   .bar-positive .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-positive .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-calm .button {
   color: white;
@@ -986,8 +997,12 @@ a.subdued {
   .bar-calm .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-calm .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-assertive .button {
   color: white;
@@ -1003,8 +1018,12 @@ a.subdued {
   .bar-assertive .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-assertive .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-balanced .button {
   color: white;
@@ -1020,8 +1039,12 @@ a.subdued {
   .bar-balanced .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-balanced .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-energized .button {
   color: white;
@@ -1037,8 +1060,12 @@ a.subdued {
   .bar-energized .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-energized .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-royal .button {
   color: white;
@@ -1054,8 +1081,12 @@ a.subdued {
   .bar-royal .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-royal .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-dark .button {
   color: white;
@@ -1071,8 +1102,12 @@ a.subdued {
   .bar-dark .button.button-clear {
     color: white;
     background: none;
+    border-color: transparent;
     box-shadow: none;
     font-size: 18px; }
+  .bar-dark .button.button-icon {
+    background: none;
+    border-color: transparent; }
 
 .bar-header {
   top: 0;
@@ -1370,9 +1405,6 @@ a.subdued {
   border-style: solid;
   font-size: 16px;
   -webkit-transition: margin-left 0.2s ease-in-out, margin-right 0.2s ease-in-out, left 0.2s ease-in-out; }
-  .item.active, .ionic-pseudo .item:active {
-    background-color: #d9d9d9;
-    border-color: #cccccc; }
   .item h2 {
     margin: 0 0 4px 0;
     font-size: 16px; }
@@ -1404,65 +1436,69 @@ a.subdued {
     color: #444444;
     background-color: white;
     border-color: #dddddd; }
-    .item.item-light.active, .ionic-pseudo .item.item-light:active {
-      background-color: #fafafa;
-      border-color: #cccccc; }
   .item.item-stable {
     color: #444444;
     background-color: #f8f8f8;
     border-color: #b2b2b2; }
-    .item.item-stable.active, .ionic-pseudo .item.item-stable:active {
-      background-color: #e5e5e5;
-      border-color: #a2a2a2; }
   .item.item-positive {
     color: white;
     background-color: #4a87ee;
     border-color: #145dd7; }
-    .item.item-positive.active, .ionic-pseudo .item.item-positive:active {
-      background-color: #145dd7;
-      border-color: #145dd7; }
   .item.item-calm {
     color: white;
     background-color: #43cee6;
     border-color: #1aaac3; }
-    .item.item-calm.active, .ionic-pseudo .item.item-calm:active {
-      background-color: #1aaac3;
-      border-color: #1aaac3; }
   .item.item-assertive {
     color: white;
     background-color: #ef4e3a;
     border-color: #cc2511; }
-    .item.item-assertive.active, .ionic-pseudo .item.item-assertive:active {
-      background-color: #cc2511;
-      border-color: #cc2511; }
   .item.item-balanced {
     color: white;
     background-color: #66cc33;
     border-color: #478f24; }
-    .item.item-balanced.active, .ionic-pseudo .item.item-balanced:active {
-      background-color: #478f24;
-      border-color: #478f24; }
   .item.item-energized {
     color: white;
     background-color: #f0b840;
     border-color: #d39511; }
-    .item.item-energized.active, .ionic-pseudo .item.item-energized:active {
-      background-color: #d39511;
-      border-color: #d39511; }
   .item.item-royal {
     color: white;
     background-color: #8a6de9;
     border-color: #552bdf; }
-    .item.item-royal.active, .ionic-pseudo .item.item-royal:active {
-      background-color: #552bdf;
-      border-color: #552bdf; }
   .item.item-dark {
     color: white;
     background-color: #444444;
     border-color: #111111; }
-    .item.item-dark.active, .ionic-pseudo .item.item-dark:active {
-      background-color: #262626;
-      border-color: black; }
+
+a.item.active, .ionic-pseudo a.item:active, button.item.active, .ionic-pseudo button.item:active {
+  background-color: #d9d9d9;
+  border-color: #cccccc; }
+a.item.item-light.active, .ionic-pseudo a.item.item-light:active, button.item.item-light.active, .ionic-pseudo button.item.item-light:active {
+  background-color: #fafafa;
+  border-color: #cccccc; }
+a.item.item-stable.active, .ionic-pseudo a.item.item-stable:active, button.item.item-stable.active, .ionic-pseudo button.item.item-stable:active {
+  background-color: #e5e5e5;
+  border-color: #a2a2a2; }
+a.item.item-positive.active, .ionic-pseudo a.item.item-positive:active, button.item.item-positive.active, .ionic-pseudo button.item.item-positive:active {
+  background-color: #145dd7;
+  border-color: #145dd7; }
+a.item.item-calm.active, .ionic-pseudo a.item.item-calm:active, button.item.item-calm.active, .ionic-pseudo button.item.item-calm:active {
+  background-color: #1aaac3;
+  border-color: #1aaac3; }
+a.item.item-assertive.active, .ionic-pseudo a.item.item-assertive:active, button.item.item-assertive.active, .ionic-pseudo button.item.item-assertive:active {
+  background-color: #cc2511;
+  border-color: #cc2511; }
+a.item.item-balanced.active, .ionic-pseudo a.item.item-balanced:active, button.item.item-balanced.active, .ionic-pseudo button.item.item-balanced:active {
+  background-color: #478f24;
+  border-color: #478f24; }
+a.item.item-energized.active, .ionic-pseudo a.item.item-energized:active, button.item.item-energized.active, .ionic-pseudo button.item.item-energized:active {
+  background-color: #d39511;
+  border-color: #d39511; }
+a.item.item-royal.active, .ionic-pseudo a.item.item-royal:active, button.item.item-royal.active, .ionic-pseudo button.item.item-royal:active {
+  background-color: #552bdf;
+  border-color: #552bdf; }
+a.item.item-dark.active, .ionic-pseudo a.item.item-dark:active, button.item.item-dark.active, .ionic-pseudo button.item.item-dark:active {
+  background-color: #262626;
+  border-color: black; }
 
 .item,
 .item h1,
@@ -2505,14 +2541,20 @@ input[type="checkbox"][readonly] {
  * --------------------------------------------------
  */
 input[type="range"] {
-  background-color: #cccccc;
   display: inline-block;
-  margin-top: 20px;
-  margin-bottom: 20px;
+  overflow: hidden;
+  margin-top: 5px;
+  margin-bottom: 5px;
+  padding-right: 2px;
+  padding-left: 1px;
   width: auto;
   height: 4px;
+  height: 35px;
   outline: none;
-  border-radius: 4px;
+  background: linear-gradient(to right, #cccccc 0%, #cccccc 100%);
+  background-position: center;
+  background-size: 96% 4px;
+  background-repeat: no-repeat;
   -webkit-appearance: none !important; }
   input[type="range"]::-webkit-slider-thumb {
     position: relative;
@@ -2520,9 +2562,18 @@ input[type="range"] {
     height: 20px;
     border-radius: 10px;
     background-color: white;
-    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 0 5px 6px rgba(0, 0, 0, 0.25);
+    box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 1px 3px 5px rgba(0, 0, 0, 0.25);
     cursor: pointer;
     -webkit-appearance: none !important; }
+  input[type="range"]::-webkit-slider-thumb:before {
+    /* what creates the colorful line on the left side of the slider */
+    position: absolute;
+    top: 8px;
+    left: -320px;
+    width: 320px;
+    height: 4px;
+    background: #444444;
+    content: ' '; }
   input[type="range"]::-webkit-slider-thumb:after {
     /* create a larger (but hidden) hit area */
     position: absolute;
@@ -2543,24 +2594,24 @@ input[type="range"] {
   -moz-align-items: center;
   align-items: center;
   padding: 2px 4px; }
-  .range.range-light input {
-    background-color: #dddddd; }
-  .range.range-stable input {
-    background-color: #b2b2b2; }
-  .range.range-positive input {
-    background-color: #4a87ee; }
-  .range.range-calm input {
-    background-color: #43cee6; }
-  .range.range-balanced input {
-    background-color: #66cc33; }
-  .range.range-assertive input {
-    background-color: #ef4e3a; }
-  .range.range-energized input {
-    background-color: #f0b840; }
-  .range.range-royal input {
-    background-color: #8a6de9; }
-  .range.range-dark input {
-    background-color: #444444; }
+  .range.range-light input::-webkit-slider-thumb:before {
+    background: #dddddd; }
+  .range.range-stable input::-webkit-slider-thumb:before {
+    background: #b2b2b2; }
+  .range.range-positive input::-webkit-slider-thumb:before {
+    background: #4a87ee; }
+  .range.range-calm input::-webkit-slider-thumb:before {
+    background: #43cee6; }
+  .range.range-balanced input::-webkit-slider-thumb:before {
+    background: #66cc33; }
+  .range.range-assertive input::-webkit-slider-thumb:before {
+    background: #ef4e3a; }
+  .range.range-energized input::-webkit-slider-thumb:before {
+    background: #f0b840; }
+  .range.range-royal input::-webkit-slider-thumb:before {
+    background: #8a6de9; }
+  .range.range-dark input::-webkit-slider-thumb:before {
+    background: #444444; }
 
 .range .icon {
   -webkit-box-flex: 0;
@@ -2570,9 +2621,9 @@ input[type="range"] {
   -ms-flex: 0 1 24px;
   flex: 0 1 24px;
   display: block;
-  font-size: 24px;
   min-width: 24px;
-  text-align: center; }
+  text-align: center;
+  font-size: 24px; }
 
 .range input {
   -webkit-box-flex: 0;
@@ -2582,10 +2633,10 @@ input[type="range"] {
   -ms-flex: 0 1 272px;
   flex: 0 1 272px;
   display: block;
-  margin-left: 10px;
   margin-right: 10px;
-  width: 100%;
-  max-width: 320px; }
+  margin-left: 10px;
+  max-width: 320px;
+  width: 100%; }
 
 /**
  * Buttons
@@ -2640,7 +2691,11 @@ input[type="range"] {
     .button.button-light.button-clear {
       color: #dddddd;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-light.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-light.button-outline {
       background: transparent;
       border-color: #dddddd;
@@ -2663,7 +2718,11 @@ input[type="range"] {
     .button.button-stable.button-clear {
       color: #b2b2b2;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-stable.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-stable.button-outline {
       background: transparent;
       border-color: #b2b2b2;
@@ -2686,7 +2745,11 @@ input[type="range"] {
     .button.button-positive.button-clear {
       color: #4a87ee;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-positive.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-positive.button-outline {
       background: transparent;
       border-color: #4a87ee;
@@ -2709,7 +2772,11 @@ input[type="range"] {
     .button.button-calm.button-clear {
       color: #43cee6;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-calm.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-calm.button-outline {
       background: transparent;
       border-color: #43cee6;
@@ -2732,7 +2799,11 @@ input[type="range"] {
     .button.button-assertive.button-clear {
       color: #ef4e3a;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-assertive.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-assertive.button-outline {
       background: transparent;
       border-color: #ef4e3a;
@@ -2755,7 +2826,11 @@ input[type="range"] {
     .button.button-balanced.button-clear {
       color: #66cc33;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-balanced.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-balanced.button-outline {
       background: transparent;
       border-color: #66cc33;
@@ -2778,7 +2853,11 @@ input[type="range"] {
     .button.button-energized.button-clear {
       color: #f0b840;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-energized.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-energized.button-outline {
       background: transparent;
       border-color: #f0b840;
@@ -2801,7 +2880,11 @@ input[type="range"] {
     .button.button-royal.button-clear {
       color: #8a6de9;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-royal.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-royal.button-outline {
       background: transparent;
       border-color: #8a6de9;
@@ -2824,7 +2907,11 @@ input[type="range"] {
     .button.button-dark.button-clear {
       color: #444444;
       background: none;
+      border-color: transparent;
       box-shadow: none; }
+    .button.button-dark.button-icon {
+      background: none;
+      border-color: transparent; }
     .button.button-dark.button-outline {
       background: transparent;
       border-color: #444444;
@@ -2859,7 +2946,7 @@ input[type="range"] {
   padding: 0 6px;
   min-width: initial;
   background: none;
-  border: none;
+  border-color: transparent;
   background: none; }
   .button-icon.button:active, .button-icon.button.active {
     background: none;
@@ -2873,13 +2960,17 @@ input[type="range"] {
   transition: opacity 0.1s;
   padding: 0 6px;
   max-height: 42px;
-  border: none;
+  border-color: transparent;
   background: none;
   box-shadow: none; }
   .button-clear.button-clear {
     color: #b2b2b2;
     background: none;
+    border-color: transparent;
     box-shadow: none; }
+  .button-clear.button-icon {
+    background: none;
+    border-color: transparent; }
   .button-clear:active, .button-clear.active {
     opacity: 0.3; }
 

scss/ionic.scss

@@ -57,4 +57,4 @@
   "platform",
 
   // Ionicons
-  "vendor/ionicons/scss/ionicons.scss"; 
+  "ionicons/ionicons.scss";