Merge pull request #11 from sg00dwin/fix-jump-of-text-and-dropdown

Minor style changes to prevent text jumping in IE. And addition of gr…

Author: jwforres

labelFilter.css

@@ -402,6 +402,7 @@
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#00000000', GradientType=0);
 }
 .selectize-control.multi .selectize-input [data-value] {
+  padding: 0 6px;
   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
   -webkit-border-radius: 1px;
   -moz-border-radius: 1px;
@@ -430,7 +431,7 @@
 .filter .navbar-filter-widget .label-filter {
   background: #ffffff;
   float: left;
-  min-width: 250px;
+  min-width: 230px;
   min-height: 41px;
   border: 1px solid #b7b7b7;
   border-radius: 1px;
@@ -454,6 +455,7 @@
 }
 .filter .navbar-filter-widget .label-filter .selectize-control .selectize-input input {
   font-size: 15px;
+  height: 24px;
 }
 .filter .navbar-filter-widget .label-filter .selectize-control .selectize-dropdown {
   min-width: 100px;
@@ -464,7 +466,7 @@
   border: 1px solid #b7b7b7;
 }
 .filter .navbar-filter-widget .label-filter .selectize-control.label-filter-key .selectize-input.not-full {
-  width: 250px;
+  width: 230px;
 }
 .filter .navbar-filter-widget .label-filter-add.btn {
   border-left: 0;

package.json

@@ -7,12 +7,14 @@
     "url": "git://github.com/kubernetes-ui/label-selector.git"
   },
   "main": "labelFilter.js",
-  "dependencies": {},
+  "dependencies": {
+  },
   "devDependencies": {
     "grunt": "~0.4.5",
     "grunt-contrib-connect": "~0.9.0",
     "grunt-contrib-jshint": "~0.11.1",
     "grunt-contrib-less": "~1.0.0",
+    "grunt-contrib-watch": "^0.6.1",
     "grunt-wiredep": "~2.0.0"
   },
   "scripts": {

styles/labelFilter.less

@@ -26,7 +26,7 @@
 @screen-md-min:              @screen-md;
 @screen-desktop:             @screen-md-min;
 
-@label-filter-default-width: 250px;
+@label-filter-default-width: 230px;
 @selectize-active-label-bg: #006e9c;
 @selectize-arrow-size: 0;
 @selectize-border-radius: 1px;
@@ -87,6 +87,7 @@
   &.multi {
     .selectize-input {
       [data-value] {
+        padding: 0 6px; // prevent text jump when 
         text-shadow: 0 1px 0 rgba(0,0,0,0.2);
         .selectize-border-radius(1px);
         .selectize-vertical-gradient(@selectize-color-item, @selectize-color-item);
@@ -127,6 +128,7 @@
           }
           input {
             font-size: @font-size-large;
+            height: 24px; // keep IE from clipping text descenders
           }
         }
         .selectize-dropdown {