updated chosen.sass to more recent version from zenaida

littleweaver · Jun 12, 2014 · 42418ed · 42418ed
1 parent f4bdd3a
commit 42418ed
Show file tree

Hide file tree

Showing 2 changed files with 89 additions and 50 deletions.
diff --git a/argus/sass/chosen.sass b/argus/sass/chosen.sass
@@ -13,44 +13,16 @@
 .chosen-container-multi .chosen-choices, .chosen-container-single .chosen-single
 	border: 1px solid $input-border
 	+background(none)
-	+border-radius($input-border-radius)
 	+box-shadow(inset 0 1px 1px rgba($black, 0.075))
+	+border-radius($input-border-radius)
 .chosen-container-active
 	&.chosen-container-multi .chosen-choices, &.chosen-container-single .chosen-single
 		border-color: $input-border-focus
 		+background(none)
 		+border-radius($input-border-radius)
 		+box-shadow(inset 0 1px 1px rgba($black, 0.075), 0 0 8px rgba($brand-primary,0.6))
 
-.chosen-container-multi .chosen-choices
-	padding: 0 2px
-	li.search-field input[type=text]
-		color: $input-color-placeholder
-		padding: 6px 12px
-		height: $input-height-base - 2px
-	li.search-choice
-		height: $input-height-base - 10px
-		margin: 5px 3px
-		padding: 6px 20px 3px 5px
-		border: none
-		+box-shadow(none)
-		+background(none)
-		background-color: $gray-lighter
-		.search-choice-close
-			top: 7px
-			right: 4px
-
-.chosen-container-single .chosen-single
-	padding: 6px 12px
-	height: $input-height-base - 2px
-	div b
-		background-position-y: 6px
-.chosen-container-active.chosen-container-single .chosen-single
-	div b
-		background-position-y: 6px
-
-
-.chosen-container
+.chosen-container-multi
 	.chosen-drop
 		top: 110%
 		border: 1px solid $dropdown-border
@@ -59,6 +31,49 @@
 	.chosen-results li.highlighted
 		+background(none)
 		background-color: $link-hover-color
+	.chosen-choices
+		padding: 0 2px
+		li.search-field input[type=text]
+			color: $input-color-placeholder
+			height: $input-height-base - 2px
+			padding: 0 8px
+		li.search-choice
+			height: $input-height-base - 10px
+			margin: 5px 3px
+			padding: 6px 20px 3px 5px
+			border: none
+			+box-shadow(none)
+			+background(none)
+			background-color: $gray-lighter
+			.search-choice-close
+				top: 7px
+				right: 4px
+
+.chosen-container-single
+	.chosen-single
+		padding: 5px 12px
+		height: $input-height-base
+		div b
+			background-position-y: 6px
+	.chosen-drop
+		top: 90%
+		border: 1px solid $input-border-focus
+		border-top: none
+		+border-top-left-radius(0)
+		+border-top-right-radius(0)
+		+border-bottom-left-radius($input-border-radius)
+		+border-bottom-right-radius($input-border-radius)
+		+box-shadow(0 5px 6px rgba($brand-primary,0.6))
+		overflow: hidden
+	.chosen-results li.highlighted
+		+background(none)
+		background-color: $link-hover-color
+.chosen-container-active.chosen-container-single .chosen-single
+	div b
+		background-position-y: 6px
+
+
+
 
 .input-group .chosen-choices
 	+border-radius(0)

diff --git a/argus/static/argus/css/chosen.css b/argus/static/argus/css/chosen.css
@@ -1,14 +1,14 @@
 .chosen-container-multi .chosen-choices, .chosen-container-single .chosen-single {
   border: 1px solid #cccccc;
   background: none;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   -ms-border-radius: 4px;
   -o-border-radius: 4px;
   border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .chosen-container-active.chosen-container-multi .chosen-choices, .chosen-container-active.chosen-container-single .chosen-single {
@@ -24,13 +24,27 @@
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(118, 81, 200, 0.6);
 }
 
+.chosen-container-multi .chosen-drop {
+  top: 110%;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+  overflow: hidden;
+}
+.chosen-container-multi .chosen-results li.highlighted {
+  background: none;
+  background-color: #52319b;
+}
 .chosen-container-multi .chosen-choices {
   padding: 0 2px;
 }
 .chosen-container-multi .chosen-choices li.search-field input[type=text] {
   color: #999999;
-  padding: 6px 12px;
   height: 33px;
+  padding: 0 8px;
 }
 .chosen-container-multi .chosen-choices li.search-choice {
   height: 25px;
@@ -49,32 +63,42 @@
 }
 
 .chosen-container-single .chosen-single {
-  padding: 6px 12px;
-  height: 33px;
+  padding: 5px 12px;
+  height: 35px;
 }
 .chosen-container-single .chosen-single div b {
   background-position-y: 6px;
 }
-
-.chosen-container-active.chosen-container-single .chosen-single div b {
-  background-position-y: 6px;
-}
-
-.chosen-container .chosen-drop {
-  top: 110%;
-  border: 1px solid rgba(0, 0, 0, 0.15);
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
-  -ms-border-radius: 4px;
-  -o-border-radius: 4px;
-  border-radius: 4px;
+.chosen-container-single .chosen-drop {
+  top: 90%;
+  border: 1px solid #7651c8;
+  border-top: none;
+  -moz-border-radius-topleft: 0;
+  -webkit-border-top-left-radius: 0;
+  border-top-left-radius: 0;
+  -moz-border-radius-topright: 0;
+  -webkit-border-top-right-radius: 0;
+  border-top-right-radius: 0;
+  -moz-border-radius-bottomleft: 4px;
+  -webkit-border-bottom-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  -moz-border-radius-bottomright: 4px;
+  -webkit-border-bottom-right-radius: 4px;
+  border-bottom-right-radius: 4px;
+  -webkit-box-shadow: 0 5px 6px rgba(118, 81, 200, 0.6);
+  -moz-box-shadow: 0 5px 6px rgba(118, 81, 200, 0.6);
+  box-shadow: 0 5px 6px rgba(118, 81, 200, 0.6);
   overflow: hidden;
 }
-.chosen-container .chosen-results li.highlighted {
+.chosen-container-single .chosen-results li.highlighted {
   background: none;
   background-color: #52319b;
 }
 
+.chosen-container-active.chosen-container-single .chosen-single div b {
+  background-position-y: 6px;
+}
+
 .input-group .chosen-choices {
   -webkit-border-radius: 0;
   -moz-border-radius: 0;