From 0595f0caee6a227a8658cc11fac3b9616ed8a2d6 Mon Sep 17 00:00:00 2001 From: Jessica Date: Fri, 31 Aug 2018 14:23:50 +0200 Subject: added loading icon --- css/settings/settings-addressbook-sharee.scss | 4 -- css/settings/settings-addressbook-shares.scss | 71 ++++----------------------- 2 files changed, 10 insertions(+), 65 deletions(-) (limited to 'css') 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; -- cgit v1.2.3