diff --git a/app/assets/javascripts/select-kit/addon/components/multi-select.hbs b/app/assets/javascripts/select-kit/addon/components/multi-select.hbs
index 2e4a1d60189..bff74779a03 100644
--- a/app/assets/javascripts/select-kit/addon/components/multi-select.hbs
+++ b/app/assets/javascripts/select-kit/addon/components/multi-select.hbs
@@ -30,32 +30,24 @@
{{/if}}
- {{#if this.selectKit.isLoading}}
-
- {{#if this.site}}
- {{loading-spinner size="small"}}
- {{/if}}
-
- {{else}}
- {{#each this.collections as |collection|}}
- {{component
- (component-for-collection collection.identifier this.selectKit)
- collection=collection
- selectKit=this.selectKit
- value=this.value
- }}
- {{/each}}
+ {{#each this.collections as |collection|}}
+ {{component
+ (component-for-collection collection.identifier this.selectKit)
+ collection=collection
+ selectKit=this.selectKit
+ value=this.value
+ }}
+ {{/each}}
- {{#if this.selectKit.filter}}
- {{#if this.selectKit.hasNoContent}}
-
- {{i18n "select_kit.no_content"}}
-
- {{else}}
-
- {{i18n "select_kit.results_count" count=this.mainCollection.length}}
-
- {{/if}}
+ {{#if this.selectKit.filter}}
+ {{#if this.selectKit.hasNoContent}}
+
+ {{i18n "select_kit.no_content"}}
+
+ {{else}}
+
+ {{i18n "select_kit.results_count" count=this.mainCollection.length}}
+
{{/if}}
{{/if}}
diff --git a/app/assets/javascripts/select-kit/addon/components/single-select.hbs b/app/assets/javascripts/select-kit/addon/components/single-select.hbs
index 2271eea924d..c4d684d817d 100644
--- a/app/assets/javascripts/select-kit/addon/components/single-select.hbs
+++ b/app/assets/javascripts/select-kit/addon/components/single-select.hbs
@@ -18,33 +18,26 @@
id=(concat this.selectKit.uniqueID "-filter")
}}
- {{#if this.selectKit.isLoading}}
-
- {{#if this.site}}
- {{loading-spinner size="small"}}
- {{/if}}
-
- {{else}}
- {{#each this.collections as |collection|}}
- {{component
- (component-for-collection collection.identifier this.selectKit)
- collection=collection
- selectKit=this.selectKit
- value=this.value
- }}
- {{/each}}
+ {{#each this.collections as |collection|}}
+ {{component
+ (component-for-collection collection.identifier this.selectKit)
+ collection=collection
+ selectKit=this.selectKit
+ value=this.value
+ }}
+ {{/each}}
- {{#if this.selectKit.filter}}
- {{#if this.selectKit.hasNoContent}}
-
- {{i18n "select_kit.no_content"}}
-
- {{else}}
-
- {{i18n "select_kit.results_count" count=this.mainCollection.length}}
-
- {{/if}}
+ {{#if this.selectKit.filter}}
+ {{#if this.selectKit.hasNoContent}}
+
+ {{i18n "select_kit.no_content"}}
+
+ {{else}}
+
+ {{i18n "select_kit.results_count" count=this.mainCollection.length}}
+
{{/if}}
{{/if}}
+
{{/unless}}
\ No newline at end of file
diff --git a/app/assets/stylesheets/common/select-kit/select-kit.scss b/app/assets/stylesheets/common/select-kit/select-kit.scss
index f5dfbb3b8a5..a443c502bf9 100644
--- a/app/assets/stylesheets/common/select-kit/select-kit.scss
+++ b/app/assets/stylesheets/common/select-kit/select-kit.scss
@@ -278,6 +278,7 @@
align-items: center;
justify-content: space-between;
width: 100%;
+ position: relative;
.filter-input {
background: none;
@@ -321,7 +322,6 @@
}
.no-content,
- .is-loading,
.results-count {
display: flex;
flex: 1 0 auto;
@@ -345,8 +345,25 @@
white-space: nowrap;
}
- .is-loading {
- align-items: flex-start;
- justify-content: center;
+ @keyframes lineDrawToRight {
+ 0% {
+ width: 0;
+ }
+ 100% {
+ width: 100%;
+ }
+ }
+
+ &.is-loading {
+ .select-kit-filter::after {
+ content: "";
+ position: absolute;
+ background: var(--tertiary);
+ width: 100%;
+ height: 2px;
+ left: 0;
+ bottom: 0;
+ animation: lineDrawToRight 0.5s ease-in;
+ }
}
}