├── .babelrc ├── .gitignore ├── LICENSE ├── README.md ├── assets ├── css │ ├── _responsive.scss │ ├── _tabelinha.scss │ ├── _uk-form.scss │ ├── _vars.scss │ ├── config │ │ ├── _config.scss │ │ ├── _mixins.scss │ │ └── _system.scss │ ├── owl-theme │ │ ├── _theme-default.scss │ │ └── _theme.scss │ ├── style.css │ ├── style.css.map │ └── style.scss ├── favicon.png ├── fonts │ ├── AlexBrush-Regular.eot │ ├── AlexBrush-Regular.svg │ ├── AlexBrush-Regular.ttf │ ├── AlexBrush-Regular.woff │ ├── Aquino-Demo.eot │ ├── Aquino-Demo.svg │ ├── Aquino-Demo.ttf │ ├── Aquino-Demo.woff │ └── _fonts.scss ├── img │ ├── Thumbs.db │ ├── flavors-border.png │ ├── header-append.png │ ├── header-bg.jpg │ ├── i-header-1.png │ ├── i-header-2.png │ ├── i-header-3.png │ ├── i-header-4.png │ ├── i-header-5.png │ ├── i-header-6.png │ ├── menuchef-bg.png │ └── menuchef-logo.png └── js │ ├── MenuChef.js │ ├── MenuChef.js.map │ ├── rellax.min.js │ └── tabelinha.min.js ├── dist ├── MenuChef.js ├── MenuChef.js.map └── index.html ├── doc.json ├── favicon.ico ├── gulpfile.js ├── img └── menuchef-logo.png ├── index.html ├── package-lock.json ├── package.json ├── site ├── _footer.twig ├── _header.twig ├── base.twig ├── index.twig └── macros.twig ├── src ├── MenuChef.js ├── helpers │ ├── forEach.js │ ├── masterCook.js │ ├── setCssVar.js │ ├── setIF.js │ └── setPublicVar.js └── templates │ ├── button.html │ ├── default.html │ ├── full.scss │ ├── main.scss │ ├── mixins.scss │ ├── schemes │ ├── _black.scss │ ├── _blue.scss │ ├── _green.scss │ ├── _red.scss │ ├── _scheme.scss │ └── _yellow.scss │ └── side.scss ├── test ├── MenuChef.test.js ├── chai.js ├── index.html ├── mocha.css ├── mocha.js └── shim.min.js └── webpack.config.babel.js /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["es2015"] 3 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 Matheus Falcão 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # MenuChef 2 | 3 | [![GitHub release](https://img.shields.io/github/tag/theus/MenuChef.svg?label=version 4 | )]() 5 | [![JavaScript Style Guide](https://img.shields.io/badge/code%20style-standard-brightgreen.svg?style=flat-square)](http://standardjs.com/) 6 | 7 |

8 | MenuChef logo 9 |

10 |

11 | Buy Me a Coffee at ko-fi.com 12 |

13 | 14 | MenuChef helps you to create hamburgers' menu easily even without knowing how to cook. You just need call the MenuChef.js in your page and initiate like the [examples](http://theus.github.io/MenuChef). It's light (approximately 55kb, **13kb gzipped**) and you don't need change the HTML code of the menu original. You can personalize it by CSS or by [options](http://theus.github.io/MenuChef#nutritionaltable). 15 | 16 | Just a simple line: 17 | 18 | ````javascript 19 | new MenuChef('.oldmenu a') 20 | ```` 21 | 22 | #### [Check the examples](http://theus.github.io/MenuChef) 23 | 24 | ## Compatibility 25 | 26 | | Browser | Compatible? | 27 | | -------------------- | -------------------| 28 | | Google Chrome | :white_check_mark: | 29 | | Mozilla Firefox | :white_check_mark: | 30 | | Internet Explorer 10+ | :white_check_mark: | 31 | | Edge | :white_check_mark: | 32 | | Safari | :white_check_mark: | -------------------------------------------------------------------------------- /assets/css/_responsive.scss: -------------------------------------------------------------------------------- 1 | @import 'config/config'; 2 | 3 | @media (max-width: 1200px) { 4 | 5 | } 6 | 7 | @media (max-width: 992px) { 8 | 9 | } 10 | 11 | @media (max-width: 768px) { 12 | 13 | } -------------------------------------------------------------------------------- /assets/css/_tabelinha.scss: -------------------------------------------------------------------------------- 1 | /* -- ESTILOS GERAIS -- */ 2 | .visivel { 3 | display: table-row !important; 4 | } 5 | 6 | .tabelinha { 7 | // font-family: Arial, Helvetica, sans-serif; 8 | border-spacing: 0; 9 | } 10 | 11 | .tabelinha th { 12 | padding: 15px 8px; 13 | vertical-align: middle; 14 | } 15 | 16 | .tabelinha td { 17 | padding: 10px 5px; 18 | } 19 | 20 | .tabelinha th, .tabelinha td { 21 | border-bottom: 1px solid #cccccc; 22 | // color: #002D61; 23 | } 24 | 25 | .tabelinha tbody tr { 26 | width: 100%; 27 | display: none; 28 | } 29 | 30 | .tabelinha tfoot td > b { 31 | display: none !important; 32 | } 33 | 34 | .tab-rodape { 35 | min-width: 275px; 36 | display: table; 37 | clear: both; 38 | padding-top: 15px; 39 | // font-family: Arial, Helvetica, sans-serif; 40 | font-size: 12px; 41 | text-align: left; 42 | } 43 | 44 | .tab-rodape a, .tab-rodape span { 45 | font-size: 12px; 46 | } 47 | 48 | .tab-num-itens { 49 | float: left; 50 | margin: 15px 0 0 10px; 51 | } 52 | 53 | .tab-paginacao { 54 | float: right; 55 | margin-right: 20px; 56 | margin-top: 13px; 57 | } 58 | 59 | .tab-btn-anterior, .tab-btn-proximo { 60 | display: inline-block; 61 | width: 20px; 62 | height: 20px; 63 | margin: 0 5px; 64 | border-radius: 50%; 65 | background-color: #F2F2F2; 66 | -webkit-box-shadow: 0 1px 2px 1px #C4C4C4!important; 67 | -moz-box-shadow: 0 1px 2px 1px #C4C4C4!important; 68 | box-shadow: 0 1px 2px 1px #C4C4C4!important; 69 | border: 1px solid #FFF; 70 | cursor: pointer; 71 | box-sizing: border-box; 72 | } 73 | 74 | .tab-btn-anterior { 75 | padding: 3px 0 0 6px; 76 | } 77 | 78 | .tab-btn-proximo { 79 | padding: 3px 0 0 7px; 80 | } 81 | 82 | .tab-btn-anterior:after, .tab-btn-proximo:after { 83 | content: ""; 84 | width: 0; 85 | height: 0; 86 | position: absolute; 87 | border-top: 6px solid transparent; 88 | border-bottom: 6px solid transparent; 89 | } 90 | 91 | .tab-btn-anterior:after { 92 | border-right: 6px solid $color-1; 93 | } 94 | 95 | .tab-btn-proximo:after { 96 | border-left: 6px solid $color-1; 97 | } 98 | 99 | .tab-btn-anterior:hover, .tab-btn-proximo:hover { 100 | color: #FFFFFF; 101 | border: 1px solid $color-1; 102 | background-color: $color-1; 103 | } 104 | 105 | .tab-btn-anterior:hover:after { 106 | border-right: 6px solid #FFFFFF; 107 | } 108 | 109 | .tab-btn-anterior.btn-inativo:after { 110 | border-right: 6px solid #CCCCCC; 111 | } 112 | 113 | .tab-btn-proximo:hover:after { 114 | border-left: 6px solid #FFFFFF; 115 | } 116 | 117 | .tab-btn-proximo.btn-inativo:after { 118 | border-left: 6px solid #CCCCCC; 119 | } 120 | 121 | .tab-btn-anterior.btn-inativo, .tab-btn-proximo.btn-inativo, .tab-btn-anterior.btn-inativo:hover, .tab-btn-proximo.btn-inativo:hover { 122 | color: #CCCCCC; 123 | border: 1px solid transparent; 124 | background-color: transparent; 125 | pointer-events: none; 126 | cursor: default; 127 | } 128 | 129 | /* -- ESTILOS DESKTOP -- */ 130 | .tabelinha.estilo-dtp td > b { 131 | display: none; 132 | } 133 | 134 | .tabelinha.estilo-dtp th, .tabelinha.estilo-dtp td { 135 | text-align: center; 136 | } 137 | 138 | .tabelinha.estilo-dtp tbody tr:nth-child(even) { 139 | background: transparent; 140 | } 141 | 142 | .tabelinha.estilo-dtp tbody tr:nth-child(odd) { 143 | background: #F9F9F9; 144 | } 145 | 146 | /* -- ESTILOS MOBILE -- */ 147 | .tabelinha.estilo-mob th { 148 | display: none; 149 | } 150 | 151 | .tabelinha.estilo-mob td { 152 | width: 100%; 153 | clear: left; 154 | float: left; 155 | text-align: left; 156 | display: block; 157 | } 158 | 159 | .tabelinha.estilo-mob td > b { 160 | width: 35%; 161 | display: inline-block; 162 | } 163 | 164 | .tabelinha.estilo-mob td > span { 165 | vertical-align: top; 166 | max-width: 62%; 167 | display: inline-block; 168 | } 169 | 170 | .tabelinha.estilo-mob td:nth-child(even) { 171 | background: transparent; 172 | } 173 | 174 | .tabelinha.estilo-mob td:nth-child(odd) { 175 | background: #F9F9F9; 176 | } -------------------------------------------------------------------------------- /assets/css/_uk-form.scss: -------------------------------------------------------------------------------- 1 | $color1: #bcb2a2; 2 | $color2: #f4df90; 3 | 4 | .uk-radio, 5 | .uk-checkbox { 6 | /* 1 */ 7 | display: inline-block; 8 | height: 16px; 9 | width: 16px; 10 | /* 2 */ 11 | overflow: hidden; 12 | outline: none !important; 13 | /* 3 */ 14 | margin-top: -4px; 15 | vertical-align: middle; 16 | /* 4 */ 17 | -webkit-appearance: none; 18 | /* 5 */ 19 | background-color: transparent; 20 | /* 6 */ 21 | background-repeat: no-repeat; 22 | background-position: 50% 50%; 23 | border: 1px solid #cccccc; 24 | -webkit-transition: 0.2s ease-in-out; 25 | transition: 0.2s ease-in-out; 26 | -webkit-transition-property: background-color, border; 27 | transition-property: background-color, border; 28 | } 29 | .uk-radio { 30 | border-radius: 50%; 31 | } 32 | /* Focus */ 33 | .uk-radio:focus, 34 | .uk-checkbox:focus { 35 | outline: none; 36 | border-color: $color1; 37 | } 38 | /* 39 | * Checked 40 | */ 41 | .uk-radio:checked, 42 | .uk-checkbox:checked, 43 | .uk-checkbox:indeterminate { 44 | background-color: $color2; 45 | border-color: transparent; 46 | } 47 | /* Focus */ 48 | .uk-radio:checked:focus, 49 | .uk-checkbox:checked:focus, 50 | .uk-checkbox:indeterminate:focus { 51 | background-color: $color2; 52 | } 53 | /* 54 | * Icons 55 | */ 56 | .uk-radio:checked { 57 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); 58 | } 59 | .uk-checkbox:checked { 60 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%2F%3E%0A%3C%2Fsvg%3E"); 61 | } 62 | .uk-checkbox:indeterminate { 63 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%3E%3C%2Frect%3E%0A%3C%2Fsvg%3E"); 64 | } 65 | /* 66 | * Disabled 67 | */ 68 | .uk-radio:disabled, 69 | .uk-checkbox:disabled { 70 | background-color: $color2; 71 | border-color: $color1; 72 | } 73 | .uk-radio:disabled:checked { 74 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23999%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); 75 | } 76 | .uk-checkbox:disabled:checked { 77 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23999%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%2F%3E%0A%3C%2Fsvg%3E"); 78 | } 79 | .uk-checkbox:disabled:indeterminate { 80 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23999%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%3E%3C%2Frect%3E%0A%3C%2Fsvg%3E"); 81 | } -------------------------------------------------------------------------------- /assets/css/_vars.scss: -------------------------------------------------------------------------------- 1 | $font-1: 'Open Sans', sans-serif; 2 | $font-2: 'Aquino Demo', $font-1; 3 | $font-3: 'Alex Brush', $font-1; 4 | 5 | $color-1: #e2bf3b; 6 | $color-2: #787167; 7 | $color-3: #f0f0e6; 8 | 9 | $color-main: $color-1; 10 | $text-color: #fff; 11 | 12 | $selection-color: $color-main; 13 | $selection-text-color: $text-color; 14 | -------------------------------------------------------------------------------- /assets/css/config/_config.scss: -------------------------------------------------------------------------------- 1 | @import 'mixins'; 2 | @import '../vars'; -------------------------------------------------------------------------------- /assets/css/config/_mixins.scss: -------------------------------------------------------------------------------- 1 | @mixin size($width, $height: null) { 2 | @if $height == null { $height: $width; } 3 | 4 | width: $width; 5 | height: $height; 6 | 7 | } 8 | 9 | @mixin clearfix { 10 | &::after { 11 | content: ""; 12 | display: table; 13 | clear: both; 14 | } 15 | } 16 | 17 | @mixin keyframes($animationName) { 18 | @-webkit-keyframes #{$animationName} { 19 | @content; 20 | } 21 | @-moz-keyframes #{$animationName} { 22 | @content; 23 | } 24 | @-o-keyframes #{$animationName} { 25 | @content; 26 | } 27 | @keyframes #{$animationName} { 28 | @content; 29 | } 30 | } 31 | 32 | @mixin animation ($delay, $duration, $animation) { 33 | -webkit-animation-delay: $delay; 34 | -webkit-animation-duration: $duration; 35 | -webkit-animation-name: $animation; 36 | -webkit-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ 37 | 38 | -moz-animation-delay: $delay; 39 | -moz-animation-duration: $duration; 40 | -moz-animation-name: $animation; 41 | -moz-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ 42 | 43 | -o-animation-delay: $delay; 44 | -o-animation-duration: $duration; 45 | -o-animation-name: $animation; 46 | -o-animation-fill-mode: forwards; /* this prevents the animation from restarting! */ 47 | 48 | animation-delay: $delay; 49 | animation-duration: $duration; 50 | animation-name: $animation; 51 | animation-fill-mode: forwards; /* this prevents the animation from restarting! */ 52 | } -------------------------------------------------------------------------------- /assets/css/config/_system.scss: -------------------------------------------------------------------------------- 1 | @charset "utf-8"; 2 | 3 | $base-dpi: 96!default; 4 | @warn '$base-dpi' $base-dpi; 5 | 6 | @import 'config'; 7 | 8 | ::-moz-selection { 9 | color: $selection-text-color; 10 | background: $selection-color; 11 | } 12 | ::selection { 13 | color: $selection-text-color; 14 | background: $selection-color; 15 | } 16 | 17 | @import '../../fonts/fonts'; -------------------------------------------------------------------------------- /assets/css/owl-theme/_theme-default.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * Default theme - Owl Carousel CSS File 3 | */ 4 | 5 | $color-base: #869791 !default; 6 | $color-white: #FFF !default; 7 | $color-gray: #D6D6D6 !default; 8 | 9 | //nav 10 | 11 | $nav-color: $color-white !default; 12 | $nav-color-hover: $color-white !default; 13 | $nav-font-size: 14px !default; 14 | $nav-rounded: 3px !default; 15 | $nav-margin: 5px !default; 16 | $nav-padding: 4px 7px !default; 17 | $nav-background: $color-gray !default; 18 | $nav-background-hover: $color-base !default; 19 | $nav-disabled-opacity: 0.5 !default; 20 | 21 | //dots 22 | 23 | $dot-width: 10px !default; 24 | $dot-height: 10px !default; 25 | $dot-rounded: 30px !default; 26 | $dot-margin: 5px 7px !default; 27 | $dot-background: $color-gray !default; 28 | $dot-background-active: $color-base !default; 29 | 30 | @import 'theme'; -------------------------------------------------------------------------------- /assets/css/owl-theme/_theme.scss: -------------------------------------------------------------------------------- 1 | /* 2 | * Owl Carousel - Animate Plugin 3 | */ 4 | .owl-carousel .animated { 5 | -webkit-animation-duration: 1000ms; 6 | animation-duration: 1000ms; 7 | -webkit-animation-fill-mode: both; 8 | animation-fill-mode: both; 9 | } 10 | .owl-carousel .owl-animated-in { 11 | z-index: 0; 12 | } 13 | .owl-carousel .owl-animated-out { 14 | z-index: 1; 15 | } 16 | .owl-carousel .fadeOut { 17 | -webkit-animation-name: fadeOut; 18 | animation-name: fadeOut; 19 | } 20 | 21 | @-webkit-keyframes fadeOut { 22 | 0% { 23 | opacity: 1; 24 | } 25 | 26 | 100% { 27 | opacity: 0; 28 | } 29 | } 30 | @keyframes fadeOut { 31 | 0% { 32 | opacity: 1; 33 | } 34 | 35 | 100% { 36 | opacity: 0; 37 | } 38 | } 39 | 40 | /* 41 | * Owl Carousel - Auto Height Plugin 42 | */ 43 | .owl-height { 44 | -webkit-transition: height 500ms ease-in-out; 45 | -moz-transition: height 500ms ease-in-out; 46 | -ms-transition: height 500ms ease-in-out; 47 | -o-transition: height 500ms ease-in-out; 48 | transition: height 500ms ease-in-out; 49 | } 50 | 51 | /* 52 | * Core Owl Carousel CSS File 53 | */ 54 | .owl-carousel { 55 | display: none; 56 | width: 100%; 57 | -webkit-tap-highlight-color: transparent; 58 | /* position relative and z-index fix webkit rendering fonts issue */ 59 | position: relative; 60 | z-index: 1; 61 | } 62 | .owl-carousel .owl-stage { 63 | position: relative; 64 | -ms-touch-action: pan-Y; 65 | } 66 | .owl-carousel .owl-stage:after { 67 | content: "."; 68 | display: block; 69 | clear: both; 70 | visibility: hidden; 71 | line-height: 0; 72 | height: 0; 73 | } 74 | .owl-carousel .owl-stage-outer { 75 | position: relative; 76 | overflow: hidden; 77 | /* fix for flashing background */ 78 | -webkit-transform: translate3d(0px, 0px, 0px); 79 | } 80 | .owl-carousel .owl-controls .owl-nav .owl-prev, 81 | .owl-carousel .owl-controls .owl-nav .owl-next, 82 | .owl-carousel .owl-controls .owl-dot { 83 | cursor: pointer; 84 | cursor: hand; 85 | -webkit-user-select: none; 86 | -khtml-user-select: none; 87 | -moz-user-select: none; 88 | -ms-user-select: none; 89 | user-select: none; 90 | } 91 | .owl-carousel.owl-loaded { 92 | display: block; 93 | } 94 | .owl-carousel.owl-loading { 95 | opacity: 0; 96 | display: block; 97 | } 98 | .owl-carousel.owl-hidden { 99 | opacity: 0; 100 | } 101 | .owl-carousel .owl-refresh .owl-item { 102 | display: none; 103 | } 104 | .owl-carousel .owl-item { 105 | position: relative; 106 | min-height: 1px; 107 | float: left; 108 | -webkit-backface-visibility: hidden; 109 | -webkit-tap-highlight-color: transparent; 110 | -webkit-touch-callout: none; 111 | -webkit-user-select: none; 112 | -moz-user-select: none; 113 | -ms-user-select: none; 114 | user-select: none; 115 | } 116 | .owl-carousel .owl-item img { 117 | display: block; 118 | width: 100%; 119 | -webkit-transform-style: preserve-3d; 120 | } 121 | .owl-carousel.owl-text-select-on .owl-item { 122 | -webkit-user-select: auto; 123 | -moz-user-select: auto; 124 | -ms-user-select: auto; 125 | user-select: auto; 126 | } 127 | .owl-carousel .owl-grab { 128 | cursor: move; 129 | cursor: -webkit-grab; 130 | cursor: -o-grab; 131 | cursor: -ms-grab; 132 | cursor: grab; 133 | } 134 | .owl-carousel.owl-rtl { 135 | direction: rtl; 136 | } 137 | .owl-carousel.owl-rtl .owl-item { 138 | float: right; 139 | } 140 | 141 | /* No Js */ 142 | .no-js .owl-carousel { 143 | display: block; 144 | } 145 | 146 | /* 147 | * Owl Carousel - Lazy Load Plugin 148 | */ 149 | .owl-carousel .owl-item .owl-lazy { 150 | opacity: 0; 151 | -webkit-transition: opacity 400ms ease; 152 | -moz-transition: opacity 400ms ease; 153 | -ms-transition: opacity 400ms ease; 154 | -o-transition: opacity 400ms ease; 155 | transition: opacity 400ms ease; 156 | } 157 | .owl-carousel .owl-item img { 158 | transform-style: preserve-3d; 159 | } 160 | 161 | /* 162 | * Owl Carousel - Video Plugin 163 | */ 164 | .owl-carousel .owl-video-wrapper { 165 | position: relative; 166 | height: 100%; 167 | background: #000; 168 | } 169 | .owl-carousel .owl-video-play-icon { 170 | position: absolute; 171 | height: 80px; 172 | width: 80px; 173 | left: 50%; 174 | top: 50%; 175 | margin-left: -40px; 176 | margin-top: -40px; 177 | background: url("owl.video.play.png") no-repeat; 178 | cursor: pointer; 179 | z-index: 1; 180 | -webkit-backface-visibility: hidden; 181 | -webkit-transition: scale 100ms ease; 182 | -moz-transition: scale 100ms ease; 183 | -ms-transition: scale 100ms ease; 184 | -o-transition: scale 100ms ease; 185 | transition: scale 100ms ease; 186 | } 187 | .owl-carousel .owl-video-play-icon:hover { 188 | -webkit-transition: scale(1.3, 1.3); 189 | -moz-transition: scale(1.3, 1.3); 190 | -ms-transition: scale(1.3, 1.3); 191 | -o-transition: scale(1.3, 1.3); 192 | transition: scale(1.3, 1.3); 193 | } 194 | .owl-carousel .owl-video-playing .owl-video-tn, 195 | .owl-carousel .owl-video-playing .owl-video-play-icon { 196 | display: none; 197 | } 198 | .owl-carousel .owl-video-tn { 199 | opacity: 0; 200 | height: 100%; 201 | background-position: center center; 202 | background-repeat: no-repeat; 203 | -webkit-background-size: contain; 204 | -moz-background-size: contain; 205 | -o-background-size: contain; 206 | background-size: contain; 207 | -webkit-transition: opacity 400ms ease; 208 | -moz-transition: opacity 400ms ease; 209 | -ms-transition: opacity 400ms ease; 210 | -o-transition: opacity 400ms ease; 211 | transition: opacity 400ms ease; 212 | } 213 | .owl-carousel .owl-video-frame { 214 | position: relative; 215 | z-index: 1; 216 | } 217 | 218 | .owl-theme { 219 | // Styling Next and Prev buttons 220 | .owl-nav { 221 | margin-top: 10px; 222 | text-align: center; 223 | -webkit-tap-highlight-color: transparent; 224 | 225 | [class*='owl-'] { 226 | color: $nav-color; 227 | font-size: $nav-font-size; 228 | margin: $nav-margin; 229 | padding: $nav-padding; 230 | background: $nav-background; 231 | display: inline-block; 232 | cursor: pointer; 233 | border-radius: 3px; 234 | 235 | &:hover { 236 | background: $nav-background-hover; 237 | color:$nav-color-hover; 238 | text-decoration: none; 239 | } 240 | } 241 | .disabled { 242 | opacity: $nav-disabled-opacity; 243 | cursor: default; 244 | } 245 | } 246 | 247 | // Styling dots 248 | .owl-nav.disabled + .owl-dots { 249 | margin-top: 10px; 250 | } 251 | 252 | .owl-dots { 253 | text-align: center; 254 | -webkit-tap-highlight-color: transparent; 255 | 256 | .owl-dot { 257 | display: inline-block; 258 | zoom: 1; 259 | *display: inline; 260 | 261 | span { 262 | width: $dot-width; 263 | height: $dot-height; 264 | margin: $dot-margin; 265 | background: $dot-background; 266 | display: block; 267 | -webkit-backface-visibility: visible; 268 | transition: opacity 200ms ease; 269 | border-radius: 30px; 270 | } 271 | 272 | &.active, 273 | &:hover { 274 | span { 275 | background: $dot-background-active; 276 | } 277 | } 278 | } 279 | } 280 | } -------------------------------------------------------------------------------- /assets/css/style.css: -------------------------------------------------------------------------------- 1 | ::-moz-selection { 2 | color: #fff; 3 | background: #e2bf3b; } 4 | 5 | ::selection { 6 | color: #fff; 7 | background: #e2bf3b; } 8 | 9 | /* This stylesheet generated by Transfonter (https://transfonter.org) on April 5, 2017 11:55 PM */ 10 | @font-face { 11 | font-family: 'Aquino Demo'; 12 | src: url("../fonts/Aquino-Demo.eot"); 13 | src: url("../fonts/Aquino-Demo.eot?#iefix") format("embedded-opentype"), url("../fonts/Aquino-Demo.woff") format("woff"), url("../fonts/Aquino-Demo.ttf") format("truetype"), url("../fonts/Aquino-Demo.svg#Aquino-Demo") format("svg"); 14 | font-weight: normal; 15 | font-style: normal; } 16 | 17 | @font-face { 18 | font-family: 'Alex Brush'; 19 | src: url("../fonts/AlexBrush-Regular.eot"); 20 | src: url("../fonts/AlexBrush-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/AlexBrush-Regular.woff") format("woff"), url("../fonts/AlexBrush-Regular.ttf") format("truetype"), url("../fonts/AlexBrush-Regular.svg#AlexBrush-Regular") format("svg"); 21 | font-weight: normal; 22 | font-style: normal; } 23 | 24 | /* -- ESTILOS GERAIS -- */ 25 | .visivel { 26 | display: table-row !important; } 27 | 28 | .tabelinha { 29 | border-spacing: 0; } 30 | 31 | .tabelinha th { 32 | padding: 15px 8px; 33 | vertical-align: middle; } 34 | 35 | .tabelinha td { 36 | padding: 10px 5px; } 37 | 38 | .tabelinha th, .tabelinha td { 39 | border-bottom: 1px solid #cccccc; } 40 | 41 | .tabelinha tbody tr { 42 | width: 100%; 43 | display: none; } 44 | 45 | .tabelinha tfoot td > b { 46 | display: none !important; } 47 | 48 | .tab-rodape { 49 | min-width: 275px; 50 | display: table; 51 | clear: both; 52 | padding-top: 15px; 53 | font-size: 12px; 54 | text-align: left; } 55 | 56 | .tab-rodape a, .tab-rodape span { 57 | font-size: 12px; } 58 | 59 | .tab-num-itens { 60 | float: left; 61 | margin: 15px 0 0 10px; } 62 | 63 | .tab-paginacao { 64 | float: right; 65 | margin-right: 20px; 66 | margin-top: 13px; } 67 | 68 | .tab-btn-anterior, .tab-btn-proximo { 69 | display: inline-block; 70 | width: 20px; 71 | height: 20px; 72 | margin: 0 5px; 73 | border-radius: 50%; 74 | background-color: #F2F2F2; 75 | -webkit-box-shadow: 0 1px 2px 1px #C4C4C4 !important; 76 | -moz-box-shadow: 0 1px 2px 1px #C4C4C4 !important; 77 | box-shadow: 0 1px 2px 1px #C4C4C4 !important; 78 | border: 1px solid #FFF; 79 | cursor: pointer; 80 | box-sizing: border-box; } 81 | 82 | .tab-btn-anterior { 83 | padding: 3px 0 0 6px; } 84 | 85 | .tab-btn-proximo { 86 | padding: 3px 0 0 7px; } 87 | 88 | .tab-btn-anterior:after, .tab-btn-proximo:after { 89 | content: ""; 90 | width: 0; 91 | height: 0; 92 | position: absolute; 93 | border-top: 6px solid transparent; 94 | border-bottom: 6px solid transparent; } 95 | 96 | .tab-btn-anterior:after { 97 | border-right: 6px solid #e2bf3b; } 98 | 99 | .tab-btn-proximo:after { 100 | border-left: 6px solid #e2bf3b; } 101 | 102 | .tab-btn-anterior:hover, .tab-btn-proximo:hover { 103 | color: #FFFFFF; 104 | border: 1px solid #e2bf3b; 105 | background-color: #e2bf3b; } 106 | 107 | .tab-btn-anterior:hover:after { 108 | border-right: 6px solid #FFFFFF; } 109 | 110 | .tab-btn-anterior.btn-inativo:after { 111 | border-right: 6px solid #CCCCCC; } 112 | 113 | .tab-btn-proximo:hover:after { 114 | border-left: 6px solid #FFFFFF; } 115 | 116 | .tab-btn-proximo.btn-inativo:after { 117 | border-left: 6px solid #CCCCCC; } 118 | 119 | .tab-btn-anterior.btn-inativo, .tab-btn-proximo.btn-inativo, .tab-btn-anterior.btn-inativo:hover, .tab-btn-proximo.btn-inativo:hover { 120 | color: #CCCCCC; 121 | border: 1px solid transparent; 122 | background-color: transparent; 123 | pointer-events: none; 124 | cursor: default; } 125 | 126 | /* -- ESTILOS DESKTOP -- */ 127 | .tabelinha.estilo-dtp td > b { 128 | display: none; } 129 | 130 | .tabelinha.estilo-dtp th, .tabelinha.estilo-dtp td { 131 | text-align: center; } 132 | 133 | .tabelinha.estilo-dtp tbody tr:nth-child(even) { 134 | background: transparent; } 135 | 136 | .tabelinha.estilo-dtp tbody tr:nth-child(odd) { 137 | background: #F9F9F9; } 138 | 139 | /* -- ESTILOS MOBILE -- */ 140 | .tabelinha.estilo-mob th { 141 | display: none; } 142 | 143 | .tabelinha.estilo-mob td { 144 | width: 100%; 145 | clear: left; 146 | float: left; 147 | text-align: left; 148 | display: block; } 149 | 150 | .tabelinha.estilo-mob td > b { 151 | width: 35%; 152 | display: inline-block; } 153 | 154 | .tabelinha.estilo-mob td > span { 155 | vertical-align: top; 156 | max-width: 62%; 157 | display: inline-block; } 158 | 159 | .tabelinha.estilo-mob td:nth-child(even) { 160 | background: transparent; } 161 | 162 | .tabelinha.estilo-mob td:nth-child(odd) { 163 | background: #F9F9F9; } 164 | 165 | .uk-radio, 166 | .uk-checkbox { 167 | /* 1 */ 168 | display: inline-block; 169 | height: 16px; 170 | width: 16px; 171 | /* 2 */ 172 | overflow: hidden; 173 | outline: none !important; 174 | /* 3 */ 175 | margin-top: -4px; 176 | vertical-align: middle; 177 | /* 4 */ 178 | -webkit-appearance: none; 179 | /* 5 */ 180 | background-color: transparent; 181 | /* 6 */ 182 | background-repeat: no-repeat; 183 | background-position: 50% 50%; 184 | border: 1px solid #cccccc; 185 | -webkit-transition: 0.2s ease-in-out; 186 | transition: 0.2s ease-in-out; 187 | -webkit-transition-property: background-color, border; 188 | transition-property: background-color, border; } 189 | 190 | .uk-radio { 191 | border-radius: 50%; } 192 | 193 | /* Focus */ 194 | .uk-radio:focus, 195 | .uk-checkbox:focus { 196 | outline: none; 197 | border-color: #bcb2a2; } 198 | 199 | /* 200 | * Checked 201 | */ 202 | .uk-radio:checked, 203 | .uk-checkbox:checked, 204 | .uk-checkbox:indeterminate { 205 | background-color: #f4df90; 206 | border-color: transparent; } 207 | 208 | /* Focus */ 209 | .uk-radio:checked:focus, 210 | .uk-checkbox:checked:focus, 211 | .uk-checkbox:indeterminate:focus { 212 | background-color: #f4df90; } 213 | 214 | /* 215 | * Icons 216 | */ 217 | .uk-radio:checked { 218 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); } 219 | 220 | .uk-checkbox:checked { 221 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%2F%3E%0A%3C%2Fsvg%3E"); } 222 | 223 | .uk-checkbox:indeterminate { 224 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%3E%3C%2Frect%3E%0A%3C%2Fsvg%3E"); } 225 | 226 | /* 227 | * Disabled 228 | */ 229 | .uk-radio:disabled, 230 | .uk-checkbox:disabled { 231 | background-color: #f4df90; 232 | border-color: #bcb2a2; } 233 | 234 | .uk-radio:disabled:checked { 235 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23999%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%3E%3C%2Fcircle%3E%0A%3C%2Fsvg%3E"); } 236 | 237 | .uk-checkbox:disabled:checked { 238 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23999%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%2F%3E%0A%3C%2Fsvg%3E"); } 239 | 240 | .uk-checkbox:disabled:indeterminate { 241 | background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23999%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%3E%3C%2Frect%3E%0A%3C%2Fsvg%3E"); } 242 | 243 | .ribbonFit { 244 | position: absolute; 245 | right: 10%; } 246 | 247 | a { 248 | color: #e2bf3b; 249 | transition: color linear .15s; 250 | text-decoration: underline; } 251 | a:hover { 252 | color: #cca71e; } 253 | 254 | body { 255 | font-size: 10px; 256 | font-family: "Open Sans", sans-serif; 257 | background-color: #fffffe; } 258 | 259 | .button { 260 | display: inline-block; 261 | background-color: #787167; 262 | font-size: 16px; 263 | font-family: "Open Sans", sans-serif; 264 | color: white; 265 | font-weight: bold; 266 | padding: 1.5rem 2.7rem; 267 | border: 0; 268 | border-radius: 3rem; 269 | transition: background-color linear .15s; 270 | outline: none; } 271 | .button i { 272 | color: #c0b5a5; 273 | margin-right: 5px; 274 | font-size: 1.2em; 275 | vertical-align: middle; } 276 | .button:hover { 277 | background-color: #5d574f; } 278 | 279 | .titleAccent { 280 | font-size: 5.2em; 281 | font-family: "Alex Brush", "Open Sans", sans-serif; 282 | color: #e2bf3b; 283 | line-height: 1.2; 284 | margin: 0; 285 | margin-bottom: -.4em; } 286 | 287 | .title { 288 | font-size: 3.2em; 289 | font-family: "Aquino Demo", "Open Sans", sans-serif; 290 | color: #787167; 291 | text-transform: uppercase; 292 | line-height: 1.2; 293 | letter-spacing: -2px; 294 | margin: 0; } 295 | 296 | .titleContainer { 297 | text-align: center; } 298 | 299 | .icon { 300 | display: inline-block; 301 | fill: #f0f0e6; } 302 | 303 | .icon--title { 304 | margin-bottom: -6.2em; 305 | position: relative; 306 | z-index: -1; 307 | width: 16em; 308 | height: 9em; 309 | transform: scale(0.9); } 310 | 311 | .icon--table, 312 | .icon--oven { 313 | margin-left: 3em; } 314 | 315 | .i-browser-center, 316 | .i-browser-side { 317 | transform: translate(0.65em, 2.6em); } 318 | 319 | .Header { 320 | background-image: url("../img/header-bg.jpg"); 321 | overflow: hidden; } 322 | .Header::after { 323 | content: ''; 324 | display: block; 325 | width: 100%; 326 | height: 36px; 327 | background-image: url("../img/header-append.png"); 328 | background-size: cover; 329 | background-position: center center; } 330 | .Header > .container { 331 | height: 580px; 332 | padding-top: 80px; 333 | display: flex; 334 | align-items: center; 335 | justify-content: center; } 336 | 337 | .Header-logo { 338 | background-repeat: no-repeat; 339 | width: 879px; 340 | height: 510px; 341 | text-align: center; 342 | padding-top: 75px; } 343 | 344 | .Header-logo-slogan { 345 | font-size: 2rem; 346 | margin-top: 1.5em; 347 | color: #787167; 348 | font-family: "Open Sans", sans-serif; 349 | font-style: italic; } 350 | .Header-logo-slogan span { 351 | font-size: .75em; } 352 | 353 | .Header-logo-btns { 354 | margin-top: 1em; 355 | position: relative; 356 | z-index: 25; } 357 | .Header-logo-btns iframe + iframe { 358 | margin-left: 1em; } 359 | 360 | .Header-icon { 361 | background-size: contain; 362 | background-repeat: no-repeat; } 363 | 364 | .Header-icon--1 { 365 | background-image: url("../img/i-header-1.png"); 366 | width: 222px; 367 | height: 247px; 368 | position: absolute; 369 | transform: translate(-90px); } 370 | 371 | .Header-icon--2 { 372 | background-image: url("../img/i-header-2.png"); 373 | width: 145px; 374 | height: 80px; 375 | position: absolute; 376 | transform: translate(-10px, 290px); } 377 | 378 | .Header-icon--3 { 379 | background-image: url("../img/i-header-3.png"); 380 | width: 85px; 381 | height: 46px; 382 | position: absolute; 383 | transform: translate(230px, 40px); } 384 | 385 | .Header-icon--4 { 386 | background-image: url("../img/i-header-4.png"); 387 | width: 113px; 388 | height: 83px; 389 | display: inline-block; 390 | transform: translate(-300px, 160px); } 391 | 392 | .Header-icon--5 { 393 | background-image: url("../img/i-header-5.png"); 394 | width: 163px; 395 | height: 101px; 396 | display: inline-block; 397 | transform: translate(0px, -50px); } 398 | 399 | .Header-icon--6 { 400 | background-image: url("../img/i-header-6.png"); 401 | width: 225px; 402 | height: 146px; 403 | display: inline-block; 404 | transform: translate(70px, -20px); } 405 | 406 | .Header-bottom { 407 | text-align: right; 408 | margin-top: -220px; } 409 | 410 | .Flavors { 411 | padding-top: 7em; } 412 | 413 | .Flavors-items { 414 | display: flex; 415 | justify-content: space-between; 416 | margin-top: 7em; 417 | width: 98%; } 418 | @media (min-with: 992px) { 419 | .Flavors-items.is-hover .Flavors-item:not(.is-active) { 420 | opacity: .6; } } 421 | 422 | .Flavors-item { 423 | width: 31%; 424 | border: 2px solid transparent; 425 | border-radius: 10px; 426 | -webkit-border-image: url("../img/flavors-border.png") 3 round; 427 | /* Safari 3.1-5 */ 428 | -o-border-image: url("../img/flavors-border.png") 3 round; 429 | /* Opera 11-12.1 */ 430 | border-image: url("../img/flavors-border.png") 3 round; 431 | padding: 4em 6em; 432 | transition: border linear .15s, box-shadow linear .15s, background-color linear .15s, transform linear .15s, opacity linear .2s; } 433 | @media (min-width: 992px) { 434 | .Flavors-item { 435 | position: relative; 436 | padding: 4em 6em 10em 6em; } } 437 | @media (min-width: 992px) { 438 | .Flavors-item .buttonContainer { 439 | margin: 0 0 0 -2em; 440 | position: absolute; 441 | bottom: 1.5em; } } 442 | @media (max-width: 992px) { 443 | .Flavors-item .buttonContainer { 444 | margin-top: 20px; 445 | text-align: center; } } 446 | .Flavors-item .button + .button { 447 | margin-left: 20px; } 448 | .Flavors-item .button { 449 | transition: opacity linear .15s; } 450 | @media (min-width: 992px) { 451 | .Flavors-item .button { 452 | opacity: 0; } } 453 | .Flavors-item:hover { 454 | border: 2px solid #ffefb4; 455 | box-shadow: 0px 0px 57px 0px rgba(242, 221, 141, 0.74); 456 | background-color: #fff; } 457 | .Flavors-item:hover .button { 458 | opacity: 1; } 459 | .Flavors-item:hover .Flavors-item-menu--center { 460 | animation: menuchef-center ease-in-out .5s; 461 | animation-iteration-count: 1; 462 | transform-origin: 35% 48%; 463 | -webkit-animation: menuchef-center ease-in-out .5s; 464 | -webkit-animation-iteration-count: 1; 465 | -webkit-transform-origin: 35% 48%; 466 | -moz-animation: menuchef-center ease-in-out .5s; 467 | -moz-animation-iteration-count: 1; 468 | -moz-transform-origin: 35% 48%; 469 | -o-animation: menuchef-center ease-in-out .5s; 470 | -o-animation-iteration-count: 1; 471 | -o-transform-origin: 35% 48%; 472 | -ms-animation: menuchef-center ease-in-out .5s; 473 | -ms-animation-iteration-count: 1; 474 | -ms-transform-origin: 35% 48%; } 475 | .Flavors-item:hover .Flavors-item-menu--left { 476 | animation: menuchef-side-left ease-in-out .6s; 477 | animation-iteration-count: 1; 478 | transform-origin: 0% 50%; 479 | -webkit-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 480 | -webkit-animation-iteration-count: 1; 481 | -webkit-transform-origin: 0% 50%; 482 | -moz-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 483 | -moz-animation-iteration-count: 1; 484 | -moz-transform-origin: 0% 50%; 485 | -o-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 486 | -o-animation-iteration-count: 1; 487 | -o-transform-origin: 0% 50%; 488 | -ms-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 489 | -ms-animation-iteration-count: 1; 490 | -ms-transform-origin: 0% 50%; } 491 | .Flavors-item:hover .Flavors-item-menu--right { 492 | animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 493 | animation-iteration-count: 1; 494 | transform-origin: 100% 50%; 495 | -webkit-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 496 | -webkit-animation-iteration-count: 1; 497 | -webkit-transform-origin: 100% 50%; 498 | -moz-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 499 | -moz-animation-iteration-count: 1; 500 | -moz-transform-origin: 100% 50%; 501 | -o-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 502 | -o-animation-iteration-count: 1; 503 | -o-transform-origin: 100% 50%; 504 | -ms-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) 0.6s; 505 | -ms-animation-iteration-count: 1; 506 | -ms-transform-origin: 100% 50%; } 507 | 508 | .Flavors-item-type { 509 | font-size: 2.1em; 510 | font-family: "Aquino Demo", "Open Sans", sans-serif; 511 | color: #787167; 512 | text-transform: uppercase; 513 | text-align: center; } 514 | 515 | .Flavors-item-browser { 516 | display: block; 517 | margin: 0 auto; 518 | width: 18.5em; 519 | height: 14.4em; 520 | fill: #787167; } 521 | 522 | .Flavors-item-menu { 523 | margin-top: -14.4em; 524 | transform: translate(2.4em, 2.2em); } 525 | @media (max-width: 1200px) { 526 | .Flavors-item-menu { 527 | transform: translate(0.6em, 2.2em); } } 528 | @media (max-width: 992px) { 529 | .Flavors-item-menu { 530 | transform: translate(6.4em, 2.1em); } } 531 | .Flavors-item-menu--left { 532 | transform: translate(2.4em, 2.1em); } 533 | @media (max-width: 1200px) { 534 | .Flavors-item-menu--left { 535 | transform: translate(0.6em, 2.1em); } } 536 | @media (max-width: 992px) { 537 | .Flavors-item-menu--left { 538 | transform: translate(6.4em, 2.1em); } } 539 | .Flavors-item-menu--right { 540 | transform: translate(11.2em, 2.1em); } 541 | @media (max-width: 1200px) { 542 | .Flavors-item-menu--right { 543 | transform: translate(9.4em, 2.1em); } } 544 | @media (max-width: 992px) { 545 | .Flavors-item-menu--right { 546 | transform: translate(15.2em, 2.1em); } } 547 | 548 | .Flavors-item-recipe, .Flavors-item-colors-title { 549 | font-size: 20px; 550 | color: #787167; 551 | font-style: italic; 552 | text-align: center; 553 | margin: 1.5em 0; } 554 | 555 | .Flavors-item-code { 556 | text-align: left; 557 | background: transparent; 558 | border-color: transparent; } 559 | @media (min-width: 1200px) { 560 | .Flavors-item-code { 561 | height: 170px; } } 562 | @media (min-width: 992px) { 563 | .Flavors-item-code { 564 | height: 190px; } } 565 | @media (max-width: 992px) { 566 | .Flavors-item-code { 567 | height: 150px; 568 | margin-bottom: 30px; } } 569 | 570 | .Flavors-item-code { 571 | position: relative; } 572 | 573 | .Flavors-item-code > pre { 574 | white-space: pre-wrap; 575 | word-break: normal; 576 | background: transparent; 577 | border-color: transparent; } 578 | 579 | .Flavors-item-checkboxes { 580 | text-align: center; } 581 | 582 | .Flavors-item-checkbox + .Flavors-item-checkbox { 583 | margin-left: 25px; } 584 | 585 | .Flavors-item-checkbox { 586 | font-size: 13px; 587 | font-family: "Open Sans", sans-serif; 588 | color: #bcb2a2; 589 | font-weight: 400; } 590 | .Flavors-item-checkbox span { 591 | vertical-align: middle; 592 | margin-left: 3px; 593 | position: relative; 594 | top: 2px; } 595 | .Flavors-item-checkbox input:checked + span { 596 | color: #787167; } 597 | 598 | @-webkit-keyframes menuchef-center { 599 | 0% { 600 | opacity: 0; } 601 | 100% { 602 | opacity: 1; } } 603 | 604 | @-moz-keyframes menuchef-center { 605 | 0% { 606 | opacity: 0; } 607 | 100% { 608 | opacity: 1; } } 609 | 610 | @-o-keyframes menuchef-center { 611 | 0% { 612 | opacity: 0; } 613 | 100% { 614 | opacity: 1; } } 615 | 616 | @keyframes menuchef-center { 617 | 0% { 618 | opacity: 0; } 619 | 100% { 620 | opacity: 1; } } 621 | 622 | @-webkit-keyframes menuchef-side-left { 623 | 0% { 624 | transform: translate(2.4em, 2em) scaleX(0); } 625 | 626 | 100% { 627 | transform: translate(2.4em, 2em) scaleX(1); } } 628 | 629 | @-moz-keyframes menuchef-side-left { 630 | 0% { 631 | transform: translate(2.4em, 2em) scaleX(0); } 632 | 633 | 100% { 634 | transform: translate(2.4em, 2em) scaleX(1); } } 635 | 636 | @-o-keyframes menuchef-side-left { 637 | 0% { 638 | transform: translate(2.4em, 2em) scaleX(0); } 639 | 640 | 100% { 641 | transform: translate(2.4em, 2em) scaleX(1); } } 642 | 643 | @keyframes menuchef-side-left { 644 | 0% { 645 | transform: translate(2.4em, 2em) scaleX(0); } 646 | 647 | 100% { 648 | transform: translate(2.4em, 2em) scaleX(1); } } 649 | 650 | @-webkit-keyframes menuchef-side-right { 651 | 0% { 652 | -webkit-transform: translate(-11.2em, 2.1em) scaleX(0); 653 | transform: translate(-11.2em, 2.1em) scaleX(0); } 654 | 655 | 100% { 656 | -webkit-transform: translate(11.2em, 2.1em) scaleX(1); 657 | transform: translate(11.2em, 2.1em) scaleX(1); } } 658 | 659 | @-moz-keyframes menuchef-side-right { 660 | 0% { 661 | -webkit-transform: translate(-11.2em, 2.1em) scaleX(0); 662 | transform: translate(-11.2em, 2.1em) scaleX(0); } 663 | 664 | 100% { 665 | -webkit-transform: translate(11.2em, 2.1em) scaleX(1); 666 | transform: translate(11.2em, 2.1em) scaleX(1); } } 667 | 668 | @-o-keyframes menuchef-side-right { 669 | 0% { 670 | -webkit-transform: translate(-11.2em, 2.1em) scaleX(0); 671 | transform: translate(-11.2em, 2.1em) scaleX(0); } 672 | 673 | 100% { 674 | -webkit-transform: translate(11.2em, 2.1em) scaleX(1); 675 | transform: translate(11.2em, 2.1em) scaleX(1); } } 676 | 677 | @keyframes menuchef-side-right { 678 | 0% { 679 | -webkit-transform: translate(-11.2em, 2.1em) scaleX(0); 680 | transform: translate(-11.2em, 2.1em) scaleX(0); } 681 | 682 | 100% { 683 | -webkit-transform: translate(11.2em, 2.1em) scaleX(1); 684 | transform: translate(11.2em, 2.1em) scaleX(1); } } 685 | 686 | @media (max-width: 1200px) { 687 | @-webkit-keyframes menuchef-side-left { 688 | 0% { 689 | transform: translate(0.6em, 2.1em) scaleX(0); } 690 | 691 | 100% { 692 | transform: translate(0.6em, 2.1em) scaleX(1); } } 693 | @-moz-keyframes menuchef-side-left { 694 | 0% { 695 | transform: translate(0.6em, 2.1em) scaleX(0); } 696 | 697 | 100% { 698 | transform: translate(0.6em, 2.1em) scaleX(1); } } 699 | @-o-keyframes menuchef-side-left { 700 | 0% { 701 | transform: translate(0.6em, 2.1em) scaleX(0); } 702 | 703 | 100% { 704 | transform: translate(0.6em, 2.1em) scaleX(1); } } 705 | @keyframes menuchef-side-left { 706 | 0% { 707 | transform: translate(0.6em, 2.1em) scaleX(0); } 708 | 709 | 100% { 710 | transform: translate(0.6em, 2.1em) scaleX(1); } } 711 | @-webkit-keyframes menuchef-side-right { 712 | 0% { 713 | transform: translate(-13em, 2.1em) scaleX(0); } 714 | 715 | 100% { 716 | transform: translate(9.4em, 2.1em) scaleX(1); } } 717 | @-moz-keyframes menuchef-side-right { 718 | 0% { 719 | transform: translate(-13em, 2.1em) scaleX(0); } 720 | 721 | 100% { 722 | transform: translate(9.4em, 2.1em) scaleX(1); } } 723 | @-o-keyframes menuchef-side-right { 724 | 0% { 725 | transform: translate(-13em, 2.1em) scaleX(0); } 726 | 727 | 100% { 728 | transform: translate(9.4em, 2.1em) scaleX(1); } } 729 | @keyframes menuchef-side-right { 730 | 0% { 731 | transform: translate(-13em, 2.1em) scaleX(0); } 732 | 733 | 100% { 734 | transform: translate(9.4em, 2.1em) scaleX(1); } } } 735 | 736 | @media (max-width: 992px) { 737 | @-webkit-keyframes menuchef-side-left { 738 | 0% { 739 | transform: translate(6.4em, 2.1em); } 740 | 741 | 100% { 742 | transform: translate(6.4em, 2.1em); } } 743 | @-moz-keyframes menuchef-side-left { 744 | 0% { 745 | transform: translate(6.4em, 2.1em); } 746 | 747 | 100% { 748 | transform: translate(6.4em, 2.1em); } } 749 | @-o-keyframes menuchef-side-left { 750 | 0% { 751 | transform: translate(6.4em, 2.1em); } 752 | 753 | 100% { 754 | transform: translate(6.4em, 2.1em); } } 755 | @keyframes menuchef-side-left { 756 | 0% { 757 | transform: translate(6.4em, 2.1em); } 758 | 759 | 100% { 760 | transform: translate(6.4em, 2.1em); } } 761 | @-webkit-keyframes menuchef-center { 762 | 0% { 763 | opacity: 1; } 764 | 100% { 765 | opacity: 1; } } 766 | @-moz-keyframes menuchef-center { 767 | 0% { 768 | opacity: 1; } 769 | 100% { 770 | opacity: 1; } } 771 | @-o-keyframes menuchef-center { 772 | 0% { 773 | opacity: 1; } 774 | 100% { 775 | opacity: 1; } } 776 | @keyframes menuchef-center { 777 | 0% { 778 | opacity: 1; } 779 | 100% { 780 | opacity: 1; } } 781 | @-webkit-keyframes menuchef-side-right { 782 | 0% { 783 | transform: translate(15.1em, 2.1em); } 784 | 785 | 100% { 786 | transform: translate(15.1em, 2.1em); } } 787 | @-moz-keyframes menuchef-side-right { 788 | 0% { 789 | transform: translate(15.1em, 2.1em); } 790 | 791 | 100% { 792 | transform: translate(15.1em, 2.1em); } } 793 | @-o-keyframes menuchef-side-right { 794 | 0% { 795 | transform: translate(15.1em, 2.1em); } 796 | 797 | 100% { 798 | transform: translate(15.1em, 2.1em); } } 799 | @keyframes menuchef-side-right { 800 | 0% { 801 | transform: translate(15.1em, 2.1em); } 802 | 803 | 100% { 804 | transform: translate(15.1em, 2.1em); } } } 805 | 806 | .NutricionalTable { 807 | padding-top: 8em; } 808 | 809 | .NutricionalTable-table { 810 | margin-top: 3em; 811 | font-size: 1.4em; 812 | border: 1px solid #d3cec6; 813 | border-radius: 2px; 814 | padding: 3em 2em; 815 | color: #787167; } 816 | .NutricionalTable-table th { 817 | font-size: 1.1em; 818 | padding-bottom: 1em !important; 819 | border-bottom: 1px solid #f3efeb !important; } 820 | .NutricionalTable-table td { 821 | font-style: italic; 822 | padding: 1em 0 !important; 823 | border-bottom: 1px solid #f3efeb !important; } 824 | .NutricionalTable-table tr:hover .NutricionalTable-table-link { 825 | opacity: 1; } 826 | 827 | .NutricionalTable-table-link { 828 | margin-right: .5em; 829 | opacity: 0; } 830 | 831 | .NutricionalTable-table-title { 832 | font-size: 20px; 833 | color: #e2bf3b; 834 | font-weight: bold; 835 | text-transform: uppercase; 836 | border-left: 0.4em solid #e2bf3b; 837 | padding-left: 1.2em; 838 | margin-left: -1.4em; } 839 | 840 | .NutricionalTable-table-var { 841 | width: 15%; } 842 | 843 | .NutricionalTable-table-type { 844 | width: 12%; } 845 | 846 | .NutricionalTable-table-default { 847 | width: 12%; } 848 | 849 | .NutricionalTable-table-desc { 850 | width: 61%; } 851 | 852 | .label--string { 853 | background-color: #d9b220; } 854 | 855 | .label--object { 856 | background-color: #ba991c; } 857 | 858 | .label--boolean { 859 | background-color: #9b7f17; } 860 | 861 | .label--function { 862 | background-color: #7c6612; } 863 | 864 | .Flavors-item-colors-title { 865 | font-size: 14px; } 866 | @media (max-width: 992px) { 867 | .Flavors-item-colors-title { 868 | margin-top: 0 !important; } } 869 | 870 | .Flavors-item-colors { 871 | padding: 0; 872 | text-align: center; } 873 | @media (max-width: 992px) { 874 | .Flavors-item-colors { 875 | margin-bottom: 20px; } } 876 | 877 | .Flavors-item-colors-color + .Flavors-item-colors-color { 878 | margin-left: 20px; } 879 | @media (max-width: 1200px) { 880 | .Flavors-item-colors-color + .Flavors-item-colors-color { 881 | margin-left: 10px; } } 882 | 883 | .Flavors-item-colors-color { 884 | list-style-type: none; 885 | display: inline-block; } 886 | .Flavors-item-colors-color button { 887 | width: 18px; 888 | height: 18px; 889 | border-radius: 3px; 890 | border: 0; 891 | outline: none; } 892 | .Flavors-item-colors-color.is-active button { 893 | box-shadow: 0 0 10px #e2bf3b; } 894 | 895 | .Flavors-item-colors-color--black button { 896 | background-color: #323232; } 897 | 898 | .Flavors-item-colors-color--yellow button { 899 | background-color: #f9e8c0; } 900 | 901 | .Flavors-item-colors-color--red button { 902 | background-color: #f1b7b0; } 903 | 904 | .Flavors-item-colors-color--green button { 905 | background-color: #bfe8d7; } 906 | 907 | .Flavors-item-colors-color--blue button { 908 | background-color: #bcc8ea; } 909 | 910 | @media (max-width: 1200px) { 911 | .Flavors-item-icon { 912 | transform: scale(0.8); } } 913 | 914 | @media (max-width: 1200px) and (min-width: 992px) { 915 | .Flavors-item .buttonContainer { 916 | text-align: center; 917 | margin: 0 0 0 -4.5em; } 918 | .Flavors-item .button + .button { 919 | margin-left: 10px; } } 920 | 921 | @media (max-width: 992px) { 922 | .Flavors-items { 923 | flex-direction: column; } 924 | .Flavors-item { 925 | width: 100%; 926 | margin-bottom: 4rem; } 927 | .Flavors-item-recipe, .Flavors-item-colors-title { 928 | margin-top: -1.6em; } 929 | .Flavors-item-icon { 930 | float: left; 931 | margin-left: -5rem; 932 | margin-top: 0.4rem; } 933 | .Flavors-item-type { 934 | text-align: left; } } 935 | 936 | @media (max-width: 768px) { 937 | .ribbonFit { 938 | right: 3%; 939 | zoom: .7; } 940 | .Header-logo { 941 | width: 100%; 942 | height: auto; } 943 | .Header-logo img { 944 | max-width: 200px; 945 | position: relative; 946 | z-index: 300; } 947 | .Header > .container { 948 | height: 290px; 949 | padding-top: 0; 950 | display: flex; 951 | align-items: initial; 952 | justify-content: center; } 953 | .Header-logo-slogan { 954 | font-size: 1.75rem; } 955 | .Flavors-item { 956 | padding: 4em 0em; } 957 | .Flavors-item-icon { 958 | float: none; 959 | margin-top: 3rem; 960 | width: 30em; 961 | display: block; 962 | margin: 0 auto; 963 | margin-bottom: 20px; } 964 | .Flavors-item-type { 965 | text-align: center; } 966 | .Flavors-item-code { 967 | text-align: center; 968 | height: auto; } 969 | .Flavors-item-code pre { 970 | display: inline-block; 971 | text-align: left; } 972 | main { 973 | overflow: hidden; } 974 | .Header-icon { 975 | zoom: 0.3; 976 | margin-top: 200px; 977 | opacity: .4; } } 978 | 979 | .Preheating { 980 | margin-top: 7em; } 981 | .Preheating pre { 982 | background: transparent !important; } 983 | 984 | .Preheating-text { 985 | font-size: 1.4em; 986 | color: #787167; 987 | margin-top: 2em; } 988 | 989 | .Footer { 990 | margin-top: 2.5em; 991 | padding: 1.2em 0; 992 | background-color: #887753; 993 | text-align: center; 994 | color: #fff; 995 | font-size: 1.2em; } 996 | .Footer a { 997 | color: #d4ccb9; 998 | text-decoration: none; } 999 | 1000 | .Footer-salt { 1001 | vertical-align: middle; 1002 | margin: 0 .25em; } 1003 | 1004 | .Code { 1005 | margin: 2em 0 !important; 1006 | background: transparent !important; } 1007 | 1008 | /*# sourceMappingURL=style.css.map */ -------------------------------------------------------------------------------- /assets/css/style.css.map: -------------------------------------------------------------------------------- 1 | { 2 | "version": 3, 3 | "file": "style.css", 4 | "sources": [ 5 | "style.scss", 6 | "config/_system.scss", 7 | "config/_config.scss", 8 | "config/_mixins.scss", 9 | "_vars.scss", 10 | "../fonts/_fonts.scss", 11 | "_tabelinha.scss", 12 | "_uk-form.scss" 13 | ], 14 | "names": [], 15 | "mappings": "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" 16 | } -------------------------------------------------------------------------------- /assets/css/style.scss: -------------------------------------------------------------------------------- 1 | @import 'config/system'; 2 | @import 'config/config'; 3 | 4 | @import 'tabelinha'; 5 | @import 'uk-form'; 6 | 7 | .ribbonFit { 8 | position: absolute; 9 | right: 10%; 10 | } 11 | 12 | a { 13 | color: $color-1; 14 | transition: color linear .15s; 15 | text-decoration: underline; 16 | 17 | &:hover { 18 | color: darken($color-1, 10%); 19 | } 20 | } 21 | 22 | body { 23 | font-size: 10px; 24 | font-family: $font-1; 25 | background-color: #fffffe; 26 | } 27 | 28 | .button { 29 | display: inline-block; 30 | background-color: $color-2; 31 | font-size: 16px; 32 | font-family: $font-1; 33 | color: rgb(255, 255, 255); 34 | font-weight: bold; 35 | padding: 1.5rem 2.7rem;; 36 | border: 0; 37 | border-radius: 3rem; 38 | transition: background-color linear .15s; 39 | outline: none; 40 | 41 | i { 42 | color: #c0b5a5; 43 | margin-right: 5px; 44 | font-size: 1.2em; 45 | vertical-align: middle; 46 | } 47 | 48 | &:hover { 49 | background-color: darken($color-2, 10%); 50 | } 51 | } 52 | 53 | .titleAccent { 54 | font-size: 5.2em; 55 | font-family: $font-3; 56 | color: $color-1; 57 | line-height: 1.2; 58 | margin: 0; 59 | margin-bottom: -.4em; 60 | } 61 | 62 | .title { 63 | font-size: 3.2em; 64 | font-family: $font-2; 65 | color: $color-2; 66 | text-transform: uppercase; 67 | line-height: 1.2; 68 | letter-spacing: -2px; 69 | margin: 0; 70 | } 71 | 72 | .titleContainer { 73 | text-align: center; 74 | } 75 | 76 | .icon { 77 | display: inline-block; 78 | fill: $color-3; 79 | } 80 | .icon--title { 81 | margin-bottom: -6.2em; 82 | position: relative; 83 | z-index: -1; 84 | width: 16em; 85 | height: 9em; 86 | transform: scale(.9); 87 | } 88 | .icon--table, 89 | .icon--oven { 90 | margin-left: 3em; 91 | } 92 | .i-browser-center, 93 | .i-browser-side { 94 | transform: translate(.65em, 2.6em); 95 | } 96 | 97 | .Header { 98 | background-image: url('../img/header-bg.jpg'); 99 | overflow: hidden; 100 | 101 | &::after { 102 | content: ''; 103 | display: block; 104 | width: 100%; 105 | height: 36px; 106 | background-image: url('../img/header-append.png'); 107 | background-size: cover; 108 | background-position: center center; 109 | } 110 | 111 | > .container { 112 | height: 580px; 113 | padding-top: 80px; 114 | display: flex; 115 | align-items: center; 116 | justify-content: center; 117 | } 118 | } 119 | 120 | .Header-logo { 121 | // background-image: url('../img/menuchef-bg.png'); 122 | background-repeat: no-repeat; 123 | @include size(879px, 510px); 124 | text-align: center; 125 | padding-top: 75px; 126 | } 127 | .Header-logo-slogan { 128 | font-size: 2rem; 129 | margin-top: 1.5em; 130 | color: #787167; 131 | font-family: $font-1; 132 | font-style: italic; 133 | 134 | span { 135 | font-size: .75em; 136 | } 137 | } 138 | .Header-logo-btns { 139 | margin-top: 1em; 140 | position: relative; 141 | z-index: 25; 142 | 143 | iframe + iframe { 144 | margin-left: 1em; 145 | } 146 | } 147 | 148 | .Header-icon { 149 | background-size: contain; 150 | background-repeat: no-repeat; 151 | 152 | @media (max-width: 768px) { 153 | // display: none !important; 154 | } 155 | } 156 | .Header-icon--1 { 157 | background-image: url('../img/i-header-1.png'); 158 | @include size(222px, 247px); 159 | position: absolute; 160 | transform: translate(-90px); 161 | } 162 | .Header-icon--2 { 163 | background-image: url('../img/i-header-2.png'); 164 | @include size(145px, 80px); 165 | position: absolute; 166 | transform: translate(-10px, 290px); 167 | } 168 | .Header-icon--3 { 169 | background-image: url('../img/i-header-3.png'); 170 | @include size(85px, 46px); 171 | position: absolute; 172 | transform: translate(230px, 40px); 173 | } 174 | .Header-icon--4 { 175 | background-image: url('../img/i-header-4.png'); 176 | @include size(113px, 83px); 177 | display: inline-block; 178 | transform: translate(-300px, 160px); 179 | } 180 | .Header-icon--5 { 181 | background-image: url('../img/i-header-5.png'); 182 | @include size(163px, 101px); 183 | display: inline-block; 184 | transform: translate(0px, -50px); 185 | } 186 | .Header-icon--6 { 187 | background-image: url('../img/i-header-6.png'); 188 | @include size(225px, 146px); 189 | display: inline-block; 190 | transform: translate(70px, -20px); 191 | } 192 | .Header-bottom { 193 | text-align: right; 194 | margin-top: -220px; 195 | } 196 | 197 | .Flavors { 198 | padding-top: 7em; 199 | } 200 | 201 | .Flavors-items { 202 | display: flex; 203 | justify-content: space-between; 204 | margin-top: 7em; 205 | width: 98%; 206 | 207 | &.is-hover .Flavors-item:not(.is-active) { 208 | @media (min-with: 992px) { 209 | opacity: .6; 210 | } 211 | } 212 | } 213 | .Flavors-item { 214 | width: 31%; 215 | border: 2px solid transparent; 216 | border-radius: 10px; 217 | -webkit-border-image: url('../img/flavors-border.png') 3 round; /* Safari 3.1-5 */ 218 | -o-border-image: url('../img/flavors-border.png') 3 round; /* Opera 11-12.1 */ 219 | border-image: url('../img/flavors-border.png') 3 round; 220 | padding: 4em 6em; 221 | transition: border linear .15s, box-shadow linear .15s, background-color linear .15s, transform linear .15s, opacity linear .2s; 222 | 223 | @media (min-width: 992px) { 224 | position: relative; 225 | padding: 4em 6em 10em 6em; 226 | } 227 | 228 | .buttonContainer { 229 | @media (min-width: 992px) { 230 | margin: 0 0 0 -2em; 231 | position: absolute; 232 | bottom: 1.5em; 233 | } 234 | @media (max-width: 992px) { 235 | margin-top: 20px; 236 | text-align: center; 237 | } 238 | } 239 | 240 | .button + .button { margin-left: 20px; } 241 | .button { 242 | transition: opacity linear .15s; 243 | 244 | @media (min-width: 992px) { 245 | opacity: 0; 246 | } 247 | } 248 | 249 | &:hover { 250 | border: 2px solid #ffefb4; 251 | box-shadow: 0px 0px 57px 0px rgba(242, 221, 141, 0.74); 252 | background-color: #fff; 253 | 254 | .button { opacity: 1; } 255 | 256 | .Flavors-item-menu--center { 257 | animation: menuchef-center ease-in-out .5s; 258 | animation-iteration-count: 1; 259 | transform-origin: 35% 48%; 260 | -webkit-animation: menuchef-center ease-in-out .5s; 261 | -webkit-animation-iteration-count: 1; 262 | -webkit-transform-origin: 35% 48%; 263 | -moz-animation: menuchef-center ease-in-out .5s; 264 | -moz-animation-iteration-count: 1; 265 | -moz-transform-origin: 35% 48%; 266 | -o-animation: menuchef-center ease-in-out .5s; 267 | -o-animation-iteration-count: 1; 268 | -o-transform-origin: 35% 48%; 269 | -ms-animation: menuchef-center ease-in-out .5s; 270 | -ms-animation-iteration-count: 1; 271 | -ms-transform-origin: 35% 48%; 272 | } 273 | .Flavors-item-menu--left { 274 | animation: menuchef-side-left ease-in-out .6s; 275 | animation-iteration-count: 1; 276 | transform-origin: 0% 50%; 277 | -webkit-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 278 | -webkit-animation-iteration-count: 1; 279 | -webkit-transform-origin: 0% 50%; 280 | -moz-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 281 | -moz-animation-iteration-count: 1; 282 | -moz-transform-origin: 0% 50%; 283 | -o-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 284 | -o-animation-iteration-count: 1; 285 | -o-transform-origin: 0% 50%; 286 | -ms-animation: menuchef-side-left cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 287 | -ms-animation-iteration-count: 1; 288 | -ms-transform-origin: 0% 50%; 289 | } 290 | .Flavors-item-menu--right { 291 | animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 292 | animation-iteration-count: 1; 293 | transform-origin: 100% 50%; 294 | -webkit-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 295 | -webkit-animation-iteration-count: 1; 296 | -webkit-transform-origin: 100% 50%; 297 | -moz-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 298 | -moz-animation-iteration-count: 1; 299 | -moz-transform-origin: 100% 50%; 300 | -o-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 301 | -o-animation-iteration-count: 1; 302 | -o-transform-origin: 100% 50%; 303 | -ms-animation: menuchef-side-right cubic-bezier(0.18, 0.93, 0.57, 1.03) .6s; 304 | -ms-animation-iteration-count: 1; 305 | -ms-transform-origin: 100% 50%; 306 | } 307 | 308 | } 309 | } 310 | .Flavors-item-type { 311 | font-size: 2.1em; 312 | font-family: $font-2; 313 | color: $color-2; 314 | text-transform: uppercase; 315 | text-align: center; 316 | } 317 | .Flavors-item-browser { 318 | display: block; 319 | margin: 0 auto; 320 | width: 18.5em; 321 | height: 14.4em; 322 | fill: $color-2; 323 | } 324 | .Flavors-item-menu { 325 | margin-top: -14.4em; 326 | transform: translate(2.4em, 2.2em); 327 | 328 | @media (max-width: 1200px) { transform: translate(.6em, 2.2em); } 329 | @media (max-width: 992px) { transform: translate(6.4em, 2.1em); } 330 | 331 | &--left { 332 | transform: translate(2.4em, 2.1em); 333 | @media (max-width: 1200px) { transform: translate(.6em, 2.1em); } 334 | @media (max-width: 992px) { transform: translate(6.4em, 2.1em); } 335 | } 336 | &--right { 337 | transform: translate(11.2em, 2.1em); 338 | @media (max-width: 1200px) { transform: translate(9.4em, 2.1em); } 339 | @media (max-width: 992px) { transform: translate(15.2em, 2.1em); } 340 | } 341 | } 342 | .Flavors-item-recipe { 343 | font-size: 20px; 344 | color: $color-2; 345 | font-style: italic; 346 | text-align: center; 347 | margin: 1.5em 0; 348 | } 349 | .Flavors-item-code { 350 | text-align: left; 351 | // transition: all linear .25s; 352 | // background: lighten($color-main, 30%); 353 | background: transparent; 354 | // border-color: lighten($color-main, 20%); 355 | border-color: transparent; 356 | 357 | @media (min-width: 1200px) { 358 | height: 170px; 359 | } 360 | 361 | @media (min-width: 992px) { 362 | height: 190px; 363 | } 364 | 365 | @media (max-width: 992px) { 366 | height: 150px; 367 | margin-bottom: 30px; 368 | } 369 | } 370 | .Flavors-item-code { 371 | position: relative; 372 | } 373 | .Flavors-item-code > pre { 374 | white-space: pre-wrap; 375 | word-break: normal; 376 | // background: lighten($color-main, 30%); 377 | background: transparent; 378 | // border-color: lighten($color-main, 20%); 379 | border-color: transparent; 380 | // width: 100%; 381 | // position: absolute; 382 | // top: 50%; 383 | // lef: 0; 384 | // right: 0; 385 | // transform: translateY(-50%); 386 | } 387 | .Flavors-item-checkboxes { 388 | text-align: center; 389 | } 390 | .Flavors-item-checkbox + .Flavors-item-checkbox { 391 | margin-left: 25px; 392 | } 393 | .Flavors-item-checkbox { 394 | font-size: 13px; 395 | font-family: $font-1; 396 | color: #bcb2a2; 397 | font-weight: 400; 398 | 399 | span { 400 | vertical-align: middle; 401 | margin-left: 3px; 402 | position: relative; 403 | top: 2px; 404 | } 405 | 406 | input:checked + span { 407 | color: #787167; 408 | } 409 | } 410 | 411 | @include keyframes(menuchef-center) { 412 | 0% { 413 | opacity: 0; 414 | // -webkit-transform: scale(0) translate(2.4em, 2.2em); 415 | // transform: scale(0) translate(2.4em, 2.2em); 416 | } 417 | 100% { 418 | opacity: 1; 419 | // -webkit-transform: scale(1) translate(2.4em, 2.2em); 420 | // transform: scale(1) translate(2.4em, 2.2em); 421 | } 422 | } 423 | 424 | @include keyframes(menuchef-side-left) { 425 | 0% { 426 | transform: translate(2.4em, 2em) scaleX(0); 427 | // @media (max-width: 1200px) { transform: translate(.6em, 2.1em) scaleX(0); } 428 | }, 429 | 100% { 430 | transform: translate(2.4em, 2em) scaleX(1); 431 | // @media (max-width: 1200px) { transform: translate(.6em, 25z.1em) scaleX(1); } 432 | } 433 | } 434 | 435 | @include keyframes(menuchef-side-right) { 436 | 0% { 437 | -webkit-transform: translate(-11.2em, 2.1em) scaleX(0); 438 | transform: translate(-11.2em, 2.1em) scaleX(0); 439 | }, 440 | 100% { 441 | -webkit-transform: translate(11.2em, 2.1em) scaleX(1); 442 | transform: translate(11.2em, 2.1em) scaleX(1); 443 | } 444 | } 445 | 446 | @media (max-width: 1200px) { 447 | @include keyframes(menuchef-side-left) { 448 | 0% { 449 | transform: translate(.6em, 2.1em) scaleX(0); 450 | }, 451 | 100% { 452 | transform: translate(.6em, 2.1em) scaleX(1); 453 | } 454 | } 455 | 456 | @include keyframes(menuchef-side-right) { 457 | 0% { 458 | transform: translate(-13em, 2.1em) scaleX(0); 459 | }, 460 | 100% { 461 | transform: translate(9.4em, 2.1em) scaleX(1); 462 | } 463 | } 464 | } 465 | 466 | @media (max-width: 992px) { 467 | @include keyframes(menuchef-side-left) { 468 | 0% { 469 | transform: translate(6.4em, 2.1em); 470 | }, 471 | 100% { 472 | transform: translate(6.4em, 2.1em); 473 | } 474 | } 475 | 476 | @include keyframes(menuchef-center) { 477 | 0% { 478 | opacity: 1; 479 | } 480 | 100% { 481 | opacity: 1; 482 | } 483 | } 484 | 485 | @include keyframes(menuchef-side-right) { 486 | 0% { 487 | transform: translate(15.1em, 2.1em); 488 | }, 489 | 100% { 490 | transform: translate(15.1em, 2.1em); 491 | } 492 | } 493 | } 494 | 495 | .NutricionalTable { 496 | padding-top: 8em; 497 | } 498 | 499 | .NutricionalTable-table { 500 | margin-top: 3em; 501 | font-size: 1.4em; 502 | border: 1px solid #d3cec6; 503 | border-radius: 2px; 504 | padding: 3em 2em; 505 | color: $color-2; 506 | 507 | th { 508 | font-size: 1.1em; 509 | padding-bottom: 1em !important; 510 | border-bottom: 1px solid #f3efeb !important; 511 | } 512 | 513 | td { 514 | font-style: italic; 515 | padding: 1em 0 !important; 516 | border-bottom: 1px solid #f3efeb !important; 517 | } 518 | 519 | tr { 520 | &:hover { 521 | .NutricionalTable-table-link { opacity: 1; } 522 | } 523 | } 524 | 525 | } 526 | .NutricionalTable-table-link { 527 | margin-right: .5em; 528 | opacity: 0; 529 | } 530 | 531 | 532 | .NutricionalTable-table-title { 533 | font-size: 20px; 534 | color: $color-1; 535 | font-weight: bold; 536 | text-transform: uppercase; 537 | border-left: .4em solid $color-1; 538 | padding-left: 1.2em; 539 | margin-left: -1.4em; 540 | } 541 | 542 | .NutricionalTable-table-var { 543 | width: 15%; 544 | } 545 | 546 | .NutricionalTable-table-type { 547 | width: 12%; 548 | } 549 | 550 | .NutricionalTable-table-default { 551 | width: 12%; 552 | } 553 | 554 | .NutricionalTable-table-desc { 555 | width: 61%; 556 | } 557 | 558 | .label--string { 559 | background-color: darken($color-main, 7%*1); 560 | } 561 | .label--object { 562 | background-color: darken($color-main, 7%*2); 563 | } 564 | .label--boolean { 565 | background-color: darken($color-main, 7%*3); 566 | } 567 | .label--function { 568 | background-color: darken($color-main, 7%*4); 569 | } 570 | 571 | .Flavors-item-colors-title { 572 | @extend .Flavors-item-recipe; 573 | font-size: 14px; 574 | 575 | @media (max-width: 992px) { 576 | margin-top: 0 !important; 577 | } 578 | } 579 | 580 | .Flavors-item-colors { 581 | padding: 0; 582 | text-align: center; 583 | 584 | @media (max-width: 992px) { 585 | margin-bottom: 20px; 586 | } 587 | } 588 | .Flavors-item-colors-color + .Flavors-item-colors-color { 589 | margin-left: 20px; 590 | 591 | @media (max-width: 1200px) { 592 | margin-left: 10px; 593 | } 594 | } 595 | .Flavors-item-colors-color { 596 | list-style-type: none; 597 | display: inline-block; 598 | 599 | button { 600 | @include size(18px); 601 | border-radius: 3px; 602 | border: 0; 603 | outline: none; 604 | } 605 | 606 | &.is-active { 607 | button { 608 | box-shadow: 0 0 10px $color-main; 609 | } 610 | } 611 | } 612 | .Flavors-item-colors-color--black button { 613 | background-color: #323232; 614 | } 615 | .Flavors-item-colors-color--yellow button { 616 | background-color: #f9e8c0; 617 | } 618 | .Flavors-item-colors-color--red button { 619 | background-color: #f1b7b0; 620 | } 621 | .Flavors-item-colors-color--green button { 622 | background-color: #bfe8d7; 623 | } 624 | .Flavors-item-colors-color--blue button { 625 | background-color: #bcc8ea; 626 | } 627 | 628 | @media (max-width: 1200px) { 629 | .Flavors-item-icon { 630 | transform: scale(.8); 631 | } 632 | 633 | @media (min-width: 992px) { 634 | .Flavors-item .buttonContainer { 635 | text-align: center; 636 | margin: 0 0 0 -4.5em; 637 | } 638 | 639 | .Flavors-item .button + .button { 640 | margin-left: 10px; 641 | } 642 | } 643 | } 644 | 645 | @media (max-width: 992px) { 646 | .Flavors-items { 647 | flex-direction: column; 648 | } 649 | 650 | .Flavors-item { 651 | width: 100%; 652 | margin-bottom: 4rem; 653 | } 654 | .Flavors-item-recipe { 655 | margin-top: -1.6em; 656 | } 657 | .Flavors-item-icon { 658 | float: left; 659 | margin-left: -5rem; 660 | margin-top: 0.4rem; 661 | } 662 | .Flavors-item-type { 663 | text-align: left; 664 | } 665 | } 666 | 667 | @media (max-width: 768px) { 668 | .ribbonFit { 669 | right: 3%; 670 | zoom: .7; 671 | } 672 | 673 | .Header-logo { 674 | width: 100%; 675 | height: auto; 676 | 677 | img { 678 | max-width: 200px; 679 | position: relative; 680 | z-index: 300; 681 | } 682 | } 683 | 684 | .Header > .container { 685 | height: 290px; 686 | padding-top: 0; 687 | display: flex; 688 | align-items: initial; 689 | justify-content: center; 690 | } 691 | 692 | .Header-logo-slogan { 693 | font-size: 1.75rem; 694 | } 695 | 696 | .Flavors-item { 697 | padding: 4em 0em; 698 | } 699 | 700 | .Flavors-item-icon { 701 | float: none; 702 | margin-top: 3rem; 703 | width: 30em; 704 | display: block; 705 | margin: 0 auto; 706 | margin-bottom: 20px; 707 | } 708 | .Flavors-item-type { 709 | text-align: center; 710 | } 711 | 712 | .Flavors-item-code { 713 | text-align: center; 714 | height: auto; 715 | } 716 | .Flavors-item-code pre { 717 | display: inline-block; 718 | text-align: left; 719 | } 720 | 721 | main { 722 | overflow: hidden; 723 | } 724 | 725 | .Header-icon { 726 | // display: initial !important; 727 | zoom: 0.3; 728 | margin-top: 200px; 729 | opacity: .4; 730 | } 731 | } 732 | 733 | .Preheating { 734 | margin-top: 7em; 735 | 736 | pre { 737 | background: transparent !important; 738 | } 739 | } 740 | .Preheating-text { 741 | font-size: 1.4em; 742 | color: #787167; 743 | margin-top: 2em; 744 | } 745 | 746 | .Footer { 747 | margin-top: 2.5em; 748 | padding: 1.2em 0; 749 | background-color: #887753; 750 | text-align: center; 751 | color: #fff; 752 | font-size: 1.2em; 753 | 754 | a { 755 | color: lighten(#887753, 35%); 756 | text-decoration: none; 757 | } 758 | } 759 | .Footer-salt { 760 | vertical-align: middle; 761 | margin: 0 .25em; 762 | } 763 | 764 | .Code { 765 | margin: 2em 0 !important; 766 | background: transparent !important; 767 | } -------------------------------------------------------------------------------- /assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/favicon.png -------------------------------------------------------------------------------- /assets/fonts/AlexBrush-Regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/AlexBrush-Regular.eot -------------------------------------------------------------------------------- /assets/fonts/AlexBrush-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/AlexBrush-Regular.ttf -------------------------------------------------------------------------------- /assets/fonts/AlexBrush-Regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/AlexBrush-Regular.woff -------------------------------------------------------------------------------- /assets/fonts/Aquino-Demo.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/Aquino-Demo.eot -------------------------------------------------------------------------------- /assets/fonts/Aquino-Demo.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/Aquino-Demo.ttf -------------------------------------------------------------------------------- /assets/fonts/Aquino-Demo.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/fonts/Aquino-Demo.woff -------------------------------------------------------------------------------- /assets/fonts/_fonts.scss: -------------------------------------------------------------------------------- 1 | /* This stylesheet generated by Transfonter (https://transfonter.org) on April 5, 2017 11:55 PM */ 2 | 3 | $path: '../fonts/'; 4 | 5 | @font-face { 6 | font-family: 'Aquino Demo'; 7 | src: url('#{$path}Aquino-Demo.eot'); 8 | src: url('#{$path}Aquino-Demo.eot?#iefix') format('embedded-opentype'), 9 | url('#{$path}Aquino-Demo.woff') format('woff'), 10 | url('#{$path}Aquino-Demo.ttf') format('truetype'), 11 | url('#{$path}Aquino-Demo.svg#Aquino-Demo') format('svg'); 12 | font-weight: normal; 13 | font-style: normal; 14 | } 15 | 16 | @font-face { 17 | font-family: 'Alex Brush'; 18 | src: url('#{$path}AlexBrush-Regular.eot'); 19 | src: url('#{$path}AlexBrush-Regular.eot?#iefix') format('embedded-opentype'), 20 | url('#{$path}AlexBrush-Regular.woff') format('woff'), 21 | url('#{$path}AlexBrush-Regular.ttf') format('truetype'), 22 | url('#{$path}AlexBrush-Regular.svg#AlexBrush-Regular') format('svg'); 23 | font-weight: normal; 24 | font-style: normal; 25 | } 26 | -------------------------------------------------------------------------------- /assets/img/Thumbs.db: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/Thumbs.db -------------------------------------------------------------------------------- /assets/img/flavors-border.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/flavors-border.png -------------------------------------------------------------------------------- /assets/img/header-append.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/header-append.png -------------------------------------------------------------------------------- /assets/img/header-bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/header-bg.jpg -------------------------------------------------------------------------------- /assets/img/i-header-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-1.png -------------------------------------------------------------------------------- /assets/img/i-header-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-2.png -------------------------------------------------------------------------------- /assets/img/i-header-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-3.png -------------------------------------------------------------------------------- /assets/img/i-header-4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-4.png -------------------------------------------------------------------------------- /assets/img/i-header-5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-5.png -------------------------------------------------------------------------------- /assets/img/i-header-6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/i-header-6.png -------------------------------------------------------------------------------- /assets/img/menuchef-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/menuchef-bg.png -------------------------------------------------------------------------------- /assets/img/menuchef-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/assets/img/menuchef-logo.png -------------------------------------------------------------------------------- /assets/js/rellax.min.js: -------------------------------------------------------------------------------- 1 | (function(h,f){"function"===typeof define&&define.amd?define([],f):"object"===typeof module&&module.exports?module.exports=f():h.Rellax=f()})(this,function(){var h=function(f,l){var b=Object.create(h.prototype),g=0,k=0,c=[],p=!1,u=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||window.oRequestAnimationFrame||function(a){setTimeout(a,1E3/60)},m=function(a,b,d){return a<=b?b:a>=d?d:a};b.options={speed:-2,center:!1};l&& 2 | Object.keys(l).forEach(function(a){b.options[a]=l[a]});b.options.speed=m(b.options.speed,-10,10);f||(f=".rellax");var q=document.querySelectorAll(f);if(0"+i+" até "+e+")")}function t(){var i=o.find(".visivel");if(console.log(i),i.eq(0).prevAll().length"+(s.mobItemInicial+1)+" of "+m.length+")"),b.children(".tab-btn-anterior").off("click",t).on("click",l),b.children(".tab-btn-proximo").off("click",a).on("click",d)}var o=i(this),c=o.find("th"),r=o.find("td"),m=o.find("tbody tr");o.addClass("tabelinha"),o.after("
\n
\n
\n\n\n
\n
"),r.each(function(){i(this).html(""+c.eq(i(this).index()).html()+" "+i(this).html()+"")});var h=o.next(),b=o.next().children(".tab-paginacao"),f=o.next().children(".tab-num-itens");if(matchMedia){var u=window.matchMedia("(min-width: "+s.minMedia+"px)");u.addListener(v),v(u)}i(window).on("load resize",function(){h.css("width",o.find(".visivel").width())})})}}(jQuery); -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MenuChef testing 6 | 7 | 8 | 9 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 43 | 44 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/favicon.ico -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'); 2 | var twig = require('gulp-twig'); 3 | var collect = require('collect.js'); 4 | var fs = require('fs'); 5 | var exec = require('child_process').exec; 6 | var importFresh = require('import-fresh'); 7 | var slugg = require('slugg'); 8 | 9 | gulp.task('compile', ['doc'], function () { 10 | const { version } = importFresh('./package.json'); 11 | 12 | let docjson = collect(importFresh('./doc.json')) 13 | let doc = {} 14 | 15 | doc.constructor = docjson.where('name', 'constructor').all() 16 | doc.options = docjson.where('name', 'options').all() 17 | doc.theme = docjson.where('name', 'theme').all() 18 | doc.public_methods = docjson.where('name', 'public_methods').all() 19 | doc.public_variables = docjson.where('name', 'public_variables').all() 20 | 21 | return gulp.src(['./site/**/*.twig', '!./site/base.twig', '!./site/macros.twig', '!./site/**/_*.twig']) 22 | .pipe(twig({ 23 | data: { 24 | doc: doc, 25 | version: version 26 | }, 27 | functions: [ 28 | { 29 | name: "json", 30 | func: function (obj) { 31 | return JSON.stringify(obj); 32 | } 33 | }, 34 | { 35 | name: "search", 36 | func: function (arr, key, val) { 37 | return arr.filter(item => item[key] == val)[0]; 38 | } 39 | }, 40 | { 41 | name: "label", 42 | func: function (type) { 43 | let types = type.split(',') 44 | let content = [] 45 | const tag = (type) => `${type.trim()}` 46 | 47 | types.forEach(type => content.push(tag(type))) 48 | return content.join(' '); 49 | } 50 | } 51 | ], 52 | filters: [ 53 | { 54 | name: 'slugify', 55 | func: function (str) { 56 | return slugg(str) 57 | } 58 | } 59 | ] 60 | })) 61 | .pipe(gulp.dest('./')); 62 | }); 63 | 64 | gulp.task('doc', function (done) { 65 | exec('node .\\node_modules\\documentation\\bin\\documentation.js build src/MenuChef.js -f json --shallow -o doc.json', function (err) { 66 | if (err) return done(err); 67 | done(); 68 | }); 69 | }); 70 | 71 | gulp.task('watch', function () { 72 | gulp.watch('./site/**/*.twig', ['compile']); 73 | gulp.watch('./src/**/*', ['doc']); 74 | gulp.watch('./doc.json', ['compile']); 75 | }); 76 | 77 | 78 | gulp.task('default', ['doc' ,'compile']); 79 | gulp.task('dev', ['default' ,'watch']); -------------------------------------------------------------------------------- /img/menuchef-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/theus/MenuChef/7fa1e789d1580e84e6908661e6e7ba7df90006c6/img/menuchef-logo.png -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "menuchef", 3 | "version": "1.3.0", 4 | "description": "Create hamburgers’ menu like a chef", 5 | "main": "dist/MenuChef.js", 6 | "dependencies": { 7 | "hamburgers": "^0.9.3", 8 | "no-scroll": "^2.1.1" 9 | }, 10 | "devDependencies": { 11 | "babel-core": "^6.26.3", 12 | "babel-loader": "^7.1.4", 13 | "babel-preset-es2015": "^6.22.0", 14 | "chai": "^3.5.0", 15 | "collect.js": "^3.0.46", 16 | "concurrently": "^3.5.0", 17 | "css-loader": "^0.28.11", 18 | "documentation": "^4.0.0-rc.1", 19 | "extract-loader": "^1.0.1", 20 | "gulp": "^3.9.1", 21 | "gulp-twig": "^0.7.0", 22 | "html-loader": "^0.5.1", 23 | "husky": "^0.14.3", 24 | "import-fresh": "^2.0.0", 25 | "lodash-es": "^4.17.10", 26 | "mocha-phantomjs": "^4.1.0", 27 | "mocha-phantomjs-core": "^2.1.1", 28 | "node-sass": "^4.9.0", 29 | "sass-loader": "^6.0.7", 30 | "slugg": "^1.2.1", 31 | "standard": "^10.0.3", 32 | "standard-loader": "^6.0.1", 33 | "style-loader": "^0.19.0", 34 | "webpack": "^3.11.0", 35 | "webpack-dev-server": "^2.11.2" 36 | }, 37 | "scripts": { 38 | "start": "npm run dev", 39 | "dev": "concurrently -k --names \"WEBPACK,GULP\" -c \"bgYellow.bold,bgRed.bold\" \"npm run webpack:watch\" \"npm run site:dev\"", 40 | "webpack:build": "webpack --colors", 41 | "webpack:watch": "webpack -w --colors", 42 | "webpack:dev": "webpack-dev-server", 43 | "build": "npm run webpack:build && npm run site:build", 44 | "test": "npm run build && mocha-phantomjs .\\test\\index.html", 45 | "precommit": "npm test", 46 | "doc:generate": "gulp doc", 47 | "site:build": "gulp", 48 | "site:dev": "gulp dev" 49 | }, 50 | "author": "Matheus Falcão (https://github.com/theus)", 51 | "license": "MIT", 52 | "directories": { 53 | "test": "test" 54 | }, 55 | "repository": { 56 | "type": "git", 57 | "url": "https://github.com/theus/MenuChef" 58 | }, 59 | "keywords": [ 60 | "menuchef", 61 | "menu", 62 | "hamburger", 63 | "nav" 64 | ], 65 | "contributors": [ 66 | "Italo Ferreira (https://github.com/italoferreira)" 67 | ], 68 | "optionalDependencies": { 69 | "hoek": "^4.2.1" 70 | } 71 | } 72 | -------------------------------------------------------------------------------- /site/_footer.twig: -------------------------------------------------------------------------------- 1 |
2 |
3 | Made with 4 | 5 | by italo and theus 6 |
7 |
-------------------------------------------------------------------------------- /site/_header.twig: -------------------------------------------------------------------------------- 1 |
2 | 6 | 8 | 10 | 13 kbcalories 11 | 12 | 13 |
14 | 15 |
16 |
17 |
18 |
19 |
20 |
21 | 33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
-------------------------------------------------------------------------------- /site/base.twig: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | {% block title %}{% endblock title %} 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | {% block prependHead %}{% endblock prependHead %} 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 44 | {% block appendHead %}{% endblock appendHead %} 45 | 46 | 47 | 48 | 58 | 59 |
60 | {% include "_header.twig" %} 61 | 62 | {% block content %}{% endblock content %} 63 | 64 | {% include "_footer.twig" %} 65 |
66 | 67 | 68 | 69 | 70 | {# #} 71 | 72 | 81 | {% block scripts %}{% endblock scripts %} 82 | 83 | -------------------------------------------------------------------------------- /site/index.twig: -------------------------------------------------------------------------------- 1 | {% extends "base.twig" %} 2 | {% import "macros.twig" as helper %} 3 | 4 | 5 | {% block title %}MenuChef - Create hamburgers' menu like a chef{% endblock title %} 6 | {% block appendHead %} 7 | 12 | {% endblock appendHead %} 13 | {% block content %} 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 43 | 44 |
45 |
46 |
47 | 48 | 49 | 50 |

Our

51 |

Flavors

52 |
53 | 54 |
55 |
56 |

Left

57 |
58 | 59 | 60 | 61 | 62 | 63 | 64 |
65 |

Recipe

66 |
67 | 

 68 |         

 69 |         
Select seasoning

 70 | 
 71 |         
    
 72 |           
  • 
 73 |             
 74 |           
    • 
 75 |         

 76 | 
 77 |         
Method of preparation

 78 | 
 79 |         

 80 |           
 81 |           
 82 |         

 83 | 
 84 |         

 85 |           
 86 |           
 87 |         

 88 | 
 89 |       

 90 | 
 91 |       

 92 |         
Center

 93 |         

 94 |           
 95 |             
 96 |           
 97 |           
 98 |             
 99 |           
100 |         

101 |         
Recipe

102 |         

103 |           

104 |         

105 | 
106 |         
Select seasoning

107 | 
108 |         
    
109 |           
  • 
110 |             
111 |           
    • 
112 |         

113 | 
114 |         

115 |           
116 |           
117 |         

118 |       

119 | 
120 |       

121 |         
Right

122 |         

123 |           
124 |             
125 |           
126 |           
127 |             
128 |           
129 |         

130 |         
Recipe

131 |         

132 |           

133 |         

134 | 
135 |         
Select seasoning

136 | 
137 |         
    
138 |           
  • 
139 |             
140 |           
    • 
141 |         

142 | 
143 |         
Method of preparation

144 | 
145 |         

146 |           
147 |           
148 |         

149 | 
150 |         

151 |           
152 |           
153 |         

154 |       

155 |     

156 |   

157 | 

158 | 
159 | 

160 |   

161 |     

162 |       
163 |         
164 |       
165 |       
Preheating

166 |       
the oven

167 |     

168 | 
169 |     

170 |       

171 |         MenuChef helps you to create hamburgers' menu easily even without knowing how to cook. You just need call the MenuChef.js in your page and initiate like the examples above. It's light (approximately 55kb, 13kb gzipped) and you don't need change the HTML code of the menu original. You can personalize it by CSS or by options.
172 |       

173 | 
174 |       

175 |         You can download the latest version of MenuChef in Github or can use the unpkg CDN
176 |       

177 | 
178 |       
<script src="//unpkg.com/menuchef@{{version}}"></script>

179 | 
180 |     

181 | 
182 |   

183 | 

184 | 
185 | 

186 |   

187 |     

188 |       
189 |         
190 |       
191 |       
Nutritional

192 |       
Table

193 |     

194 | 
195 |     

196 |       
Constructor

197 |       
198 |         
199 |           
200 |             
201 |             
202 |             
203 |             
204 |           
205 |         
206 |         
207 |           {% for item in doc.constructor  %}
208 |             
209 |               {{ helper.item(search(item.tags, 'title', 'variable').description, item.name) }}
210 |               
211 |               
212 |               
213 |             
214 |           {% endfor %}
215 |         
216 |       
VariableTypeDefaultDescription
{{ label(search(item.tags, 'title', 'type').description) }}{{ search(item.tags, 'title', 'default').description }}{{ search(item.tags, 'title', 'description').description }}

217 | 
218 |       
Options

219 |       
220 |         
221 |           
222 |             
223 |             
224 |             
225 |             
226 |           
227 |         
228 |         
229 |           {% for item in doc.options  %}
230 |             
231 |               {{ helper.item(search(item.tags, 'title', 'variable').description, item.name, search(item.tags, 'title', 'released').description) }}
232 |               
233 |               
234 |               
235 |             
236 |           {% endfor %}
237 |         
238 |       
VariableTypeDefaultDescription
{{ label(search(item.tags, 'title', 'type').description) }}{{ search(item.tags, 'title', 'default').description }}{{ search(item.tags, 'title', 'description').description }}

239 | 
240 |       
Theme Options

241 |       
242 |         
243 |           
244 |             
245 |             
246 |             
247 |             
248 |           
249 |         
250 |         
251 |           {% for item in doc.theme  %}
252 |             
253 |               {{ helper.item(search(item.tags, 'title', 'variable').description, item.name) }}
254 |               
255 |               
256 |               
257 |             
258 |           {% endfor %}
259 |         
260 |       
VariableTypeDefaultDescription
{{ label(search(item.tags, 'title', 'type').description) }}{{ search(item.tags, 'title', 'default').description }}{{ search(item.tags, 'title', 'description').description }}

261 | 
262 |       
Methods

263 |       
264 |         
265 |           
266 |             
267 |             
268 |             
269 |             
270 |           
271 |         
272 |         
273 |           {% for item in doc.public_methods  %}
274 |             
275 |               {{ helper.item(search(item.tags, 'title', 'variable').description, item.name) }}
276 |               
277 |               
278 |               
279 |             
280 |           {% endfor %}
281 |         
282 |       
VariableTypeDefaultDescription
{{ label(search(item.tags, 'title', 'type').description) }}{{ search(item.tags, 'title', 'default').description }}{{ search(item.tags, 'title', 'description').description }}

283 | 
284 |       
Public Variables

285 |       
286 |         
287 |           
288 |             
289 |             
290 |             
291 |             
292 |           
293 |         
294 |         
295 |           {% for item in doc.public_variables  %}
296 |             
297 |               {{ helper.item(search(item.tags, 'title', 'variable').description, item.name) }}
298 |               
299 |               
300 |               
301 |             
302 |           {% endfor %}
303 | 
304 |         
305 |       
VariableTypeDefaultDescription
{{ label(search(item.tags, 'title', 'type').description) }}{{ search(item.tags, 'title', 'default').description }}{{ search(item.tags, 'title', 'description').description }}

306 | 
307 |       
Theming Vars

308 | 
309 |       

310 |         MenuChef was created with CSS variables, so it's very easy change some elements of the interface just changing a couple of variables, with sort, without change the CSS in fact. The support of CSS variables isn't complete yet in some browsers, so if you want support those browsers, you can overwrite CSS theme default below. If you choose overwrite the CSS theme, don't forget to put !important because the MenuChef's style is injected by JS, so you CSS can't overwrite by cascade.
311 |       

312 | 
313 |       
/* open hamburger button */
314 | .MenuChefOpen .hamburger-inner,
315 | .MenuChefOpen .hamburger-inner::before,
316 | .MenuChefOpen .hamburger-inner::after {
317 |   background-color: #A0A1A5 !important; /* fallback */
318 |   background-color: var(--MenuChef-scheme-color, #A0A1A5) !important; /* try use CSS var with fallback */
319 | }
320 | 
321 | /* close hamburger button */
322 | .MenuChefOpen.is-active .hamburger-inner,
323 | .MenuChefOpen.is-active .hamburger-inner::before,
324 | .MenuChefOpen.is-active .hamburger-inner::after {
325 |   background-color: #28292E !important; /* fallback */
326 |   background-color: var(--MenuChef-scheme-color, #28292E) !important; /* try use CSS var with fallback */
327 | }
328 | 
329 | /* Menuchef kitchen: link's area */
330 | .MenuChef {
331 |   background-color: #28292E !important; /* fallback */
332 |   background-color: var(--MenuChef-scheme-bgcolor, #28292E) !important; /* try use CSS var with fallback */
333 | }
334 | 
335 | /* Menuchef links */
336 | .MenuChef .MenuChef-links-link {
337 |   color: #A0A1A5  !important; /* fallback */
338 |   color: var(--MenuChef-scheme-color, #A0A1A5)  !important; /* try use CSS var with fallback */
339 | }
340 | 
341 | /* Menuchef links hover */
342 | .MenuChef .MenuChef-links-link:hover {
343 |   color: #86878c  !important; /* fallback */
344 |   color: var(--MenuChef-scheme-color-hover, #86878c)  !important; /* try use CSS var with fallback */
345 | }

346 | 
347 |       
348 |         
349 |           
350 |             
351 |             
352 |             
353 |             
354 |           
355 |         
356 |         
357 |           
358 |             {{ helper.item('--MenuChef-scheme-bgcolor', 'Theming-Vars') }}
359 |             
360 |             
361 |           
362 | 
363 |           
364 |             {{ helper.item('--MenuChef-scheme-color', 'Theming-Vars') }}
365 |             
366 |             
367 |           
368 | 
369 |           
370 |             {{ helper.item('--MenuChef-scheme-color-hover', 'Theming-Vars') }}
371 |             
372 |             
373 |           
374 | 
375 |         
376 |       
VariableDefaultDescription
It depend's of schemeMenuChef kitchen's background color
It depend's of schemeLinks color
It depend's of schemeLinks hover color

377 | 
378 |       
Others Vars

379 |       
380 |         
381 |           
382 |             
383 |             
384 |             
385 |             
386 |           
387 |         
388 |         
389 |           
390 |             {{ helper.item('--MenuChef-font-family', 'Others-Vars') }}
391 |             
392 |             
393 |           
394 |           
395 |             {{ helper.item('--MenuChef-font-size', 'Others-Vars') }}
396 |             
397 |             
398 |           
399 |           
400 |             {{ helper.item('--MenuChef-margin-bottom', 'Others-Vars') }}
401 |             
402 |             
403 |           
404 |           
405 |             {{ helper.item('--MenuChef-text-transform', 'Others-Vars') }}
406 |             
407 |             
408 |           
409 |           
410 |             {{ helper.item('--MenuChef-transition', 'Others-Vars') }}
411 |             
412 |             
413 |           
414 |           
415 |             {{ helper.item('--MenuChef-font-weight', 'Others-Vars') }}
416 |             
417 |             
418 |           
419 |           
420 |             {{ helper.item('--MenuChef-theme_side-width', 'Others-Vars') }}
421 |             
422 |             
423 |           
424 |           
425 |             {{ helper.item('--MenuChef-theme_side-min-width', 'Others-Vars') }}
426 |             
427 |             
428 |           
429 | 
430 |         
431 |       
VariableDefaultDescription
'Helvetica', 'Arial', sans-serifFont family of links
16pxFont size of links
25pxMargin bottom between links
uppercaseText transform of links
color linear .15sTransition for links hover
boldLinks font weight
20%Default width of MenuChef's kitchen
240pxMinimum width of MenuChef's kitchen

432 | 
433 |       
Default Options

434 | 
435 |       

436 |         Example of all MenuChef default options
437 |       

438 | 
439 |       
new MenuChef('.old-menu a', {
440 |   theme: {
441 |     theme: 'full',
442 |     effectOnOpen: '',
443 |     direction: '',
444 |     pageEffect: ''
445 |   },
446 | 
447 |   scheme: 'black',
448 |   closeOnClick: true,
449 |   closeOnClickOutside: true,
450 | 
451 |   classes: {
452 |     exclude: [],
453 |     only: [],
454 |     include: []
455 |   },
456 | 
457 |   hamburger: 'boring',
458 |   bodyClassOpen: '',
459 |   kitchenClass: '',
460 |   kitchenOpenClass: '',
461 | 
462 |   onOpen: function () {},
463 |   onClose: function () {},
464 |   onClick: function () {},
465 |   onReady: function () {}
466 | });

467 | 
468 |     

469 | 
470 |   

471 | 

472 | 
473 | {% endblock content %}
474 | {% block scripts %}
475 | 
476 | 
477 | 
478 | 
479 | 
480 | 
481 | 
482 | 
637 | {% endblock scripts %}


--------------------------------------------------------------------------------
/site/macros.twig:
--------------------------------------------------------------------------------
 1 | {% macro item(item, linkSection, released) %}
 2 | 	{% if not linkName %} {% set linkName = item %} {% endif %}
 3 | 	
 4 | 		
 5 | 		{% if released %}
 6 | 			
 7 | 				v{{released}}
 8 | 			
 9 | 		{% endif %}
10 | 		{{item}}
11 | 	
12 | {% endmacro %}
13 | 
14 | {% macro linkTo(item, linkSection) %}
15 | 	{{item}}
16 | {% endmacro %}


--------------------------------------------------------------------------------
/src/MenuChef.js:
--------------------------------------------------------------------------------
  1 | // devDependencies
  2 | import assign from 'lodash-es/assign'
  3 | 
  4 | // Helpers
  5 | import setIF from './helpers/setIF'
  6 | import masterCook from './helpers/masterCook'
  7 | import setPublicVar from './helpers/setPublicVar'
  8 | import forEach from './helpers/forEach'
  9 | import noScroll from 'no-scroll'
 10 | 
 11 | // Theme assets
 12 | import './templates/main.scss'
 13 | import themeDefault from './templates/default.html'
 14 | import buttonDefault from './templates/button.html'
 15 | 
 16 | // Utils
 17 | import { version as PKG_VERSION } from '../package.json'
 18 | 
 19 | /**
 20 |  * @module constructor
 21 |  * @variable ingredients
 22 |  * @type string
 23 |  * @default --
 24 |  * @description HTML selector for the anchor tags: eg: “.menu a” or “.menu-link” if ”.menu-link” it’s a NODE Collection of links
 25 |  * @required true
 26 |  */
 27 | class MenuChef {
 28 |   constructor (ingredients = false, options = {}) {
 29 |     if (ingredients === false) throw new Error('MenuChef needs link elements passed as ingredients')
 30 |     this._ingredients = document.querySelectorAll(ingredients)
 31 |     if (this._ingredients.length === 0) throw new Error('MenuChef needs link elements passed as ingredients')
 32 |     if (this._ingredients.length === 1) console.warn('MenuChef don\'t find ingredients. Maybe you passed the menu itself as ingredients. If the class of menu is ".menu", pass ".menu a". The links are the ingredients =)')
 33 | 
 34 |     const THEMES = {
 35 |       full: {
 36 |         html: themeDefault,
 37 |         options: {
 38 |           effectOnOpen: [],
 39 |           pageEffect: [],
 40 |           direction: []
 41 |         }
 42 |       },
 43 |       side: {
 44 |         html: themeDefault,
 45 |         options: {
 46 |           effectOnOpen: ['smooth'],
 47 |           pageEffect: ['blur'],
 48 |           direction: ['left', 'right']
 49 |         }
 50 |       }
 51 |     }
 52 | 
 53 |     const HAMBURGERS = ['3dx', '3dx-r', '3dy', '3dy-r', 'arrow', 'arrow-r', 'arrowalt', 'arrowalt-r', 'boring', 'collapse', 'collapse-r', 'elastic', 'elastic-r', 'emphatic', 'emphatic-r', 'slider', 'slider-r', 'spin', 'spin-r', 'spring', 'spring-r', 'stand', 'stand-r', 'squeeze', 'vortex', 'vortex-r']
 54 | 
 55 |     const SCHEMES = ['black', 'yellow', 'red', 'green', 'blue']
 56 | 
 57 |     /**
 58 |      * @module constructor
 59 |      * @variable options
 60 |      * @type object
 61 |      * @default options
 62 |      * @description Overwrite the default options of MenuChef
 63 |      */
 64 |     const DEFAULTS = {
 65 |       /**
 66 |        * @module options
 67 |        * @variable parent
 68 |        * @type string
 69 |        * @default body
 70 |        * @released 1.2.0
 71 |        * @description Parent element where MenuChef'll placed
 72 |        */
 73 |       parent: 'body',
 74 |       /**
 75 |        * @module options
 76 |        * @variable theme
 77 |        * @type string, object
 78 |        * @default full
 79 |        * @description Theme string (name)/object to personalize specific details of MenuChef theme
 80 |        */
 81 |       theme: {
 82 |         /**
 83 |        * @module theme
 84 |        * @variable theme
 85 |        * @type string
 86 |        * @default full
 87 |        * @description Theme string (name)/object to personalize specific details of MenuChef theme
 88 |        */
 89 |         theme: 'full',
 90 |         /**
 91 |        * @module theme
 92 |        * @variable effectOnOpen
 93 |        * @type string
 94 |        * @default --
 95 |        * @description Effects on open the menu. The effects available depends of theme. 

 side: smooth
 96 |        */
 97 |         effectOnOpen: '',
 98 |         /**
 99 |        * @module theme
100 |        * @variable direction
101 |        * @type string
102 |        * @default right
103 |        * @description Direction to open the menu. Directions available depends of theme. 

side: left, right
104 |        */
105 |         direction: '',
106 |         /**
107 |        * @module theme
108 |        * @variable pageEffect
109 |        * @type string
110 |        * @default --
111 |        * @description Effects on page when the menu is opening. Effects available depends of theme. 

side: blur
112 |        */
113 |         pageEffect: ''
114 |       },
115 |       /**
116 |        * @module options
117 |        * @variable preventScroll
118 |        * @type boolean
119 |        * @default false
120 |        * @released 1.3.0
121 |        * @description Prevent page scrolling while menu is open
122 |        */
123 |       preventScroll: false,
124 |       /**
125 |        * @module options
126 |        * @variable scheme
127 |        * @type string
128 |        * @default black
129 |        * @description Default schemes colors of MenuChef. You can modify by yourself

Options: black, yellow, red, green, blue
130 |        */
131 |       scheme: 'black',
132 |       /**
133 |        * @module options
134 |        * @variable closeOnClick
135 |        * @type boolean
136 |        * @default true
137 |        * @description Close MenuChef when it’s clicked in a link
138 |        */
139 |       closeOnClick: true,
140 |       /**
141 |        * @module options
142 |        * @variable closeOnClickOutside
143 |        * @type boolean
144 |        * @default true
145 |        * @description Close MenuChef when it’s clicked outside of kitchen (the menu it self)
146 |        */
147 |       closeOnClickOutside: true,
148 |       /**
149 |        * @module options
150 |        * @variable button
151 |        * @type string
152 |        * @default MenuChef's hamburger button
153 |        * @released 1.2.0
154 |        * @description HTML of MenuChef's button. You can pass your own button HTML like <i class="myicon"></i>.
155 |        * 

156 |        * Remember: The MenuChef's button is the same for open and for close (toggle). You can control appearence of button with CSS. The button container receives the class is-active when MenuChef is open.
157 |        */
158 |       button: buttonDefault,
159 |       /**
160 |        * @module options
161 |        * @variable classes
162 |        * @type object
163 |        * @default --
164 |        * @released 1.1.0
165 |        * @description Classes is a manager of classes in links passed to MenuChef. It reveives 3 properties. All properties receives ONLY array of classes.
166 |        * 

167 |        * exclude: remove a class or an array of classes
168 |        * 

169 |        * only: remove ALL classes expect this one or an array of classes
170 |        * 

171 |        * include: add a class or an array of classes
172 |        * 

173 |        * ps: The order of hierarchy is respected. exclude > only > include
174 |        */
175 |       classes: {
176 |         exclude: [],
177 |         only: [],
178 |         include: []
179 |       },
180 | 
181 |       /**
182 |        * @module options
183 |        * @variable hamburger
184 |        * @type string
185 |        * @default boring
186 |        * @description This option is powered by awesome lib Hamburgers, by Jonathan Sug. The operation can be seen at lib demo site

Options: 3dx, 3dx-r, 3dy, 3dy-r, arrow, arrow-r, arrowalt, arrowalt-r, boring, collapse, collapse-r, elastic, elastic-r, emphatic, emphatic-r, slider, slider-r, spin, spin-r, spring, spring-r, stand, stand-r, squeeze, vortex, vortex-r
187 |        */
188 |       hamburger: 'boring',
189 |       /**
190 |        * @module options
191 |        * @variable bodyClassOpen
192 |        * @type string
193 |        * @default --
194 |        * @description Append a class in  when the menu is opened
195 |        */
196 |       bodyClassOpen: '',
197 |       /**
198 |        * @module options
199 |        * @variable kitchenClass
200 |        * @type string
201 |        * @default --
202 |        * @description Append a class in MenuChef wrapper 

ps. Kitchen is the wrapper of MenuChef, where all the ingredients are cooked
203 |        */
204 |       kitchenClass: '',
205 |       /**
206 |        * @module options
207 |        * @variable kitchenOpenClass
208 |        * @type string
209 |        * @default --
210 |        * @description Append a class in MenuChef when the same is opened
211 |        */
212 |       kitchenOpenClass: '',
213 |       /**
214 |        * @module options
215 |        * @variable onOpen
216 |        * @type function
217 |        * @default --
218 |        * @description Callback function that's called when MenuChef is open
219 |        */
220 |       onOpen: () => {},
221 |       /**
222 |        * @module options
223 |        * @variable onClose
224 |        * @type function
225 |        * @default --
226 |        * @description Callback function that's called when MenuChef is close
227 |        */
228 |       onClose: () => {},
229 |       /**
230 |        * @module options
231 |        * @variable onClick
232 |        * @type function
233 |        * @default --
234 |        * @description Callback function that's called when a link in MenuChef is clicked
235 |        */
236 |       onClick: () => {},
237 |       /**
238 |        * @module options
239 |        * @variable onReady
240 |        * @type function
241 |        * @default --
242 |        * @released 1.2.0
243 |        * @description Callback function that's called when MenuChef is ready and loaded
244 |        */
245 |       onReady: () => {}
246 |     }
247 | 
248 |     this.version = PKG_VERSION
249 |     this._options = assign(DEFAULTS, options)
250 |     this._options.hamburger = setIF(this._options.hamburger, (HAMBURGERS.indexOf(this._options.hamburger) !== -1), 'boring')
251 |     this._options.scheme = setIF(this._options.scheme, (SCHEMES.indexOf(this._options.scheme) !== -1), 'black')
252 |     if (typeof this._options.theme !== 'string' && typeof this._options.theme !== 'object') throw new Error('theme must be a string or a object')
253 |     this._theme = (typeof this._options.theme === 'string') ? this._options.theme : this._options.theme.theme
254 | 
255 |     this.$parent = document.querySelector(this._options.parent) ? document.querySelector(this._options.parent) : document.querySelector(DEFAULTS.parent)
256 | 
257 |     if (this._options.parent !== DEFAULTS.parent && !this.$parent) console.warning(`parent element don't found. body will be used instead.`)
258 | 
259 |     this._themeOptions = (typeof this._options.theme === 'object') ? this._options.theme : {}
260 | 
261 |     if (typeof this._options.onOpen !== 'function') throw new Error('onOpen callback must be a function')
262 |     if (typeof this._options.onClose !== 'function') throw new Error('onClose callback must be a function')
263 |     if (typeof this._options.onClick !== 'function') throw new Error('onClick callback must be a function')
264 |     if (typeof this._options.onReady !== 'function') throw new Error('onReady callback must be a function')
265 | 
266 |     if (!THEMES.hasOwnProperty(this._theme)) {
267 |       console.warn(`Theme "${this._theme}" passed in options does not exist. Default theme was setted. Themes availables: ${Object.keys(THEMES).join(', ')}`)
268 |       this._theme = 'full'
269 |     }
270 | 
271 |     try { this._themeOptions.effectOnOpen = setIF(this._themeOptions.effectOnOpen, (THEMES[this._theme].options.effectOnOpen.indexOf(this._themeOptions.effectOnOpen) !== -1)) } catch (e) {}
272 |     try { this._themeOptions.direction = setIF(this._themeOptions.direction, (THEMES[this._theme].options.direction.indexOf(this._themeOptions.direction) !== -1)) } catch (e) {}
273 |     try { this._themeOptions.pageEffect = setIF(this._themeOptions.pageEffect, (THEMES[this._theme].options.pageEffect.indexOf(this._themeOptions.pageEffect) !== -1)) } catch (e) {}
274 | 
275 |     this._themeClass = `MenuChef--theme-${this._theme}`
276 |     this._kitchenClass = 'js-MenuChef'
277 |     this._kitchenLinksClass = 'js-MenuChefLinks'
278 |     this._kitchenLinksClassStyled = 'MenuChef-links-link'
279 |     this._dirClass = (this._themeOptions.direction) ? `${this._themeClass}--dir--${this._themeOptions.direction}` : ''
280 |     this._themeEffectClass = (this._themeOptions.effectOnOpen) ? `${this._themeClass}-effect--${this._themeOptions.effectOnOpen}` : false
281 |     this._themeOpenClass = (this._themeEffectClass) ? `${this._themeEffectClass}--open` : 'is-visible'
282 | 
283 |     this._classes = {
284 |       init: {
285 |         body: [(this._themeOptions.pageEffect) ? `has-MenuChef--effect--${this._themeOptions.pageEffect}` : ''],
286 |         controlBtn: {
287 |           open: [(this._themeOptions.direction) ? `MenuChefOpen--dir--${this._themeOptions.direction}` : ''],
288 |           close: []
289 |         },
290 |         kitchen: [this._themeClass, this._themeEffectClass, this._dirClass, this._options.kitchenClass]
291 |       },
292 |       open: {
293 |         body: ['has-menuChefOpen', `has-menuChefOpen--${this._theme}`, this._options.bodyClassOpen],
294 |         controlBtn: {
295 |           open: [],
296 |           close: []
297 |         },
298 |         kitchen: [this._themeOpenClass, this._options.kitchenOpenClass]
299 |       },
300 |       close: {
301 |         body: [],
302 |         controlBtn: {
303 |           open: [],
304 |           close: []
305 |         },
306 |         kitchen: []
307 |       }
308 |     }
309 | 
310 |     MenuChef.prototype.ISBUTTONDEFAULT = (this._options.button === buttonDefault)
311 | 
312 |     this.init()
313 |     this.inject(THEMES)
314 |     this.cook()
315 |   }
316 | 
317 |   inject (themes) {
318 |     if (!this.ISBUTTONDEFAULT) this._options.button = `${this._options.button}`
319 |     this.$parent.insertAdjacentHTML('afterbegin', (themes[this._theme].html + this._options.button).replace(/{{options.hamburger}}/g, this._options.hamburger.toLowerCase()))
320 |     this.$openButton = document.querySelector('.MenuChefOpen')
321 |     this._kitchen = document.querySelector(`.${this._kitchenClass}`)
322 |     masterCook(document.body, this._classes.init.body)
323 |     masterCook(this._kitchen, this._classes.init.kitchen)
324 |     if (this.ISBUTTONDEFAULT) masterCook(this.$openButton, this._classes.init.controlBtn.open)
325 | 
326 |     // to work in IE10
327 |     // this.$openButton.dataset.scheme = this._kitchen.dataset.scheme = this._options.scheme
328 |     if (this.ISBUTTONDEFAULT) this.$openButton.setAttribute('data-scheme', this._options.scheme)
329 |     this._kitchen.setAttribute('data-scheme', this._options.scheme)
330 |     this._options.onReady()
331 |   }
332 | 
333 |   cook () {
334 |     const self = this
335 |     const pan = this._kitchen.querySelector(`.${this._kitchenLinksClass}`)
336 |     forEach(this._ingredients, (index, ingredient) => { // for (let ingredient of this._ingredients) {}
337 |       var preparing = ingredient.cloneNode(true)
338 | 
339 |       try {
340 |         // options.classes.exclude
341 |         if (self._options.classes.exclude.length === 0) {
342 |         } else {
343 |           self._options.classes.exclude.map(classe => preparing.classList.remove(classe))
344 |           preparing.classList.add(self._kitchenLinksClassStyled)
345 |         }
346 |       } catch (e) {}
347 | 
348 |       try {
349 |         // options.classes.only
350 |         if (self._options.classes.only.length === 0) {
351 |         } else {
352 |           for (let i = preparing.classList.length - 1; i >= 0; i--) {
353 |             let classe = preparing.classList[i]
354 |             if (self._options.classes.only.indexOf(classe) === -1) {
355 |               preparing.classList.remove(classe)
356 |             }
357 |           }
358 |           preparing.classList.add(self._kitchenLinksClassStyled)
359 |         }
360 |       } catch (e) {}
361 | 
362 |       try {
363 |         // options.classes.include
364 |         if (self._options.classes.include.length !== 0) {
365 |           self._options.classes.include.map(classe => preparing.classList.add(classe))
366 |           preparing.classList.add(self._kitchenLinksClassStyled)
367 |         }
368 |       } catch (e) {}
369 | 
370 |       try {
371 |         if (self._options.classes.exclude.length === 0 && self._options.classes.only.length === 0) preparing.className = self._kitchenLinksClassStyled
372 |       } catch (e) {}
373 | 
374 |       preparing.onclick = () => {
375 |         self._options.onClick()
376 |         if (self._options.closeOnClick) MenuChef.close()
377 |       }
378 | 
379 |       pan.appendChild(preparing)
380 |     })
381 |   }
382 | 
383 |   init () {
384 |     const self = this
385 |     self._isOpen = null
386 | 
387 |     /**
388 |        * @module public_variables
389 |        * @variable MenuChef.version
390 |        * @type string
391 |        * @default version
392 |        * @description Return MenuChef version number
393 |        */
394 |     setPublicVar(MenuChef, self, 'version')
395 |     /**
396 |        * @module public_variables
397 |        * @variable MenuChef.isOpen
398 |        * @type boolean
399 |        * @default null
400 |        * @description Return null if MenuChef was never opened, true/>false classe default is is-active
441 |      * @description Toggle MenuChef

When this is passed, toggle is fired and return the classe to the element this. Only works when the function toggle() itself is triggered
442 |      */
443 |     MenuChef.toggle = function (el = false, classe = 'is-active') {
444 |       if (self._kitchen.classList.contains(self._themeOpenClass)) {
445 |         MenuChef.close()
446 |         if (el) el.classList.remove(classe)
447 |       } else {
448 |         MenuChef.open()
449 |         if (el) el.classList.add(classe)
450 |       }
451 |     }
452 |     MenuChef._watcher = function (e) {
453 |       const searchKitchen = (el) => {
454 |         try {
455 |           return el.getAttribute('onclick').includes('MenuChef.toggle')
456 |         } catch (err) {}
457 | 
458 |         try {
459 |           return el.classList.contains(self._kitchenLinksClass) || el.classList.contains(self._kitchenClass)
460 |         } catch (err) {}
461 |       }
462 |       /**
463 |        * @private
464 |        * Close MenuChef if is clicked outside
465 |        * Don't close if is clicked in kitchen or in a button with
466 |        * MenuChef.toggle() function on onclick because the watcher
467 |        * closes the MenuChef before the toggle(), who mistakenly opened
468 |        */
469 | 
470 |       try {
471 |         if (e.path.filter(searchKitchen).length === 0) MenuChef.close()
472 |       } catch (e) {}
473 |     }
474 |     /**
475 |      * @module public_methods
476 |      * @variable MenuChef.destroy()
477 |      * @type function
478 |      * @default -
479 |      * @description Destroy MenuChef instance, HTML inserts and watchers
480 |      */
481 |     MenuChef.destroy = function () {
482 |       masterCook(document.body, self._classes.init.body, 'remove')
483 |       const kitchen = document.querySelector(`.${self._kitchenClass}`)
484 |       const kitchenButtonOpen = document.querySelector(`.MenuChefOpen`)
485 | 
486 |       kitchen.parentNode.removeChild(kitchen)
487 |       kitchenButtonOpen.parentNode.removeChild(kitchenButtonOpen)
488 |     }
489 |   }
490 | 
491 |   chefObserver (type = 'addWatch') {
492 |     if (type === 'addWatch') {
493 |       document.addEventListener('click', MenuChef._watcher, true)
494 |     }
495 | 
496 |     if (type === 'removeWatch') {
497 |       document.removeEventListener('click', MenuChef._watcher, true)
498 |     }
499 |   }
500 | }
501 | 
502 | window.MenuChef = MenuChef
503 | 


--------------------------------------------------------------------------------
/src/helpers/forEach.js:
--------------------------------------------------------------------------------
1 | // https://css-tricks.com/snippets/javascript/loop-queryselectorall-matches/
2 | // forEach method, could be shipped as part of an Object Literal/Module
3 | export default function (array, callback, scope) {
4 |   for (let i = 0; i < array.length; i++) {
5 |     callback.call(scope, i, array[i])
6 |   }
7 | }
8 | 


--------------------------------------------------------------------------------
/src/helpers/masterCook.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  *
 3 |  * @function masterCook
 4 |  *
 5 |  * @description Add or remove automatically an array of classes in a Element
 6 |  *
 7 |  * @param {el} HTML Element @required
 8 |  * @param {classList} Array @required
 9 |  * @param {method} String add or remove @default add
10 |  *
11 |  * @return undefined
12 |  *
13 |  */
14 | 
15 | export default function (el, classList, method = 'add') {
16 |   // if (!!el) cosole.error('masterCook needs an element to manage')
17 |   // if (!!classList) cosole.error('masterCook needs a classList to work with element')
18 | 
19 |   for (let classe in classList) {
20 |     let _classe = classList[classe]
21 |     if (!!_classe) { // eslint-disable-line no-extra-boolean-cast
22 |       try {
23 |         el.classList[method](_classe)
24 |       } catch (e) {
25 |         console.warn(e)
26 |       }
27 |     }
28 |   }
29 | }
30 | 


--------------------------------------------------------------------------------
/src/helpers/setCssVar.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  *
 3 |  * @function setCssVar
 4 |  *
 5 |  * @description Try to set a CSS variable
 6 |  *
 7 |  * @param {variable} String variable @required
 8 |  * @param {value} String value @required
 9 |  *
10 |  * @return null
11 |  *
12 |  */
13 | 
14 | export default function (variable, value) {
15 |   try {
16 |     document.documentElement.style.setProperty(variable, value)
17 |   } catch (e) {
18 |   	console.warn('MenuChef failed to change a CSS variable', e)
19 |   }
20 | }


--------------------------------------------------------------------------------
/src/helpers/setIF.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  *
 3 |  * @function setIF
 4 |  *
 5 |  * @description Verify determined condition and return passed value. If not, return default value
 6 |  * The condition don't need exist and don't break the program
 7 |  *
 8 |  * @param {val} String value @required
 9 |  * @param {condition} String condition to be analized @required
10 |  * @param {defaultVal} String @default '' @optional
11 |  *
12 |  * @return val || defaultVal
13 |  *
14 |  */
15 | 
16 | export default function (val, condition, defaultVal = '') {
17 |   try {
18 |     if (condition && val) return val
19 |   } catch (e) {}
20 |   return defaultVal
21 | }
22 | 


--------------------------------------------------------------------------------
/src/helpers/setPublicVar.js:
--------------------------------------------------------------------------------
 1 | /**
 2 |  *
 3 |  * @function setPublicVar
 4 |  *
 5 |  * @description Set readonly public variable to a object
 6 |  *
 7 |  * @param {obj} Object destination @required
 8 |  * @param {location} Object source @required
 9 |  * @param {variable} String source variable @required
10 |  * @param {variableLocation} String if source variable isn't the same name
11 |  *
12 |  * @return Object.defineProperty
13 |  *
14 |  */
15 | 
16 | export default function (obj, location, variable, variableLocation = variable) {
17 |   if (obj['hasOwnProperty'](variable)) delete obj[variable]
18 |   return Object.defineProperty(obj, variable, {
19 |     configurable: true,
20 |     get () {
21 |       return location[variableLocation]
22 |     },
23 |     set (val) {
24 |       console.warn(`${obj.name}.${variable} is readonly`)
25 |     }
26 |   })
27 | }
28 | 


--------------------------------------------------------------------------------
/src/templates/button.html:
--------------------------------------------------------------------------------
1 | 


--------------------------------------------------------------------------------
/src/templates/default.html:
--------------------------------------------------------------------------------
 1 | 

 2 |   
14 |   

15 |     
16 |   

17 | 



--------------------------------------------------------------------------------
/src/templates/full.scss:
--------------------------------------------------------------------------------
 1 | .MenuChef--theme-full {
 2 |   display: none;
 3 |   background-color: rgba(0,0,0, .9);
 4 |   position: fixed;
 5 |   top: 0;
 6 |   left: 0;
 7 |   right: 0;
 8 |   bottom: 0;
 9 |   height: 100%;
10 |   width: 100%;
11 |   z-index: 99;
12 | 
13 |   &.is-visible { display: table; }
14 | }


--------------------------------------------------------------------------------
/src/templates/main.scss:
--------------------------------------------------------------------------------
  1 | @import 'mixins';
  2 | 
  3 | $font: 'Helvetica', 'Arial', sans-serif;
  4 | 
  5 | $cssVars: (
  6 |   MenuChef-font-family: $font,
  7 |   MenuChef-font-size: 16px,
  8 |   MenuChef-margin-bottom: 25px,
  9 |   MenuChef-text-transform: uppercase,
 10 |   MenuChef-transition: color linear .15s,
 11 |   MenuChef-font-weight: bold,
 12 |   MenuChef-theme_side-width: 20%,
 13 |   MenuChef-theme_side-min-width: 240px
 14 | ) !default;
 15 | 
 16 | /*
 17 |  * Hamburgers
 18 |  * @description Tasty CSS-animated hamburgers
 19 |  * @author Jonathan Suh @jonsuh
 20 |  * @site https://jonsuh.com/hamburgers
 21 |  * @link https://github.com/jonsuh/hamburgers
 22 |  */
 23 | @import '../../node_modules/hamburgers/_sass/hamburgers/hamburgers';
 24 | 
 25 | // Schemes
 26 | @import 'schemes/black';
 27 | @import 'schemes/yellow';
 28 | @import 'schemes/red';
 29 | @import 'schemes/green';
 30 | @import 'schemes/blue';
 31 | // end schemes
 32 | 
 33 | %MenuChefOpen--dir--right {
 34 |   top: 15px;
 35 |   right: 15px;
 36 | }
 37 | 
 38 | %MenuChefOpen--dir--left {
 39 |   top: 15px;
 40 |   left: 15px;
 41 | }
 42 | 
 43 | body.has-menuOpen {
 44 |   overflow: hidden !important;
 45 | }
 46 | 
 47 | .MenuChefOpen {
 48 |   background: transparent;
 49 |   border: 0;
 50 |   position: absolute;
 51 |   z-index: 200;
 52 |   cursor: pointer;
 53 | 
 54 |   &.is-active {
 55 |     position: fixed;
 56 |     .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
 57 |       background-color: #fff;
 58 |     }
 59 |   }
 60 | 
 61 |   &:hover, &:active, &:focus { outline: none; }
 62 | 
 63 |   &--dir {
 64 |     &--left { @extend %MenuChefOpen--dir--left; }
 65 |     &--right { @extend %MenuChefOpen--dir--right; }
 66 |   }
 67 | 
 68 |   @extend %MenuChefOpen--dir--right;
 69 | 
 70 |     // @media (min-width: 768px) { display: none; }
 71 |   }
 72 | 
 73 |   // fix specific hamburgers that was overwritten by MenuChefOpen color
 74 |   .hamburger--3dx.is-active .hamburger-inner,
 75 |   .hamburger--3dx-r.is-active .hamburger-inner,
 76 |   .hamburger--3dy.is-active .hamburger-inner,
 77 |   .hamburger--3dy-r.is-active .hamburger-inner,
 78 |   .hamburger--emphatic.is-active .hamburger-inner,
 79 |   .hamburger--emphatic-r.is-active .hamburger-inner,
 80 |   .hamburger--spring.is-active .hamburger-inner,
 81 |   .hamburger--spring-r.is-active .hamburger-inner,
 82 |   .hamburger--stand.is-active .hamburger-inner,
 83 |   .hamburger--stand-r.is-active .hamburger-inner
 84 |   {
 85 |     background-color: transparent;
 86 |   }
 87 | 
 88 |   .MenuChef-close {
 89 |     @extend .MenuChefOpen;
 90 |     color: #fff;
 91 |   }
 92 |   .MenuChef-links-link {
 93 |     @include var(font-family, MenuChef-font-family);
 94 |     display: block;
 95 |     color: #fff;
 96 |     @include var(font-size, MenuChef-font-size);
 97 |     @include var(margin-bottom, MenuChef-margin-bottom);
 98 |     @include var(text-transform, MenuChef-text-transform);
 99 |     text-decoration: none;
100 |     @include var(transition, MenuChef-transition);
101 |     @include var(font-weight, MenuChef-font-weight);
102 | 
103 |     &:hover {
104 |       text-decoration: none;
105 |     }
106 |   }
107 |     .MenuChef-wrapper {
108 |       display:table-cell;
109 |       vertical-align:middle;
110 |     }
111 |     .MenuChef-links {
112 |       margin-left: auto;
113 |       margin-right: auto;
114 |       text-align: center;
115 |     }
116 | 
117 | body.has-MenuChef--effect--blur { transition: filter linear .3s; }
118 | body.has-MenuChef--effect--blur.has-menuChefOpen > *:not([class*="MenuChef"]) {
119 |   -webkit-filter: blur(2px);
120 |        -o-filter: blur(2px);
121 |           filter: blur(2px);
122 | }
123 | 
124 | @import 'full';
125 | @import 'side';


--------------------------------------------------------------------------------
/src/templates/mixins.scss:
--------------------------------------------------------------------------------
1 | @mixin var($property, $varName) {
2 |   #{$property}: map-get($cssVars, $varName);
3 |   #{$property}: var(--#{$varName}, map-get($cssVars, $varName));
4 | }


--------------------------------------------------------------------------------
/src/templates/schemes/_black.scss:
--------------------------------------------------------------------------------
 1 | $scheme: 'black';
 2 | $scheme-bgcolor: #28292E;
 3 | $scheme-color: #A0A1A5;
 4 | $scheme-color-hover: darken($scheme-color, 10%);
 5 | 
 6 | $cssVars_scheme: (
 7 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
 8 |   MenuChef-scheme-color: $scheme-color,
 9 |   MenuChef-scheme-color-hover: $scheme-color-hover
10 | );
11 | 
12 | @import 'scheme';
13 | 


--------------------------------------------------------------------------------
/src/templates/schemes/_blue.scss:
--------------------------------------------------------------------------------
 1 | $scheme: 'blue';
 2 | $scheme-bgcolor: #4476CD;
 3 | $scheme-color: #293659;
 4 | $scheme-color-hover: darken($scheme-color, 10%);
 5 | 
 6 | $cssVars_scheme: (
 7 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
 8 |   MenuChef-scheme-color: $scheme-color,
 9 |   MenuChef-scheme-color-hover: $scheme-color-hover
10 | );
11 | 
12 | @import 'scheme';
13 | 


--------------------------------------------------------------------------------
/src/templates/schemes/_green.scss:
--------------------------------------------------------------------------------
 1 | $scheme: 'green';
 2 | $scheme-bgcolor: #01C69B;
 3 | $scheme-color: #015743;
 4 | $scheme-color-hover: darken($scheme-color, 10%);
 5 | 
 6 | $cssVars_scheme: (
 7 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
 8 |   MenuChef-scheme-color: $scheme-color,
 9 |   MenuChef-scheme-color-hover: $scheme-color-hover
10 | );
11 | 
12 | @import 'scheme';
13 | 


--------------------------------------------------------------------------------
/src/templates/schemes/_red.scss:
--------------------------------------------------------------------------------
 1 | $scheme: 'red';
 2 | $scheme-bgcolor: #FF4A35;
 3 | $scheme-color: #7C1506;
 4 | $scheme-color-hover: darken($scheme-color, 10%);
 5 | 
 6 | $cssVars_scheme: (
 7 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
 8 |   MenuChef-scheme-color: $scheme-color,
 9 |   MenuChef-scheme-color-hover: $scheme-color-hover
10 | );
11 | 
12 | @import 'scheme';
13 | 


--------------------------------------------------------------------------------
/src/templates/schemes/_scheme.scss:
--------------------------------------------------------------------------------
 1 | @import '../mixins';
 2 | 
 3 | $scheme: 'black' !default;
 4 | $scheme-bgcolor: #28292E !default;
 5 | $scheme-color: #A0A1A5 !default;
 6 | $scheme-color-hover: darken($scheme-color, 10%) !default;
 7 | 
 8 | $cssVars_scheme: (
 9 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
10 |   MenuChef-scheme-color: $scheme-color,
11 |   MenuChef-scheme-color-hover: $scheme-color-hover
12 | ) !default;
13 | 
14 | $cssVars: () !default;
15 | $cssVars: map-merge($cssVars, $cssVars_scheme);
16 | 
17 | .MenuChefOpen[data-scheme=#{$scheme}] {
18 | 	&.is-active {
19 |     .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
20 |       // background-color: $scheme-color;
21 |       @include var(background-color, MenuChef-scheme-color);
22 |     }
23 |   }
24 | }
25 | 
26 | .MenuChef[data-scheme=#{$scheme}] {
27 | 	// background-color: $scheme-bgcolor;
28 |   @include var(background-color, MenuChef-scheme-bgcolor);
29 | 
30 | 	.MenuChef-links-link {
31 | 		// color: $scheme-color;
32 |     @include var(color, MenuChef-scheme-color);
33 | 
34 | 		&:hover {
35 | 			// color: $scheme-color-hover;
36 |       @include var(color, MenuChef-scheme-color-hover);
37 | 		}
38 | 	}
39 | }
40 | 


--------------------------------------------------------------------------------
/src/templates/schemes/_yellow.scss:
--------------------------------------------------------------------------------
 1 | $scheme: 'yellow';
 2 | $scheme-bgcolor: #FEC659;
 3 | $scheme-color: #966000;
 4 | $scheme-color-hover: darken($scheme-color, 10%);
 5 | 
 6 | $cssVars_scheme: (
 7 |   MenuChef-scheme-bgcolor: $scheme-bgcolor,
 8 |   MenuChef-scheme-color: $scheme-color,
 9 |   MenuChef-scheme-color-hover: $scheme-color-hover
10 | );
11 | 
12 | @import 'scheme';
13 | 


--------------------------------------------------------------------------------
/src/templates/side.scss:
--------------------------------------------------------------------------------
 1 | %theme-side--dir--right {
 2 |   right: 0;
 3 |   -webkit-transform: translateX(105%);
 4 |       -ms-transform: translateX(105%);
 5 |        -o-transform: translateX(105%);
 6 |           transform: translateX(105%);
 7 | }
 8 | 
 9 | %theme-side--dir--left {
10 |   left: 0;
11 |   -webkit-transform: translateX(-105%);
12 |       -ms-transform: translateX(-105%);
13 |        -o-transform: translateX(-105%);
14 |           transform: translateX(-105%);
15 | }
16 | 
17 | .MenuChef--theme-side {
18 |   display: table;
19 |   background-color: rgba(0,0,0, .9);
20 |   position: fixed;
21 |   top: 0;
22 |   bottom: 0;
23 |   height: 100%;
24 |   height: 100vh;
25 |   @include var(width, MenuChef-theme_side-width);
26 |   @include var(min-width, MenuChef-theme_side-min-width);
27 |   z-index: 99;
28 | 
29 |   @extend %theme-side--dir--right;
30 | 
31 |   &--dir {
32 |     &--right { @extend %theme-side--dir--right; }
33 |     &--left { @extend %theme-side--dir--left; }
34 |   }
35 | 
36 |   &-effect {
37 |     &--smooth {
38 |       -webkit-transition: transform linear .15s;
39 |            -o-transition: transform linear .15s;
40 |               transition: transform linear .15s;
41 |       &--open {
42 |         -webkit-transform: translateX(0);
43 |             -ms-transform: translateX(0);
44 |              -o-transform: translateX(0);
45 |                 transform: translateX(0);
46 |       }
47 |     }
48 |   }
49 | 
50 |   &.is-visible {
51 |     -webkit-transform: translateX(0);
52 |         -ms-transform: translateX(0);
53 |          -o-transform: translateX(0);
54 |             transform: translateX(0);
55 |   }
56 | }


--------------------------------------------------------------------------------
/test/MenuChef.test.js:
--------------------------------------------------------------------------------
  1 | var expect = chai.expect
  2 | chai.should()
  3 | 
  4 | var eventFire = function eventFire(el, etype){
  5 |   if (el.fireEvent) {
  6 |     el.fireEvent('on' + etype);
  7 |   } else {
  8 |     var evObj = document.createEvent('Events');
  9 |     evObj.initEvent(etype, true, false);
 10 |     el.dispatchEvent(evObj);
 11 |   }
 12 | }
 13 | 
 14 | describe('new MenuChef', function () {
 15 |   it('new MenuChef should init', function () {
 16 |     expect(new MenuChef('.js-Menu a')).to.be.an.object;
 17 |     MenuChef.destroy();
 18 |   })
 19 |   it('instance of new MenuChef should init', function () {
 20 |     var menu = new MenuChef('.js-Menu a')
 21 |     menu.should.be.an.object;
 22 |     MenuChef.destroy();
 23 |   })
 24 | 
 25 |   it('new MenuChef(".js-Menu") should advice in console about that element aren\'t ingredients', function () {
 26 |     window.logs.warns = []
 27 |     new MenuChef('.js-Menu')
 28 |     expect(window.logs.warns[0]).to.be.equal('MenuChef don\'t find ingredients. Maybe you passed the menu itself as ingredients. If the class of menu is ".menu", pass ".menu a". The links are the ingredients =)');
 29 |     MenuChef.destroy();
 30 |   });
 31 | 
 32 |   it('new MenuChef(".js-Mene") receive a element that don\'t exist and throw an error', function () {
 33 |     try {
 34 |       new MenuChef('.js-Mene')
 35 |     } catch (err) {
 36 |       expect(err).to.match(/Error: MenuChef needs link elements passed as ingredients/);
 37 |     }
 38 |   });
 39 | 
 40 |   it('new MenuChef(".js-Menu a") works fine', function () {
 41 |     expect(new MenuChef('.js-Menu a')._ingredients).to.have.length.above(2);
 42 |   });
 43 | 
 44 | });
 45 | 
 46 | describe('MenuChef.open()', function () {
 47 |   it('MenuChef.open() should open the menu', function () {
 48 |     MenuChef.open();
 49 |     expect(document.querySelector('.MenuChef').classList.contains('is-visible')).to.be.true;
 50 |   });
 51 | });
 52 | 
 53 | describe('MenuChef.close()', function () {
 54 |   it('MenuChef.close() should close the menu', function () {
 55 |     MenuChef.close();
 56 |     expect(document.querySelector('.MenuChef').classList.contains('is-visible')).to.be.false;
 57 |   });
 58 | });
 59 | 
 60 | describe('MenuChef.toggle()', function () {
 61 |   it('MenuChef.toggle() should open the menu', function () {
 62 |     MenuChef.toggle();
 63 |     expect(document.querySelector('.MenuChef').classList.contains('is-visible')).to.be.true;
 64 |   });
 65 | 
 66 |   it('MenuChef.toggle() should close the menu', function () {
 67 |     MenuChef.toggle();
 68 |     expect(document.querySelector('.MenuChef').classList.contains('is-visible')).to.be.false;
 69 |   });
 70 | });
 71 | 
 72 | describe('MenuChef.destroy()', function () {
 73 |   it('MenuChef.destroy() should remove MenuChef from DOM', function () {
 74 |     MenuChef.destroy();
 75 |     expect(document.querySelector('.MenuChef')).to.be.null;
 76 |   });
 77 | });
 78 | 
 79 | describe('MenuChef options', function () {
 80 |   it('Change options', function () {
 81 |     var menu = new MenuChef('.js-Menu a', {
 82 |       closeOnClick: false,
 83 |     });
 84 |     expect(menu._options.closeOnClick).to.be.false;
 85 |     MenuChef.destroy();
 86 |   });
 87 | 
 88 |   it('Options classes object', function () {
 89 |     new MenuChef('.js-Menu a', {
 90 |       classes: {
 91 |         exclude: ['class-foo'],
 92 |       },
 93 |     });
 94 |     expect(document.querySelector('.MenuChef-links-link').classList.contains('class-foo')).to.be.false;
 95 |     MenuChef.destroy();
 96 | 
 97 |     new MenuChef('.js-Menu a', {
 98 |       classes: {
 99 |         include: ['yolo'],
100 |       },
101 |     });
102 |     expect(document.querySelector('.MenuChef-links-link').classList.contains('yolo')).to.be.true;
103 |     MenuChef.destroy();
104 | 
105 |     new MenuChef('.js-Menu a', {
106 |       classes: {
107 |         only: ['class-foo']
108 |       }
109 |     });
110 |     expect(document.querySelector('.MenuChef-links-link').classList.contains('class-foo')).to.be.true;
111 |     expect(document.querySelector('.MenuChef-links-link').classList.contains('class-bar')).to.be.false;
112 |   });
113 | 
114 |   it('Change scheme', function () {
115 |     var menu = new MenuChef('.js-Menu a', {
116 |       scheme: 'red'
117 |     });
118 |     MenuChef.open();
119 |     expect(menu._options.scheme).to.be.equal('red');
120 |     expect(document.querySelector('.MenuChef').dataset.scheme).to.be.equal('red');
121 |     MenuChef.destroy();
122 |   });
123 |   it('Change theme', function () {
124 |     // test theme string
125 |     var menu = new MenuChef('.js-Menu a', {
126 |       theme: 'side'
127 |     });
128 |     expect(menu._options.theme).to.be.equal('side');
129 |     expect(menu._themeClass).to.be.equal('MenuChef--theme-side');
130 |     MenuChef.destroy();
131 |     var menu = new MenuChef('.js-Menu a', {
132 |       theme: {
133 |         theme: 'side',
134 |         direction: 'left'
135 |       }
136 |     });
137 | 
138 |     // test theme object
139 |     expect(menu._options.theme).to.be.a.object;
140 |     expect(menu._options.theme.theme).to.be.equal('side')
141 |     expect(menu._options.theme.direction).to.be.equal('left')
142 |     expect(menu._themeClass).to.be.equal('MenuChef--theme-side');
143 |     MenuChef.destroy();
144 |   });
145 |   it('Change custom classes', function () {
146 |     var menu = new MenuChef('.js-Menu a', {
147 |       bodyClassOpen: 'body-example-class-open',
148 |       kitchenClass: 'kitchen-example-class',
149 |       kitchenOpenClass: 'kitchen-example-class-open'
150 |     });
151 |     MenuChef.open();
152 |     expect(document.body.classList.contains('body-example-class-open')).to.be.true;
153 |     expect(document.querySelector('.MenuChef').classList.contains('kitchen-example-class-open')).to.be.true;
154 |     expect(document.querySelector('.MenuChef').classList.contains('kitchen-example-class')).to.be.true;
155 |     MenuChef.close();
156 |     expect(document.body.classList.contains('body-example-class-open')).to.be.false;
157 |     expect(document.querySelector('.MenuChef').classList.contains('kitchen-example-class-open')).to.be.false;
158 |     expect(document.querySelector('.MenuChef').classList.contains('kitchen-example-class')).to.be.true;
159 |     MenuChef.destroy();
160 |   });
161 |   it('Change theme effects', function () {
162 |     var menu = new MenuChef('.js-Menu a', {
163 |       theme: {
164 |         theme: 'side',
165 |         effectOnOpen: 'smooth',
166 |         direction: 'left',
167 |         pageEffect: 'blur'
168 |       },
169 |     });
170 |     expect(document.body.classList.contains('has-MenuChef--effect--blur')).to.be.true;
171 |     expect(document.querySelector('.MenuChef').classList.contains('MenuChef--theme-side-effect--smooth')).to.be.true;
172 |     expect(document.querySelector('.MenuChef').classList.contains('MenuChef--theme-side--dir--left')).to.be.true;
173 |     MenuChef.open();
174 |     expect(document.body.classList.contains('has-menuChefOpen--side')).to.be.true;
175 |     expect(document.querySelector('.MenuChef').classList.contains('MenuChef--theme-side-effect--smooth--open')).to.be.true;
176 |     MenuChef.destroy();
177 |   });
178 | 
179 |   it('Change custom button', function () {
180 |     var menu = new MenuChef('.js-Menu a', {
181 |       button: 'custom btn'
182 |     });
183 | 
184 |     var custombtn = document.getElementById('custombtn');
185 | 
186 |     expect(menu.ISBUTTONDEFAULT).to.be.false;
187 |     expect(custombtn.textContent).to.be.equal('custom btn');
188 |     eventFire(custombtn, 'click');
189 |     expect(MenuChef.isOpen).to.be.true;
190 |     eventFire(custombtn, 'click');
191 |     expect(MenuChef.isOpen).to.be.false;
192 |     MenuChef.destroy();
193 |   });
194 | 
195 |   it('Change parent element', function () {
196 |     expect(document.querySelector('#menu .MenuChef')).to.be.null;
197 | 
198 |     var menu = new MenuChef('.js-Menu a', {
199 |       parent: '#menu'
200 |     });
201 | 
202 |     expect(document.querySelector('#menu .MenuChef')).to.be.not.null;
203 |     MenuChef.destroy();
204 |   });
205 | 
206 | });
207 | 
208 | describe('MenuChef options callbacks', function () {
209 |   it('onOpen() should execute on open', function () {
210 |     var executed = false;
211 |     var menu = new MenuChef('.js-Menu a', {
212 |       onOpen: function () {
213 |         executed = true;
214 |       }
215 |     });
216 |     MenuChef.open();
217 |     expect(executed).to.be.true;
218 |     MenuChef.destroy();
219 |   });
220 | 
221 |   it('onClose() should execute on close', function () {
222 |     var executed = false;
223 |     var menu = new MenuChef('.js-Menu a', {
224 |       onClose: function () {
225 |         executed = true;
226 |       }
227 |     });
228 |     MenuChef.open();
229 |     expect(executed).to.be.false;
230 |     MenuChef.close();
231 |     expect(executed).to.be.true;
232 |     MenuChef.destroy();
233 |   });
234 | 
235 |   it('onClick() should execute on click', function () {
236 |     // http://stackoverflow.com/a/2706236/1856898
237 |     // simulate click to work in terminal testing
238 |     var executed = false;
239 |     var menu = new MenuChef('.js-Menu a', {
240 |       onClick: function () {
241 |         executed = true;
242 |       }
243 |     });
244 | 
245 |     MenuChef.open();
246 |     expect(executed).to.be.false;
247 |     eventFire(document.querySelector('.MenuChef-links-link'), 'click');
248 |     expect(executed).to.be.true;
249 |     MenuChef.close();
250 |     MenuChef.destroy();
251 |   });
252 | 
253 |   it('onReady() should execute on ready', function () {
254 |     MenuChef.destroy();
255 |     var executed = false;
256 |     expect(executed).to.be.false;
257 |     expect(document.querySelector('.MenuChef')).to.be.null;
258 |     
259 |     var menu = new MenuChef('.js-Menu a', {
260 |       onReady: function () {
261 |         executed = true;
262 |       }
263 |     });
264 | 
265 |     expect(document.querySelector('.MenuChef')).to.be.not.null;
266 |     expect(executed).to.be.true;
267 |     MenuChef.destroy();
268 |   });
269 | });
270 | 
271 | describe('Public Variables', function () {
272 |   it('MenuChef.version should return the actual version of MenuChef', function () {
273 |     expect(MenuChef.version).to.be.a.string;
274 |   });
275 |   it('MenuChef.isOpen should return a boolean indicating whether it\'s open or not or null if never was opened', function () {
276 |     new MenuChef('.js-Menu a');
277 |     expect(MenuChef.isOpen).to.be.null;
278 |     MenuChef.open();
279 |     expect(MenuChef.isOpen).to.be.true;
280 |     MenuChef.close();
281 |     expect(MenuChef.isOpen).to.be.false;
282 |     MenuChef.destroy();
283 |   });
284 | });


--------------------------------------------------------------------------------
/test/index.html:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 |   
 4 |     Mocha
 5 |     
 6 |     
 7 |     
 8 |     
 9 | 
10 |     
22 | 
23 |     
24 |     
25 |     
26 |   
27 |   
28 |     
37 |     
38 |     

39 | 
40 |     
41 | 
42 |     
43 | 
44 |     
47 |   
48 | 
49 | 


--------------------------------------------------------------------------------
/test/mocha.css:
--------------------------------------------------------------------------------
  1 | @charset "utf-8";
  2 | 
  3 | body {
  4 |   margin:0;
  5 | }
  6 | 
  7 | #mocha {
  8 |   font: 20px/1.5 "Helvetica Neue", Helvetica, Arial, sans-serif;
  9 |   margin: 60px 50px;
 10 | }
 11 | 
 12 | #mocha ul,
 13 | #mocha li {
 14 |   margin: 0;
 15 |   padding: 0;
 16 | }
 17 | 
 18 | #mocha ul {
 19 |   list-style: none;
 20 | }
 21 | 
 22 | #mocha h1,
 23 | #mocha h2 {
 24 |   margin: 0;
 25 | }
 26 | 
 27 | #mocha h1 {
 28 |   margin-top: 15px;
 29 |   font-size: 1em;
 30 |   font-weight: 200;
 31 | }
 32 | 
 33 | #mocha h1 a {
 34 |   text-decoration: none;
 35 |   color: inherit;
 36 | }
 37 | 
 38 | #mocha h1 a:hover {
 39 |   text-decoration: underline;
 40 | }
 41 | 
 42 | #mocha .suite .suite h1 {
 43 |   margin-top: 0;
 44 |   font-size: .8em;
 45 | }
 46 | 
 47 | #mocha .hidden {
 48 |   display: none;
 49 | }
 50 | 
 51 | #mocha h2 {
 52 |   font-size: 12px;
 53 |   font-weight: normal;
 54 |   cursor: pointer;
 55 | }
 56 | 
 57 | #mocha .suite {
 58 |   margin-left: 15px;
 59 | }
 60 | 
 61 | #mocha .test {
 62 |   margin-left: 15px;
 63 |   overflow: hidden;
 64 | }
 65 | 
 66 | #mocha .test.pending:hover h2::after {
 67 |   content: '(pending)';
 68 |   font-family: arial, sans-serif;
 69 | }
 70 | 
 71 | #mocha .test.pass.medium .duration {
 72 |   background: #c09853;
 73 | }
 74 | 
 75 | #mocha .test.pass.slow .duration {
 76 |   background: #b94a48;
 77 | }
 78 | 
 79 | #mocha .test.pass::before {
 80 |   content: '✓';
 81 |   font-size: 12px;
 82 |   display: block;
 83 |   float: left;
 84 |   margin-right: 5px;
 85 |   color: #00d6b2;
 86 | }
 87 | 
 88 | #mocha .test.pass .duration {
 89 |   font-size: 9px;
 90 |   margin-left: 5px;
 91 |   padding: 2px 5px;
 92 |   color: #fff;
 93 |   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
 94 |   -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
 95 |   box-shadow: inset 0 1px 1px rgba(0,0,0,.2);
 96 |   -webkit-border-radius: 5px;
 97 |   -moz-border-radius: 5px;
 98 |   -ms-border-radius: 5px;
 99 |   -o-border-radius: 5px;
100 |   border-radius: 5px;
101 | }
102 | 
103 | #mocha .test.pass.fast .duration {
104 |   display: none;
105 | }
106 | 
107 | #mocha .test.pending {
108 |   color: #0b97c4;
109 | }
110 | 
111 | #mocha .test.pending::before {
112 |   content: '◦';
113 |   color: #0b97c4;
114 | }
115 | 
116 | #mocha .test.fail {
117 |   color: #c00;
118 | }
119 | 
120 | #mocha .test.fail pre {
121 |   color: black;
122 | }
123 | 
124 | #mocha .test.fail::before {
125 |   content: '✖';
126 |   font-size: 12px;
127 |   display: block;
128 |   float: left;
129 |   margin-right: 5px;
130 |   color: #c00;
131 | }
132 | 
133 | #mocha .test pre.error {
134 |   color: #c00;
135 |   max-height: 300px;
136 |   overflow: auto;
137 | }
138 | 
139 | #mocha .test .html-error {
140 |   overflow: auto;
141 |   color: black;
142 |   line-height: 1.5;
143 |   display: block;
144 |   float: left;
145 |   clear: left;
146 |   font: 12px/1.5 monaco, monospace;
147 |   margin: 5px;
148 |   padding: 15px;
149 |   border: 1px solid #eee;
150 |   max-width: 85%; /*(1)*/
151 |   max-width: -webkit-calc(100% - 42px);
152 |   max-width: -moz-calc(100% - 42px);
153 |   max-width: calc(100% - 42px); /*(2)*/
154 |   max-height: 300px;
155 |   word-wrap: break-word;
156 |   border-bottom-color: #ddd;
157 |   -webkit-box-shadow: 0 1px 3px #eee;
158 |   -moz-box-shadow: 0 1px 3px #eee;
159 |   box-shadow: 0 1px 3px #eee;
160 |   -webkit-border-radius: 3px;
161 |   -moz-border-radius: 3px;
162 |   border-radius: 3px;
163 | }
164 | 
165 | #mocha .test .html-error pre.error {
166 |   border: none;
167 |   -webkit-border-radius: 0;
168 |   -moz-border-radius: 0;
169 |   border-radius: 0;
170 |   -webkit-box-shadow: 0;
171 |   -moz-box-shadow: 0;
172 |   box-shadow: 0;
173 |   padding: 0;
174 |   margin: 0;
175 |   margin-top: 18px;
176 |   max-height: none;
177 | }
178 | 
179 | /**
180 |  * (1): approximate for browsers not supporting calc
181 |  * (2): 42 = 2*15 + 2*10 + 2*1 (padding + margin + border)
182 |  *      ^^ seriously
183 |  */
184 | #mocha .test pre {
185 |   display: block;
186 |   float: left;
187 |   clear: left;
188 |   font: 12px/1.5 monaco, monospace;
189 |   margin: 5px;
190 |   padding: 15px;
191 |   border: 1px solid #eee;
192 |   max-width: 85%; /*(1)*/
193 |   max-width: -webkit-calc(100% - 42px);
194 |   max-width: -moz-calc(100% - 42px);
195 |   max-width: calc(100% - 42px); /*(2)*/
196 |   word-wrap: break-word;
197 |   border-bottom-color: #ddd;
198 |   -webkit-box-shadow: 0 1px 3px #eee;
199 |   -moz-box-shadow: 0 1px 3px #eee;
200 |   box-shadow: 0 1px 3px #eee;
201 |   -webkit-border-radius: 3px;
202 |   -moz-border-radius: 3px;
203 |   border-radius: 3px;
204 | }
205 | 
206 | #mocha .test h2 {
207 |   position: relative;
208 | }
209 | 
210 | #mocha .test a.replay {
211 |   position: absolute;
212 |   top: 3px;
213 |   right: 0;
214 |   text-decoration: none;
215 |   vertical-align: middle;
216 |   display: block;
217 |   width: 15px;
218 |   height: 15px;
219 |   line-height: 15px;
220 |   text-align: center;
221 |   background: #eee;
222 |   font-size: 15px;
223 |   -webkit-border-radius: 15px;
224 |   -moz-border-radius: 15px;
225 |   border-radius: 15px;
226 |   -webkit-transition:opacity 200ms;
227 |   -moz-transition:opacity 200ms;
228 |   -o-transition:opacity 200ms;
229 |   transition: opacity 200ms;
230 |   opacity: 0.3;
231 |   color: #888;
232 | }
233 | 
234 | #mocha .test:hover a.replay {
235 |   opacity: 1;
236 | }
237 | 
238 | #mocha-report.pass .test.fail {
239 |   display: none;
240 | }
241 | 
242 | #mocha-report.fail .test.pass {
243 |   display: none;
244 | }
245 | 
246 | #mocha-report.pending .test.pass,
247 | #mocha-report.pending .test.fail {
248 |   display: none;
249 | }
250 | #mocha-report.pending .test.pass.pending {
251 |   display: block;
252 | }
253 | 
254 | #mocha-error {
255 |   color: #c00;
256 |   font-size: 1.5em;
257 |   font-weight: 100;
258 |   letter-spacing: 1px;
259 | }
260 | 
261 | #mocha-stats {
262 |   position: fixed;
263 |   top: 15px;
264 |   right: 10px;
265 |   font-size: 12px;
266 |   margin: 0;
267 |   color: #888;
268 |   z-index: 1;
269 | }
270 | 
271 | #mocha-stats .progress {
272 |   float: right;
273 |   padding-top: 0;
274 | 
275 |   /**
276 |    * Set safe initial values, so mochas .progress does not inherit these
277 |    * properties from Bootstrap .progress (which causes .progress height to
278 |    * equal line height set in Bootstrap).
279 |    */
280 |   height: auto;
281 |   -webkit-box-shadow: none;
282 |   -moz-box-shadow: none;
283 |   box-shadow: none;
284 |   background-color: initial;
285 | }
286 | 
287 | #mocha-stats em {
288 |   color: black;
289 | }
290 | 
291 | #mocha-stats a {
292 |   text-decoration: none;
293 |   color: inherit;
294 | }
295 | 
296 | #mocha-stats a:hover {
297 |   border-bottom: 1px solid #eee;
298 | }
299 | 
300 | #mocha-stats li {
301 |   display: inline-block;
302 |   margin: 0 5px;
303 |   list-style: none;
304 |   padding-top: 11px;
305 | }
306 | 
307 | #mocha-stats canvas {
308 |   width: 40px;
309 |   height: 40px;
310 | }
311 | 
312 | #mocha code .comment { color: #ddd; }
313 | #mocha code .init { color: #2f6fad; }
314 | #mocha code .string { color: #5890ad; }
315 | #mocha code .keyword { color: #8a6343; }
316 | #mocha code .number { color: #2f6fad; }
317 | 
318 | @media screen and (max-device-width: 480px) {
319 |   #mocha {
320 |     margin: 60px 0px;
321 |   }
322 | 
323 |   #mocha #stats {
324 |     position: absolute;
325 |   }
326 | }
327 | 


--------------------------------------------------------------------------------
/webpack.config.babel.js:
--------------------------------------------------------------------------------
 1 | const webpack = require('webpack');
 2 | const path = require('path');
 3 | const pkg = require('./package.json');
 4 | 
 5 | module.exports = {
 6 |   devtool: 'source-map',
 7 |   entry: {
 8 |     MenuChef: './src/MenuChef.js'
 9 |   },
10 |   output: {
11 |     path: path.join(__dirname, './dist'),
12 |     filename: '[name].js'
13 |   },
14 |   module: {
15 |     rules: [
16 |       {
17 |         enforce: 'pre',
18 |         test: /\.js$/,
19 |         loader: 'standard-loader',
20 |         exclude: /(node_modules)/,
21 |       },
22 |       {
23 |         test: /\.html$/,
24 |         exclude: /node_modules/,
25 |         loader: 'html-loader',
26 |         query: {
27 |           minimize: true,
28 |         }
29 |       },
30 |       {
31 |         test: /\.css$/,
32 |         exclude: /node_modules/,
33 |         use: [
34 |           'style-loader',
35 |           'css-loader'
36 |         ]
37 |       },
38 |       {
39 |         test: /\.scss$/,
40 |         use: [{
41 |             loader: "style-loader"
42 |           }, {
43 |               loader: "css-loader"
44 |           }, {
45 |               loader: "sass-loader"
46 |         }]
47 |       },
48 |       {
49 |         test: /\.(js|jsx)$/,
50 |         exclude: /node_modules/,
51 |         use: [
52 |           'babel-loader'
53 |         ],
54 |       },
55 |     ],
56 |   },
57 |   resolve: {
58 |     extensions: ['.webpack-loader.js', '.web-loader.js', '.loader.js', '.js', '.jsx'],
59 |     modules: [
60 |       path.resolve(__dirname, 'node_modules'),
61 |       path.join(__dirname, './src')
62 |     ]
63 |   },
64 |   devServer: {
65 |     contentBase: path.join(__dirname, 'dist'),
66 |     compress: true,
67 |     port: 9000
68 |   },
69 |   plugins: [
70 |     new webpack.BannerPlugin(`MenuChef v${pkg.version}
71 | http://github.com/theus/MenuChef
72 | Released under the MIT License.`),
73 |     new webpack.optimize.UglifyJsPlugin({
74 |       sourceMap: true,
75 |       mangle: {
76 |         except: ['MenuChef']
77 |       }
78 |     })
79 |   ]
80 | }


--------------------------------------------------------------------------------