-
Notifications
You must be signed in to change notification settings - Fork 2
/
myOrders.html
142 lines (139 loc) · 4.88 KB
/
myOrders.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>My Orders</title>
<link href="css/bootstrap.css" rel="stylesheet" />
<!-- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" /> -->
<link href="css/font-awesome.css" rel="stylesheet" />
<link href="css/all.css" rel="stylesheet" />
<link rel="stylesheet" href="./css/productdetalis.css" />
<link rel="stylesheet" href="./css/productCatalog.css" />
<link rel="stylesheet" href="css/style.css" />
<style>
.empty {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 30px;
}
.empty button {
background-color: white;
border: 1px solid black;
border-radius: 5px;
font-size: 20px;
padding: 10px 20px;
transition: 0.3s;
}
.empty button:hover {
background-color: black;
color: white;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-sm navbar-light border-bottom">
<div class="container-fluid">
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarText"
aria-controls="navbarText"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<span class="navbar-text d-none d-md-block welcoming__message">
Welcome to Topico
</span>
<div
class="collapse navbar-collapse justify-content-around justify-content-md-end"
id="navbarText"
>
<ul class="navbar-nav">
<li class="nav-item">
<a
class="nav-link preventIfLogOut"
aria-current="page"
href="myAccount.html"
>My Account
</a>
</li>
<li class="nav-item">
<a class="nav-link preventIfLogOut" href="wishList.html"
>My Wishlist</a
>
</li>
<li class="nav-item">
<a class="nav-link user__check" href="login.html">Sign In</a>
</li>
<li class="nav-item">
<a class="nav-link preventIfLogOut" href="myOrders.html"
>My orders</a
>
</li>
</ul>
</div>
</div>
<!-- end container fluid -->
</nav>
<!-- end navbar -->
<section class="breadcrumb__area box-plr-75">
<div class="container-fluid">
<div class="row">
<div class="col-xxl-12">
<div class="breadcrumb_wrraper">
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item">
<a href="checkout.html">Checkout</a>
</li>
<li
class="breadcrumb-item breadcrumb__item--avtive"
aria-current="page"
>
My Orders
</li>
</ol>
</nav>
</div>
</div>
</div>
</div>
</section>
<div class="container mt-5">
<h2>My Orders</h2>
<div class="table-responsive">
<table class="table table-bordered">
<thead class="thead-light">
<tr>
<th class="d-none d-md-table-cell">Order ID</th>
<th class="d-none d-md-table-cell">Order Date</th>
<th>Total Price</th>
<th>Tracking Status</th>
</tr>
</thead>
<tbody></tbody>
</table>
<div class="empty">
<button id="backHomeBtn">Go Home</button>
</div>
</div>
</div>
<script>
const backHomeBtn = document.getElementById("backHomeBtn");
backHomeBtn.addEventListener("click", () => {
window.location.href = "../index.html";
});
</script>
<!-- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> -->
<!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-B4gt1jrGC7Jh4AgEPkEYnDd/9+YkG8X4FwW9OUj1qKxr13Aq0LGhz4+30JwVhnbb" crossorigin="anonymous"></script> -->
<!-- <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js" integrity="sha384-B4gt1jrGC7Jh4AgEPkEYnDd/9+YkG8X4FwW9OUj1qKxr13Aq0LGhz4+30JwVhnbb" crossorigin="anonymous"></script> -->
<script src="js/JQuery-3.3.1.js"></script>
<script src="js/bootstrap.bundle.js"></script>
<script type="module" src="./js/myOrders.js"></script>
</body>
</html>