[#2695] Update the select2 styles

ckan · Jul 24, 2012 · dd4a78a · dd4a78a
1 parent 2c1c4c7
commit dd4a78a
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 15 deletions.
diff --git a/ckan/public/base/css/main.css b/ckan/public/base/css/main.css
@@ -5440,15 +5440,19 @@ textarea {
   background: url("../images/loading-spinner.gif") no-repeat center right;
   padding-right: 5px;
 }
-.select2-container .select2-choice,
-.select2-container-multi .select2-choices .select2-search-field input {
-  height: 29px;
+.select2-container .select2-choice input,
+.select2-container-multi .select2-choices .select2-search-field:first-child input {
+  font-size: 14px;
+}
+.select2-container .select2-choice input,
+.select2-container-multi .select2-choices .select2-search-field:first-child input {
+  padding-left: 10px;
 }
-.select2-container .select2-choice {
-  padding: 4px 8px 2px;
+.select2-container {
+  margin-top: 5px;
 }
-.select2-container .select2-choice div b {
-  background-position: 0 5px;
+.select2-container-multi {
+  margin-top: 0;
 }
 .select2-container-multi .select2-choices .select2-search-choice {
   padding: 5px 8px 5px 22px;
@@ -5491,6 +5495,9 @@ textarea {
 .select2-container-multi .select2-drop {
   margin-top: -2px;
 }
+.control-full .select2-container {
+  width: 520px !important;
+}
 .dataset-item {
   border-bottom: 1px dotted #ccc;
   padding-bottom: 20px;

diff --git a/ckan/public/base/less/forms.less b/ckan/public/base/less/forms.less
@@ -509,18 +509,24 @@ textarea {
 }
 
 // Select2
-.select2-container .select2-choice,
-.select2-container-multi .select2-choices .select2-search-field input {
-  // Need to compensate for box-sizing: border-box
-  height: 29px;
+
+.select2-container .select2-choice input,
+.select2-container-multi .select2-choices .select2-search-field:first-child input {
+  font-size: 14px;
+}
+
+.select2-container .select2-choice input,
+.select2-container-multi .select2-choices .select2-search-field:first-child input {
+  // Only apply if there are no other tags (ie. is the first child)
+  padding-left: 10px;
 }
 
-.select2-container .select2-choice {
-  padding: 4px 8px 2px;
+.select2-container {
+  margin-top: 5px;
 }
 
-.select2-container .select2-choice div b {
-  background-position: 0 5px;
+.select2-container-multi {
+  margin-top: 0;
 }
 
 .select2-container-multi .select2-choices .select2-search-choice {
@@ -558,3 +564,9 @@ textarea {
 .select2-container-multi .select2-drop {
   margin-top: -2px;
 }
+
+.control-full .select2-container {
+  // Important is bad but select2 incorrectly calculates the width and
+  // sets it on the element.
+  width: 520px !important;
+}