Fixed CSS issue on create/update User using Select2. Closes #83.

Signed-off-by: crynobone <crynobone@gmail.com>
orchestral · Aug 3, 2013 · bd7eb08 · bd7eb08
1 parent dcfd2d5
commit bd7eb08
Show file tree

Hide file tree

Showing 2 changed files with 33 additions and 15 deletions.
diff --git a/public/css/style.css b/public/css/style.css
@@ -42,6 +42,7 @@
 body{background:#eeeff2;font-family:'Roboto',Helvetica,sans-serif;}
 form fieldset legend{clear:0;padding:20px 0 0;}
 form label.checkboxes{font-weight:normal;}
+form .form-group .select2-container{width:100%;}
 form.navbar-form input[role="keyword"]{margin-top:5px;padding:8px 6px;width:250px;}
 form.navbar-form select[role="roles"]{min-width:200px;}
 @media (max-width:768px){form.navbar-form input[type="submit"]{margin-top:4px;}}
@@ -66,8 +67,10 @@ section.container.main{clear:both;margin-top:40px;}section.container.main .theme
 .rounded-bottom{border-bottom-right-radius:4px;border-bottom-left-radius:4px;}
 .rounded-top{border-top-right-radius:4px;border-top-left-radius:4px;}
 .select2-container.col,.select2-container.columns{padding-left:0 !important;padding-right:0 !important;}
+.select2-container.select2-container-multi{min-width:200px;}.select2-container.select2-container-multi .select2-choices{min-width:200px;height:40px !important;}.select2-container.select2-container-multi .select2-choices .select2-search-choice{line-height:23px !important;}.select2-container.select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close{top:8px !important;}
+.select2-container.select2-container-multi .select2-choices .select2-search-field input{height:40px !important;max-height:40px;}
 .table tbody td .meta{font-size:11px;}
-.user-search{background:#eeeff2;margin-bottom:5px;}.user-search .navbar-form .select2-container{margin-top:5px;}.user-search .navbar-form .select2-container.select2-container-multi{min-width:200px;}.user-search .navbar-form .select2-container.select2-container-multi .select2-choices{min-width:200px;height:40px !important;}.user-search .navbar-form .select2-container.select2-container-multi .select2-choices .select2-search-field input{height:40px !important;max-height:40px;}
+.user-search{background:#eeeff2;margin-bottom:5px;}.user-search .navbar-form .select2-container{margin-top:5px;}
 form label.ui-state-active{background:transparent;}
 form .ui-slider .ui-slider-handle{z-index:1;}
 table.ui-datepicker-calendar td.ui-datepicker-unselectable.ui-state-disabled span.ui-state-default{display:block;padding:0 !important;border:0 none !important;width:30px;height:30px;line-height:30px;text-align:center;font-size:12px;text-decoration:none;font-weight:normal !important;}

diff --git a/public/css/style.less b/public/css/style.less
@@ -29,6 +29,12 @@ form {
 		font-weight: normal;
 	}
 
+	.form-group {
+		.select2-container {
+			width: 100%;
+		}
+	}
+
 	&.navbar-form {
 		input[role="keyword"] {
 			margin-top: 5px;
@@ -225,10 +231,33 @@ section {
 }
 
 .select2-container {
+
 	&.col, &.columns {
 		padding-left: 0 !important;
 		padding-right: 0 !important;
 	}
+
+	&.select2-container-multi {
+		min-width: 200px;
+
+		.select2-choices {
+			min-width: 200px;
+			height: 40px !important;
+
+			.select2-search-choice {
+				line-height: 23px !important;
+
+				.select2-search-choice-close {
+					top: 8px !important;
+				}
+			}
+
+			.select2-search-field input {
+				height: 40px !important;
+				max-height: 40px;
+			}
+		}
+	}
 }
 
 .table {
@@ -246,20 +275,6 @@ section {
 	.navbar-form {
 		.select2-container {
 			margin-top: 5px;
-
-			&.select2-container-multi {
-				min-width: 200px;
-
-				.select2-choices {
-					min-width: 200px;
-					height: 40px !important;
-
-					.select2-search-field input {
-						height: 40px !important;
-						max-height: 40px;
-					}
-				}
-			}
 		}
 	}