-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
154 lines (146 loc) · 4.48 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
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Sarah Price Portfolio</title>
<link
href="https://fonts.googleapis.com/css?family=Varela+Round"
rel="stylesheet"
type="text/css"
/>
<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<header class="main-header">
<div class="container">
<h1 class="name" id="Home">Sarah Price</h1>
<ul class="main-nav">
<li><a href="#Home">Home</a></li>
<li><a href="#Portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#">Profile</a></li>
</ul>
</div>
</header>
<!--/.main-header-->
<div class="banner clearfix">
<img
class="logo clearfix"
src="images/responsive-layout-profile.png"
alt="Me"
style="order: 2"
/>
<h1 class="headline"></h1>
<span class="tagline" style="order: 1"
>I'm a front-end developer who loves responsive design and css. I
recently finished learning front-end development at Treehouse and I am
excited to put my skills to use!</span
>
</div>
<!--/.banner-->
<div class="container clearfix">
<h2 id="Portfolio">Portfolio</h2>
<div class="secondary col">
<img
class="img-marketing"
src="images/portfolio-1.png"
alt="marketing site"
/>
<h3>Marketing Page</h3>
<p>
This project shows the front page of a marketing website meant for a
specific business I'm interested in.
</p>
</div>
<!--/.secondary-->
<div class="primary col">
<img
class="img-search"
src="images/portfolio-2.png"
alt="search site"
/>
<h3>Search Page</h3>
<p>
This project searches through a specific database to find information
that the user is trying to look up.
</p>
</div>
<!--/.primary-->
<div class="tertiary col">
<img
class="img-travel"
src="images/portfolio-3.png"
alt="travel site"
/>
<h3>Travel App</h3>
<p>
This project compares travel times based on different transportation
methods and tells you the best one.
</p>
</div>
<!--/.tertiary-->
<!-- </div>
<div class="container clearfix"> -->
<div class="secondary col">
<img class="img-map" src="images/portfolio-4.png" alt="map site" />
<h3>Map of Favorite Spots</h3>
<p>
This project uses apis to plot points for my favorite spots in the
city for a do-it-yourself walking tour,
</p>
</div>
<!--/.secondary-->
<div class="primary col">
<img
class="img-gallery"
src="images/portfolio-5.png"
alt="photo gallery site"
/>
<h3>Photo Gallery</h3>
<p>
This project shows pictures from a recent trip to the viewer and
allows them to easily navigate through the photos.
</p>
</div>
<!--/.primary-->
<div class="tertiary col">
<img
class="img-calculator"
src="images/portfolio-6.png"
alt="calculator site"
/>
<h3>Calculator</h3>
<p>
Someone can enter in the numbers they want and press the big blue
button to get the result.
</p>
</div>
<!--/.tertiary-->
</div>
<footer class="main-footer">
<div class="contact">
<h2 id="contact">Contact</h2>
<p class="contact-info">
If you're interested in chatting or want more information about what
I've been working on, I'd love to hear from you!
</p>
<p>Phone<strong> 000-000-000</strong></p>
</div>
<div class="side-nav">
<div class="container">
<h1 class="nameb"><a href="#">Sarah Price</a></h1>
<ul class="second-nav">
<li><a href="#Home">Home</a></li>
<li><a href="#Portfolio">Portfolio</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#">Profile</a></li>
</ul>
<span class="back"><a href="#Home">Back to Top</a></span>
</div>
</div>
<!--/.main-header-->
</footer>
</body>
</html>