Skip to content

Commit 5df66e2

Browse files
committed
END UPDET
1 parent b91410c commit 5df66e2

16 files changed

+297
-212
lines changed

404.html

Lines changed: 11 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -69,11 +69,12 @@
6969

7070
<!-- End navbar -->
7171
<!-- error message -->
72-
<div class="error_content">
73-
<div class="error_message">404 Not Found</div>
74-
<p>Your visited page not found. You may go home page.</p>
75-
<!-- <a href="../Home/index.html" class="go_home_bottom">Back to home page</a> -->
76-
<button class="go_home_bottom" onclick="goHome()">Back to home page</button>
72+
<div class="error_wrapper">
73+
<div class="error_content">
74+
<div class="error_message">404 Not Found</div>
75+
<p>Your visited page not found. You may go home page.</p>
76+
<a href="../Home/index.html" class="go_home_bottom">Back to home page</a>
77+
</div>
7778
</div>
7879

7980
<script>
@@ -104,11 +105,11 @@ <h5>Support</h5>
104105
<div class="box">
105106
<h5>Account</h5>
106107
<div class="Account-us">
107-
<a href="./editProfilePage/EditProfilePage.html">My Account</a>
108-
<a href="./login/login.htm" style="display: inline-block;">Login</a> / <a href="./create acount/create.htm"style="display: inline-block;">Register</a>
109-
<a href="">Cart</a>
110-
<a href="">Wishlist</a>
111-
<a href="">Shop</a>
108+
<a href="./index.html">Home</a>
109+
<a href="../login/login.htm" style="display: inline-block;">Login</a> / <a href="../create acount/create.htm" style="display: inline-block;">Register</a>
110+
<a href="../Cart/cart.html">Cart</a>
111+
<a href="../contact_ page/contact.html">Contact</a>
112+
<a href="../about/about.html">About</a>
112113
</div>
113114
</div>
114115
<div class="box">

Cart/cart.html

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -44,21 +44,18 @@
4444
<div class="collapse navbar-collapse" id="navbarSupportedContent">
4545
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
4646
<li class="nav-item">
47-
<a class="nav-link active" aria-current="page" href="../index.html">Home</a>
47+
<a class="nav-link" aria-current="page" href="../index.html">Home</a>
4848
</li>
4949
<li class="nav-item">
5050
<a class="nav-link" href="../contact_ page/contact.html">Contact</a>
5151
</li>
5252
<li class="nav-item">
5353
<a class="nav-link" href="../about/about.html">About</a>
5454
</li>
55-
<li class="nav-item">
56-
<a class="nav-link" href="../create acount/create.htm">Sign up</a>
57-
</li>
5855
</ul>
5956
<form class="d-flex">
6057
<div class="ico">
61-
<a href="./Cart/cart.html"><i class="fa-solid fa-cart-shopping"></i></a>
58+
<a href="./Cart/cart.html" style="color: red;"><i class="fa-solid fa-cart-shopping "></i></a>
6259
</div>
6360

6461
<div class="person">
@@ -112,10 +109,10 @@ <h5>Support</h5>
112109
<h5>Account</h5>
113110
<div class="Account-us">
114111
<a href="../editProfilePage/EditProfilePage.html">My Account</a>
115-
<a href="../login/login.htm" style="display: inline-block;">Login</a> / <a href="../login/login.htm" style="display: inline-block;">Register</a>
116-
<a href="./cart.html">Cart</a>
117-
<a href="">Wishlist</a>
118-
<a href="">Shop</a>
112+
<a href="../login/login.htm" style="display: inline-block;">Login</a> / <a href="../create acount/create.htm" style="display: inline-block;">Register</a>
113+
<a href="../Cart/cart.html">Cart</a>
114+
<a href="../contact_ page/contact.html">Contact</a>
115+
<a href="../about/about.html">About</a>
119116
</div>
120117
</div>
121118
<div class="box">

Checkout/Checkout.css

Lines changed: 172 additions & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,187 @@
11
.aboutus {
2-
margin: 50px 0;
3-
}
4-
.containers {
5-
margin: 0 35px;
6-
padding: 0 10px;
7-
}
8-
.landing {
9-
padding: 0 0 60px;
10-
}
11-
.aboutus .head {
12-
color: #c0c4c8;
13-
margin-bottom: 40px;
14-
}
15-
.aboutus .head a {
16-
text-decoration: none;
17-
color:#c0c4c8 ;
18-
}
19-
.aboutus .head a:hover,
20-
.aboutus .head a:focus,
21-
.aboutus .head .actives {
22-
color: black;
23-
}
2+
margin: 50px 0;
3+
}
4+
5+
.containers {
6+
margin: 0 35px;
7+
padding: 0 10px;
8+
}
9+
10+
.landing {
11+
padding: 0 0 60px;
12+
}
13+
14+
.aboutus .head {
15+
color: #c0c4c8;
16+
margin-bottom: 40px;
17+
}
18+
19+
.aboutus .head a {
20+
text-decoration: none;
21+
color: #c0c4c8;
22+
}
23+
24+
.aboutus .head a:hover,
25+
.aboutus .head a:focus,
26+
.aboutus .head .actives {
27+
color: black;
28+
}
29+
30+
.Box {
31+
display: flex;
32+
max-width: 1000px;
33+
margin: auto;
34+
background: #fff;
35+
padding: 20px;
36+
border-radius: 10px;
37+
}
38+
39+
.form, .order {
40+
flex: 1;
41+
min-width: 300px;
42+
padding: 20px;
43+
}
44+
45+
h2 {
46+
margin-bottom: 20px;
47+
}
48+
49+
form label {
50+
display: block;
51+
margin-top: 15px;
52+
font-weight: bold;
53+
}
54+
55+
form input[type="text"],
56+
form input[type="email"],
57+
form input[type="tel"] {
58+
width: 100%;
59+
padding: 8px;
60+
margin-top: 5px;
61+
border: 1px solid #ccc;
62+
border-radius: 5px;
63+
}
64+
65+
.save {
66+
margin-top: 15px;
67+
}
68+
69+
.order .product {
70+
display: flex;
71+
justify-content: space-between;
72+
margin-bottom: 10px;
73+
}
74+
75+
.total .row {
76+
display: flex;
77+
justify-content: space-between;
78+
margin: 5px 0;
79+
}
80+
81+
.total .total {
82+
font-weight: bold;
83+
border-top: 1px solid #ccc;
84+
margin-top: 10px;
85+
padding-top: 10px;
86+
}
87+
88+
.pay {
89+
margin-top: 20px;
90+
}
91+
92+
.code {
93+
margin-top: 20px;
94+
display: flex;
95+
gap: 10px;
96+
}
97+
98+
.code input {
99+
flex: 1;
100+
padding: 8px;
101+
}
102+
103+
.apply {
104+
padding: 8px 12px;
105+
background: #e74c3c;
106+
color: white;
107+
border: none;
108+
border-radius: 5px;
109+
cursor: pointer;
110+
}
111+
112+
.confirm {
113+
margin-top: 20px;
114+
width: 100%;
115+
padding: 12px;
116+
background: #e74c3c;
117+
color: white;
118+
border: none;
119+
border-radius: 5px;
120+
cursor: pointer;
121+
font-size: 16px;
122+
}
123+
124+
.steps {
125+
text-align: center;
126+
margin-bottom: 30px;
127+
color: #888;
128+
font-size: 14px;
129+
}
130+
131+
.steps a {
132+
text-decoration: none;
133+
color: #444;
134+
}
135+
136+
.steps strong {
137+
color: black;
138+
}
139+
140+
#summary .row {
141+
display: flex;
142+
justify-content: space-between;
143+
align-items: center;
144+
padding: 5px 0;
145+
}
146+
147+
#summary .row.total {
148+
font-weight: bold;
149+
border-top: 1px solid #ccc;
150+
margin-top: 10px;
151+
padding-top: 10px;
152+
}
153+
154+
/* Responsive for Mobile */
155+
@media (max-width: 768px) {
24156
.Box {
25-
display: flex;
26-
max-width: 1000px;
27-
margin: auto;
28-
background: #fff;
29-
padding: 20px;
30-
border-radius: 10px;
157+
flex-direction: column;
158+
padding: 15px;
31159
}
160+
32161
.form, .order {
33-
flex: 1;
34-
min-width: 300px;
35-
padding: 20px;
36-
}
37-
h2 {
38-
margin-bottom: 20px;
39-
}
40-
form label {
41-
display: block;
42-
margin-top: 15px;
43-
font-weight: bold;
44-
}
45-
form input[type="text"],
46-
form input[type="email"],
47-
form input[type="tel"] {
48-
width: 100%;
49-
padding: 8px;
50-
margin-top: 5px;
51-
border: 1px solid #ccc;
52-
border-radius: 5px;
162+
min-width: 100%;
163+
padding: 10px 0;
53164
}
54-
.save {
55-
margin-top: 15px;
56-
}
57-
.order .product {
58-
display: flex;
59-
justify-content: space-between;
60-
margin-bottom: 10px;
61-
}
62-
.total .row {
63-
display: flex;
64-
justify-content: space-between;
65-
margin: 5px 0;
66-
}
67-
.total .total {
68-
font-weight: bold;
69-
border-top: 1px solid #ccc;
70-
margin-top: 10px;
71-
padding-top: 10px;
72-
}
73-
.pay {
74-
margin-top: 20px;
165+
166+
.containers {
167+
margin: 0 15px;
168+
padding: 0 5px;
75169
}
170+
76171
.code {
77-
margin-top: 20px;
78-
display: flex;
79-
gap: 10px;
172+
flex-direction: column;
80173
}
174+
81175
.code input {
82-
flex: 1;
83-
padding: 8px;
176+
width: 100%;
84177
}
178+
85179
.apply {
86-
padding: 8px 12px;
87-
background: #e74c3c;
88-
color: white;
89-
border: none;
90-
border-radius: 5px;
91-
cursor: pointer;
92-
}
93-
.confirm {
94-
margin-top: 20px;
95180
width: 100%;
96-
padding: 12px;
97-
background: #e74c3c;
98-
color: white;
99-
border: none;
100-
border-radius: 5px;
101-
cursor: pointer;
102-
font-size: 16px;
103181
}
104-
.steps {
105-
text-align: center;
106-
margin-bottom: 30px;
107-
color: #888;
182+
183+
.confirm {
108184
font-size: 14px;
185+
padding: 10px;
109186
}
110-
.steps a {
111-
text-decoration: none;
112-
color: #444;
113-
}
114-
.steps strong {
115-
color: black;
116-
}
187+
}

0 commit comments

Comments
 (0)