dropdown.less in semantic-ui-rails-0.14.0

- old
+ new

@@ -195,16 +195,24 @@
 /* Dropdown Visible */
 .ui.visible.dropdown > .menu {
   display: block;
 }
 
+/*--------------------
+        Hover
+----------------------*/
+
 /* Menu Item Hover */
 .ui.dropdown .menu .item:hover {
   background-color: rgba(0, 0, 0, 0.02);
   z-index: 12;
 }
 
+/*--------------------
+        Active
+----------------------*/
+
 /* Menu Item Active */
 .ui.dropdown .menu .active.item {
   box-shadow: none;
   background-color: rgba(0, 0, 0, 0.06) !important;
   border-left: none;
@@ -214,21 +222,60 @@
   -moz-shadow: none;
   box-shadow: none;
   z-index: 12;
 }
 
-/* Default Text */
+/*--------------------
+     Default Text
+----------------------*/
+
 .ui.dropdown > .default.text,
 .ui.default.dropdown > .text {
   color: rgba(0, 0, 0, 0.5);
 }
 .ui.dropdown:hover > .default.text,
 .ui.default.dropdown:hover > .text {
   color: rgba(0, 0, 0, 0.8);
 }
 
 
+/*--------------------
+        Error
+----------------------*/
+
+.ui.dropdown.error,
+.ui.dropdown.error .item {
+  color: #D95C5C !important;
+}
+
+.ui.selection.dropdown.error {
+  background-color: #FFFAFA;
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(231, 190, 190, 1) !important;
+  box-shadow: 0px 0px 0px 1px rgba(231, 190, 190, 1) !important;
+}
+.ui.selection.dropdown.error:hover {
+  -webkit-box-shadow: 0px 0px 0px 1px rgba(231, 190, 190, 1) !important;
+  box-shadow: 0px 0px 0px 1px rgba(231, 190, 190, 1) !important;
+}
+
+.ui.dropdown.error .menu {
+  -webkit-box-shadow: 0px 0px 1px 1px #E7BEBE !important;
+  -moz-box-shadow: 0px 0px 1px 1px #E7BEBE !important;
+  box-shadow: 0px 0px 1px 1px #E7BEBE !important;
+}
+
+/* Item Hover */
+.ui.dropdown.error .menu .item:hover {
+  background-color: #FFF2F2 !important;
+}
+
+/* Item Active */
+.ui.dropdown.error .menu .active.item {
+  background-color: #FDCFCF !important;
+}
+
+
 /*******************************
            Variations
 *******************************/
 
 /*--------------
@@ -359,41 +406,23 @@
   display: inline-block;
   vertical-align: middle;
   margin-right: 0.5em;
 }
 
-/* Hover */
-.ui.selection.dropdown:hover {
-  -webkit-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) !important;
-  -moz-box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) !important;
-  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2) !important;
-}
-.ui.selection.dropdown:hover .menu {
-  -webkit-box-shadow: 0px 1px 0px 1px #D3D3D3;
-  -moz-box-shadow: 0px 1px 0px 1px #D3D3D3;
-  box-shadow: 0px 1px 0px 1px #D3D3D3;
-}
-.ui.selection.dropdown:hover > .dropdown.icon {
-  opacity: 1;
-}
-
 /* Visible */
 .ui.visible.selection.dropdown {
   border-bottom-left-radius: 0em !important;
   border-bottom-right-radius: 0em !important;
 }
 
 /* Active */
 .ui.active.selection.dropdown {
-
   -webkit-border-radius: 0.3125em 0.3125em 0em 0em !important;
   -moz-border-radius: 0.3125em 0.3125em 0em 0em !important;
   border-radius: 0.3125em 0.3125em 0em 0em !important;
 }
 .ui.active.selection.dropdown > .dropdown.icon {
   opacity: 1;
-}
-.ui.active.selection.dropdown .menu {
 }
 
 /*--------------
       Fluid
 ---------------*/