Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

adds some styling #29

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
80 changes: 80 additions & 0 deletions about.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Oh, Hey Mary</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/about.css">
<link href="styles/normalize.css" rel="stylesheet" />
</head>

<body>
<nav>
<ul class="navbar">
<li><a href="index.html">Home</a></li>
<li><a href="portfolio.html">Code Life</a></li>
<li><a href="code-journal.html">Non Code Life</a></li>
</ul>
</nav>

<section class="container">
<section class="intro">
<img src="http://placecage.com/g/200/200" />
<h2>Mary Lamkin</h2>
<p>
Ada Dev Academy student; PNW Jersey girl; lover of animals, hats, ultimate frisbee, food, and games
</p>
</section>

<section class="career">
<h3>pre ada career</h3>
<p>
Suspendisse convallis est sem, sed luctus nulla tristique at. Morbi at tellus urna. Curabitur venenatis odio id augue maximus, feugiat aliquet felis tristique. Etiam risus nisi, iaculis in libero ut, placerat interdum ligula. Donec semper quam et porttitor
tincidunt. Praesent diam diam, egestas vel nibh et, tincidunt tincidunt justo. Etiam at sem diam. Nunc consectetur ipsum at est accumsan, vitae bibendum odio eleifend. Morbi blandit nibh leo. Ut tristique dolor a quam hendrerit convallis. Nulla
non eros eu orci finibus lobortis id ut nisl. Etiam tempor mauris purus, sed vehicula mi commodo non. In hac habitasse platea dictumst. Donec eleifend, mauris non rhoncus porttitor, lacus purus molestie lorem, dignissim ornare eros eros fermentum
diam. Vestibulum ac justo cursus, faucibus nibh ac, ornare sapien.
</p>
</section>

<section class="jersey">
<h3>pre career life</h3>
<p>
Cras pellentesque ex eget quam interdum, eget tempus mi gravida. Phasellus a turpis vel ex dapibus condimentum. Nam sodales fringilla nisl quis consequat. Fusce rhoncus tempor mollis. Vivamus quam orci, commodo id mauris commodo, auctor egestas lacus.
Vivamus vitae quam imperdiet, fermentum magna non, lacinia erat. Sed eu egestas metus, sed efficitur nulla. Aliquam vitae tincidunt odio.
</p>
<p>
Proin eget justo enim. Donec eget cursus quam. Nunc tempor nisl vitae feugiat lobortis. Sed eget pharetra mauris, non interdum orci. Vivamus dictum nisl dui, vel ultrices quam congue eu. Vivamus pellentesque ligula eu lectus lacinia suscipit. Nam molestie
nisl sapien, non sagittis libero ullamcorper eu. Duis lobortis auctor diam, nec aliquet justo rutrum vitae.
</p>
</section>

<section class="dixie">
<h3>dixie lee</h3>
<img src="http://placecage.com/g/100/100" />
<p>
Dixie is the greatest dog who ever lived. Proin eget justo enim. Donec eget cursus quam. Nunc tempor nisl vitae feugiat lobortis. Sed eget pharetra mauris, non interdum orci. Vivamus dictum nisl dui, vel ultrices quam congue eu. Vivamus pellentesque ligula eu lectus lacinia suscipit.
</p>
</section>
</section>

<footer>
<nav>
<ul>
<li>
<a href="https://twitter.com"><img src="images/logo-twitter.png"/></a>
</li>
<li>
<a href="https://facebook.com"><img src="images/logo-facebook.png"/></a>
</li>
<li>
<a mailto="mailto:[email protected]">email</a>
</li>
<li <a href="https://github.com">github</a>
</li>
</ul>

</nav>
</body>

</html>
93 changes: 93 additions & 0 deletions code-journal.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Oh, Hey Mary</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/code-journal.css">
<link href="styles/normalize.css" rel="stylesheet" />
</head>

<body>
<nav>
<ul class="navbar">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About Me</a></li>
<li><a href="portfolio.html">Code Life</a></li>
</ul>
</nav>

<section class="grid">
<section>
<h3>ultimate</h3>
<p>
ultimate is great and I do it a lot.
</p>
<img src="http://fillmurray.com/g/150/150" alt="team photo" />
<p>
Donec aliquet sodales mi sit amet semper. Aliquam erat volutpat. Donec mollis feugiat nisl vitae vulputate. Sed ut consectetur ipsum. Vivamus nec commodo erat, vitae condimentum justo. Morbi elit ligula, euismod at ex eu, laoreet gravida felis. Cras aliquet
dui eget faucibus venenatis.
</p>

</section>

<section>
<h3>food</h3>
<img src="http://baconmockup.com/300/200" />
<p>
food is soooooo amaze
</p>
<p>
Donec aliquet sodales mi sit amet semper. Aliquam erat volutpat. Donec mollis feugiat nisl vitae vulputate. Sed ut consectetur ipsum. Vivamus nec commodo erat, vitae condimentum justo. Morbi elit ligula, euismod at ex eu, laoreet gravida felis. Cras aliquet
dui eget faucibus venenatis.
</p>
</section>

<section>
<h3>travel</h3>
<p>
just keep swimming
</p>
<img src="http://placekitten.com/g/200/200" alt="pic of some cool place" />
<p>
Donec condimentum viverra libero eu auctor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque quis facilisis nibh. Integer eu tincidunt erat. Nunc eget augue vel tellus dapibus tristique ac at mi.
In sit amet porttitor ex, accumsan ultrices arcu. Pellentesque eget augue facilisis, luctus leo non, rhoncus mauris. Etiam pellentesque lorem sit amet porta volutpat. Nulla semper sollicitudin posuere. In sed turpis et elit euismod vulputate.
Praesent sollicitudin tempor vulputate.
</p>

</section>

<section>
<h3>games</h3>
<p>
games all day erry day
</p>
<p>
Morbi aliquam pellentesque placerat. Proin non dui condimentum, blandit tellus sed, consectetur est. Aliquam ultrices hendrerit neque, vel dictum tellus elementum quis. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
Sed nec feugiat tellus. Fusce vitae lectus eros. Nulla id massa quam. Aenean fringilla, nunc vel commodo tempus, urna dui laoreet mi, sollicitudin dictum nisi risus tempor erat. Sed imperdiet maximus nibh ac sagittis.
</p>
</section>
</section>

</section>
<footer>
<nav>
<ul>
<li>
<a href="https://twitter.com"><img src="images/logo-twitter.png"/></a>
</li>
<li>
<a href="https://facebook.com"><img src="images/logo-facebook.png"/></a>
</li>
<li>
<a mailto="mailto:[email protected]">email</a>
</li>
<li <a href="https://github.com">github</a>
</li>
</ul>

</nav>
</body>

</html>
Binary file added images/logo-facebook.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added images/logo-twitter.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Empty file added images/profilepic.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
61 changes: 61 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,61 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Oh, Hey Mary</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/index.css">
<link href="styles/normalize.css" rel="stylesheet" />
</head>

<body>
<nav>
<ul class="navbar">
<li><a href="about.html">About Me</a></li>
<li><a href="portfolio.html">Code Life</a></li>
<li><a href="code-journal.html">Non Code Life</a></li>
<link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">
</ul>
</nav>

<section>
<h1>Oh, Hey. I'm Mary</h1>
<p>
I used to have a pet caymen like Clarissa
</p>
<p>
Click below and find out some more
</p>
</section>

<nav class="menu">
<ul>
<li><a href="about.html">about me</a></li>
<li><a href="portfolio.html">code life</a></li>
<li><a href="code-journal.html">non code life</a></li>
</ul>
</nav>

<footer>
<nav>
<ul>
<li>
<a href="https://twitter.com"><img src="images/logo-twitter.png"/></a>
</li>
<li>
<a href="https://facebook.com"><img src="images/logo-facebook.png"/></a>
</li>
<li>
<a mailto="mailto:[email protected]">email</a>
</li>
<li
<a href="https://github.com">github</a>
</li>
</ul>
</nav>
</footer>

</body>

</html>
92 changes: 92 additions & 0 deletions portfolio.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<title>Oh, Hey Mary</title>
<link rel="stylesheet" href="styles/style.css">
<link rel="stylesheet" href="styles/portfolio.css">
<link href="styles/normalize.css" rel="stylesheet" />
</head>

<body>
<nav>
<ul class="navbar">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About Me</a></li>
<li><a href="code-journal.html">Non Code Life</a></li>
</ul>
</nav>

<section class="heading">
<h1>Github Projects</h1>
<p>
art in the medium of ruby html and css (lol)
</p>
</section>

<section class="projects">
<div class="hotel">
<h2>hotel</h2>
<a href="https://github.com/mmlamkin/hotel"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing hotel
</p>
</div>
<div class="store">
<h2>grocery store</h2>
<a href="https://github.com/mmlamkin/grocery-store"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing grocery store
</p>
</div>
<div class="startrly">
<h2>startrly</h2>
<a href="https://github.com/mmlamkin/Startrly"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing website
</p>
</div>
<div class="rideshare">
<h2>rideshare</h2>
<a href="https://github.com/mmlamkin/ride-share"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing rideshare
</p>
</div>
<div class="book-review">
<h2>book review</h2>
<a href="https://github.com/mmlamkin/book-review-site"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing book review site
</p>
</div>
<div class="solar-system">
<h2>solar system</h2>
<a href="https://github.com/mmlamkin/solar-system"><img src="http://placecage.com/g/100/100" /></a>
<p>
description of my amazing solar system
</p>
</div>
</section>

<footer>
<nav>
<ul>
<li>
<a href="https://twitter.com"><img src="images/logo-twitter.png"/></a>
</li>
<li>
<a href="https://facebook.com"><img src="images/logo-facebook.png"/></a>
</li>
<li>
<a mailto="mailto:[email protected]">email</a>
</li>
<li <a href="https://github.com">github</a>
</li>
</ul>

</nav>
</body>

</html>
53 changes: 53 additions & 0 deletions styles/about.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
.container {
display: grid;
grid-template: 300px auto 300px / 1fr 1fr;
width: 80%;
grid-gap: 10px;
margin: 0 auto;
}

.intro {
grid-column: 1 / -1;
display: flex;
flex-direction: column;
flex-wrap: wrap;
max-width: 80%;
justify-content: center;
}

.intro img {
margin: 5%;
margin-left: 10%;
}

.intro p {
max-width: 50%;
font-style: italic;
}

.intro h2 {
margin-top: 10%;
}

.dixie {
grid-column: 1 / -1;
display: flex;
flex-direction: column;
flex-wrap: wrap;

}

.dixie h3 {
height: 1em;
}

.dixie img {
max-width: 120px;
margin-bottom: 10%;
margin-right: 3%;
}

.dixie p {
margin-top: 8%;
max-width: 80%;
}
Loading