css.sass to .sass

app/assets/stylesheets/supplier/foundation1/_qicons.sass

@@ -0,0 +1,66 @@
+@import font-awesome
+span.icon
+  @extend .fa
+  @extend .fa-lg
+  &.needs-help
+    @extend .fa-bell
+  &.needs-payment
+    @extend .fa-money
+.fa-stack
+  .revoke
+    color: #b94a48
+
+.button-icon
+  display: inline-block
+  width: 2em
+  height: 2em
+  line-height: 2em
+  vertical-align: middle
+  background-repeat: no-repeat
+  background-position: center center
+.mark-order-active .button-icon
+  background-image: image-url('supplier/order-check.png')
+.mark-order-delivered .button-icon
+  background-image: image-url('supplier/order-doublecheck.png')
+
+//.fa-shifted-stack
+  @extend .fa-stack
+//.fa-shifted-stack
+  position: relative
+  display: inline-block
+  width: 2.5em
+  height: 2em
+  //line-height: 2em
+  vertical-align: middle
+  .fa
+    position: absolute
+    width: 100%
+    left: 20%
+    &:first-child
+      left: -10%
+.fa-shifted-stack .fa-shifted:last-child
+  margin-left: -1.15rem
+button, .button
+  .fa-shifted-stack
+    .fa-shifted:last-child
+      margin-left: -0.85rem
+  .fa-stack.fa-stack-sized
+    width: auto
+    height: auto
+    line-height: 0 // For some reason this works on supplier dashboard for list
+    vertical-align: -15%
+    .fa-stack-small
+      font-size: 0.5em
+    .fa:last-child
+      margin-left: -1.35rem
+      vertical-align: -20%
+      &.fa-stack-small
+        margin-left: -1.35rem
+        vertical-align: 30%
+    .fa-stack-check:last-child
+      @extend .fa
+      @extend .fa-check
+      color: #ffd600
+      margin-left: -2rem
+      vertical-align: 0
+      text-shadow: 1px 4px 1px rgba(0, 0, 0, 0.45)