From cb49dc6448b1d0c352638bdeb340ca72f48fa8be Mon Sep 17 00:00:00 2001
From: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Date: Fri, 16 Mar 2018 10:52:15 +0100
Subject: [PATCH] FIX: use right caret for collapse state of tag and category
 drops

---
 .../select-kit/components/category-drop.js.es6     |  2 ++
 .../select-kit/components/tag-drop.js.es6          |  2 ++
 .../common/select-kit/category-drop.scss           | 14 +++++++++-----
 .../stylesheets/common/select-kit/tag-drop.scss    |  3 ++-
 4 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/select-kit/components/category-drop.js.es6 b/app/assets/javascripts/select-kit/components/category-drop.js.es6
index 5fa6218806..b8c4a8724c 100644
--- a/app/assets/javascripts/select-kit/components/category-drop.js.es6
+++ b/app/assets/javascripts/select-kit/components/category-drop.js.es6
@@ -18,6 +18,8 @@ export default ComboBoxComponent.extend({
   noCategoriesLabel: I18n.t("categories.no_subcategory"),
   mutateAttributes() {},
   fullWidthOnMobile: true,
+  caretDownIcon: "caret-right fa-fw",
+  caretUpIcon: "caret-down fa-fw",
 
   init() {
     this._super();
diff --git a/app/assets/javascripts/select-kit/components/tag-drop.js.es6 b/app/assets/javascripts/select-kit/components/tag-drop.js.es6
index 79e9f017cf..d30775edb4 100644
--- a/app/assets/javascripts/select-kit/components/tag-drop.js.es6
+++ b/app/assets/javascripts/select-kit/components/tag-drop.js.es6
@@ -19,6 +19,8 @@ export default ComboBoxComponent.extend({
   categoryStyle: Ember.computed.alias("siteSettings.category_style"),
   mutateAttributes() {},
   fullWidthOnMobile: true,
+  caretDownIcon: "caret-right fa-fw",
+  caretUpIcon: "caret-down fa-fw",
 
   @computed("tagId")
   noTagsSelected() {
diff --git a/app/assets/stylesheets/common/select-kit/category-drop.scss b/app/assets/stylesheets/common/select-kit/category-drop.scss
index 83f5efdfcf..201ce200b5 100644
--- a/app/assets/stylesheets/common/select-kit/category-drop.scss
+++ b/app/assets/stylesheets/common/select-kit/category-drop.scss
@@ -16,24 +16,27 @@
         }
       }
 
-      &.bar.has-selection .category-drop-header,
       &.none.has-selection .category-drop-header {
-        padding: 5px 10px;
+        padding: 4.5px 5px 4.5px 10px;
+      }
+
+      &.bar.has-selection .category-drop-header {
+        padding: 3.5px 5px 3.5px 10px;
       }
 
       &.box.has-selection .category-drop-header {
-        padding: 2.5px 10px;
+        padding: 2.5px 5px 2.5px 10px;
       }
 
       &.bullet.has-selection .category-drop-header {
-        padding: 5px 10px;
+        padding: 4.5px 5px 4.5px 10px;
       }
 
       .category-drop-header {
         background: $primary-low;
         color: $primary;
         border: 1px solid transparent;
-        padding: 5px 10px;
+        padding: 4.5px 5px 4.5px 10px;
         font-size: $font-0;
         transition: none;
 
@@ -47,6 +50,7 @@
 
         .caret-icon {
           opacity: 1;
+          margin: 0;
         }
       }
 
diff --git a/app/assets/stylesheets/common/select-kit/tag-drop.scss b/app/assets/stylesheets/common/select-kit/tag-drop.scss
index 84b6b7b1f0..48c114f303 100644
--- a/app/assets/stylesheets/common/select-kit/tag-drop.scss
+++ b/app/assets/stylesheets/common/select-kit/tag-drop.scss
@@ -7,13 +7,14 @@
         background: $primary-low;
         color: $primary;
         border: 1px solid transparent;
-        padding: 5px 10px;
+        padding: 4.5px 5px 4.5px 10px;
         font-size: $font-0;
         transition: none;
 
         .d-icon {
           opacity: 1;
           font-size: $font-0;
+          margin: 0;
         }
       }