From 135e2a7f4a2655d860a208c2306712b24c11456e Mon Sep 17 00:00:00 2001
From: Torgeir Pedersen Cook <torgeir.pedersen.cook@sparebank1.no>
Date: Fri, 17 Mar 2017 08:33:49 +0100
Subject: [PATCH] Removed arrowicon, use ffe-form dropdown styling

---
 src/selectors/base-selector.js |  2 +-
 src/selectors/input-field.js   |  9 ++-------
 styles/base-selector.less      | 18 ------------------
 3 files changed, 3 insertions(+), 26 deletions(-)

diff --git a/src/selectors/base-selector.js b/src/selectors/base-selector.js
index 526f6ffdfe..5247f54b46 100644
--- a/src/selectors/base-selector.js
+++ b/src/selectors/base-selector.js
@@ -186,7 +186,7 @@ class BaseSelector extends Component {
     const {showSuggestions, highlightedSuggestionIndex, suggestionListId} = this.state;
     return (
       <div
-        className='base-selector'
+        className='base-selector ffe-input-group'
       >
         <Input
           inputFieldRef={(input) => {
diff --git a/src/selectors/input-field.js b/src/selectors/input-field.js
index 9401a439fa..725ecf3bbc 100644
--- a/src/selectors/input-field.js
+++ b/src/selectors/input-field.js
@@ -1,6 +1,4 @@
 import React, { PropTypes, Component } from 'react';
-import classNames from 'classnames';
-import ChevronIkon from 'ffe-icons-react/chevron-ikon';
 import KryssIkon from 'ffe-icons-react/kryss-ikon';
 
 class Input extends Component {
@@ -32,14 +30,14 @@ class Input extends Component {
       >
         <input
           onChange={ (e) => {onChange(e.target.value);}}
-          className='ffe-input-field input-field'
+          className='ffe-input-field ffe-dropdown input-field'
           onKeyDown={ onKeyDown }
           autoComplete='off'
           value={ value }
           id={ id }
           placeholder={ placeholder }
           ref={inputFieldRef}
-          aria-invalid={ ariaInvalid } // add aria with hoc?
+          aria-invalid={ ariaInvalid }
           aria-autocomplete='list'
         />
         { value.length > 0 &&
@@ -53,9 +51,6 @@ class Input extends Component {
           <KryssIkon className='reset-button-icon'/>
         </button>
         }
-        <div className={classNames('arrow-icon', {'arrow-icon--up': isSuggestionsShowing })}>
-          <ChevronIkon focusable={ false }/>
-        </div>
       </div>
     );
   }
diff --git a/styles/base-selector.less b/styles/base-selector.less
index 3445e80095..61916f7406 100644
--- a/styles/base-selector.less
+++ b/styles/base-selector.less
@@ -7,24 +7,6 @@
     }
   }
 
-  .arrow-icon {
-    position: absolute;
-    top: 16px;
-    right: 10px;
-
-    svg {
-      width: 14px;
-      height: 14px;
-      fill: @ffe-blue-royal-light-wcag;
-    }
-
-    &--up {
-      svg {
-        transform: rotate(180deg);
-      }
-    }
-  }
-
   .reset-button {
     position: absolute;
     right: 35px;