#1753, Dropdown arrow is now clickable to hide dropdown in search selection dropdown

src/definitions/modules/dropdown.less

@@ -348,7 +348,7 @@
 }
 
 select.ui.dropdown {
-  height: 38px;
+  height: @selectPreInitHeight;
   padding: 0em;
   margin: 0em;
   visibility: hidden;
@@ -359,10 +359,12 @@ select.ui.dropdown {
 .ui.selection.dropdown > .search.icon,
 .ui.selection.dropdown > .delete.icon,
 .ui.selection.dropdown > .dropdown.icon {
+  cursor: pointer;
   position: absolute;
   top: auto;
-  margin: 0em;
   width: auto;
+  margin: @selectionIconMargin;
+  padding: @selectionIconPadding;
   right: @selectionHorizontalPadding;
   opacity: @selectionIconOpacity;
   transition: @selectionIconTransition;
@@ -455,9 +457,6 @@ select.ui.dropdown {
   border-color: @selectionVisibleBorderColor;
   box-shadow: @selectionVisibleBoxShadow;
 }
-.ui.visible.selection.dropdown > .dropdown.icon {
-  opacity: @selectionVisibleIconOpacity;
-}
 
 /* Active Item */
 .ui.selection.active.dropdown > .text:not(.default),
@@ -466,6 +465,12 @@ select.ui.dropdown {
   color: @selectionVisibleTextColor;
 }
 
+/* Dropdown Icon */
+.ui.active.selection.dropdown > .dropdown.icon,
+.ui.visible.selection.dropdown > .dropdown.icon {
+  opacity: @selectionVisibleIconOpacity;
+  z-index: 3;
+}
 
 /* Connecting Border */
 .ui.active.selection.dropdown,

src/themes/default/modules/dropdown.variables

@@ -119,6 +119,9 @@
 @selectionPadding: @selectionVerticalPadding @selectionHorizontalPadding;
 @selectionZIndex: 10;
 
+/* <select> */
+@selectPreInitHeight: 38px;
+
 @selectionTextIconDistance: 2em;
 @selectionTextColor: @textColor;
 
@@ -126,8 +129,13 @@
 @selectionBorderColor: @borderColor;
 @selectionBorder: 1px solid @selectionBorderColor;
 @selectionBorderRadius: @borderRadius;
+
 @selectionIconOpacity: 0.8;
+@selectionIconHitbox: @selectionVerticalPadding;
+@selectionIconMargin: -@selectionIconHitbox;
+@selectionIconPadding: @selectionIconHitbox;
 @selectionIconTransition: opacity 0.2s ease;
+
 @selectionMenuBoxShadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
 @selectionMenuItemBoxShadow: none;