-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
135 lines (116 loc) · 4.31 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>Ladies Learning Code - Mobile Web</title>
<!-- Exercise #4 -->
<link rel='stylesheet' href='desktop.css' media='screen' />
<!-- Exercise #4 this is an HTML comment -->
<!-- Exercise #8 -->
<!-- Exercise #12 -->
</head>
<body>
<div class='container'>
<!-- The header. The top of the website -->
<div class='header'>
</div>
<!-- Exercise #10 -->
<!-- The sidebar -->
<div class='sidebar'>
<div class='categories'>
<h3>Categories</h3>
<ul class='categories'>
<li><a href='#candy'>Candy</a></li>
<li><a href='#apparel'>Apparel</a></li>
<li><a href='#mugs'>Mugs</a></li>
<li><a href='#puppies'>Puppies</a></li>
<li><a href='#'>Kitties</a></li>
<li><a href='#'>Magnets</a></li>
<li><a href='#'>Pens</a></li>
<li><a href='#'>Ties</a></li>
<li><a href='#'>Trousers</a></li>
<li><a href='#'>Shoes</a></li>
<li><a href='#'>Cute things</a></li>
</ul>
</div> <!-- end categories -->
<div class='cart'>
<h3>Your Cart</h3>
<ul class='items'>
<li>
<img src='images/items/fake_item_1_cart.png' />
<div class='item-info'>
<h4>LLC T-Shirt</h4>
<p>$10.00</p>
</div>
</li>
<li>
<img src='images/items/fake_item_1_cart.png' />
<div class='item-info'>
<h4>Smiles</h4>
<p>FREE</p>
</div>
</li>
</ul>
</div> <!-- end cart -->
</div> <!-- end sidebar -->
<div class='content'>
<h1>Ladies Learning Code Shop</h1>
<p>Welcome to the fictitious Ladies Learning Code shopping site!</p>
<p>There are lots of great items not available for purchase below!</p>
<p class='using-desktop'>You are using a desktop to browse the shop.</p>
<p class='using-mobile'>You are using a mobile device to browse the shop.</p>
<!-- Exercise #13 -->
<hr class='divider' />
<!-- Candy -->
<h3>Candy</h3>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Mints</h4>
<p>Mints that make your breath fresher. Eat some while coding to improve concentration!</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Chocolate</h4>
<p>Chocolate is amazing. Everyone knows that.</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Lovely Item #3</h4>
<p>A great item with lots of cool swag value.</p>
</div>
<!-- end Candy -->
<!-- Apparel -->
<h3>Apparel</h3>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>LLC T-Shirt</h4>
<p>Show your Ladies Learning Code pride! A lovely t-shirt in black with the Ladies Learning Code logo.</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Lovely Item #1</h4>
<p>A great item with lots of cool swag value.</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Lovely Item #1</h4>
<p>A great item with lots of cool swag value.</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Lovely Item #1</h4>
<p>A great item with lots of cool swag value.</p>
</div>
<div class='item'>
<img src='images/items/fake_item_1.png' />
<h4>Lovely Item #1</h4>
<p>A great item with lots of cool swag value.</p>
</div>
<!-- end Apparel -->
</div> <!-- closing content div -->
<!-- Footer -->
<div class='footer'>
<p>© Ladies Learning Code 2012</p>
</div>
</div> <!-- end container -->
</body>
</html>