cheeseburger_menu.css in Cheeseburger Menu 8.3
body.is-visible{overflow:hidden}.cheeseburger-menu__wrapper{position:fixed;top:0;bottom:0;left:0;width:100%;-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%);-webkit-overflow-scrolling:touch;z-index:10;color:#333;-webkit-transition:ease .4s;-o-transition:ease .4s;-moz-transition:ease .4s;transition:ease .4s;background-color:#f5f5f5}.cheeseburger-menu__wrapper.is-visible{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}@media all and (min-width:768px){.cheeseburger-menu__wrapper{width:380px}}.cheeseburger-menu__trigger{position:absolute;display:block;margin:0 auto;width:36px;height:36px;background-image:url(../images/cheeseburger-menu/trigger.svg);background-position:center;-moz-background-size:100%;background-size:100%;background-repeat:no-repeat}@media all and (min-width:1024px){.cheeseburger-menu__trigger{display:none}}.cheeseburger-menu__trigger.is-open{position:absolute;background-image:url(../images/cheeseburger-menu/trigger-close.svg);z-index:500;top:16px;right:16px}@media all and (min-width:768px){.cheeseburger-menu__trigger.is-open{position:fixed;left:328px;right:auto}}.cheeseburger-menu__navigation{float:left;height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);width:96px;background-color:#e5e5e5;overflow:auto}.cheeseburger-menu__navigation-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__navigation-list-item{background:url(../images/cheeseburger-menu/default.svg) top 18px center/28px no-repeat}.cheeseburger-menu__navigation-list-item a,.cheeseburger-menu__navigation-list-item span{font-size:10px;text-transform:uppercase;padding:54px 8px 12px 8px;cursor:pointer;text-align:center;display:block;word-wrap:break-word;color:#111517;font-weight:900}.cheeseburger-menu__navigation-list-item a:hover,.cheeseburger-menu__navigation-list-item span:hover{text-decoration:none}.cheeseburger-menu__navigation-list-item:hover{-webkit-filter:invert(100%);filter:invert(100%);background-color:#e5e5e5}.cheeseburger-menu__navigation-list-item--account{background-image:url(../images/cheeseburger-menu/account.svg)}.cheeseburger-menu__navigation-list-item--category{background-image:url(../images/cheeseburger-menu/category.svg)}.cheeseburger-menu__navigation-list-item--cart{background-image:url(../images/cheeseburger-menu/cart.svg)}.cheeseburger-menu__navigation-list-item--phone{background-image:url(../images/cheeseburger-menu/phone.svg)}.cheeseburger-menu__navigation-list-item--active{background-color:#f5f5f5}.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%)}.cheeseburger-menu__menu-title{font-size:20px;font-weight:900;color:#ef0d33;padding:24px 24px 8px;text-transform:uppercase}.cheeseburger-menu__menu-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__menu-list li{padding:8px 12px}.cheeseburger-menu__menu-list li>a,.cheeseburger-menu__menu-list li>span{padding:8px 12px;color:#111517}.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 img{float:left;max-height:32px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;border:1px solid #333;margin-right:12px}.cheeseburger-menu__menu-list-item ul{padding:0 24px}.cheeseburger-menu__menu-list-item ul a{padding:4px 12px}.cheeseburger-menu__menu-list-item ul ul{padding:0;display:none;margin-bottom:0}.cheeseburger-menu__menu-list-item ul ul.open-parent{display:block;padding:0 0 0 24px}.cheeseburger-menu__menu-list-item--expanded>a,.cheeseburger-menu__menu-list-item--expanded>span{background:url(../images/cheeseburger-menu/chevron.svg) top 6px right 8px/24px no-repeat;padding-right:30px!important}.cheeseburger-menu__menu-list-item--expanded ul{display:none;overflow:hidden}.cheeseburger-menu__menu-list-item--expanded ul a,.cheeseburger-menu__menu-list-item--expanded ul span{background:0 0}.cheeseburger-menu__menu-list-item--expanded ul.open-parent{display:block}.cheeseburger-menu__menu-list-item--expanded ul li{padding:2px 0}.cheeseburger-menu__menu-list-item-link{display:block;padding:4px 12px}
File
css/cheeseburger_menu.css
View source
- body.is-visible{overflow:hidden}.cheeseburger-menu__wrapper{position:fixed;top:0;bottom:0;left:0;width:100%;-webkit-transform:translateX(-100%);-moz-transform:translateX(-100%);-ms-transform:translateX(-100%);-o-transform:translateX(-100%);transform:translateX(-100%);-webkit-overflow-scrolling:touch;z-index:10;color:#333;-webkit-transition:ease .4s;-o-transition:ease .4s;-moz-transition:ease .4s;transition:ease .4s;background-color:#f5f5f5}.cheeseburger-menu__wrapper.is-visible{-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}@media all and (min-width:768px){.cheeseburger-menu__wrapper{width:380px}}.cheeseburger-menu__trigger{position:absolute;display:block;margin:0 auto;width:36px;height:36px;background-image:url(../images/cheeseburger-menu/trigger.svg);background-position:center;-moz-background-size:100%;background-size:100%;background-repeat:no-repeat}@media all and (min-width:1024px){.cheeseburger-menu__trigger{display:none}}.cheeseburger-menu__trigger.is-open{position:absolute;background-image:url(../images/cheeseburger-menu/trigger-close.svg);z-index:500;top:16px;right:16px}@media all and (min-width:768px){.cheeseburger-menu__trigger.is-open{position:fixed;left:328px;right:auto}}.cheeseburger-menu__navigation{float:left;height:-webkit-calc(100vh);height:-moz-calc(100vh);height:calc(100vh);width:96px;background-color:#e5e5e5;overflow:auto}.cheeseburger-menu__navigation-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__navigation-list-item{background:url(../images/cheeseburger-menu/default.svg) top 18px center/28px no-repeat}.cheeseburger-menu__navigation-list-item a,.cheeseburger-menu__navigation-list-item span{font-size:10px;text-transform:uppercase;padding:54px 8px 12px 8px;cursor:pointer;text-align:center;display:block;word-wrap:break-word;color:#111517;font-weight:900}.cheeseburger-menu__navigation-list-item a:hover,.cheeseburger-menu__navigation-list-item span:hover{text-decoration:none}.cheeseburger-menu__navigation-list-item:hover{-webkit-filter:invert(100%);filter:invert(100%);background-color:#e5e5e5}.cheeseburger-menu__navigation-list-item--account{background-image:url(../images/cheeseburger-menu/account.svg)}.cheeseburger-menu__navigation-list-item--category{background-image:url(../images/cheeseburger-menu/category.svg)}.cheeseburger-menu__navigation-list-item--cart{background-image:url(../images/cheeseburger-menu/cart.svg)}.cheeseburger-menu__navigation-list-item--phone{background-image:url(../images/cheeseburger-menu/phone.svg)}.cheeseburger-menu__navigation-list-item--active{background-color:#f5f5f5}.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%)}.cheeseburger-menu__menu-title{font-size:20px;font-weight:900;color:#ef0d33;padding:24px 24px 8px;text-transform:uppercase}.cheeseburger-menu__menu-list{list-style:none;padding:0;margin:0}.cheeseburger-menu__menu-list li{padding:8px 12px}.cheeseburger-menu__menu-list li>a,.cheeseburger-menu__menu-list li>span{padding:8px 12px;color:#111517}.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 img{float:left;max-height:32px;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;border:1px solid #333;margin-right:12px}.cheeseburger-menu__menu-list-item ul{padding:0 24px}.cheeseburger-menu__menu-list-item ul a{padding:4px 12px}.cheeseburger-menu__menu-list-item ul ul{padding:0;display:none;margin-bottom:0}.cheeseburger-menu__menu-list-item ul ul.open-parent{display:block;padding:0 0 0 24px}.cheeseburger-menu__menu-list-item--expanded>a,.cheeseburger-menu__menu-list-item--expanded>span{background:url(../images/cheeseburger-menu/chevron.svg) top 6px right 8px/24px no-repeat;padding-right:30px!important}.cheeseburger-menu__menu-list-item--expanded ul{display:none;overflow:hidden}.cheeseburger-menu__menu-list-item--expanded ul a,.cheeseburger-menu__menu-list-item--expanded ul span{background:0 0}.cheeseburger-menu__menu-list-item--expanded ul.open-parent{display:block}.cheeseburger-menu__menu-list-item--expanded ul li{padding:2px 0}.cheeseburger-menu__menu-list-item-link{display:block;padding:4px 12px}