From 2388fe4dc6066a089b6f827526f15f3263fbc810 Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandy@ionic.io>
Date: Wed, 6 Dec 2017 14:26:00 -0500
Subject: [PATCH] style(sass): fix linter errors

---
 .../src/components/action-sheet/action-sheet.scss |  2 +-
 .../core/src/components/alert/alert.ios.vars.scss |  2 +-
 packages/core/src/components/app/app.ios.scss     |  2 +-
 packages/core/src/components/app/app.md.scss      |  2 +-
 .../core/src/components/avatar/avatar.ios.scss    |  2 +-
 .../core/src/components/avatar/avatar.md.scss     |  2 +-
 packages/core/src/components/button/button.scss   |  9 +++++----
 .../components/card-header/card-header.md.scss    |  2 +-
 .../card-subtitle/card-subtitle.ios.scss          |  2 +-
 .../card-subtitle/card-subtitle.ios.vars.scss     |  2 +-
 .../src/components/checkbox/checkbox.ios.scss     | 13 +++++++------
 .../core/src/components/checkbox/checkbox.md.scss | 13 +++++++------
 packages/core/src/components/chip/chip.scss       |  2 +-
 .../core/src/components/fab-list/fab-list.scss    |  2 +-
 .../core/src/components/grid/grid.mixins.scss     |  4 ++--
 packages/core/src/components/item/item.vars.scss  |  2 +-
 packages/core/src/components/menu/menu.ios.scss   |  2 +-
 .../core/src/components/menu/menu.ios.vars.scss   |  2 +-
 .../core/src/components/popover/popover.ios.scss  |  2 +-
 packages/core/src/components/radio/radio.ios.scss | 13 +++++++------
 packages/core/src/components/radio/radio.md.scss  | 15 ++++++++-------
 .../src/components/searchbar/searchbar.ios.scss   |  4 ++--
 packages/core/src/components/tabs/tabs.md.scss    |  1 +
 .../core/src/components/tabs/tabs.md.vars.scss    |  4 ++--
 .../src/components/thumbnail/thumbnail.ios.scss   |  2 +-
 .../src/components/thumbnail/thumbnail.md.scss    |  2 +-
 packages/core/src/components/toast/toast.ios.scss |  2 +-
 packages/core/src/components/toggle/toggle.scss   |  2 +-
 .../core/src/components/toolbar/toolbar.md.scss   |  2 +-
 packages/core/src/themes/ionic.mixins.scss        |  2 +-
 30 files changed, 62 insertions(+), 56 deletions(-)

diff --git a/packages/core/src/components/action-sheet/action-sheet.scss b/packages/core/src/components/action-sheet/action-sheet.scss
index c0922cc5df..264048221c 100644
--- a/packages/core/src/components/action-sheet/action-sheet.scss
+++ b/packages/core/src/components/action-sheet/action-sheet.scss
@@ -56,4 +56,4 @@ ion-action-sheet {
   overflow: hidden;
 
   flex-shrink: 0;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/alert/alert.ios.vars.scss b/packages/core/src/components/alert/alert.ios.vars.scss
index f262345cf9..a6c84dfc45 100644
--- a/packages/core/src/components/alert/alert.ios.vars.scss
+++ b/packages/core/src/components/alert/alert.ios.vars.scss
@@ -285,4 +285,4 @@ $alert-ios-translucent-filter:                  saturate(180%) blur(20px) !defau
 $alert-ios-translucent-opacity:                 .88 !default;
 
 /// @prop - Minimum height of the tappable inputs in the checkbox alert
-$alert-ios-tappable-min-height:                 $item-min-height !default;
\ No newline at end of file
+$alert-ios-tappable-min-height:                 $item-min-height !default;
diff --git a/packages/core/src/components/app/app.ios.scss b/packages/core/src/components/app/app.ios.scss
index cb2e59a955..1f9b0de9e7 100644
--- a/packages/core/src/components/app/app.ios.scss
+++ b/packages/core/src/components/app/app.ios.scss
@@ -15,7 +15,7 @@
   // TODO this can be simplified
   .ion-page,
   .ion-page > ion-header,
-  ion-tabs ion-tab ion-nav .ion-page > ion-header,
+  ion-tab ion-nav .ion-page > ion-header,
   ion-menu > .menu-inner,
   ion-menu > .menu-inner > ion-header {
     @include toolbar-statusbar-padding($toolbar-ios-height, $toolbar-ios-padding, $content-ios-padding, $app-ios-statusbar-padding);
diff --git a/packages/core/src/components/app/app.md.scss b/packages/core/src/components/app/app.md.scss
index 7c0fdbb02a..f05af076cf 100644
--- a/packages/core/src/components/app/app.md.scss
+++ b/packages/core/src/components/app/app.md.scss
@@ -15,7 +15,7 @@
   // TODO this can be simplified
   .ion-page,
   .ion-page > ion-header,
-  ion-tabs ion-tab ion-nav .ion-page > ion-header,
+  ion-tab ion-nav .ion-page > ion-header,
   ion-menu > .menu-inner,
   ion-menu > .menu-inner > ion-header {
     @include toolbar-statusbar-padding($toolbar-md-height, $toolbar-md-padding, $content-md-padding, $app-md-statusbar-padding);
diff --git a/packages/core/src/components/avatar/avatar.ios.scss b/packages/core/src/components/avatar/avatar.ios.scss
index 233ffb9b7b..5b3c5d2c1f 100644
--- a/packages/core/src/components/avatar/avatar.ios.scss
+++ b/packages/core/src/components/avatar/avatar.ios.scss
@@ -17,4 +17,4 @@
   @include border-radius($avatar-ios-border-radius);
 
   overflow: hidden;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/avatar/avatar.md.scss b/packages/core/src/components/avatar/avatar.md.scss
index 251c32ba0d..c5b0ce653e 100644
--- a/packages/core/src/components/avatar/avatar.md.scss
+++ b/packages/core/src/components/avatar/avatar.md.scss
@@ -17,4 +17,4 @@
   @include border-radius($avatar-md-border-radius);
 
   overflow: hidden;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/button/button.scss b/packages/core/src/components/button/button.scss
index bab13ecfd8..79de9eef54 100644
--- a/packages/core/src/components/button/button.scss
+++ b/packages/core/src/components/button/button.scss
@@ -13,10 +13,11 @@
 
   border: 0;
 
+  line-height: 1;
+
   text-decoration: none;
   text-overflow: ellipsis;
   text-transform: none;
-  line-height: 1;
 
   white-space: nowrap;
   cursor: pointer;
@@ -105,14 +106,14 @@ button[disabled],
 }
 
 .button ion-icon[slot="start"] {
-  margin: 0 0.3em 0 -0.3em;
+  @include margin(0, .3em, 0, -.3em);
 }
 
 .button ion-icon[slot="end"] {
-  margin: 0 -0.2em 0 0.3em;
+  @include margin(0, -.2em, 0, .3em);
 }
 
 .button ion-icon[slot="icon-only"] {
   width: 1.8em;
   height: 1.8em;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/card-header/card-header.md.scss b/packages/core/src/components/card-header/card-header.md.scss
index 291209936e..c37cb96e19 100644
--- a/packages/core/src/components/card-header/card-header.md.scss
+++ b/packages/core/src/components/card-header/card-header.md.scss
@@ -6,4 +6,4 @@
 
 .card-header-md {
   @include padding($card-md-header-padding-top, $card-md-header-padding-end, $card-md-header-padding-bottom, $card-md-header-padding-start);
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/card-subtitle/card-subtitle.ios.scss b/packages/core/src/components/card-subtitle/card-subtitle.ios.scss
index ee3e2657ea..6e8399bf48 100644
--- a/packages/core/src/components/card-subtitle/card-subtitle.ios.scss
+++ b/packages/core/src/components/card-subtitle/card-subtitle.ios.scss
@@ -37,4 +37,4 @@
     color: $color-base;
   }
 
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/card-subtitle/card-subtitle.ios.vars.scss b/packages/core/src/components/card-subtitle/card-subtitle.ios.vars.scss
index 88ff54c88d..cbe866e591 100644
--- a/packages/core/src/components/card-subtitle/card-subtitle.ios.vars.scss
+++ b/packages/core/src/components/card-subtitle/card-subtitle.ios.vars.scss
@@ -28,4 +28,4 @@ $card-ios-subtitle-padding-bottom:       $card-ios-subtitle-padding-top !default
 $card-ios-subtitle-padding-start:        $card-ios-subtitle-padding-end !default;
 
 /// @prop - Color of the card subtitle
-$card-ios-subtitle-color:                rgba(0, 0, 0, 0.4) !default;
+$card-ios-subtitle-color:                rgba(0, 0, 0, .4) !default;
diff --git a/packages/core/src/components/checkbox/checkbox.ios.scss b/packages/core/src/components/checkbox/checkbox.ios.scss
index 58d008b8c2..b148da67cd 100644
--- a/packages/core/src/components/checkbox/checkbox.ios.scss
+++ b/packages/core/src/components/checkbox/checkbox.ios.scss
@@ -66,20 +66,21 @@
 // -----------------------------------------
 
 .checkbox-key .checkbox-icon::after {
+  @include border-radius(50%);
+  @include position(-9px, null, null, -9px);
+
   position: absolute;
-  top: -9px;
-  left: -9px;
 
   display: block;
 
   width: 36px;
   height: 36px;
 
-  background: #86A8DF;
-  opacity: .3;
+  background: #86a8df;
 
-  border-radius: 50%;
-  content: '';
+  content: "";
+
+  opacity: .3;
 }
 
 
diff --git a/packages/core/src/components/checkbox/checkbox.md.scss b/packages/core/src/components/checkbox/checkbox.md.scss
index 858d0f6729..2e89d73d3a 100644
--- a/packages/core/src/components/checkbox/checkbox.md.scss
+++ b/packages/core/src/components/checkbox/checkbox.md.scss
@@ -70,20 +70,21 @@
 // -----------------------------------------
 
 .checkbox-key .checkbox-icon::after {
+  @include border-radius(50%);
+  @include position(-12px, null, null, -12px);
+
   position: absolute;
-  top: -12px;
-  left: -12px;
 
   display: block;
 
   width: 36px;
   height: 36px;
 
-  background: #86A8DF;
-  opacity: .3;
+  background: #86a8df;
 
-  border-radius: 50%;
-  content: '';
+  content: "";
+
+  opacity: .3;
 }
 
 
diff --git a/packages/core/src/components/chip/chip.scss b/packages/core/src/components/chip/chip.scss
index b5d699a8c9..0c7096895d 100644
--- a/packages/core/src/components/chip/chip.scss
+++ b/packages/core/src/components/chip/chip.scss
@@ -23,4 +23,4 @@ ion-chip ion-icon {
 
   font-size: $chip-icon-font-size;
   line-height: $chip-icon-line-height;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/fab-list/fab-list.scss b/packages/core/src/components/fab-list/fab-list.scss
index 4f8f7efd32..ee7e0baf29 100644
--- a/packages/core/src/components/fab-list/fab-list.scss
+++ b/packages/core/src/components/fab-list/fab-list.scss
@@ -1,4 +1,4 @@
-@import './fab-list.vars';
+@import "./fab-list.vars";
 
 // Floating Action Button List
 // --------------------------------------------------
diff --git a/packages/core/src/components/grid/grid.mixins.scss b/packages/core/src/components/grid/grid.mixins.scss
index 7d3be4a4c4..70974827c0 100644
--- a/packages/core/src/components/grid/grid.mixins.scss
+++ b/packages/core/src/components/grid/grid.mixins.scss
@@ -100,16 +100,16 @@
 // ---------------------------------------------------------------------------------
 
 @mixin make-column-base($padding-width: $grid-padding-width) {
+  @include margin(0);
   @include padding($padding-width / 2);
 
   position: relative;
 
   width: 100%;
-  @include margin(0);
-  min-height: 1px; // Prevent columns from collapsing when empty
   flex-basis: 0;
   flex-grow: 1;
   max-width: 100%;
+  min-height: 1px; // Prevent columns from collapsing when empty
 
   &[align-self-start] {
     align-self: flex-start;
diff --git a/packages/core/src/components/item/item.vars.scss b/packages/core/src/components/item/item.vars.scss
index ebccdc06d7..4852cee567 100644
--- a/packages/core/src/components/item/item.vars.scss
+++ b/packages/core/src/components/item/item.vars.scss
@@ -4,4 +4,4 @@
 // --------------------------------------------------
 
 /// @prop - Minimum height of the item
-$item-min-height:           44px !default;
\ No newline at end of file
+$item-min-height:           44px !default;
diff --git a/packages/core/src/components/menu/menu.ios.scss b/packages/core/src/components/menu/menu.ios.scss
index e02da274d3..19e627360c 100644
--- a/packages/core/src/components/menu/menu.ios.scss
+++ b/packages/core/src/components/menu/menu.ios.scss
@@ -32,4 +32,4 @@
 
 .app-ios .menu-type-push .show-backdrop {
   display: block;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/menu/menu.ios.vars.scss b/packages/core/src/components/menu/menu.ios.vars.scss
index 12bd79bf1b..6f194cdfb4 100644
--- a/packages/core/src/components/menu/menu.ios.vars.scss
+++ b/packages/core/src/components/menu/menu.ios.vars.scss
@@ -10,7 +10,7 @@ $menu-ios-background:            $background-ios-color !default;
 $menu-ios-box-shadow-color:      rgba(0, 0, 0, .08) !default;
 
 /// @prop - Box shadow of the menu
-$menu-ios-box-shadow:            -8px 0px 42px $menu-ios-box-shadow-color !default;
+$menu-ios-box-shadow:            -8px 0 42px $menu-ios-box-shadow-color !default;
 
 /// @prop - Box shadow of the reveal menu
 $menu-ios-box-shadow-reveal:     $menu-ios-box-shadow !default;
diff --git a/packages/core/src/components/popover/popover.ios.scss b/packages/core/src/components/popover/popover.ios.scss
index a060f5e8c4..237383112e 100644
--- a/packages/core/src/components/popover/popover.ios.scss
+++ b/packages/core/src/components/popover/popover.ios.scss
@@ -64,4 +64,4 @@
 
   -webkit-backdrop-filter: $popover-ios-translucent-filter;
   backdrop-filter: $popover-ios-translucent-filter;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/radio/radio.ios.scss b/packages/core/src/components/radio/radio.ios.scss
index a1ecc5d015..bb09bade06 100644
--- a/packages/core/src/components/radio/radio.ios.scss
+++ b/packages/core/src/components/radio/radio.ios.scss
@@ -51,20 +51,21 @@
 // -----------------------------------------
 
 .radio-key .radio-icon::after {
+  @include border-radius(50%);
+  @include position(-8px, null, null, -9px);
+
   position: absolute;
-  top: -8px;
-  left: -9px;
 
   display: block;
 
   width: 36px;
   height: 36px;
 
-  background: #86A8DF;
-  opacity: .3;
+  background: #86a8df;
 
-  border-radius: 50%;
-  content: '';
+  content: "";
+
+  opacity: .3;
 }
 
 
diff --git a/packages/core/src/components/radio/radio.md.scss b/packages/core/src/components/radio/radio.md.scss
index de75bd5a72..6953bd0fd2 100644
--- a/packages/core/src/components/radio/radio.md.scss
+++ b/packages/core/src/components/radio/radio.md.scss
@@ -72,21 +72,22 @@
 // Material Design Radio: Keyboard Focus
 // -----------------------------------------
 
-.radio-key .radio-icon::after  {
+.radio-key .radio-icon::after {
+  @include border-radius(50%);
+  @include position(-12px, null, null, -12px);
+
   position: absolute;
-  top: -12px;
-  left: -12px;
 
   display: block;
 
   width: 36px;
   height: 36px;
 
-  background: #86A8DF;
-  opacity: .3;
+  background: #86a8df;
 
-  border-radius: 50%;
-  content: '';
+  content: "";
+
+  opacity: .3;
 }
 
 
diff --git a/packages/core/src/components/searchbar/searchbar.ios.scss b/packages/core/src/components/searchbar/searchbar.ios.scss
index 895b186e6e..3b3e7742c6 100644
--- a/packages/core/src/components/searchbar/searchbar.ios.scss
+++ b/packages/core/src/components/searchbar/searchbar.ios.scss
@@ -25,9 +25,10 @@
 // -----------------------------------------
 
 .searchbar-ios .searchbar-search-icon {
-  @include position(0, null, null, 9px);
+  @include background-position(center);
   @include ios-searchbar-icon($searchbar-ios-input-search-icon-svg, $searchbar-ios-input-search-icon-color);
   @include margin-horizontal(calc(50% - 60px), null);
+  @include position(0, null, null, 9px);
 
   position: absolute;
 
@@ -36,7 +37,6 @@
 
   background-repeat: no-repeat;
   background-size: $searchbar-ios-input-search-icon-size;
-  background-position: center;
 }
 
 
diff --git a/packages/core/src/components/tabs/tabs.md.scss b/packages/core/src/components/tabs/tabs.md.scss
index 8741e9fecf..2bab615749 100644
--- a/packages/core/src/components/tabs/tabs.md.scss
+++ b/packages/core/src/components/tabs/tabs.md.scss
@@ -23,6 +23,7 @@
 
   // min-height: $tabs-md-tab-min-height;
   display: flex;
+
   max-width: 168px;
   // min-width: 80px;
   // Maximum: 168dp
diff --git a/packages/core/src/components/tabs/tabs.md.vars.scss b/packages/core/src/components/tabs/tabs.md.vars.scss
index 8a040503d8..c9a7ff1056 100644
--- a/packages/core/src/components/tabs/tabs.md.vars.scss
+++ b/packages/core/src/components/tabs/tabs.md.vars.scss
@@ -85,13 +85,13 @@ $tabs-md-tab-icon-right-transform-z-active:   0 !default;
 $tabs-md-tab-icon-bottom-transform-x-active:  0 !default;
 
 /// @prop - Transform y for the active tab button icon when the layout is icon-bottom
-$tabs-md-tab-icon-bottom-transform-y-active:  0.2rem !default;
+$tabs-md-tab-icon-bottom-transform-y-active:  .2rem !default;
 
 /// @prop - Transform z for the active tab button icon when the layout is icon-bottom
 $tabs-md-tab-icon-bottom-transform-z-active:  0 !default;
 
 /// @prop - Transform x for the active tab button icon when the layout is icon-left
-$tabs-md-tab-icon-left-transform-x-active:    -0.2rem !default;
+$tabs-md-tab-icon-left-transform-x-active:    -.2rem !default;
 
 /// @prop - Transform y for the active tab button icon when the layout is icon-left
 $tabs-md-tab-icon-left-transform-y-active:    0 !default;
diff --git a/packages/core/src/components/thumbnail/thumbnail.ios.scss b/packages/core/src/components/thumbnail/thumbnail.ios.scss
index 885200b277..2920f40a60 100644
--- a/packages/core/src/components/thumbnail/thumbnail.ios.scss
+++ b/packages/core/src/components/thumbnail/thumbnail.ios.scss
@@ -17,4 +17,4 @@
   @include border-radius($thumbnail-ios-border-radius);
 
   overflow: hidden;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/thumbnail/thumbnail.md.scss b/packages/core/src/components/thumbnail/thumbnail.md.scss
index aa36021795..aa92923437 100644
--- a/packages/core/src/components/thumbnail/thumbnail.md.scss
+++ b/packages/core/src/components/thumbnail/thumbnail.md.scss
@@ -16,4 +16,4 @@
   @include border-radius($thumbnail-md-border-radius);
 
   overflow: hidden;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/toast/toast.ios.scss b/packages/core/src/components/toast/toast.ios.scss
index da4f553bfb..b5099e3a9c 100644
--- a/packages/core/src/components/toast/toast.ios.scss
+++ b/packages/core/src/components/toast/toast.ios.scss
@@ -52,4 +52,4 @@
 
 .toast-ios .toast-button {
   color: $toast-ios-button-color;
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/components/toggle/toggle.scss b/packages/core/src/components/toggle/toggle.scss
index 1f239fa664..cd87213df5 100644
--- a/packages/core/src/components/toggle/toggle.scss
+++ b/packages/core/src/components/toggle/toggle.scss
@@ -60,5 +60,5 @@ ion-toggle input {
 }
 
 .toggle-key input {
-  border: 2px solid #5E9ED6;
+  border: 2px solid #5e9ed6;
 }
diff --git a/packages/core/src/components/toolbar/toolbar.md.scss b/packages/core/src/components/toolbar/toolbar.md.scss
index 1b0b14cf23..d458db735f 100644
--- a/packages/core/src/components/toolbar/toolbar.md.scss
+++ b/packages/core/src/components/toolbar/toolbar.md.scss
@@ -38,7 +38,7 @@
   width: 100%;
   height: 5px;
 
-  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==);
+  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAHBAMAAADzDtBxAAAAD1BMVEUAAAAAAAAAAAAAAAAAAABPDueNAAAABXRSTlMUCS0gBIh/TXEAAAAaSURBVAjXYxCEAgY4UIICBmMogMsgFLtAAQCNSwXZKOdPxgAAAABJRU5ErkJggg==");
   background-repeat: repeat-x;
 
   content: "";
diff --git a/packages/core/src/themes/ionic.mixins.scss b/packages/core/src/themes/ionic.mixins.scss
index d8fad6a1fa..6e7e95e282 100644
--- a/packages/core/src/themes/ionic.mixins.scss
+++ b/packages/core/src/themes/ionic.mixins.scss
@@ -672,7 +672,7 @@
 // ----------------------------------------------------------
 @mixin footer-safe-area($toolbar-height, $toolbar-padding, $tabs-height) {
   ion-tabs ion-tabbar:not(.placement-top) {
-    @include safe-area-padding(null, null, 0px, null);
+    @include safe-area-padding(null, null, 0, null);
     @include safe-area-sizing(height, safe-area-inset-bottom, $tabs-height)
   }