Skip to content

Instantly share code, notes, and snippets.

@haydenw1

haydenw1/index.html

Created July 24, 2015 03:22
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save haydenw1/b9b9b39e65383b977efa to your computer and use it in GitHub Desktop.
Save haydenw1/b9b9b39e65383b977efa to your computer and use it in GitHub Desktop.
Download ZIP
website
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hayden Port</title>
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<link href='http://fonts.googleapis.com/css?family=Comfortaa:400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/main.css"/>
<script type="text/javascript">
</script>
</head>
<body>
<!--%%%%%%%%%%%%%%%%%%%%%%%% NAVIGATION %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
<div class="nav">
<div class="head link">work</div>
<div class="head link">ideas</div>
<div class="head link">HW </div>
<div class="head link">about</div>
<div class="head link">contact</div>
</div>
<!--%%%%%%%%%%%%%%%%%%%%%%%% NAVIGATION %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
<!--%%%%%%%%%%%%%%%%%%%%%%%% MEAT %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
<div class="container">
<div class="section">
<p class="head title">Work</p>
</div>
<div class="section">
<p class="head title">Ideas</p>
</div>
<div class="section">
<p class="head title">About</p>
</div>
<div class="section">
<p class="head title">Contact</p>
</div>
</div>
<!--%%%%%%%%%%%%%%%%%%%%%%%% MEAT %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
<!--%%%%%%%%%%%%%%%%%%%%%%%% FOOTER %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
<div class="footer">
<!--<p>Background pattern made by <a href="https://www.anchour.com/">Anchour</a> and downloaded from <a href="http://subtlepatterns.com">Subtle Patterns</a>. <a href="http://subtlepatterns.com/concrete-seamless/">Download page link</a>. <a href="http://creativecommons.org/licenses/by-sa/3.0/">Link to license</a>. No modifications were made to this material.</p>-->
</div>
<!--%%%%%%%%%%%%%%%%%%%%%%%% FOOTER %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%-->
</body>
</html>
Raw
main.css
@import url(http://fonts.googleapis.com/css?family=Comfortaa:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Roboto);
html,
body,
ul,
ol {
margin: 0;
padding: 0; }
html,
body {
height: 100%;
min-height: 100%;
overflow-x: hidden;
width: 100%; }
.container {
margin: 0 auto;
width: 975px; }
.nav {
font-family: "Comfortaa", Arial, sans-serif;
font-size: 0;
margin: 0 auto;
padding: 15px;
width: 1025px; }
.nav p {
color: black;
text-align: center;
pointer-events: none; }
.section .description {
font-family: "Roboto", Arial, sans-serif;
font-size: 1.10em;
text-indent: 2em; }
.head {
font-family: "Comfortaa", Arial, sans-serif;
font-size: 24px; }
.title {
border-bottom: 1.5px solid black;
font-weight: 400;
margin-bottom: 10px;
text-align: left;
text-indent: .25em; }
.link {
cursor: pointer;
display: inline-block;
font-weight: 300;
margin: 0px 2.5%;
padding: 10px 0px;
text-align: center;
width: 15%; }
.link:hover {
border-bottom: 1px solid black;
padding: 9px 0px; }
/*# sourceMappingURL=main.css.map */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment