feat(dropdown): support dropup option (#658)

Fixes #618.

src/components/dropdown/_dropdown.scss

@@ -37,6 +37,20 @@
     }
   }
 
+  .#{$prefix}--dropdown--up {
+    &.#{$prefix}--dropdown--open:focus {
+      box-shadow: 0 1px 0 0 $brand-01, 1px 0 0 0 $brand-01, -1px 0 0 0 $brand-01;
+
+      .#{$prefix}--dropdown-list {
+        box-shadow: 0 -1px 0 0 $brand-01, 1px 0 0 0 $brand-01, -1px 0 0 0 $brand-01;
+      }
+    }
+
+    .#{$prefix}--dropdown-list {
+      bottom: 2.5rem;
+    }
+  }
+
   .#{$prefix}--dropdown__arrow {
     fill: $brand-01;
     position: absolute;

src/components/dropdown/dropdown--up.html

@@ -0,0 +1,25 @@
+<ul data-dropdown data-value class="bx--dropdown bx--dropdown--up" tabindex="0">
+  <li class="bx--dropdown-text">Dropdown label</li>
+  <svg class="bx--dropdown__arrow" width="10" height="5" viewBox="0 0 10 5" fill-rule="evenodd">
+    <path d="M10 0L5 5 0 0z"></path>
+  </svg>
+  <li>
+    <ul class="bx--dropdown-list">
+      <li data-option data-value="all" class="bx--dropdown-item">
+        <a class="bx--dropdown-link" href="javascript:void(0)">Option 1</a>
+      </li>
+      <li data-option data-value="cloudFoundry" class="bx--dropdown-item">
+        <a class="bx--dropdown-link" href="javascript:void(0)">Option 2</a>
+      </li>
+      <li data-option data-value="staging" class="bx--dropdown-item">
+        <a class="bx--dropdown-link" href="javascript:void(0)">Option 3</a>
+      </li>
+      <li data-option data-value="dea" class="bx--dropdown-item">
+        <a class="bx--dropdown-link" href="javascript:void(0)">Option 4</a>
+      </li>
+      <li data-option data-value="router" class="bx--dropdown-item">
+        <a class="bx--dropdown-link" href="javascript:void(0)">Option 5</a>
+      </li>
+    </ul>
+  </li>
+</ul>