added loading icon

2 files changed, 10 insertions, 65 deletions

diff --git a/css/settings/settings-addressbook-sharee.scss b/css/settings/settings-addressbook-sharee.scss
index e334830e..6d8fda34 100644
--- a/css/settings/settings-addressbook-sharee.scss
+++ b/css/settings/settings-addressbook-sharee.scss
@@ -56,10 +56,6 @@
 		display: inline-block;
 	}
 	
-	.icon-group {
-		background-image: url(/apps/contacts/img/group.svg);
-	}
-	
 	.icon-delete {
 		display: inline-block;
 		width: 24px;
diff --git a/css/settings/settings-addressbook-shares.scss b/css/settings/settings-addressbook-shares.scss
index c2bf75e0..e84c570b 100644
--- a/css/settings/settings-addressbook-shares.scss
+++ b/css/settings/settings-addressbook-shares.scss
@@ -29,72 +29,20 @@
 		display: flex;
 		flex-direction: column;
 	}
+
 	&__shareematch--bold {
 		font-weight: bold;
 	}
+	
+	.icon-loading::after {
+		top: 70%;
+		left: 95%;
+		height: 14px;
+		width: 14px;
+	}
+
 	.multiselect.multiselect-vue {
 		width: inherit;
-		.multiselect__spinner {
-			position: absolute;
-			right: 1px;
-			top: 1px;
-			width: 48px;
-			height: 35px;
-			background: #fff;
-			display: block
-		}
-		
-		.multiselect__spinner:after,
-		.multiselect__spinner:before {
-			position: absolute;
-			content: "";
-			top: 50%;
-			left: 50%;
-			margin: -8px 0 0 -8px;
-			width: 16px;
-			height: 16px;
-			border-radius: 100%;
-			border-color: #41b883 transparent transparent;
-			border-style: solid;
-			border-width: 2px;
-			box-shadow: 0 0 0 1px transparent
-		}
-		
-		.multiselect__spinner:before {
-			animation: a 2.4s cubic-bezier(.41, .26, .2, .62);
-			animation-iteration-count: infinite
-		}
-		
-		.multiselect__spinner:after {
-			animation: a 2.4s cubic-bezier(.51, .09, .21, .8);
-			animation-iteration-count: infinite
-		}
-		
-		.multiselect__loading-enter-active,
-		.multiselect__loading-leave-active {
-			transition: opacity .4s ease-in-out;
-			opacity: 1
-		}
-		
-		.multiselect__loading-enter,
-		.multiselect__loading-leave-active {
-			opacity: 0
-		}
-
-		[dir=rtl] .multiselect__spinner {
-			right: auto;
-			left: 1px
-		}
-		
-		@keyframes a {
-			0% {
-				transform: rotate(0)
-			}
-			to {
-				transform: rotate(2turn)
-			}
-		}
-
 		.multiselect__tags:focus-within, 
 		.multiselect__tags:hover {
 			border-color: var(--color-primary-element);
@@ -104,6 +52,7 @@
 			display: none;
 		}
 	}
+
 	.multiselect.showContent {
 		.multiselect__content-wrapper {
 			display: inherit;