Made Chosen look better.

argus/sass/styles.sass

@@ -1,2 +1,32 @@
 @import variables
 @import bootstrap
+
+@import compass/css3/border-radius
+
+// CHOSEN FIXES
+// ------------
+
+// Override jQuery Chosen styles to get it to better integrate with
+// Bootstrap 3.
+
+.chosen-container-multi .chosen-choices li.search-field input[type=text]
+	color: $input-color-placeholder
+	padding: 6px 12px
+	height: $input-height-base - 2px
+
+.chosen-container-multi  .chosen-choices
+	border: 1px solid $input-border
+	+border-radius($input-border-radius)
+
+.chosen-container-active .chosen-choices
+	border-color: $input-border-focus
+
+.chosen-container .chosen-drop
+	top: 110%
+	border: 1px solid $dropdown-border
+	+border-radius($border-radius-base)
+	overflow: hidden
+
+.chosen-container-multi .chosen-choices li.search-choice
+	height: $input-height-base - 10px
+	margin: 5px 3px

argus/static/argus/css/styles.css

@@ -6315,3 +6315,37 @@ button.close {
     display: none !important;
   }
 }
+.chosen-container-multi .chosen-choices li.search-field input[type=text] {
+  color: #999999;
+  padding: 6px 12px;
+  height: 32px;
+}
+
+.chosen-container-multi .chosen-choices {
+  border: 1px solid #cccccc;
+  -webkit-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+}
+
+.chosen-container-active .chosen-choices {
+  border-color: #66afe9;
+}
+
+.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;
+  overflow: hidden;
+}
+
+.chosen-container-multi .chosen-choices li.search-choice {
+  height: 24px;
+  margin: 5px 3px;
+}

argus/static/argus/js/app.js

@@ -1 +1 @@
-$(".chosen-select").chosen();
+$(".chosen-select").chosen({width: "100%"});