diff --git a/lib/item-quantity-dropdown.min.css b/lib/item-quantity-dropdown.min.css index c06c500..4c4ca91 100644 --- a/lib/item-quantity-dropdown.min.css +++ b/lib/item-quantity-dropdown.min.css @@ -1,4 +1,3 @@ -@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700); html{box-sizing:border-box}html *{box-sizing:inherit}html *::after,html *::before{box-sizing:inherit}body{margin:0;position:inherit}.iqdropdown{-webkit-tap-highlight-color:transparent;box-sizing:border-box}.iqdropdown *{-webkit-tap-highlight-color:transparent;box-sizing:border-box}.iqdropdown *::after,.iqdropdown *::before{box-sizing:inherit}.iqdropdown *:not(input){-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.iqdropdown *:focus{outline:none}.iqdropdown h1,.iqdropdown h2,.iqdropdown h3,.iqdropdown h4,.iqdropdown h5,.iqdropdown h6{margin:0}.iqdropdown p{margin:0}.iqdropdown ul,.iqdropdown ol{list-style-type:none;margin:0;padding:0}.iqdropdown a{cursor:pointer}.iqdropdown button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;cursor:pointer;margin:0;padding:0}.iqdropdown select::-ms-expand{display:none}.iqdropdown input::-ms-clear{display:none;height:0;width:0}.iqdropdown .icon-decrement{display:inline-block;height:15px;margin:auto;min-width:15px;position:relative;width:15px}.iqdropdown .icon-decrement::after{background:#002674;content:'';display:block;height:3px;position:absolute;top:6px;transition:-webkit-transform 0.25s ease-in-out;transition:transform 0.25s ease-in-out;transition:transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;width:15px}.iqdropdown .icon-decrement.icon-increment::before{background:#002674;content:'';display:block;height:3px;position:absolute;top:6px;-webkit-transform:rotate(90deg);transform:rotate(90deg);transition:-webkit-transform 0.25s ease-in-out;transition:transform 0.25s ease-in-out;transition:transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;width:15px}.iqdropdown .iqdropdown-menu{background-color:#FFFFFF;box-shadow:0 0 10px rgba(0,0,0,0.2);cursor:default;display:none;left:0;margin:-2px -1px -1px;position:absolute;right:0;top:50px;transition:all 0.2s ease-in-out;z-index:99999}.iqdropdown .iqdropdown-menu-option{align-items:center;display:flex;height:75px;padding:0 15px}.iqdropdown .iqdropdown-menu-option:last-child{border:0}.iqdropdown .iqdropdown-menu-close{color:#002674;font-family:"OpenSans",sans-serif;font-size:14px;font-weight:600;height:20px;margin:20px 0;padding:0 15px;text-align:right;width:100%}.iqdropdown.menu-open .iqdropdown-menu{display:block}@media only screen and (max-width: 640px){.iqdropdown .iqdropdown-menu.mobile-top-menu{top:-285px}}.iqdropdown-content{flex:1;padding-right:10px}.iqdropdown-item{color:#000;font-family:"OpenSans",sans-serif;font-size:17px;font-weight:400}.iqdropdown p.iqdropdown-description{color:#4A4A4A;font-family:"OpenSans",sans-serif;font-size:14px;font-weight:400;margin-top:5px}.iqdropdown .iqdropdown-item-controls{display:flex;height:45px}.iqdropdown .iqdropdown-item-controls .counter{color:#4A4A4A;font-family:"OpenSans",sans-serif;font-size:17px;font-weight:400;border-bottom:1px solid #E2E2E2;border-top:1px solid #E2E2E2;padding:11px 20px}.iqdropdown .iqdropdown-item-controls button{align-items:center;border:1px solid #E2E2E2;display:flex;height:45px;padding:0 20px;transition:all 0.2s ease-in-out}.iqdropdown .iqdropdown-item-controls button:hover{background-color:#eee}.iqdropdown .iqdropdown-item-controls button.button-decrement{border-bottom-left-radius:25px;border-top-left-radius:25px}.iqdropdown .iqdropdown-item-controls button.button-increment{border-bottom-right-radius:25px;border-top-right-radius:25px}.iqdropdown{align-items:center;border:1px solid #E2E2E2;border-radius:4px;cursor:pointer;display:flex;height:50px;justify-content:space-between;padding:0 15px;position:relative;width:100%}.iqdropdown .iqdropdown-selection{color:#4A4A4A;font-family:"OpenSans",sans-serif;font-size:17px;font-weight:400;flex:1;position:relative}.iqdropdown .iqdropdown-selection::after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAMCAMAAABGBS09AAAAeFBMVEVMaXGVlZWRkZGRkZH///+UlJSRkZGQkJCRkZGZmZmRkZGRkZGSkpKRkZGVlZWQkJCdnZ2QkJCVlZWUlJSQkJCXl5eRkZGSkpKRkZGSkpKRkZGRkZGRkZGRkZGQkJCQkJCRkZGSkpKQkJCRkZGTk5OSkpKRkZGQkJAWlBl2AAAAJ3RSTlMAHcnXATdy+f4FzLJg5ySKDYgMJuYbSm61XtmUmcc1qkiq9fVHWVidqGmEAAAAhUlEQVR42o2O5w7CYAhF6e7XvfdwtN73f0OhatLUxnj+wMklAP2mHGpFX6h6KLn0QFcds6oDeq6rC6DJ91HeAHAf0k4jACdOPlESOwDG6WVmW7CFgblJELIULcubLJVh3SKydFmTZrQn8uXMdZYH/IiOXAxsGAudoOwbcLcVnaN5nkb/8gRapQtVGGewNQAAAABJRU5ErkJggg==);background-position:center;background-repeat:no-repeat;background-size:contain;content:'';display:inline-block;height:5px;width:12px;position:absolute;right:0;top:40%}.iqdropdown.menu-open{border-color:#002674}.iqdropdown.menu-open .iqdropdown-selection::after{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAMCAMAAABGBS09AAAAe1BMVEVMaXH///+ZmZmqqqqVlZWdnZ2Xl5eVlZWVlZWUlJSQkJCUlJSTk5ORkZGRkZGRkZGSkpKRkZGSkpKSkpKRkZGQkJCRkZGRkZGRkZGQkJCSkpKRkZGRkZGRkZGRkZGRkZGRkZGRkZGQkJCRkZGQkJCRkZGQkJCRkZGQkJAwdLQhAAAAKHRSTlMAAQUGDA0bHSQmNTdHSEpYWV1gbnKIi5SZqqqytcfJzNfZ5uf19fn+jEECQQAAAIhJREFUeNqNj+cSwkAIhLn0Znoz7dLD+z9hII6OJTruH5b9mDuAv2VKaX5BSjojLqlyxi49Huq9D2TVlG/VdaNSWy9Iy1YKOxfA7cismfZAIhopmWJxNPFEzRiJG3NaHs71+6ye8zOtwz7kbxobnmQ3vEBArkAcfHiTPyAWVI0yOTlNTUoDfmoHOBIMkOONx34AAAAASUVORK5CYII=)} diff --git a/lib/item-quantity-dropdown.min.css.map b/lib/item-quantity-dropdown.min.css.map index 06e7fcd..ed0479f 100644 --- a/lib/item-quantity-dropdown.min.css.map +++ b/lib/item-quantity-dropdown.min.css.map @@ -1 +1 @@ -{"version":3,"sources":["webpack://item-quantity-dropdown/./src/styles/_reset.scss","webpack://item-quantity-dropdown/./src/styles/lib/_icons.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_variables.scss","webpack://item-quantity-dropdown/./src/styles/component/_iqdropdown-menu.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_mixins.scss","webpack://item-quantity-dropdown/./src/styles/component/_item-description.scss","webpack://item-quantity-dropdown/./src/styles/component/_controls.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_design-system.scss","webpack://item-quantity-dropdown/./src/styles/component/_iqdropdown.scss"],"names":[],"mappings":";AAEA,KACE,qBAAsB,CADxB,OAII,kBAAmB,CAJvB,6BAQM,kBAAmB,CACpB,KAKH,SACA,gBAAiB,CAClB,YAIC,wCACA,qBAAsB,CAHxB,cAOI,wCACA,qBAAsB,CAR1B,2CAYM,kBAAmB,CAZzB,yBAgBM,oFAAiB,CAhBvB,oBAoBM,YAAa,CApBnB,0FA8BI,QAAS,CA9Bb,cAkCI,QAAS,CAlCb,8BAuCI,qBACA,SACA,SAAU,CAzCd,cA6CI,cAAe,CA7CnB,mBAiDI,6DACA,gBACA,SACA,eACA,SACA,SAAU,CAtDd,+BA0DI,YAAa,CA1DjB,6BA8DI,aACA,SACA,OAAQ,CACT,4BCpFD,qBACA,YACA,YACA,eACA,kBACA,UCIyB,CDV3B,mCASI,mBACA,WACA,cACA,WACA,kBACA,QACA,kKACA,UCNuB,CDV3B,mDAoBI,mBACA,WACA,cACA,WACA,kBACA,QACA,wDACA,kKACA,UClBuB,CDmBxB,6BE3BC,yBACA,oCACA,eACA,aACA,OACA,sBACA,kBACA,QACA,SACA,gCACA,aAAc,CAZlB,oCAgBM,mBACA,aACA,YACA,cAAe,CCEnB,+CACE,QAAW,CACZ,mCApBD,cACA,kCACA,eACA,gBDkBI,YACA,cACA,eACA,iBACA,UAAW,CA5BjB,uCAiCI,aAAc,CACf,0CAID,6CACE,UAAW,CACZ,CEvCD,oBACE,OACA,kBAAmB,CACpB,iBDDD,WACA,kCACA,eACA,eAJgF,CCFlF,qCDGE,cACA,kCACA,eACA,gBCME,cAAe,CAChB,sCCZD,aACA,WJU6B,CIZ/B,+CFGE,cACA,kCACA,eACA,gBEAE,gCACA,6BACA,iBAAkB,CARtB,6CAYI,mBACA,yBACA,aACA,YACA,eACA,+BAAgC,CAjBpC,mDAoBM,qBCHY,CDjBlB,8DAwBM,+BACA,2BJhBkB,CITxB,8DA6BM,gCACA,4BJrBkB,CMJxB,YACE,mBACA,yBACA,kBACA,eACA,aACA,YACA,8BACA,eACA,kBACA,UAAW,CAVb,kCJFE,cACA,kCACA,eACA,gBIaE,OACA,iBAAkB,CAftB,yCJKE,+CACA,2BACA,4BACA,wBACA,WACA,qBACA,WACA,WIOI,kBACA,QACA,OAAQ,CArBd,sBA0BI,oBDnBiB,CCPrB,mDA6BM,8CAAkE,CACnE","file":"item-quantity-dropdown.min.css","sourcesContent":["// Reset Styles\n\nhtml {\n box-sizing: border-box;\n\n * {\n box-sizing: inherit;\n\n &::after,\n &::before {\n box-sizing: inherit;\n }\n }\n}\n\nbody {\n margin: 0;\n position: inherit;\n}\n\n.iqdropdown {\n // This feature is non-standard, it will not work for every user\n -webkit-tap-highlight-color: transparent;\n box-sizing: border-box;\n\n * {\n // This feature is non-standard, it will not work for every user\n -webkit-tap-highlight-color: transparent;\n box-sizing: border-box;\n\n &::after,\n &::before {\n box-sizing: inherit;\n }\n\n &:not(input) {\n user-select: none;\n }\n\n &:focus {\n outline: none;\n }\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n }\n\n p {\n margin: 0;\n }\n\n ul,\n ol {\n list-style-type: none;\n margin: 0;\n padding: 0;\n }\n\n a {\n cursor: pointer;\n }\n\n button {\n appearance: none;\n background: none;\n border: 0;\n cursor: pointer;\n margin: 0;\n padding: 0;\n }\n\n select::-ms-expand {\n display: none;\n }\n\n input::-ms-clear {\n display: none;\n height: 0;\n width: 0;\n }\n}\n",".iqdropdown .icon-decrement {\n display: inline-block;\n height: $iqdropdown-icon-size;\n margin: auto;\n min-width: $iqdropdown-icon-size;\n position: relative;\n width: $iqdropdown-icon-size;\n\n &::after {\n background: $iqdropdown-icon-color;\n content: '';\n display: block;\n height: 3px;\n position: absolute;\n top: 6px;\n transition: transform 0.25s ease-in-out;\n width: $iqdropdown-icon-size;\n }\n\n &.icon-increment::before {\n background: $iqdropdown-icon-color;\n content: '';\n display: block;\n height: 3px;\n position: absolute;\n top: 6px;\n transform: rotate(90deg);\n transition: transform 0.25s ease-in-out;\n width: $iqdropdown-icon-size;\n }\n}\n","// Variables used in project\n\n$iqdropdown-item-color: #000000 !default;\n$iqdropdown-border: 1px solid $gray-200 !default;\n$iqdropdown-border-active: $primary-700 !default;\n$iqdropdown-shadow: 0 0 10px rgba(0, 0, 0, 0.2) !default;\n$iqdropdown-background-hover: $gray-100 !default;\n$iqdropdown-height: 50px !default;\n$iqdropdown-menu-height: 75px !default;\n$iqdropdown-radius: 25px !default;\n$iqdropdown-icon-size: 15px !default;\n$iqdropdown-icon-color: $primary-700 !default;\n$iqdropdown-controls-size: 45px !default;\n$iqdropdown-close-size: 20px !default;\n",".iqdropdown {\n .iqdropdown-menu {\n background-color: #FFFFFF;\n box-shadow: $iqdropdown-shadow;\n cursor: default;\n display: none;\n left: 0;\n margin: -2px -1px -1px;\n position: absolute;\n right: 0;\n top: $iqdropdown-height;\n transition: all 0.2s ease-in-out;\n z-index: 99999;\n\n &-option {\n @include last-child('border');\n align-items: center;\n display: flex;\n height: $iqdropdown-menu-height;\n padding: 0 15px;\n }\n\n &-close {\n @include font-styles($iqdropdown-fontsize-m, $primary-700, 600);\n height: $iqdropdown-close-size;\n margin: 20px 0;\n padding: 0 15px;\n text-align: right;\n width: 100%;\n }\n }\n\n &.menu-open .iqdropdown-menu {\n display: block;\n }\n}\n\n@media only screen and (max-width: 640px) {\n .iqdropdown .iqdropdown-menu.mobile-top-menu {\n top: -285px;\n }\n}\n","// Miscellaneous mixins\n\n@mixin font-styles ($size: $iqdropdown-fontsize-l, $color: $gray-900, $weight: 400, $family: $primary-font) {\n color: $color;\n font-family: $family;\n font-size: $size;\n font-weight: $weight;\n}\n\n@mixin background-image ($imgpath, $height, $width: 100%, $display: inline-block, $bg-size: contain, $bg-pos: center) {\n background-image: url($imgpath);\n background-position: $bg-pos;\n background-repeat: no-repeat;\n background-size: $bg-size;\n content: '';\n display: $display;\n height: $height;\n width: $width;\n}\n\n@mixin last-child($prop: margin) {\n &:last-child {\n #{$prop}: 0;\n }\n}\n",".iqdropdown {\n &-content {\n flex: 1;\n padding-right: 10px;\n }\n\n &-item {\n @include font-styles($color: $iqdropdown-item-color);\n }\n\n p.iqdropdown-description {\n @include font-styles($iqdropdown-fontsize-m);\n margin-top: 5px;\n }\n}\n",".iqdropdown .iqdropdown-item-controls {\n display: flex;\n height: $iqdropdown-controls-size;\n\n .counter {\n @include font-styles;\n border-bottom: $iqdropdown-border;\n border-top: $iqdropdown-border;\n padding: 11px 20px;\n }\n\n button {\n align-items: center;\n border: $iqdropdown-border;\n display: flex;\n height: $iqdropdown-controls-size;\n padding: 0 20px;\n transition: all 0.2s ease-in-out;\n\n &:hover {\n background-color: $iqdropdown-background-hover;\n }\n\n &.button-decrement {\n border-bottom-left-radius: $iqdropdown-radius;\n border-top-left-radius: $iqdropdown-radius;\n }\n\n &.button-increment {\n border-bottom-right-radius: $iqdropdown-radius;\n border-top-right-radius: $iqdropdown-radius;\n }\n }\n}\n","// ColorSystem and fontfamily for the Reservamos theme\n// Each variable inside uses the !default keyword\n\n@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700');\n\n$primary-font: 'OpenSans', sans-serif !default;\n\n$iqdropdown-fontsize-m: 14px !default;\n$iqdropdown-fontsize-l: 17px !default;\n\n// Color System\n// Primary colors ----------\n$primary-700: #002674 !default;\n\n// GrayScale ----------\n$gray-900: #4A4A4A !default;\n$gray-200: #E2E2E2 !default;\n$gray-100: #EEEEEE !default;\n","@import '../app';\n@import 'iqdropdown-menu';\n@import 'item-description';\n@import 'controls';\n\n.iqdropdown {\n align-items: center;\n border: $iqdropdown-border;\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n height: $iqdropdown-height;\n justify-content: space-between;\n padding: 0 15px;\n position: relative;\n width: 100%;\n\n .iqdropdown-selection {\n @include font-styles($iqdropdown-fontsize-l);\n flex: 1;\n position: relative;\n\n &::after {\n @include background-image('../../../images/dropdown-arrow-down.png', 5px, 12px);\n position: absolute;\n right: 0;\n top: 40%;\n }\n }\n\n &.menu-open {\n border-color: $iqdropdown-border-active;\n\n .iqdropdown-selection::after {\n background-image: url('../../../src/images/dropdown-arrow-up.png');\n }\n }\n}\n"],"sourceRoot":""} \ No newline at end of file +{"version":3,"sources":["webpack://item-quantity-dropdown/./src/styles/_reset.scss","webpack://item-quantity-dropdown/./src/styles/lib/_icons.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_variables.scss","webpack://item-quantity-dropdown/./src/styles/component/_iqdropdown-menu.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_mixins.scss","webpack://item-quantity-dropdown/./src/styles/component/_item-description.scss","webpack://item-quantity-dropdown/./src/styles/component/_controls.scss","webpack://item-quantity-dropdown/./src/styles/lib/helpers/_design-system.scss","webpack://item-quantity-dropdown/./src/styles/component/_iqdropdown.scss"],"names":[],"mappings":"AAEA,KACE,qBAAsB,CADxB,OAII,kBAAmB,CAJvB,6BAQM,kBAAmB,CACpB,KAKH,SACA,gBAAiB,CAClB,YAIC,wCACA,qBAAsB,CAHxB,cAOI,wCACA,qBAAsB,CAR1B,2CAYM,kBAAmB,CAZzB,yBAgBM,oFAAiB,CAhBvB,oBAoBM,YAAa,CApBnB,0FA8BI,QAAS,CA9Bb,cAkCI,QAAS,CAlCb,8BAuCI,qBACA,SACA,SAAU,CAzCd,cA6CI,cAAe,CA7CnB,mBAiDI,6DACA,gBACA,SACA,eACA,SACA,SAAU,CAtDd,+BA0DI,YAAa,CA1DjB,6BA8DI,aACA,SACA,OAAQ,CACT,4BCpFD,qBACA,YACA,YACA,eACA,kBACA,UCIyB,CDV3B,mCASI,mBACA,WACA,cACA,WACA,kBACA,QACA,kKACA,UCNuB,CDV3B,mDAoBI,mBACA,WACA,cACA,WACA,kBACA,QACA,wDACA,kKACA,UClBuB,CDmBxB,6BE3BC,yBACA,oCACA,eACA,aACA,OACA,sBACA,kBACA,QACA,SACA,gCACA,aAAc,CAZlB,oCAgBM,mBACA,aACA,YACA,cAAe,CCEnB,+CACE,QAAW,CACZ,mCApBD,cACA,kCACA,eACA,gBDkBI,YACA,cACA,eACA,iBACA,UAAW,CA5BjB,uCAiCI,aAAc,CACf,0CAID,6CACE,UAAW,CACZ,CEvCD,oBACE,OACA,kBAAmB,CACpB,iBDDD,WACA,kCACA,eACA,eAJgF,CCFlF,qCDGE,cACA,kCACA,eACA,gBCME,cAAe,CAChB,sCCZD,aACA,WJU6B,CIZ/B,+CFGE,cACA,kCACA,eACA,gBEAE,gCACA,6BACA,iBAAkB,CARtB,6CAYI,mBACA,yBACA,aACA,YACA,eACA,+BAAgC,CAjBpC,mDAoBM,qBCLY,CDflB,8DAwBM,+BACA,2BJhBkB,CITxB,8DA6BM,gCACA,4BJrBkB,CMJxB,YACE,mBACA,yBACA,kBACA,eACA,aACA,YACA,8BACA,eACA,kBACA,UAAW,CAVb,kCJFE,cACA,kCACA,eACA,gBIaE,OACA,iBAAkB,CAftB,yCJKE,+CACA,2BACA,4BACA,wBACA,WACA,qBACA,WACA,WIOI,kBACA,QACA,OAAQ,CArBd,sBA0BI,oBDrBiB,CCLrB,mDA6BM,8CAAkE,CACnE","file":"item-quantity-dropdown.min.css","sourcesContent":["// Reset Styles\n\nhtml {\n box-sizing: border-box;\n\n * {\n box-sizing: inherit;\n\n &::after,\n &::before {\n box-sizing: inherit;\n }\n }\n}\n\nbody {\n margin: 0;\n position: inherit;\n}\n\n.iqdropdown {\n // This feature is non-standard, it will not work for every user\n -webkit-tap-highlight-color: transparent;\n box-sizing: border-box;\n\n * {\n // This feature is non-standard, it will not work for every user\n -webkit-tap-highlight-color: transparent;\n box-sizing: border-box;\n\n &::after,\n &::before {\n box-sizing: inherit;\n }\n\n &:not(input) {\n user-select: none;\n }\n\n &:focus {\n outline: none;\n }\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0;\n }\n\n p {\n margin: 0;\n }\n\n ul,\n ol {\n list-style-type: none;\n margin: 0;\n padding: 0;\n }\n\n a {\n cursor: pointer;\n }\n\n button {\n appearance: none;\n background: none;\n border: 0;\n cursor: pointer;\n margin: 0;\n padding: 0;\n }\n\n select::-ms-expand {\n display: none;\n }\n\n input::-ms-clear {\n display: none;\n height: 0;\n width: 0;\n }\n}\n",".iqdropdown .icon-decrement {\n display: inline-block;\n height: $iqdropdown-icon-size;\n margin: auto;\n min-width: $iqdropdown-icon-size;\n position: relative;\n width: $iqdropdown-icon-size;\n\n &::after {\n background: $iqdropdown-icon-color;\n content: '';\n display: block;\n height: 3px;\n position: absolute;\n top: 6px;\n transition: transform 0.25s ease-in-out;\n width: $iqdropdown-icon-size;\n }\n\n &.icon-increment::before {\n background: $iqdropdown-icon-color;\n content: '';\n display: block;\n height: 3px;\n position: absolute;\n top: 6px;\n transform: rotate(90deg);\n transition: transform 0.25s ease-in-out;\n width: $iqdropdown-icon-size;\n }\n}\n","// Variables used in project\n\n$iqdropdown-item-color: #000000 !default;\n$iqdropdown-border: 1px solid $gray-200 !default;\n$iqdropdown-border-active: $primary-700 !default;\n$iqdropdown-shadow: 0 0 10px rgba(0, 0, 0, 0.2) !default;\n$iqdropdown-background-hover: $gray-100 !default;\n$iqdropdown-height: 50px !default;\n$iqdropdown-menu-height: 75px !default;\n$iqdropdown-radius: 25px !default;\n$iqdropdown-icon-size: 15px !default;\n$iqdropdown-icon-color: $primary-700 !default;\n$iqdropdown-controls-size: 45px !default;\n$iqdropdown-close-size: 20px !default;\n",".iqdropdown {\n .iqdropdown-menu {\n background-color: #FFFFFF;\n box-shadow: $iqdropdown-shadow;\n cursor: default;\n display: none;\n left: 0;\n margin: -2px -1px -1px;\n position: absolute;\n right: 0;\n top: $iqdropdown-height;\n transition: all 0.2s ease-in-out;\n z-index: 99999;\n\n &-option {\n @include last-child('border');\n align-items: center;\n display: flex;\n height: $iqdropdown-menu-height;\n padding: 0 15px;\n }\n\n &-close {\n @include font-styles($iqdropdown-fontsize-m, $primary-700, 600);\n height: $iqdropdown-close-size;\n margin: 20px 0;\n padding: 0 15px;\n text-align: right;\n width: 100%;\n }\n }\n\n &.menu-open .iqdropdown-menu {\n display: block;\n }\n}\n\n@media only screen and (max-width: 640px) {\n .iqdropdown .iqdropdown-menu.mobile-top-menu {\n top: -285px;\n }\n}\n","// Miscellaneous mixins\n\n@mixin font-styles ($size: $iqdropdown-fontsize-l, $color: $gray-900, $weight: 400, $family: $primary-font) {\n color: $color;\n font-family: $family;\n font-size: $size;\n font-weight: $weight;\n}\n\n@mixin background-image ($imgpath, $height, $width: 100%, $display: inline-block, $bg-size: contain, $bg-pos: center) {\n background-image: url($imgpath);\n background-position: $bg-pos;\n background-repeat: no-repeat;\n background-size: $bg-size;\n content: '';\n display: $display;\n height: $height;\n width: $width;\n}\n\n@mixin last-child($prop: margin) {\n &:last-child {\n #{$prop}: 0;\n }\n}\n",".iqdropdown {\n &-content {\n flex: 1;\n padding-right: 10px;\n }\n\n &-item {\n @include font-styles($color: $iqdropdown-item-color);\n }\n\n p.iqdropdown-description {\n @include font-styles($iqdropdown-fontsize-m);\n margin-top: 5px;\n }\n}\n",".iqdropdown .iqdropdown-item-controls {\n display: flex;\n height: $iqdropdown-controls-size;\n\n .counter {\n @include font-styles;\n border-bottom: $iqdropdown-border;\n border-top: $iqdropdown-border;\n padding: 11px 20px;\n }\n\n button {\n align-items: center;\n border: $iqdropdown-border;\n display: flex;\n height: $iqdropdown-controls-size;\n padding: 0 20px;\n transition: all 0.2s ease-in-out;\n\n &:hover {\n background-color: $iqdropdown-background-hover;\n }\n\n &.button-decrement {\n border-bottom-left-radius: $iqdropdown-radius;\n border-top-left-radius: $iqdropdown-radius;\n }\n\n &.button-increment {\n border-bottom-right-radius: $iqdropdown-radius;\n border-top-right-radius: $iqdropdown-radius;\n }\n }\n}\n","// ColorSystem and fontfamily for the Reservamos theme\n// Each variable inside uses the !default keyword\n\n$primary-font: 'OpenSans', sans-serif !default;\n\n$iqdropdown-fontsize-m: 14px !default;\n$iqdropdown-fontsize-l: 17px !default;\n\n// Color System\n// Primary colors ----------\n$primary-700: #002674 !default;\n\n// GrayScale ----------\n$gray-900: #4A4A4A !default;\n$gray-200: #E2E2E2 !default;\n$gray-100: #EEEEEE !default;\n","@import '../app';\n@import 'iqdropdown-menu';\n@import 'item-description';\n@import 'controls';\n\n.iqdropdown {\n align-items: center;\n border: $iqdropdown-border;\n border-radius: 4px;\n cursor: pointer;\n display: flex;\n height: $iqdropdown-height;\n justify-content: space-between;\n padding: 0 15px;\n position: relative;\n width: 100%;\n\n .iqdropdown-selection {\n @include font-styles($iqdropdown-fontsize-l);\n flex: 1;\n position: relative;\n\n &::after {\n @include background-image('../../../images/dropdown-arrow-down.png', 5px, 12px);\n position: absolute;\n right: 0;\n top: 40%;\n }\n }\n\n &.menu-open {\n border-color: $iqdropdown-border-active;\n\n .iqdropdown-selection::after {\n background-image: url('../../../src/images/dropdown-arrow-up.png');\n }\n }\n}\n"],"sourceRoot":""} \ No newline at end of file diff --git a/src/styles/lib/helpers/_design-system.scss b/src/styles/lib/helpers/_design-system.scss index df95c16..f017f8f 100644 --- a/src/styles/lib/helpers/_design-system.scss +++ b/src/styles/lib/helpers/_design-system.scss @@ -1,8 +1,6 @@ // ColorSystem and fontfamily for the Reservamos theme // Each variable inside uses the !default keyword -@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700'); - $primary-font: 'OpenSans', sans-serif !default; $iqdropdown-fontsize-m: 14px !default; diff --git a/test/index.html b/test/index.html index ddaeaee..4938156 100644 --- a/test/index.html +++ b/test/index.html @@ -1,11 +1,16 @@ - +
- - + +