Sass lint: fix various unsorted properties

diff --git a/.sass-lint.yml b/.sass-lint.yml
index 99d69ef0da65ebb9d1909729a6002f43c4602271..d60f1b4e43964a3fb317fd39567717d298251285 100644 (file)
--- a/.sass-lint.yml
+++ b/.sass-lint.yml
@@ -269,12 +269,13 @@ rules:
 
         # Background
         - 'background'
+        - 'background-image'
+        - 'background-color'
         - 'background-attachment'
         - 'background-clip'
-        - 'background-color'
-        - 'background-image'
-        - 'background-repeat'
+        - 'background-origin'
         - 'background-position'
+        - 'background-repeat'
         - 'background-size'
 
         # Shadow

diff --git a/scss/components/_accordion-menu.scss b/scss/components/_accordion-menu.scss
index eb02e7bd25700dc3915340220b70d34dece2b6c7..7719c0c2e4ab3f47d7ae10df7ec0c5025b7d9d9f 100644 (file)
--- a/scss/components/_accordion-menu.scss
+++ b/scss/components/_accordion-menu.scss
@@ -41,8 +41,8 @@ $accordionmenu-arrow-color: $primary-color !default;
     }
 
     .is-accordion-submenu-parent[aria-expanded='true'] > span::after {
-      transform-origin: 50% 50%;
       transform: scaleY(-1);
+      transform-origin: 50% 50%;
     }
 
   }

diff --git a/scss/components/_accordion.scss b/scss/components/_accordion.scss
index cfc96ab0def60a8b76aaea45de3980564f643243..3678f66075ded60a1b768e3f35ea555064a4cb3b 100644 (file)
--- a/scss/components/_accordion.scss
+++ b/scss/components/_accordion.scss
@@ -78,8 +78,8 @@ $accordion-content-padding: 1rem !default;
   color: $accordion-item-color;
 
   :last-child:not(.is-active) > & {
-    border-radius: 0 0 $global-radius $global-radius;
     border-bottom: $accordion-content-border;
+    border-radius: 0 0 $global-radius $global-radius;
   }
 
   &:hover,
@@ -89,11 +89,11 @@ $accordion-content-padding: 1rem !default;
 
   @if $accordion-plusminus {
     &::before {
-      content: '+';
       position: absolute;
-      #{$global-right}: 1rem;
       top: 50%;
+      #{$global-right}: 1rem;
       margin-top: -0.5rem;
+      content: '+';
     }
 
     .is-active > &::before {

diff --git a/scss/components/_button.scss b/scss/components/_button.scss
index 529cb735341b759e7a8c5c38ff6d3bbc2bf427c6..ecb0d34555fb8e4ecedbefa4d32e516700182bda 100644 (file)
--- a/scss/components/_button.scss
+++ b/scss/components/_button.scss
@@ -73,8 +73,8 @@ $button-transition: background-color 0.25s ease-out, color 0.25s ease-out !defau
   @include disable-mouse-outline;
   display: inline-block;
   vertical-align: middle;
-  padding: $button-padding;
   margin: $button-margin;
+  padding: $button-padding;
 
   -webkit-appearance: none;
   border: 1px solid transparent;
@@ -82,8 +82,8 @@ $button-transition: background-color 0.25s ease-out, color 0.25s ease-out !defau
   transition: $button-transition;
 
   font-size: map-get($button-sizes, default);
-  text-align: center;
   line-height: 1;
+  text-align: center;
   cursor: pointer;
 }
 

diff --git a/scss/components/_dropdown-menu.scss b/scss/components/_dropdown-menu.scss
index 2ff07f758a86ced20a8cccb49d2e7af8f9356052..1961df7cb289326ebf17e705c4ce305347056e4b 100644 (file)
--- a/scss/components/_dropdown-menu.scss
+++ b/scss/components/_dropdown-menu.scss
@@ -50,17 +50,17 @@ $dropdownmenu-border-width: nth($dropdownmenu-border, 1);
   @if $dir == horizontal {
     > li.opens-left {
       > .is-dropdown-submenu {
-        left: auto;
-        right: 0;
         top: 100%;
+        right: 0;
+        left: auto;
       }
     }
 
     > li.opens-right {
       > .is-dropdown-submenu {
+        top: 100%;
         right: auto;
         left: 0;
-        top: 100%;
       }
     }
 
@@ -194,8 +194,8 @@ $dropdownmenu-border-width: nth($dropdownmenu-border, 1);
     display: none;
     min-width: $dropdownmenu-min-width;
 
-    background: $dropdownmenu-background;
     border: $dropdownmenu-border;
+    background: $dropdownmenu-background;
 
     .is-dropdown-submenu-parent {
       @if $dropdownmenu-arrows {

diff --git a/scss/components/_menu.scss b/scss/components/_menu.scss
index 3176935a688e7738138194c56f16d08b9ef5a7d4..7cafc0657ac7d8846e6d6862f584e4c61f2d885f 100644 (file)
--- a/scss/components/_menu.scss
+++ b/scss/components/_menu.scss
@@ -122,8 +122,8 @@ $menu-border: $light-gray !default;
       }
 
       > li  > a {
-        align-items: flex-start;
         justify-content: flex-start;
+        align-items: flex-start;
       }
     }
     @else {
@@ -306,8 +306,8 @@ $menu-border: $light-gray !default;
 
     // Active state
     .active > a {
-      color: $menu-item-color-active;
       background: $menu-item-background-active;
+      color: $menu-item-color-active;
     }
 
     // Menu with border

diff --git a/scss/components/_off-canvas.scss b/scss/components/_off-canvas.scss
index c282b1df72e6169ae2ee42c01acc9f7db20060dc..8ed13b49d46f19d11326275b5cbd19461f1f06be 100644 (file)
--- a/scss/components/_off-canvas.scss
+++ b/scss/components/_off-canvas.scss
@@ -109,9 +109,9 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
   z-index: $offcanvas-zindex;
   max-height: 100%;
 
-  overflow-y: auto;
-  background: $offcanvas-background;
   transform: translateX(0) translateY(0);
+  background: $offcanvas-background;
+  overflow-y: auto;
 }
 
 @mixin off-canvas-position(
@@ -121,13 +121,13 @@ $maincontent-shadow: 0 0 10px rgba($black, 0.5) !default;
   $vertical-size: $offcanvas-vertical-size
 ) {
   @if $position == left {
-    left: -$size;
     top: 0;
+    left: -$size;
     width: $size;
   }
   @else if $position == right {
-    right: -$size;
     top: 0;
+    right: -$size;
     width: $size;
   }
   @else if $position == top {

diff --git a/scss/components/_orbit.scss b/scss/components/_orbit.scss
index b8a341c471f2cfec5fa5dfcf40f4de39bc6a0652..11a627673a2f65e1331149963945d077df1e6eaf 100644 (file)
--- a/scss/components/_orbit.scss
+++ b/scss/components/_orbit.scss
@@ -58,10 +58,10 @@ $orbit-control-zindex: 10 !default;
 /// Adds styles for the inner Orbit slide container. These styles are used on the `.orbit-container` class.
 @mixin orbit-container {
   position: relative;
+  height: 0px; // Prevent FOUC by not showing until JS sets height
   margin: 0;
-  overflow: hidden;
   list-style: none;
-  height: 0px; // Prevent FOUC by not showing until JS sets height
+  overflow: hidden;
 }
 
 /// Adds styles for the individual slides of an Orbit slider. These styles are used on the `.orbit-slide` class.

diff --git a/scss/components/_progress-bar.scss b/scss/components/_progress-bar.scss
index cd7b066f5921015154e22e8388f2308773fb7a8a..342cfe6cbc29be5ca836a1a4090c73475932508d 100644 (file)
--- a/scss/components/_progress-bar.scss
+++ b/scss/components/_progress-bar.scss
@@ -6,8 +6,8 @@
 @mixin progress-container {
   height: $progress-height;
   margin-bottom: $progress-margin-bottom;
-  background-color: $progress-background;
   border-radius: $progress-radius;
+  background-color: $progress-background;
 }
 
 /// Adds styles for the inner meter of a progress bar.

diff --git a/scss/components/_responsive-embed.scss b/scss/components/_responsive-embed.scss
index 719d019987496a1b95486ff11848b4a0c122a05c..a476c149596851f7dfcf7fad944bb9179a492500 100644 (file)
--- a/scss/components/_responsive-embed.scss
+++ b/scss/components/_responsive-embed.scss
@@ -32,8 +32,8 @@ $responsive-embed-ratio-widescreen: 16 by 9 !default;
 @mixin responsive-embed($ratio: $responsive-embed-ratio) {
   position: relative;
   height: 0;
-  padding-bottom: responsive-embed($ratio);
   margin-bottom: $responsive-embed-margin-bottom;
+  padding-bottom: responsive-embed($ratio);
   overflow: hidden;
 
   iframe,

diff --git a/scss/components/_switch.scss b/scss/components/_switch.scss
index 44b430b15ffa951c17f4ce43e478ed50fe4d762a..3b3f0dd72cb0af56482839602dc0b62160fb0cd6 100644 (file)
--- a/scss/components/_switch.scss
+++ b/scss/components/_switch.scss
@@ -95,12 +95,13 @@ $switch-paddle-transition: all 0.25s ease-out !default;
   border-radius: $switch-radius;
   background: $switch-background;
   transition: $switch-paddle-transition;
-  cursor: pointer;
 
   // Resetting these <label> presets so type styles cascade down
   font-weight: inherit;
   color: inherit;
 
+  cursor: pointer;
+
   // Needed to override specificity
   input + & {
     margin: 0;

diff --git a/scss/typography/_base.scss b/scss/typography/_base.scss
index 8781cae97a743fa4b1ce47c3d4bb93c7295cfbc1..e21550e301198eeae4d8ec732310747cfb1deeab 100644 (file)
--- a/scss/typography/_base.scss
+++ b/scss/typography/_base.scss
@@ -431,8 +431,8 @@ $abbr-underline: 1px dotted $black !default;
   code {
     padding: $code-padding;
 
-    background-color: $code-background;
     border: $code-border;
+    background-color: $code-background;
 
     font-family: $code-font-family;
     font-weight: $code-font-weight;

diff --git a/scss/util/_mixins.scss b/scss/util/_mixins.scss
index 4666e3eefde2326b141693e37592f2ee97c931e1..353bc32fcdd750e7edcc179ee099edc0baa0ed6c 100644 (file)
--- a/scss/util/_mixins.scss
+++ b/scss/util/_mixins.scss
@@ -25,24 +25,24 @@
   content: '';
 
   @if ($triangle-direction == down) {
-    border-color: $triangle-color transparent transparent;
-    border-top-style: solid;
     border-bottom-width: 0;
+    border-top-style: solid;
+    border-color: $triangle-color transparent transparent;
   }
   @if ($triangle-direction == up) {
-    border-color: transparent transparent $triangle-color;
-    border-bottom-style: solid;
     border-top-width: 0;
+    border-bottom-style: solid;
+    border-color: transparent transparent $triangle-color;
   }
   @if ($triangle-direction == right) {
-    border-color: transparent transparent transparent $triangle-color;
-    border-left-style: solid;
     border-right-width: 0;
+    border-left-style: solid;
+    border-color: transparent transparent transparent $triangle-color;
   }
   @if ($triangle-direction == left) {
-    border-color: transparent $triangle-color transparent transparent;
-    border-right-style: solid;
     border-left-width: 0;
+    border-right-style: solid;
+    border-color: transparent $triangle-color transparent transparent;
   }
 }
 
@@ -92,6 +92,7 @@
     height: $weight;
 
     background: $color;
+    box-shadow: $shadow;
 
     content: '';
 
@@ -99,8 +100,6 @@
       $offset: ($weight + $spacing) * ($i - 1);
       $shadow: append($shadow, 0 $offset 0 $color, comma);
     }
-
-    box-shadow: $shadow;
   }
 
   // Hover state
@@ -194,8 +193,8 @@
 /// Reverses the CSS output created by the `element-invisible()` mixin.
 @mixin element-invisible-off {
   position: static !important;
-  height: auto;
   width: auto;
+  height: auto;
   overflow: visible;
   clip: auto;
 }