add dropdown component

css/checkbox.scss

@@ -34,19 +34,19 @@
 
     .check-box-inner {
         flex: 0 0 auto;
-    }
 
-    >span {
-        flex: 1 1 auto;
-        font-weight: 400;
-        font-size: $mediumSize;
-        padding-left: 8px;
-        padding-right: 6px;
-        align-self: center;
-        white-space: nowrap;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        cursor: pointer;
-        color: #201f1e;
+        &+* {
+            flex: 1 1 auto;
+            font-weight: 400;
+            font-size: $mediumSize;
+            padding-left: 8px;
+            padding-right: 6px;
+            align-self: center;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            cursor: pointer;
+            color: $foreColor;
+        }
     }
 }

css/dropdown.scss

@@ -14,6 +14,9 @@ $searchIconSize: 13px;
 $listMaxHeight: 210px;
 
 .dropdown-wrapper {
+    display: inline-block;
+    border: none;
+    @include border-radius(unset);
     @include user-select(none);
     position: relative;
 
@@ -35,7 +38,7 @@ $listMaxHeight: 210px;
             outline: none;
         }
 
-        >.dropdown-select-container {
+        /*>.dropdown-select-container {
             flex: 1 1 auto;
             overflow-x: auto;
             white-space: nowrap;
@@ -98,7 +101,7 @@ $listMaxHeight: 210px;
                 font-size: .8125rem;
                 color: $foreColor;
             }
-        }
+        }*/
 
         >.dropdown-text {
             flex: 1 1 auto;
@@ -132,11 +135,11 @@ $listMaxHeight: 210px;
         }
 
         &.disabled {
-            border-color: $disabledColor;
-            color: $disabledColor;
+            border-color: $disabledBgColor;
+            color: $disabledForeColor;
 
             &:focus {
-                border-color: $disabledColor;
+                border-color: $disabledBgColor;
                 // @include box-shadow(none);
             }
 
@@ -217,6 +220,7 @@ $listMaxHeight: 210px;
         >.dropdown-list {
             margin: 0;
             padding: 0;
+            padding-bottom: 6px;
             list-style: none;
             max-height: $listMaxHeight;
             overflow-y: auto;
@@ -226,8 +230,8 @@ $listMaxHeight: 210px;
             }
 
             >li {
-                display: flex;
-                align-items: center;
+                // display: flex;
+                // align-items: center;
                 line-height: $dropItemHeight;
                 height: $dropItemHeight;
                 padding: 0 10px;
@@ -241,29 +245,8 @@ $listMaxHeight: 210px;
                     background-color: $hoverColor;
                 }
 
-                @include check-box();
-
-                >label {
-                    display: flex;
-                    align-items: center;
-                }
-
-                .check-box-inner {
-                    flex: 0 0 auto;
-                }
-
-                .check-box-inner+* {
-                    flex: 1 1 auto;
-                    font-weight: 400;
-                    font-size: .8125rem;
-                    padding-left: 8px;
-                    padding-right: 6px;
-                    align-self: center;
-                    white-space: nowrap;
-                    overflow: hidden;
-                    text-overflow: ellipsis;
-                    cursor: pointer;
-                    color: $foreColor;
+                >.checkbox-wrapper {
+                    height: $dropItemHeight;
                 }
             }
         }

css/tooltip.scss

@@ -46,7 +46,7 @@
         font-size: $smallSize;
         line-height: 1rem;
         white-space: normal;
-        overflow: auto;
+        overflow: hidden;
         margin: 8px;
         height: calc(100% - 16px);
         @include user-select(none);

css/ui.scss

@@ -1,2 +1,3 @@
 @import './checkbox.scss';
+@import './dropdown.scss';
 @import './tooltip.scss';

css/variables/definition.scss

@@ -1,7 +1,8 @@
 // color
 $borderColor: #d9d9d9;
 $focusColor: #b9b9b9;
-$disabledColor: #e9e9e9;
+$disabledBgColor: #e9e9e9;
+$disabledForeColor: #aaa;
 $hoverColor: #eee;
 $bgColor: #fff;
 $foreColor: #201f1e;