-
Notifications
You must be signed in to change notification settings - Fork 0
/
cart.html
150 lines (150 loc) · 7.5 KB
/
cart.html
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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Sean's RWD Final</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="shortcut icon" href="./images/icons/burger_DoK_icon.ico" />
<meta name="keywords" content="RWD,HexSchool,六角,六角學院,作業,">
<meta name="description" content="六角學院RWD課程最終作業">
<!-- Facebook -->
<meta property="og:title" content="Sean's RWD Final">
<meta property="og:description" content="[HexSchool]RWD最終作業">
<meta property="og:type" content="website">
<meta property="og:url" content="https://rpwtsry.github.io/rwd-final/cart.html">
<meta property="og:image" content="https://upload.cc/i1/2019/05/01/RSs8eJ.png">
<meta property="og:image:width" content="1049">
<meta property="og:image:height" content="420">
<!-- Apple touch icon -->
<link href="./images/icons/apple-icon-57x57.png" rel="apple-touch-icon-precomposed" sizes="57x57" />
<link href="./images/icons/apple-icon-72x72.png" rel="apple-touch-icon-precomposed" sizes="72x72" />
<link href="./images/icons/apple-icon-114x114.png" rel="apple-touch-icon-precomposed" sizes="114x114" />
<link href="./images/icons/apple-icon-144x144.png" rel="apple-touch-icon-precomposed" sizes="144x144" />
<!-- CSS -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link rel="stylesheet" href="css/all.css">
<!-- JS -->
<script src="js/jquery-3.3.1.min.js"></script>
<script src="js/all.js"></script>
</head>
<body>
<div class="wrap">
<div class="header">
<div class="topbar clearfix">
<h1><a href="index.html"><img src="./images/logo_w@svg.svg" alt="六角西餐廳" class="logo"></a></h1>
<ul class="top-menu clearfix">
<li><a href="#">特色</a></li>
<li><a href="#">主廚</a></li>
<li><a href="#">地圖</a></li>
</ul>
<a href="#" class="showmenu"><i class="fas fa-bars"></i></a>
</div>
<div class="banner">
<p class="font-big">咬一口<br class="font-m">就無法忘懷的漢堡</p>
<p class="font-small">七夕絕對無法錯過的好滋味<br><i class="fas fa-utensils"></i> 六角大漢堡 <i class="fas fa-utensils"></i></p>
</div>
</div>
<div class="content-cart clearfix">
<div class="sidebar">
<div class="sidebar-title clearfix">
<span><i class="fas fa-leaf"></i></span><h4>線上訂購美食</h4>
</div>
<ul>
<li><a href="#">全部 (23)</a></li>
<li><a href="#">只愛吃薯條 (18)</a></li>
<li><a href="#">加熱就可食 (1)</a></li>
<li><a href="#">不敗漢堡系列 (4)</a></li>
</ul>
</div>
<div class="main">
<div class="main-topbar clearfix">
<div class="search clearfix">
<input type="search" id="search">
<a href="#" class="icon"><i class="fa fa-search"></i></a>
</div>
<ul class="payment clearfix">
<li><a href="#">結帳去</a></li>
<li>
<a href="#"><i class="fas fa-shopping-cart"></i></a>
<span class="cart-num">1</span>
</li>
</ul>
</div>
<ul class="meals">
<li>
<div class="product product-1">
<span class="ribbon"><div class="small">熱銷美食</div></span>
<a href="#"><i class="far fa-heart"></i></a>
</div>
<div class="detail">
<h5>經典漢堡套餐</h5>
<p>Classic Hamburger Package</p>
<span>$120</span>
<a href="#"><i class="fas fa-shopping-cart"></i>加入購物車</a>
</div>
</li>
<li>
<div class="product product-2">
<span class="ribbon"><div class="small">熱銷美食</div></span>
<a href="#"><i class="far fa-heart"></i></a>
</div>
<div class="detail">
<h5>英俊香腸</h5>
<p>Handsome Sausage</p>
<span>$1,024</span>
<a href="#"><i class="fas fa-shopping-cart"></i>加入購物車</a>
</div>
</li>
<li>
<div class="product product-3">
<span class="ribbon"><div class="small">熱銷美食</div></span>
<a href="#"><i class="far fa-heart"></i></a>
</div>
<div class="detail">
<h5>漢堡兄弟</h5>
<p>Hamburg Brothers</p>
<span>$792</span>
<a href="#"><i class="fas fa-shopping-cart"></i>加入購物車</a>
</div>
</li>
<li>
<div class="product product-4">
<span class="ribbon"><div class="small">熱銷美食</div></span>
<a href="#"><i class="far fa-heart"></i></a>
</div>
<div class="detail">
<h5>完美願望</h5>
<p>Dragon Ball Package</p>
<span>$999,999</span>
<a href="#"><i class="fas fa-shopping-cart"></i>加入購物車</a>
</div>
</li>
</ul>
</div>
</div>
<div class="footer clearfix">
<div class="about">
<h5>關於 六角西餐廳</h5>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos a aperiam necessitatibus sunt ex voluptatum vitae beatae, accusantium.</p>
</div>
<div class="contact">
<p>聯絡方式</p>
<ul>
<li>高雄市中正五路到底</li>
<li>+886 886 886</li>
<li>service@hexschool.com</li>
</ul>
</div>
<div class="link">
<a href="index.html"><img src="./images/logo_l(null).svg" alt="六角西餐廳" class="logo"></a>
<ul class="clearfix">
<li><a href="#"><span style="color: #3a5795;"><i class="fab fa-facebook-square"></i></span></a></li>
<li><a href="#"><span style="color: #41abe1;"><i class="fab fa-twitter-square"></i></span></a></li>
<li><a href="#"><span style="color: #db4437;"><i class="fab fa-google-plus-square"></i></span></a></li>
</ul>
</div>
</div>
</div>
</body>
</html>