From 6b369591c46bd0bc973c489f308cd49717fd9adb Mon Sep 17 00:00:00 2001 From: zetta83 Date: Thu, 19 Nov 2015 23:19:17 +0300 Subject: [PATCH] fixed height for empty option; --- mdl-selectfield.min.css | 2 +- mdl-selectfield.min.css.map | 2 +- src/selectfield/selectfield.scss | 1 + 3 files changed, 3 insertions(+), 2 deletions(-) diff --git a/mdl-selectfield.min.css b/mdl-selectfield.min.css index 3cb26a9..2b21362 100644 --- a/mdl-selectfield.min.css +++ b/mdl-selectfield.min.css @@ -1,3 +1,3 @@ -.mdl-selectfield{position:relative;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;vertical-align:middle;line-height:20px;font-size:16px;padding:20px 0}.mdl-selectfield__select{visibility:visible;font-size:16px;margin:2px 0 3px 0;padding:0;width:100%}.mdl-selectfield__label{color:rgba(0,0,0, 0.26);vertical-align:middle;bottom:0;font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left;-webkit-transition-duration:0.2s;transition-duration:0.2s;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.mdl-selectfield.is-dirty .mdl-selectfield__label,.mdl-selectfield.is-focused .mdl-selectfield__label{color:rgb(63,81,181);font-size:12px;top:4px;visibility:visible}.mdl-selectfield--floating-label.is-invalid .mdl-selectfield__label{color:rgb(222, 50, 38)}.mdl-selectfield__error{color:rgb(222, 50, 38);position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block;white-space:nowrap}.mdl-selectfield.is-invalid .mdl-selectfield__error{visibility:visible}.mdl-selectfield__box{position:absolute;top:24px;left:0;right:0;bottom:19px;border-bottom:1px solid rgba(0,0,0, 0.12);outline:none;z-index:100;overflow:hidden}.mdl-selectfield__box>i{color:rgba(0,0,0, 0.26);position:absolute;top:50%;margin-top:-14px;right:0;line-height:24px;width:24px;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;z-index:99}.mdl-selectfield.is-invalid .mdl-selectfield__box>i{color:rgb(222, 50, 38)}.mdl-selectfield__box .mdl-selectfield__box-value{position:absolute;left:0;top:0;font-size:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;z-index:99;outline:none;white-space:nowrap;width:92%;overflow:hidden}.mdl-selectfield.is-focused .mdl-selectfield__box{outline:none}.mdl-selectfield.is-invalid .mdl-selectfield__box{border-color:rgb(222, 50, 38)}.mdl-selectfield__list-option-box{position:absolute;left:0;top:24px;right:0;display:none;background:rgb(255,255,255);margin:0;padding:0;border:none;border-radius:2px;opacity:0;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.2),0 1px 5px 0 rgba(0,0,0,0.12);-webkit-transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);z-index:-1;min-width:124px;max-height:300px;overflow-x:hidden;overflow-y:auto}.mdl-selectfield__list-option-box ul{margin:0;padding:5px 0;list-style:none}.mdl-selectfield__list-option-box ul>li{font-size:16px;color:rgba(33,33,33,0.87);line-height:19px;min-height:19px;padding:10px 14px 8px 14px;-webkit-transition:background-color cubic-bezier(0.4, 0, 0.2, 1);transition:background-color cubic-bezier(0.4, 0, 0.2, 1);cursor:pointer;outline:none}.mdl-selectfield__list-option-box ul>li:hover,.mdl-selectfield__list-option-box ul>li.is-selected{background-color:#f8f8f8}.mdl-selectfield.is-focused .mdl-selectfield__list-option-box{display:block;opacity:1;z-index:999} +.mdl-selectfield{position:relative;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;vertical-align:middle;line-height:20px;font-size:16px;padding:20px 0}.mdl-selectfield__select{visibility:visible;font-size:16px;margin:2px 0 3px 0;padding:0;width:100%}.mdl-selectfield__label{color:rgba(0,0,0, 0.26);vertical-align:middle;bottom:0;font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left;-webkit-transition-duration:0.2s;transition-duration:0.2s;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.mdl-selectfield.is-dirty .mdl-selectfield__label,.mdl-selectfield.is-focused .mdl-selectfield__label{color:rgb(63,81,181);font-size:12px;top:4px;visibility:visible}.mdl-selectfield--floating-label.is-invalid .mdl-selectfield__label{color:rgb(222, 50, 38)}.mdl-selectfield__error{color:rgb(222, 50, 38);position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block;white-space:nowrap}.mdl-selectfield.is-invalid .mdl-selectfield__error{visibility:visible}.mdl-selectfield__box{position:absolute;top:24px;left:0;right:0;bottom:19px;border-bottom:1px solid rgba(0,0,0, 0.12);outline:none;z-index:100;overflow:hidden}.mdl-selectfield__box>i{color:rgba(0,0,0, 0.26);position:absolute;top:50%;margin-top:-14px;right:0;line-height:24px;width:24px;outline:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;z-index:99}.mdl-selectfield.is-invalid .mdl-selectfield__box>i{color:rgb(222, 50, 38)}.mdl-selectfield__box .mdl-selectfield__box-value{position:absolute;left:0;top:0;font-size:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;z-index:99;outline:none;white-space:nowrap;width:92%;overflow:hidden}.mdl-selectfield.is-focused .mdl-selectfield__box{outline:none}.mdl-selectfield.is-invalid .mdl-selectfield__box{border-color:rgb(222, 50, 38)}.mdl-selectfield__list-option-box{position:absolute;left:0;top:24px;right:0;display:none;background:rgb(255,255,255);margin:0;padding:0;border:none;border-radius:2px;opacity:0;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.2),0 1px 5px 0 rgba(0,0,0,0.12);-webkit-transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);z-index:-1;min-width:124px;max-height:300px;overflow-x:hidden;overflow-y:auto}.mdl-selectfield__list-option-box ul{margin:0;padding:5px 0;list-style:none}.mdl-selectfield__list-option-box ul>li{font-size:16px;color:rgba(33,33,33,0.87);line-height:19px;min-height:19px;padding:10px 14px 8px 14px;-webkit-transition:background-color cubic-bezier(0.4, 0, 0.2, 1);transition:background-color cubic-bezier(0.4, 0, 0.2, 1);cursor:pointer;outline:none;box-sizing:content-box}.mdl-selectfield__list-option-box ul>li:hover,.mdl-selectfield__list-option-box ul>li.is-selected{background-color:#f8f8f8}.mdl-selectfield.is-focused .mdl-selectfield__list-option-box{display:block;opacity:1;z-index:999} /*# sourceMappingURL=mdl-selectfield.min.css.map */ diff --git a/mdl-selectfield.min.css.map b/mdl-selectfield.min.css.map index 7dc4b20..e622e87 100644 --- a/mdl-selectfield.min.css.map +++ b/mdl-selectfield.min.css.map @@ -1 +1 @@ -{"version":3,"sources":["selectfield.css"],"names":[],"mappings":"AAAA,iBAAiB,kBAAkB,qBAAqB,sBAAsB,YAAY,eAAe,SAAS,sBAAsB,iBAAiB,eAAe,cAAc,CAAC,yBAAyB,mBAAmB,eAAe,mBAAmB,UAAU,UAAU,CAAC,wBAAwB,wBAAwB,sBAAsB,SAAS,eAAe,OAAO,QAAQ,oBAAoB,kBAAkB,cAAc,SAAS,WAAW,gBAAgB,mBAAmB,gBAAgB,iCAAA,AAAyB,yBAAA,gEAAA,AAAuD,uDAAA,CAAC,sGAAsG,qBAAqB,eAAe,QAAQ,kBAAkB,CAAC,oEAAoE,sBAAsB,CAAC,wBAAwB,uBAAuB,kBAAkB,eAAe,eAAe,kBAAkB,cAAc,kBAAkB,CAAC,oDAAoD,kBAAkB,CAAC,sBAAsB,kBAAkB,SAAS,OAAO,QAAQ,YAAY,0CAA0C,aAAa,YAAY,eAAe,CAAC,wBAAwB,wBAAwB,kBAAkB,QAAQ,iBAAiB,QAAQ,iBAAiB,WAAW,aAAa,yBAAA,AAAiB,sBAAjB,AAAiB,qBAAjB,AAAiB,iBAAA,eAAe,UAAU,CAAC,oDAAoD,sBAAsB,CAAC,kDAAkD,kBAAkB,OAAO,MAAM,eAAe,yBAAA,AAAiB,sBAAjB,AAAiB,qBAAjB,AAAiB,iBAAA,eAAe,WAAW,aAAa,mBAAmB,UAAU,eAAe,CAAC,kDAAkD,YAAY,CAAC,kDAAkD,6BAA6B,CAAC,kCAAkC,kBAAkB,OAAO,SAAS,QAAQ,aAAa,4BAA4B,SAAS,UAAU,YAAY,kBAAkB,UAAU,oGAAoG,6DAAA,AAAqD,qDAAA,WAAW,gBAAgB,iBAAiB,kBAAkB,eAAe,CAAC,qCAAqC,SAAS,cAAc,eAAe,CAAC,wCAAwC,eAAe,0BAA0B,iBAAiB,gBAAgB,2BAA2B,iEAAA,AAAyD,yDAAA,eAAe,YAAY,CAAC,kGAAkG,wBAAwB,CAAC,8DAA8D,cAAc,UAAU,WAAW,CAAC","file":"mdl-selectfield.min.css","sourcesContent":[".mdl-selectfield{position:relative;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;vertical-align:middle;line-height:20px;font-size:16px;padding:20px 0}.mdl-selectfield__select{visibility:visible;font-size:16px;margin:2px 0 3px 0;padding:0;width:100%}.mdl-selectfield__label{color:rgba(0,0,0, 0.26);vertical-align:middle;bottom:0;font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.mdl-selectfield.is-dirty .mdl-selectfield__label,.mdl-selectfield.is-focused .mdl-selectfield__label{color:rgb(63,81,181);font-size:12px;top:4px;visibility:visible}.mdl-selectfield--floating-label.is-invalid .mdl-selectfield__label{color:rgb(222, 50, 38)}.mdl-selectfield__error{color:rgb(222, 50, 38);position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block;white-space:nowrap}.mdl-selectfield.is-invalid .mdl-selectfield__error{visibility:visible}.mdl-selectfield__box{position:absolute;top:24px;left:0;right:0;bottom:19px;border-bottom:1px solid rgba(0,0,0, 0.12);outline:none;z-index:100;overflow:hidden}.mdl-selectfield__box>i{color:rgba(0,0,0, 0.26);position:absolute;top:50%;margin-top:-14px;right:0;line-height:24px;width:24px;outline:none;user-select:none;cursor:default;z-index:99}.mdl-selectfield.is-invalid .mdl-selectfield__box>i{color:rgb(222, 50, 38)}.mdl-selectfield__box .mdl-selectfield__box-value{position:absolute;left:0;top:0;font-size:16px;user-select:none;cursor:default;z-index:99;outline:none;white-space:nowrap;width:92%;overflow:hidden}.mdl-selectfield.is-focused .mdl-selectfield__box{outline:none}.mdl-selectfield.is-invalid .mdl-selectfield__box{border-color:rgb(222, 50, 38)}.mdl-selectfield__list-option-box{position:absolute;left:0;top:24px;right:0;display:none;background:rgb(255,255,255);margin:0;padding:0;border:none;border-radius:2px;opacity:0;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.2),0 1px 5px 0 rgba(0,0,0,0.12);transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);z-index:-1;min-width:124px;max-height:300px;overflow-x:hidden;overflow-y:auto}.mdl-selectfield__list-option-box ul{margin:0;padding:5px 0;list-style:none}.mdl-selectfield__list-option-box ul>li{font-size:16px;color:rgba(33,33,33,0.87);line-height:19px;min-height:19px;padding:10px 14px 8px 14px;transition:background-color cubic-bezier(0.4, 0, 0.2, 1);cursor:pointer;outline:none}.mdl-selectfield__list-option-box ul>li:hover,.mdl-selectfield__list-option-box ul>li.is-selected{background-color:#f8f8f8}.mdl-selectfield.is-focused .mdl-selectfield__list-option-box{display:block;opacity:1;z-index:999}\n"],"sourceRoot":"/source/"} \ No newline at end of file +{"version":3,"sources":["selectfield.css"],"names":[],"mappings":"AAAA,iBAAiB,kBAAkB,qBAAqB,sBAAsB,YAAY,eAAe,SAAS,sBAAsB,iBAAiB,eAAe,cAAc,CAAC,yBAAyB,mBAAmB,eAAe,mBAAmB,UAAU,UAAU,CAAC,wBAAwB,wBAAwB,sBAAsB,SAAS,eAAe,OAAO,QAAQ,oBAAoB,kBAAkB,cAAc,SAAS,WAAW,gBAAgB,mBAAmB,gBAAgB,iCAAA,AAAyB,yBAAA,gEAAA,AAAuD,uDAAA,CAAC,sGAAsG,qBAAqB,eAAe,QAAQ,kBAAkB,CAAC,oEAAoE,sBAAsB,CAAC,wBAAwB,uBAAuB,kBAAkB,eAAe,eAAe,kBAAkB,cAAc,kBAAkB,CAAC,oDAAoD,kBAAkB,CAAC,sBAAsB,kBAAkB,SAAS,OAAO,QAAQ,YAAY,0CAA0C,aAAa,YAAY,eAAe,CAAC,wBAAwB,wBAAwB,kBAAkB,QAAQ,iBAAiB,QAAQ,iBAAiB,WAAW,aAAa,yBAAA,AAAiB,sBAAjB,AAAiB,qBAAjB,AAAiB,iBAAA,eAAe,UAAU,CAAC,oDAAoD,sBAAsB,CAAC,kDAAkD,kBAAkB,OAAO,MAAM,eAAe,yBAAA,AAAiB,sBAAjB,AAAiB,qBAAjB,AAAiB,iBAAA,eAAe,WAAW,aAAa,mBAAmB,UAAU,eAAe,CAAC,kDAAkD,YAAY,CAAC,kDAAkD,6BAA6B,CAAC,kCAAkC,kBAAkB,OAAO,SAAS,QAAQ,aAAa,4BAA4B,SAAS,UAAU,YAAY,kBAAkB,UAAU,oGAAoG,6DAAA,AAAqD,qDAAA,WAAW,gBAAgB,iBAAiB,kBAAkB,eAAe,CAAC,qCAAqC,SAAS,cAAc,eAAe,CAAC,wCAAwC,eAAe,0BAA0B,iBAAiB,gBAAgB,2BAA2B,iEAAA,AAAyD,yDAAA,eAAe,aAAa,sBAAsB,CAAC,kGAAkG,wBAAwB,CAAC,8DAA8D,cAAc,UAAU,WAAW,CAAC","file":"mdl-selectfield.min.css","sourcesContent":[".mdl-selectfield{position:relative;display:inline-block;box-sizing:border-box;width:300px;max-width:100%;margin:0;vertical-align:middle;line-height:20px;font-size:16px;padding:20px 0}.mdl-selectfield__select{visibility:visible;font-size:16px;margin:2px 0 3px 0;padding:0;width:100%}.mdl-selectfield__label{color:rgba(0,0,0, 0.26);vertical-align:middle;bottom:0;font-size:16px;left:0;right:0;pointer-events:none;position:absolute;display:block;top:24px;width:100%;overflow:hidden;white-space:nowrap;text-align:left;transition-duration:0.2s;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)}.mdl-selectfield.is-dirty .mdl-selectfield__label,.mdl-selectfield.is-focused .mdl-selectfield__label{color:rgb(63,81,181);font-size:12px;top:4px;visibility:visible}.mdl-selectfield--floating-label.is-invalid .mdl-selectfield__label{color:rgb(222, 50, 38)}.mdl-selectfield__error{color:rgb(222, 50, 38);position:absolute;font-size:12px;margin-top:3px;visibility:hidden;display:block;white-space:nowrap}.mdl-selectfield.is-invalid .mdl-selectfield__error{visibility:visible}.mdl-selectfield__box{position:absolute;top:24px;left:0;right:0;bottom:19px;border-bottom:1px solid rgba(0,0,0, 0.12);outline:none;z-index:100;overflow:hidden}.mdl-selectfield__box>i{color:rgba(0,0,0, 0.26);position:absolute;top:50%;margin-top:-14px;right:0;line-height:24px;width:24px;outline:none;user-select:none;cursor:default;z-index:99}.mdl-selectfield.is-invalid .mdl-selectfield__box>i{color:rgb(222, 50, 38)}.mdl-selectfield__box .mdl-selectfield__box-value{position:absolute;left:0;top:0;font-size:16px;user-select:none;cursor:default;z-index:99;outline:none;white-space:nowrap;width:92%;overflow:hidden}.mdl-selectfield.is-focused .mdl-selectfield__box{outline:none}.mdl-selectfield.is-invalid .mdl-selectfield__box{border-color:rgb(222, 50, 38)}.mdl-selectfield__list-option-box{position:absolute;left:0;top:24px;right:0;display:none;background:rgb(255,255,255);margin:0;padding:0;border:none;border-radius:2px;opacity:0;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 3px 1px -2px rgba(0,0,0,0.2),0 1px 5px 0 rgba(0,0,0,0.12);transition:opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);z-index:-1;min-width:124px;max-height:300px;overflow-x:hidden;overflow-y:auto}.mdl-selectfield__list-option-box ul{margin:0;padding:5px 0;list-style:none}.mdl-selectfield__list-option-box ul>li{font-size:16px;color:rgba(33,33,33,0.87);line-height:19px;min-height:19px;padding:10px 14px 8px 14px;transition:background-color cubic-bezier(0.4, 0, 0.2, 1);cursor:pointer;outline:none;box-sizing:content-box}.mdl-selectfield__list-option-box ul>li:hover,.mdl-selectfield__list-option-box ul>li.is-selected{background-color:#f8f8f8}.mdl-selectfield.is-focused .mdl-selectfield__list-option-box{display:block;opacity:1;z-index:999}\n"],"sourceRoot":"/source/"} \ No newline at end of file diff --git a/src/selectfield/selectfield.scss b/src/selectfield/selectfield.scss index 54e174f..dfc1265 100644 --- a/src/selectfield/selectfield.scss +++ b/src/selectfield/selectfield.scss @@ -150,6 +150,7 @@ transition: background-color $animation-curve-default; cursor: pointer; outline: none; + box-sizing: content-box; &:hover, &.is-selected {