Skip to content

Commit 237774e

Browse files
Revised final project to reflect slide presentation updates to HTML & CSS.
1 parent 5568ad5 commit 237774e

File tree

6 files changed

+431
-253
lines changed

6 files changed

+431
-253
lines changed

project/final/about.html

Lines changed: 16 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -2,22 +2,17 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Jane Smith</title>
5+
<title>Jane Smith | About Me</title>
66
<link href='http://fonts.googleapis.com/css?family=Nixie+One|Open+Sans:300|Pacifico' rel='stylesheet' type='text/css'>
7-
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
8-
<link href="css/final.css" rel="stylesheet">
7+
<link rel="stylesheet" href="css/final.css">
98
<link rel="shortcut icon" href="favicon.ico">
109
</head>
11-
<body class="about">
12-
13-
<div class="wrapper">
14-
15-
<!-- HEADER -->
10+
<body>
11+
<div class="page-wrap">
1612
<header>
1713
<h1><span class="highlight">Jane</span>Smith</h1>
18-
<h2>Web Developer <span class="highlight">+</span> City Girl</h2>
14+
<h2>Web Developer + City Girl</h2>
1915

20-
<!-- NAV -->
2116
<nav>
2217
<ul>
2318
<li><a href="index.html">Home</a></li>
@@ -27,33 +22,25 @@ <h2>Web Developer <span class="highlight">+</span> City Girl</h2>
2722
</nav>
2823
</header>
2924

30-
<section class="cf">
31-
<img class="profile-image" src="images/profile.jpg" alt="description of image">
25+
<section>
26+
<img class="profile-img" src="images/profile.jpg" alt="description of image">
27+
3228
<h2>Hello!</h2>
29+
3330
<p>[Personal summary or life story here] Lorem ipsum dolor sit amet, consectetur adipisicing elit. Debitis laboriosam officia blanditiis tempora sit fugiat molestiae iusto impedit ipsa cum, asperiores laborum, esse, doloribus explicabo! Autem, distinctio provident itaque non.</p>
3431
<p>Links to stuff about you, if needed. <a href="#">Link example</a> and <a href="#">another link example</a>.</p>
3532
<p>Or another paragraph! Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque maiores dolor id voluptatibus iure eum hic similique, cum impedit possimus nesciunt deleniti atque fugiat. Nesciunt in ipsum voluptatem debitis nihil!</p>
3633

37-
<blockquote>
38-
<p>The more that you read, the more things you will know. The more that you learn, the more places you'll go.</p>
39-
<cite>― Dr. Seuss, I Can Read With My Eyes Shut!</cite>
34+
<blockquote class="quote">
35+
<p>The more that you read, the more things you will know. The more that you learn, the more places you'll go.</p>
36+
<cite>― Dr. Seuss, I Can Read With My Eyes Shut!</cite>
4037
</blockquote>
4138
</section>
42-
43-
</div><!-- close wrapper -->
44-
39+
</div><!-- close .page-wrap -->
40+
4541
<footer>
46-
<p class="copyright">&#169; 2014 <span class="cursive">by</span><span class="highlight">jane</span>smith</p>
47-
48-
<div class="social">
49-
<a href="#" title="Twitter"><i class="fa fa-twitter"></i></a>
50-
<a href="#" title="LinkedIn"><i class="fa fa-linkedin"></i></a>
51-
<a href="#" title="Instagram"><i class="fa fa-instagram"></i></a>
52-
<a href="#" title="Facebook"><i class="fa fa-facebook"></i></a>
53-
<a href="#" title="Google+"><i class="fa fa-google-plus"></i></a>
54-
</div>
55-
</footer>
56-
42+
<p>&#169; 2014 <span class="cursive">by</span> <span class="highlight">jane</span>smith</p>
43+
</footer>
5744
</body>
5845
</html>
5946

project/final/contact.html

Lines changed: 26 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,17 @@
22
<html lang="en">
33
<head>
44
<meta charset="UTF-8">
5-
<title>Jane Smith</title>
5+
<title>Jane Smith | Contact Me</title>
66
<link href='http://fonts.googleapis.com/css?family=Nixie+One|Open+Sans:300|Pacifico' rel='stylesheet' type='text/css'>
7-
<link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
8-
<link href="css/final.css" rel="stylesheet">
7+
<link rel="stylesheet" href="css/final.css">
98
<link rel="shortcut icon" href="favicon.ico">
109
</head>
1110
<body class="contact">
12-
<div class="wrapper">
13-
<!-- HEADER -->
11+
<div class="page-wrap">
1412
<header>
1513
<h1><span class="highlight">Jane</span>Smith</h1>
16-
<h2>Web Developer <span class="highlight">+</span> City Girl</h2>
17-
<!-- NAV -->
14+
<h2>Web Developer + City Girl</h2>
15+
1816
<nav>
1917
<ul>
2018
<li><a href="index.html">Home</a></li>
@@ -23,41 +21,32 @@ <h2>Web Developer <span class="highlight">+</span> City Girl</h2>
2321
</ul>
2422
</nav>
2523
</header>
26-
27-
<section>
2824

29-
<form action="http://forms.brace.io/hello@your-email.com" method="POST">
25+
<section>
26+
<form class="contact-form" method="POST" action="" >
3027
<h2>Let's meet for coffee!</h2>
31-
32-
<p>Send me a message at <a href="mailto:hello@your-email.com">hello@your-email.com</a>, use the form below or say "hi!" on one of my social networks.</p>
28+
29+
<p>Send me a message at <a href="mailto:hello@your-email.com">hello@your-email.com</a>,
30+
use the form below or say "hi!" on one of my social networks.</p>
3331
<p>
3432
<label for="name">Name</label>
35-
<input id="name" type="text" name="name">
33+
<input id="name" type="text" name="name">
3634
</p>
37-
<p>
38-
<label for="email">Email</label>
39-
<input id="email" type="email" name="replyto">
40-
</p>
41-
<p>
42-
<label for="message">Message</label>
43-
<textarea id="message" name="message"></textarea>
44-
</p>
45-
<input type="submit" value="SEND">
46-
</form>
47-
35+
<p>
36+
<label for="email">Email</label>
37+
<input id="email" type="email" name="replyto">
38+
</p>
39+
<p>
40+
<label for="message">Message</label>
41+
<textarea id="message" name="message"></textarea>
42+
</p>
43+
<input type="submit" value="SEND">
44+
</form>
4845
</section>
49-
50-
</div>
46+
</div><!-- close .page-wrap -->
47+
5148
<footer>
52-
<p class="copyright">&#169; 2014 <span class="cursive">by</span><span class="highlight">jane</span>smith</p>
53-
54-
<div class="social">
55-
<a href="#" title="Twitter"><i class="fa fa-twitter"></i></a>
56-
<a href="#" title="LinkedIn"><i class="fa fa-linkedin"></i></a>
57-
<a href="#" title="Instagram"><i class="fa fa-instagram"></i></a>
58-
<a href="#" title="Facebook"><i class="fa fa-facebook"></i></a>
59-
<a href="#" title="Google+"><i class="fa fa-google-plus"></i></a>
60-
</div>
61-
</footer>
49+
<p>&#169; 2014 <span class="cursive">by</span> <span class="highlight">jane</span>smith</p>
50+
</footer>
6251
</body>
63-
</html>
52+
</html>

0 commit comments

Comments
 (0)