From b23c89564a46e6377d1e8187f76103fe37b1a47b Mon Sep 17 00:00:00 2001 From: John Hawthorn Date: Mon, 6 Feb 2017 12:47:01 -0800 Subject: [PATCH 1/4] Use unprefixed flexbox CSS attributes Bourbon is removed these mixins from bourbon 5.0 and recommend autoprefixer as a replacement. Fortunately, we have no need to use prefixes since our admin only supports modern browsers (IE11+) --- .../spree/backend/components/_tabs.scss | 14 +++++++------- .../spree/backend/sections/_style_guide.scss | 10 +++++----- .../stylesheets/spree/backend/shared/_forms.scss | 4 ++-- .../stylesheets/spree/backend/shared/_header.scss | 6 +++--- 4 files changed, 17 insertions(+), 17 deletions(-) diff --git a/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss b/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss index d549bdcf9a2..7ee3ddcd83e 100644 --- a/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss +++ b/backend/app/assets/stylesheets/spree/backend/components/_tabs.scss @@ -1,5 +1,5 @@ .tabs { - @include display(flex); + display: flex; margin: 1em 0; border-bottom: 1px solid $color-border; white-space: nowrap; @@ -18,8 +18,8 @@ } .tabs > li:not(.in-dropdown) { - @include flex-grow(0); - @include flex-shrink(0); + flex-grow: 0; + flex-shrink: 0; // Move down one pixel to sit on top of the ul's border-bottom position: relative; @@ -54,13 +54,13 @@ } .tabs-overflowed.tabs > li:not(.tabs-dropdown) { - @include flex-grow(1); - @include flex-shrink(1); + flex-grow: 1; + flex-shrink: 1; } .tabs-dropdown { - @include flex-grow(0); - @include flex-shrink(0); + flex-grow: 0; + flex-shrink: 0; position: relative; .tabs:not(.tabs-overflowed) & { diff --git a/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss b/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss index b6894af118a..d4a0fb7a786 100644 --- a/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss +++ b/backend/app/assets/stylesheets/spree/backend/sections/_style_guide.scss @@ -1,5 +1,5 @@ .style-guide { - @include display(flex); + display: flex; &-sidebar { width: 225px; @@ -23,7 +23,7 @@ } &-main-content { - @include flex(1); + flex: 1; } ul { @@ -109,12 +109,12 @@ } .color-variables { - @include display(flex); - @include flex-wrap(wrap); + display: flex; + flex-wrap: wrap; } .color-variable { - @include flex-shrink(0); + flex-shrink: 0; width: 240px; padding: 1rem; diff --git a/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss b/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss index 045665d4439..1740192c7e6 100644 --- a/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss +++ b/backend/app/assets/stylesheets/spree/backend/shared/_forms.scss @@ -142,8 +142,8 @@ span.info { &.checkbox { min-height: 73px; - @include display(flex); - @include align-items(center); + display: flex; + align-items: center; input[type="checkbox"] { display: inline-block; diff --git a/backend/app/assets/stylesheets/spree/backend/shared/_header.scss b/backend/app/assets/stylesheets/spree/backend/shared/_header.scss index 14db73ca36b..26a61c839db 100644 --- a/backend/app/assets/stylesheets/spree/backend/shared/_header.scss +++ b/backend/app/assets/stylesheets/spree/backend/shared/_header.scss @@ -1,6 +1,6 @@ .main-header { - @include display(flex); - @include align-items(center); + display: flex; + align-items: center; padding: 15px $grid-gutter-width; background-color: very-light($color-3, 4); border-bottom: 1px solid $color-border; @@ -25,7 +25,7 @@ } .header-actions { - @include flex-grow(1); + flex-grow: 1; text-align: right; line-height: 38px; From 84a4bb7c7e68ae2842235e24cf471c4c83f11acc Mon Sep 17 00:00:00 2001 From: John Hawthorn Date: Mon, 6 Feb 2017 12:50:13 -0800 Subject: [PATCH 2/4] Use unprefixed calc CSS Bourbon is removed these mixins from bourbon 5.0 and recommend autoprefixer as a replacement. Fortunately, we have no need to use prefixes since our admin only supports modern browsers (IE11+) --- .../assets/stylesheets/spree/backend/components/_progress.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss index e861d846097..4cbe0bd84ed 100644 --- a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss +++ b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss @@ -6,7 +6,7 @@ bottom: 0; z-index: 1000; opacity: 0.8; - @include calc(width, "100% - #{$width-sidebar}"); + width: calc(100% - #{$width-sidebar}); .wrapper { border-radius: 10px; From 6372731ef572502e6d133b77f0bddac9bcac4a53 Mon Sep 17 00:00:00 2001 From: John Hawthorn Date: Mon, 6 Feb 2017 12:51:29 -0800 Subject: [PATCH 3/4] Use unprefixed animation CSS Bourbon is removed these mixins from bourbon 5.0 and recommend autoprefixer as a replacement. Fortunately, we have no need to use prefixes since our admin only supports modern browsers (IE11+) --- .../stylesheets/spree/backend/components/_progress.scss | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss index 4cbe0bd84ed..d5869d7ac86 100644 --- a/backend/app/assets/stylesheets/spree/backend/components/_progress.scss +++ b/backend/app/assets/stylesheets/spree/backend/components/_progress.scss @@ -40,15 +40,15 @@ height: 30px; border: 6px solid rgba($color-spinner, 0.2); border-left-color: rgba($color-spinner, 1); - @include animation(spinner 1s infinite linear); + animation: spinner 1s infinite linear; border-radius: 50%; } -@include keyframes(spinner) { +@keyframes spinner { from { - @include transform(rotate(0)); + transform: rotate(0); } to { - @include transform(rotate(360deg)); + transform: rotate(360deg); } } From 08c86da3e66178b2519ffee5d7f2ccd6e6b8f913 Mon Sep 17 00:00:00 2001 From: John Hawthorn Date: Mon, 6 Feb 2017 12:56:50 -0800 Subject: [PATCH 4/4] Use unprefixed CSS transforms Bourbon is removed these mixins from bourbon 5.0 and recommend autoprefixer as a replacement. Fortunately, we have no need to use prefixes since our admin only supports modern browsers (IE11+) --- .../stylesheets/spree/backend/components/_navigation.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss b/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss index f8f7809a813..91abe39158f 100644 --- a/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss +++ b/backend/app/assets/stylesheets/spree/backend/components/_navigation.scss @@ -119,7 +119,7 @@ nav.menu { &:before { position: absolute; left: 1em; - @include transform(translateX(-50%)); + transform: translateX(-50%); } }