Skip to content

Commit fd98c5c

Browse files
authoredJul 29, 2020
Add files via upload
0 parents  commit fd98c5c

6 files changed

+153
-0
lines changed
 

‎README.md

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
# Olivia_Woodruff_Webpage

‎index.html

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>Olivia Woodruff</title>
8+
<link rel="stylesheet" href="style.css" type="text/css">
9+
</head>
10+
<body>
11+
<header class="container">
12+
<div class="container blue-box">
13+
<div class="container photo-frame">
14+
<img class="image" src="travel.jpeg" alt="hicker woman looking at the landscape">
15+
</div><!--container photo-->
16+
<div class="container about-me-box">
17+
<h1>Olivia Woodruff</h1>
18+
<h2>Photographer</h2>
19+
<p class="about-me">I am a developer specializing in HTML and CSS.
20+
I like to run, bike, and make coffee using an Aeropress.</p>
21+
</div>
22+
</div><!--container blue-box-->
23+
</header>
24+
<section class="projects">
25+
<h2>Projects</h2>
26+
<h3>Web Development projects</h3>
27+
<ul>
28+
<li><a href="#"></a>Cofee Brur</li>
29+
<li><a href="#"></a>Taco Finder</li>
30+
<li><a href="#"></a>CSS Selector Finder</li>
31+
<li><a href="#"></a>HTML Formatter</li>
32+
</ul>
33+
<h3>Design Projects</h3>
34+
<ul>
35+
<li><a href="#"></a>Baby Shark interactive game</li>
36+
<li><a href="#"></a>Yum Yum Fudge Inc.</li>
37+
<li><a href="#"></a>University of Marimont Dance Marathon</li>
38+
</ul>
39+
</section>
40+
<footer>
41+
<h2>Contact Info</h2>
42+
<p>Find me on <a href="#">Twitter</a>, <a href="#">Facebook</a>, and <a href="#">Github</a></p>
43+
</footer>
44+
</body>
45+
</html>

‎original_index.html

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<html lang="en" dir="ltr">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>Olivia Woodruff</title>
6+
<link href="original_style.css" type="text/css" rel="stylesheet">
7+
</head>
8+
9+
<body>
10+
<div class="header">
11+
<img src="https://s3.amazonaws.com/codecademy-content/courses/freelance-1/unit-2/travel.jpeg" />
12+
<h1>Olivia Woodruff</h1>
13+
<p class="about-me">I am a developer specializing in HTML and CSS. I like to run, bike, and make coffee using an Aeropress.</p>
14+
</div>
15+
16+
<h2>Projects</h2>
17+
<p class="title">Web Development projects</p>
18+
<ul>
19+
<li>Coffee Brur</li>
20+
<li>Taco Finder</li>
21+
<li>CSS Selector Finder</li>
22+
<li>HTML Formatter</li>
23+
</ul>
24+
25+
<p class="title">Design projects</p>
26+
<ul>
27+
<li>Yum Yum Fudge Inc.</li>
28+
<li>University of Marimont Dance Marathon</li>
29+
</ul>
30+
<h2>Contact</h2>
31+
<p>Find me on Twitter, Dribbble, and GitHub.</p>
32+
33+
<h6>&copy; Copyright. All Rights Reserved.</h6>
34+
</body>
35+
36+
</html>

‎original_style.css

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
.header{
2+
background-color: CornflowerBlue;
3+
text-align: center;
4+
}
5+
6+
.about-me {
7+
font-size: 20px;
8+
opacity: 0.5;
9+
}
10+
11+
.title {
12+
font-weight: bold;
13+
}
14+
15+
h1 {
16+
color: Azure;
17+
}
18+
19+
body {
20+
font-family: Georgia;
21+
background-image: url("https://s3.amazonaws.com/codecademy-content/courses/learn-css-selectors-visual-rules/hypnotize_bg.png");
22+
}

‎style.css

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
2+
body{
3+
font-family: Georgia, serif;
4+
width: 60%;
5+
margin: 0 auto;
6+
justify-content: center;
7+
}
8+
9+
h1 { font-size: 2em;
10+
color: azure;}
11+
h2 { font-size: 1.5em; }
12+
h3 { font-size: 1em; }
13+
14+
.container{
15+
display: flex;
16+
flex-direction: column;
17+
}
18+
19+
.about-me {
20+
font-size: 1.5em;
21+
opacity: 0.5;
22+
}
23+
24+
.image{
25+
position: relative;
26+
top:30px;
27+
box-sizing: border-box;
28+
width: 70%;
29+
height: auto;
30+
margin: 0 auto;
31+
border: 15px solid azure;
32+
}
33+
34+
.blue-box{
35+
position:relative;
36+
background-color: CornflowerBlue;
37+
text-align: center;
38+
margin: 0 auto;
39+
}
40+
41+
/*
42+
.photo-phrame{
43+
border: 20px
44+
background-color: white;
45+
padding: 20px 20px;
46+
height: auto;
47+
margin: 0 auto;
48+
}
49+
*/

‎travel.jpeg

32.4 KB
Loading

0 commit comments

Comments
 (0)
Please sign in to comment.