HTML markup
|
1 2 3 4 5 6 7 8 9 10 11 12 13 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 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 |
<section id="menus" class="ct-menuSection onepager"> <div data-bg="../assets/images/demo-content/booze/main-picture2.jpg" class="ct-topSection ct-js-background"> <ul id="myTab2" role="tablist" class="ct-menuList list-inline list-unstyledul nav nav-tabs"> <li><a href="#tab11" role="tab" data-toggle="tab"><img src="../assets/images/demo-content/booze/menu-icon1.png" alt="Image"><img src="../assets/images/demo-content/booze/menu-icon1-colored.png" alt="Image" class="ct-hide"><span>bar food</span></a></li> <li class="active"><a href="#tab22" role="tab" data-toggle="tab"><img src="../assets/images/demo-content/booze/menu-icon2.png" alt="Image"><img src="../assets/images/demo-content/booze/menu-icon2-colored.png" alt="Image" class="ct-hide"><span>drinks</span></a></li> <li><a href="#tab33" role="tab" data-toggle="tab"><img src="../assets/images/demo-content/booze/menu-icon3.png" alt="Image"><img src="../assets/images/demo-content/booze/menu-icon3-colored.png" alt="Image" class="ct-hide"><span>events</span></a></li> <li><a href="#tab44" role="tab" data-toggle="tab"><img src="../assets/images/demo-content/booze/menu-icon4.png" alt="Image"><img src="../assets/images/demo-content/booze/menu-icon4-colored.png" alt="Image" class="ct-hide"><span>masterclass</span></a></li> </ul> </div> <div class="ct-bottomSection tab-content"> <div id="tab11" class="tab-pane fade"> <div class="container"> <div class="row text-center"> <div class="col-md-12"><span class="ct-iconHeader ct-iconHeader--large"><i class="fa fa-close"></i><i class="fa fa-close"></i><i class="fa fa-close"></i></span> <div class="ct-header ct-header--smaller ct-u-paddingTop10 ct-u-font-weight--600 ct-u-color--white ct-u-paddingBottom10">The taste treat</div> <h1 class="ct-anotherHeader ct-u-paddingTop25 ct-u-marginTopMinus30 ct-u-paddingBottom25 ct-u-color--white">Bar Food</h1> </div> </div> </div> <div class="ct-tabsContent"> <div class="ct-leftSide"> <div class="ct-leftSide-inside"> <div class="ct-iconContainer text-center"><span class="ct-iconHeader ct-iconHeader--small"><i class="fa fa-close"></i><i class="fa fa-close"></i><i class="fa fa-close"></i></span> <header class="ct-bigHeader">Menucard</header> </div> <ul id="myTab06" role="tablist" class="ct-menuRestaurant list-unstyled"> <li class="active"><a href="#tab0100111" role="tab" data-toggle="tab">Tobacco</a></li> <li><a href="#tab0100222" role="tab" data-toggle="tab">Fresh Fish</a></li> <li><a href="#tab0100333" role="tab" data-toggle="tab">The Powerplant</a></li> <li><a href="#tab0100444" role="tab" data-toggle="tab">Potatoes with salad</a></li> <li><a href="#tab0100555" role="tab" data-toggle="tab">Chicken</a></li> <li><a href="#tab0100666" role="tab" data-toggle="tab">Fresh carry</a></li> <li><a href="#tab0100777" role="tab" data-toggle="tab">Salad with cheese</a></li> <li><a href="#tab0100888" role="tab" data-toggle="tab">Pizza</a></li> <li><a href="#tab0100999" role="tab" data-toggle="tab">Becon</a></li> </ul> </div> </div> <div class="ct-rightSide tab-content"> <div id="tab0100111" class="tab-pane fade active in"> <div class="ct-rightSideContent"> <div class="ct-menu"> <header class="ct-bigHeader text-center">Tobacco</header> <ul class="list-unstyled"> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-photo"><img src="../assets/images/demo-content/booze/camera.png" alt="Image"></div> <div class="ct-dottedBg"><span data-left-position="110" class="ct-specialOffer ct-js-specialOffer">*special</span></div><span class="ct-name">Dry Goods</span><span class="ct-price">$16.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-dottedBg"></div><span class="ct-name">Bad Days</span><span class="ct-price">$18.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-photo"><img src="../assets/images/demo-content/booze/camera.png" alt="Image"></div> <div class="ct-dottedBg"><span data-left-position="146" class="ct-specialOffer ct-js-specialOffer">*special</span></div><span class="ct-name">Private Rooms</span><span class="ct-price">$17.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-photo"><img src="../assets/images/demo-content/booze/camera.png" alt="Image"></div> <div class="ct-dottedBg"></div><span class="ct-name">Party</span><span class="ct-price">$12.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-photo"><img src="../assets/images/demo-content/booze/camera.png" alt="Image"></div> <div class="ct-dottedBg"></div><span class="ct-name">Night Party</span><span class="ct-price">$10.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> <li> <ul class="ct-dottedBox list-unstyled"> <li class="ct-dottedMenu"> <div class="ct-photo"><img src="../assets/images/demo-content/booze/camera.png" alt="Image"></div> <div class="ct-dottedBg"></div><span class="ct-name">Meeting with stars</span><span class="ct-price">$13.50</span> <div class="clearfix"></div> <p class="ct-dottedMenuDetails">Includes dry vermouth and olive brine shaken ice and served with an olive.</p> </li> </ul> </li> </ul> <ul class="pagination"> <li><a href="#">1</a></li> <li class="active"><a href="#">2</a></li> <li><a href="#">3</a></li> </ul> <div class="clearfix"></div> </div> <div class="ct-content"><img src="../assets/images/demo-content/booze/drinks.jpg" alt="Image"></div> <div class="clearfix"></div> <div class="ct-additionalBox"> <div class="ct-title">*The fine print</div> <p>All drinks marked with are of a special price.<br/>We only use clean glasses and biological ingredients.</p> </div> </div> </div> |
Screenshots
Menu Restaurant ver 1
Menu Restaurant Version 2