input.scss in titon-toolkit-1.1.0.rc.1

- old
+ new

@@ -61,10 +61,15 @@
         background: $gray-lightest;
         border: 1px solid $gray-dark;
         border-radius: $round;
         white-space: nowrap;
         line-height: 1rem;
+        z-index: 3;
+
+        &.#{$state-is-prefix}active {
+            border-color: $info;
+        }
     }
 
     .#{$vendor-prefix}select-label,
     .#{$vendor-prefix}select-arrow {
         display: inline-block;
@@ -82,11 +87,11 @@
     // Position the real select over the custom one
     select {
         position: absolute;
         top: 0;
         left: 0;
-        z-index: 1;
+        z-index: 5;
         opacity: 0;
         width: 100%;
 
         // Style when the select is hovered
         &:hover + .#{$vendor-prefix}select {
@@ -101,8 +106,33 @@
         // Style when select is disabled
         &[disabled] + .#{$vendor-prefix}select {
             cursor: not-allowed;
             color: $gray-darkest;
             border-color: $gray;
+
+            .#{$vendor-prefix}select-arrow { opacity: $default-opacity; }
+        }
+    }
+
+    // Select dropdown
+    .#{$vendor-prefix}select-options {
+        max-height: 300px;
+        overflow: auto;
+
+        li.#{$state-is-prefix}disabled {
+            > a,
+            > a:hover {
+                background: none;
+                color: $gray-darkest;
+                cursor: default;
+            }
+        }
+
+        &.hide-selected {
+            li.#{$state-is-prefix}active { display: none !important; }
+        }
+
+        &.hide-first {
+            li:first-child:not(.#{$vendor-prefix}drop-heading) { display: none !important; }
         }
     }
 }
\ No newline at end of file