From 2ac3cda2f43ba1934703adbf3f536dff35ad11df Mon Sep 17 00:00:00 2001
From: Matt-Yorkley <9029026+Matt-Yorkley@users.noreply.github.com>
Date: Mon, 14 Jun 2021 09:15:19 +0100
Subject: [PATCH] Deal with deprecated @extend syntax

Errors:
```
SassError: SassError: compound selectors may no longer be extended.
Consider `@extend a, :hover` instead.
See http://bit.ly/ExtendCompound for details.
```
---
 app/webpacker/css/admin/components/navigation.scss |  2 +-
 app/webpacker/css/admin/plugins/select2.scss       |  4 ++--
 app/webpacker/css/admin/shared/icons.scss          | 12 ++++++------
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/app/webpacker/css/admin/components/navigation.scss b/app/webpacker/css/admin/components/navigation.scss
index 2bb630ba7d..4291aa1901 100644
--- a/app/webpacker/css/admin/components/navigation.scss
+++ b/app/webpacker/css/admin/components/navigation.scss
@@ -127,7 +127,7 @@ nav.menu {
     }
 
     &.selected a {
-      @extend a:hover;
+      @extend a, :hover;
     }
   }
 }
diff --git a/app/webpacker/css/admin/plugins/select2.scss b/app/webpacker/css/admin/plugins/select2.scss
index a721da9b7c..705385207c 100644
--- a/app/webpacker/css/admin/plugins/select2.scss
+++ b/app/webpacker/css/admin/plugins/select2.scss
@@ -66,7 +66,7 @@
   }
 
   input {
-    @extend input[type="text"];
+    @extend input, [type="text"];
 
     padding: 6px 0 6px 25px;
     margin: 5px 0 0 5px;
@@ -143,7 +143,7 @@
     }
   }
   .select2-choices {
-    @extend input[type="text"];
+    @extend input, [type="text"];
     padding: 6px 3px 3px 3px;
     box-shadow: none;
     background-image: none !important;
diff --git a/app/webpacker/css/admin/shared/icons.scss b/app/webpacker/css/admin/shared/icons.scss
index 2bb1604e8e..cecc5fdb8c 100644
--- a/app/webpacker/css/admin/shared/icons.scss
+++ b/app/webpacker/css/admin/shared/icons.scss
@@ -13,12 +13,12 @@
   }
 }
 
-.icon-email:before    { @extend .icon-envelope, :before }
-.icon-resend_authorization_email:before    { @extend .icon-envelope, :before }
-.icon-resume:before   { @extend .icon-refresh, :before  }
+.icon-email:before    { @extend .icon-envelope, :before; }
+.icon-resend_authorization_email:before    { @extend .icon-envelope, :before; }
+.icon-resume:before   { @extend .icon-refresh, :before; }
 
 .icon-cancel:before,
-.icon-void:before     { @extend .icon-remove, :before   }
+.icon-void:before     { @extend .icon-remove, :before;   }
 
-.icon-capture:before  { @extend .icon-ok, :before       }
-.icon-credit:before   { @extend .icon-ok, :before       }
+.icon-capture:before  { @extend .icon-ok, :before;       }
+.icon-credit:before   { @extend .icon-ok, :before ;      }