forked from UWFront-End-Cert/html200-adopt-a-dog
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
160 lines (158 loc) · 6.84 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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" >
<title>Adoptadog | Seattle's Premier Dog Adoption Agency</title>
<link rel="stylesheet" href="styles/style.css" >
</head>
<body>
<header >
<a href="#main-content" class="skip-link">Skip to main content</a>
<div class="top-container">
<div class="top-box">
<p>
<a href="index.html"
><img
class="logo-img"
src="images/adoptadog-logo.svg"
alt="Adoptadog logo"
></a>
</p>
<p class="logotext">Seattle’s premier dog adoption agency</p>
</div>
<div class="top-box">
<p><i class="fa fa-shopping-cart fa-2x"></i>$1234.56</p>
<div class="checkout"><a href="checkout.html">Checkout</a></div>
</div>
</div>
</header>
<nav>
<p>
<a href="index.html" class="active">Home</a> /
<a href="catalogue.html">Dogs</a>
/
<a href="blog.html">Blog</a>
</p>
</nav>
<aside >
<h2>From our blog</h2>
<img class="aside_image" src="images/blog-1.jpg" alt="a travler person with a dog on top of a mountain">
<h3>Traveling with your dog</h3>
<p>Iciustiam, et ad quiaes cum que excea sinciendi qui offic temquas doluptios dolupta tiandebis nem ut.</p>
<p><strong><a href="blog.html">Read more ></a></strong></p>
<img class="aside_image" src="images/blog-2.jpg" alt="dog walker with four dogs in a park ">
<h3>How to walk multiple dogs</h3>
<p>Iciustiam, et ad quiaes cum que excea sinciendi qui offic temquas doluptios dolupta tiandebis nem ut.</p>
<p><strong><a href="blog.html">Read more ></a></strong></p>
<img class="aside_image" src="images/blog-3.jpg" alt="a person training a dog ">
<h3>Teach your dog to fetch!</h3>
<p>Iciustiam, et ad quiaes cum que excea sinciendi qui offic temquas doluptios dolupta tiandebis nem ut.</p>
<p><strong><a href="blog.html">Read more ></a></strong></p>
</aside>
<article >
<img src="images/home-intro.jpg" alt="a person with adopted dog" class="img2" srcset="images/home-intro.jpg">
<h1>Adopt a dog</h1>
<p class="articles">
Iduciendisite quo magnatem iuntum quid quaest ea am, tenderumet adis dolenem quidustrum fuga. Faceaquae estioria derum recuptatur, cum volore, undipsa doloreium hillupta aut es ut alitatuscit ommossum haritatur arum qui officae videbiti corporeium faccull oribus es quidignis ipietus explam sus am
</p>
<div class="main-container" >
<div class="dog-container" >
<img width="476" height="284"
src="images/murphy-card.jpg"
alt="murphy is a brown and white dog"
onclick="alert('About this dog: \nName: Murphy\nBreed: Pit bull\nCost to adopt: $123.45')" srcset="images/murphy-card.jpg" >
<h2>Murphy</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
<div class="dog-container">
<img width="476" height="284"
src="images/poppy-card.jpg"
alt="poppy is a white dog"
onclick="alert('About this dog: \nName: Poppy,\nBreed: Shih tzu puppy ,\nCost to adopt: $123.45')" srcset="images/poppy-card.jpg">
<h2>Poppy</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
<div class="dog-container">
<img width="476" height="284"
src="images/jack-card.jpg"
alt="jack is a brown and white dog"
onclick="alert('About this dog: \nName: Jack,\nBreed: Beagle ,\nCost to adopt: $123.45')" srcset="images/jack-card.jpg">
<h2>Jack</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
<div class="dog-container">
<img width="476" height="284"
src="images/duffy-card.jpg"
alt="Duffy is a brown and white dog"
onclick="alert('About this dog: \nName: Duffy,\nBreed: Pit bull ,\nCost to adopt: $123.45')" srcset="images/duffy-card.jpg">
<h2>Duffy</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
<div class="dog-container">
<img width="476" height="284"
src="images/lucas-card.jpg"
alt="lucas is a black dog"
onclick="alert('About this dog: \nName: Lucas,\nBreed: Australian Kelpie ,\nCost to adopt: $123.45')" srcset="images/lucas-card.jpg">
<h2>Lucas</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
<div class="dog-container">
<img width="476" height="284"
src="images/jake-card.jpg"
alt="jake is a brown dog"
onclick="alert('About this dog: \nName: Jake,\nBreed: Labrador Retriever ,\nCost to adopt: $123.45')" srcset="images/jake-card.jpg">
<h2>Jake</h2>
<p><strong>Cost to Adopt:</strong> $123.45</p>
<p>
Corrum volorit iandae nimaxim cum restia volor reicid ut et etur
sunt arum rendae pla endis re ea erum, qui doluptae.
</p>
<button class="adopt-btn">Adopt</button>
</div>
</div>
<div class="large-btn"><a href="catalogue.html">See more dogs</a></div>
</article>
<footer>
<img src="images/adoptadog-logo.svg" alt="adopt a dog logo" >
<p>
Aborpos nisto inci tet aut que volupti beruptiberro to exesseque
invenienihil imaximu scideru ptistiusam consequunt
</p>
<p>
<a href="index.html">Home</a> /
<a href="catalogue.html">Dogs</a>
/
<a href="contact.html">Contact</a>
</p>
<p>
© 2018 Adoptadog, LLC | Seattle, WA
</p>
</footer>
</body>
</html>