cheeseburger_menu.css in Cheeseburger Menu 8.4
.block-cheeseburgermenu{position:absolute;right:10px;top:10px;width:40px;height:40px}@media all and (min-width:1024px){.block-cheeseburgermenu{display:none}}body.menu-is-visible{overflow:hidden}.cheeseburger-menu__wrapper{position:fixed;bottom:0;left:0;width:100%;-webkit-transform:translate3D(-100%,0,0);-moz-transform:translate3D(-100%,0,0);-ms-transform:translate3D(-100%,0,0);-o-transform:translate3D(-100%,0,0);transform:translate3D(-100%,0,0);-webkit-overflow-scrolling:touch;z-index:10;color:#363636;-webkit-transition:all .15s;-o-transition:all .15s;-moz-transition:all .15s;transition:all .15s;background-color:#e9e9e9;opacity:0;-webkit-perspective:1000;-moz-perspective:1000;perspective:1000}.cheeseburger-menu__wrapper.menu-is-visible{-webkit-transform:translate3D(0,0,0);-moz-transform:translate3D(0,0,0);-ms-transform:translate3D(0,0,0);-o-transform:translate3D(0,0,0);transform:translate3D(0,0,0);opacity:1}@media all and (min-width:768px){.cheeseburger-menu__wrapper{width:380px}}.cheeseburger-menu__wrapper a,.cheeseburger-menu__wrapper a:focus,.cheeseburger-menu__wrapper a:hover,.cheeseburger-menu__wrapper a:visited{color:#363636;text-decoration:none}.cheeseburger-menu__wrapper ul{padding:0;margin:0}.cheeseburger-menu__navigation{float:left;height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);width:73px;background-color:#b5b5b5;overflow:auto}.cheeseburger-menu__navigation-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__navigation-list-item{background:url(../images/default.svg) top 18px center/26px no-repeat}.cheeseburger-menu__navigation-list-item a,.cheeseburger-menu__navigation-list-item span{font-size:9px;text-transform:uppercase;padding:54px 8px 12px 8px;cursor:pointer;line-height:11px;text-align:center;display:block;font-weight:700;word-wrap:break-word}.cheeseburger-menu__navigation-list-item--main{background-image:url(../images/main.svg)}.cheeseburger-menu__navigation-list-item--account{background-image:url(../images/account.svg)}.cheeseburger-menu__navigation-list-item--category{background-image:url(../images/category.svg)}.cheeseburger-menu__navigation-list-item--cart{background-image:url(../images/cart.svg)}.cheeseburger-menu__navigation-list-item--phone{background-image:url(../images/phone.svg)}.cheeseburger-menu__navigation-list-item--active{background-color:#e9e9e9}.cheeseburger-menu__menus{height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);overflow:auto}.cheeseburger-menu__menu{float:right;width:-webkit-calc(100%);width:-moz-calc(100%);width:calc(100%);padding:15px 0;border-bottom:1px solid rgba(0,0,0,.1)}.cheeseburger-menu__menu-title{font-size:22px;font-weight:700;padding:10px 10px 0;color:#fe1c3e}.cheeseburger-menu__menu-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__menu-list li>a,.cheeseburger-menu__menu-list li>span{padding:20px 15px}.cheeseburger-menu__menu-list li ul{height:0;overflow:hidden}.cheeseburger-menu__menu-list li ul.open-child{height:auto}.cheeseburger-menu__menu-list>li{border-bottom:1px solid rgba(0,0,0,.1);font-weight:700}.cheeseburger-menu__menu-list>li:last-of-type{border-bottom:none}.cheeseburger-menu__menu-list-item{padding:0}.cheeseburger-menu__menu-list-item img{float:left;max-width:30px;margin-right:10px;margin-top:2px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;border:1px solid #363636}.cheeseburger-menu__menu-list-item img+span{padding-left:40px}.cheeseburger-menu__menu-list-item--expanded>a,.cheeseburger-menu__menu-list-item--expanded>span{background:url(../images/down-arrow.svg) top 22px right 8px/17px no-repeat;padding-right:30px!important}.cheeseburger-menu__menu-list-item--expanded ul a,.cheeseburger-menu__menu-list-item--expanded ul span{background:0 0}.cheeseburger-menu__menu-list-item-link{display:block}.cheeseburger-menu{display:block;float:left;width:40px;height:40px}@media all and (min-width:1024px){.cheeseburger-menu{display:none}}.cheeseburger-menu__trigger{position:relative;display:block;margin:0 auto;height:40px;text-transform:uppercase;font-size:18px;text-decoration:none;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:11}.cheeseburger-menu__trigger:after{position:absolute;left:0;right:0;bottom:0;top:0;background-image:url(../images/trigger.svg);background-repeat:no-repeat;background-position:center;content:"";text-align:center;height:40px;font-size:12px;color:#232323;font-weight:700}.cheeseburger-menu__trigger:after:focus{color:#232323}.cheeseburger-menu__trigger.is-open{background-color:#b5b5b5}.cheeseburger-menu__trigger.is-open:after{background-image:url(../images/trigger-close.svg)}
File
css/cheeseburger_menu.css
View source
- .block-cheeseburgermenu{position:absolute;right:10px;top:10px;width:40px;height:40px}@media all and (min-width:1024px){.block-cheeseburgermenu{display:none}}body.menu-is-visible{overflow:hidden}.cheeseburger-menu__wrapper{position:fixed;bottom:0;left:0;width:100%;-webkit-transform:translate3D(-100%,0,0);-moz-transform:translate3D(-100%,0,0);-ms-transform:translate3D(-100%,0,0);-o-transform:translate3D(-100%,0,0);transform:translate3D(-100%,0,0);-webkit-overflow-scrolling:touch;z-index:10;color:#363636;-webkit-transition:all .15s;-o-transition:all .15s;-moz-transition:all .15s;transition:all .15s;background-color:#e9e9e9;opacity:0;-webkit-perspective:1000;-moz-perspective:1000;perspective:1000}.cheeseburger-menu__wrapper.menu-is-visible{-webkit-transform:translate3D(0,0,0);-moz-transform:translate3D(0,0,0);-ms-transform:translate3D(0,0,0);-o-transform:translate3D(0,0,0);transform:translate3D(0,0,0);opacity:1}@media all and (min-width:768px){.cheeseburger-menu__wrapper{width:380px}}.cheeseburger-menu__wrapper a,.cheeseburger-menu__wrapper a:focus,.cheeseburger-menu__wrapper a:hover,.cheeseburger-menu__wrapper a:visited{color:#363636;text-decoration:none}.cheeseburger-menu__wrapper ul{padding:0;margin:0}.cheeseburger-menu__navigation{float:left;height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);width:73px;background-color:#b5b5b5;overflow:auto}.cheeseburger-menu__navigation-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__navigation-list-item{background:url(../images/default.svg) top 18px center/26px no-repeat}.cheeseburger-menu__navigation-list-item a,.cheeseburger-menu__navigation-list-item span{font-size:9px;text-transform:uppercase;padding:54px 8px 12px 8px;cursor:pointer;line-height:11px;text-align:center;display:block;font-weight:700;word-wrap:break-word}.cheeseburger-menu__navigation-list-item--main{background-image:url(../images/main.svg)}.cheeseburger-menu__navigation-list-item--account{background-image:url(../images/account.svg)}.cheeseburger-menu__navigation-list-item--category{background-image:url(../images/category.svg)}.cheeseburger-menu__navigation-list-item--cart{background-image:url(../images/cart.svg)}.cheeseburger-menu__navigation-list-item--phone{background-image:url(../images/phone.svg)}.cheeseburger-menu__navigation-list-item--active{background-color:#e9e9e9}.cheeseburger-menu__menus{height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);overflow:auto}.cheeseburger-menu__menu{float:right;width:-webkit-calc(100%);width:-moz-calc(100%);width:calc(100%);padding:15px 0;border-bottom:1px solid rgba(0,0,0,.1)}.cheeseburger-menu__menu-title{font-size:22px;font-weight:700;padding:10px 10px 0;color:#fe1c3e}.cheeseburger-menu__menu-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__menu-list li>a,.cheeseburger-menu__menu-list li>span{padding:20px 15px}.cheeseburger-menu__menu-list li ul{height:0;overflow:hidden}.cheeseburger-menu__menu-list li ul.open-child{height:auto}.cheeseburger-menu__menu-list>li{border-bottom:1px solid rgba(0,0,0,.1);font-weight:700}.cheeseburger-menu__menu-list>li:last-of-type{border-bottom:none}.cheeseburger-menu__menu-list-item{padding:0}.cheeseburger-menu__menu-list-item img{float:left;max-width:30px;margin-right:10px;margin-top:2px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;border:1px solid #363636}.cheeseburger-menu__menu-list-item img+span{padding-left:40px}.cheeseburger-menu__menu-list-item--expanded>a,.cheeseburger-menu__menu-list-item--expanded>span{background:url(../images/down-arrow.svg) top 22px right 8px/17px no-repeat;padding-right:30px!important}.cheeseburger-menu__menu-list-item--expanded ul a,.cheeseburger-menu__menu-list-item--expanded ul span{background:0 0}.cheeseburger-menu__menu-list-item-link{display:block}.cheeseburger-menu{display:block;float:left;width:40px;height:40px}@media all and (min-width:1024px){.cheeseburger-menu{display:none}}.cheeseburger-menu__trigger{position:relative;display:block;margin:0 auto;height:40px;text-transform:uppercase;font-size:18px;text-decoration:none;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;z-index:11}.cheeseburger-menu__trigger:after{position:absolute;left:0;right:0;bottom:0;top:0;background-image:url(../images/trigger.svg);background-repeat:no-repeat;background-position:center;content:"";text-align:center;height:40px;font-size:12px;color:#232323;font-weight:700}.cheeseburger-menu__trigger:after:focus{color:#232323}.cheeseburger-menu__trigger.is-open{background-color:#b5b5b5}.cheeseburger-menu__trigger.is-open:after{background-image:url(../images/trigger-close.svg)}