5/9/25, 6:17 PM account.
html
account.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <title>Account - RedStore | Ecommerce Website Design</title>
7 <link rel="stylesheet" href="style.css">
8 <link href="https://fonts.googleapis.com/css2?
family=Poppins:wght@200;300;400;500;600;700;800&display=swap" rel="stylesheet">
9 <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-
awesome/4.7.0/css/font-awesome.min.css">
10 </head>
11 <body>
12 <div class="container">
13 <div class="navbar">
14 <div class="logo">
15 <a href="index.html"><img src="images/logo.png" width="125px"></a>
16 </div>
17 <nav>
18 <ul id="MenuItems">
19 <li><a href="index.html">Home</a></li>
20 <li><a href="products.html">Products</a></li>
21 <li><a href="">About</a></li>
22 <li><a href="">Contact</a></li>
23 <li><a href="account.html">Account</a></li>
24 </ul>
25 </nav>
26 <a href="cart.html"><img src="images/cart.png" width="30px" height="30px">
</a>
27 <img src="images/menu.png" onclick="menutoggle()" class="menu-icon">
28 </div>
29
30
31 </div>
32
33
34 <!--------------Cart Items details--------------->
35 <div class="accout-page">
36 <div class="container">
37
38 <div class="row">
39
40 <div class="col-2">
41 <img src="images/image1.png" width="100%">
42 </div>
43
44 <div class="col-2">
45 <div class="form-container">
46 <div class="form-btn">
47 <span onclick="login()">Login</span>
48 <span onclick="register()">Register</span>
49 <hr id="indicator">
localhost:61187/b8abfaf6-d1f5-41e1-a153-b898d32c8ec5/ 1/3
5/9/25, 6:17 PM account.html
50 </div>
51
52 <form id="LoginForm">
53 <input type="text" placeholder="username">
54 <input type="password" placeholder="Password">
55 <button type="submit" class="btn">Login</button>
56 <a href="">Forgot password</a>
57 </form>
58
59 <form id="RegForm">
60 <input type="text" placeholder="username">
61 <input type="email" placeholder="Email">
62 <input type="password" placeholder="Password">
63 <button type="submit" class="btn">Register</button>
64 </form>
65 </div>
66 </div>
67 </div>
68 </div>
69 </div>
70
71 <!----------Footer--------------->
72
73 <div class="footer">
74 <div class="container">
75 <div class="row">
76 <div class="footer-col1">
77 <h3>Download Our App</h3>
78 <p>Download App for Android and ios mobile phone.</p>
79 <div class="app-logo">
80 <img src="images/play-store.png">
81 <img src="images/app-store.png">
82 </div>
83 </div>
84 <div class="footer-col2">
85 <img src="images/logo-white.png">
86 <p>Our Purpose Is To Sustainably Make the Pleasure and Benefits of Sports
Accessible to the Many.</p>
87 </div>
88 <div class="footer-col3">
89 <h3>Useful Links</h3>
90 <ul>
91 <li>Coupons</li>
92 <li>Blog Post</li>
93 <li>Return Policy</li>
94 <li>Join Affiliate</li>
95 </ul>
96 </div>
97 <div class="footer-col4">
98 <h3>Follow Us</h3>
99 <ul>
100 <li>Facebook</li>
101 <li>Twitter<li>
102 <li>Instagram</li>
localhost:61187/b8abfaf6-d1f5-41e1-a153-b898d32c8ec5/ 2/3
5/9/25, 6:17 PM account.html
103 <li>YouTube</li>
104 </ul>
105 </div>
106 </div>
107 <hr>
108 <p class="copyright"><a href="https://www.youtube.com/c/EasyTutorialsVideo?
sub_confirmation=1">Copyright 2020 - Easy Tutorials</a></p>
109 </div>
110 </div>
111
112 <!-------------js for toggle menu-------------->
113
114 <script>
115 var MenuItems = document.getElementById("MenuItems");
116
117 MenuItems.style.maxHeight = "0px";
118
119 function menutoggle()
120 {
121 if(MenuItems.style.maxHeight == "0px")
122 {
123 MenuItems.style.maxHeight = "200px";
124 }else
125 {
126 MenuItems.style.maxHeight = "0px"
127 }
128 }
129
130 </script>
131 <!------------------- form toggle ----------->
132 <script>
133 var LoginForm = document.getElementById("LoginForm");
134 var RegForm = document.getElementById("RegForm");
135 var Indicator = document.getElementById("indicator");
136
137 function register(){
138 RegForm.style.transform = "translateX(0px)";
139 LoginForm.style.transform = "translateX(0px)";
140 Indicator.style.transform = "translateX(100px)"
141 };
142 function login(){
143 RegForm.style.transform = "translateX(300px)";
144 LoginForm.style.transform = "translateX(300px)";
145 Indicator.style.transform = "translateX(0px)"
146 };
147
148 </script>
149
150
151
152 </body>
153 </html>
154
155
localhost:61187/b8abfaf6-d1f5-41e1-a153-b898d32c8ec5/ 3/3
