Skip to content

Commit 16c015a

Browse files
SuperSimpleDevSuperSimpleDev
committed
Add starting code for the project
0 parents  commit 16c015a

File tree

119 files changed

+3063
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

119 files changed

+3063
-0
lines changed

‎amazon.html

+205
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,205 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Amazon Project</title>
5+
6+
<!-- This code is needed for responsive design to work.
7+
(Responsive design = make the website look good on
8+
smaller screen sizes like a phone or a tablet). -->
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
11+
<!-- Load a font called Roboto from Google Fonts. -->
12+
<link rel="preconnect" href="https://fonts.googleapis.com">
13+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
14+
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap" rel="stylesheet">
15+
16+
<!-- Here are the CSS files for this page. -->
17+
<link rel="stylesheet" href="styles/shared/general.css">
18+
<link rel="stylesheet" href="styles/shared/amazon-header.css">
19+
<link rel="stylesheet" href="styles/pages/amazon.css">
20+
</head>
21+
<body>
22+
<div class="amazon-header">
23+
<div class="amazon-header-left-section">
24+
<a href="amazon.html" class="header-link">
25+
<img class="amazon-logo"
26+
src="images/amazon-logo-white.png">
27+
<img class="amazon-mobile-logo"
28+
src="images/amazon-mobile-logo-white.png">
29+
</a>
30+
</div>
31+
32+
<div class="amazon-header-middle-section">
33+
<input class="search-bar" type="text" placeholder="Search">
34+
35+
<button class="search-button">
36+
<img class="search-icon" src="images/icons/search-icon.png">
37+
</button>
38+
</div>
39+
40+
<div class="amazon-header-right-section">
41+
<a class="orders-link header-link" href="orders.html">
42+
<span class="returns-text">Returns</span>
43+
<span class="orders-text">& Orders</span>
44+
</a>
45+
46+
<a class="cart-link header-link" href="checkout.html">
47+
<img class="cart-icon" src="images/icons/cart-icon.png">
48+
<div class="cart-quantity">3</div>
49+
<div class="cart-text">Cart</div>
50+
</a>
51+
</div>
52+
</div>
53+
54+
<div class="main">
55+
<div class="products-grid">
56+
<div class="product-container">
57+
<div class="product-image-container">
58+
<img class="product-image"
59+
src="images/products/athletic-cotton-socks-6-pairs.jpg">
60+
</div>
61+
62+
<div class="product-name limit-text-to-2-lines">
63+
Black and Gray Athletic Cotton Socks - 6 Pairs
64+
</div>
65+
66+
<div class="product-rating-container">
67+
<img class="product-rating-stars"
68+
src="images/ratings/rating-45.png">
69+
<div class="product-rating-count link-primary">
70+
87
71+
</div>
72+
</div>
73+
74+
<div class="product-price">
75+
$10.90
76+
</div>
77+
78+
<div class="product-quantity-container">
79+
<select>
80+
<option selected value="1">1</option>
81+
<option value="2">2</option>
82+
<option value="3">3</option>
83+
<option value="4">4</option>
84+
<option value="5">5</option>
85+
<option value="6">6</option>
86+
<option value="7">7</option>
87+
<option value="8">8</option>
88+
<option value="9">9</option>
89+
<option value="10">10</option>
90+
</select>
91+
</div>
92+
93+
<div class="product-spacer"></div>
94+
95+
<div class="added-to-cart">
96+
<img src="images/icons/checkmark.png">
97+
Added
98+
</div>
99+
100+
<button class="add-to-cart-button button-primary">
101+
Add to Cart
102+
</button>
103+
</div>
104+
105+
<div class="product-container">
106+
<div class="product-image-container">
107+
<img class="product-image"
108+
src="images/products/intermediate-composite-basketball.jpg">
109+
</div>
110+
111+
<div class="product-name limit-text-to-2-lines">
112+
Intermediate Size Basketball
113+
</div>
114+
115+
<div class="product-rating-container">
116+
<img class="product-rating-stars"
117+
src="images/ratings/rating-40.png">
118+
<div class="product-rating-count link-primary">
119+
127
120+
</div>
121+
</div>
122+
123+
<div class="product-price">
124+
$20.95
125+
</div>
126+
127+
<div class="product-quantity-container">
128+
<select>
129+
<option selected value="1">1</option>
130+
<option value="2">2</option>
131+
<option value="3">3</option>
132+
<option value="4">4</option>
133+
<option value="5">5</option>
134+
<option value="6">6</option>
135+
<option value="7">7</option>
136+
<option value="8">8</option>
137+
<option value="9">9</option>
138+
<option value="10">10</option>
139+
</select>
140+
</div>
141+
142+
<div class="product-spacer"></div>
143+
144+
<div class="added-to-cart">
145+
<img src="images/icons/checkmark.png">
146+
Added
147+
</div>
148+
149+
<button class="add-to-cart-button button-primary">
150+
Add to Cart
151+
</button>
152+
</div>
153+
154+
<div class="product-container">
155+
<div class="product-image-container">
156+
<img class="product-image"
157+
src="images/products/adults-plain-cotton-tshirt-2-pack-teal.jpg">
158+
</div>
159+
160+
<div class="product-name limit-text-to-2-lines">
161+
Adults Plain Cotton T-Shirt - 2 Pack
162+
</div>
163+
164+
<div class="product-rating-container">
165+
<img class="product-rating-stars"
166+
src="images/ratings/rating-45.png">
167+
<div class="product-rating-count link-primary">
168+
56
169+
</div>
170+
</div>
171+
172+
<div class="product-price">
173+
$7.99
174+
</div>
175+
176+
<div class="product-quantity-container">
177+
<select>
178+
<option selected value="1">1</option>
179+
<option value="2">2</option>
180+
<option value="3">3</option>
181+
<option value="4">4</option>
182+
<option value="5">5</option>
183+
<option value="6">6</option>
184+
<option value="7">7</option>
185+
<option value="8">8</option>
186+
<option value="9">9</option>
187+
<option value="10">10</option>
188+
</select>
189+
</div>
190+
191+
<div class="product-spacer"></div>
192+
193+
<div class="added-to-cart">
194+
<img src="images/icons/checkmark.png">
195+
Added
196+
</div>
197+
198+
<button class="add-to-cart-button button-primary">
199+
Add to Cart
200+
</button>
201+
</div>
202+
</div>
203+
</div>
204+
</body>
205+
</html>

0 commit comments

Comments
 (0)