added nav
parent
717aa2e805
commit
2c07310a9a
|
@ -0,0 +1,15 @@
|
||||||
|
<header>
|
||||||
|
<div class="masthead">
|
||||||
|
<a href="/">
|
||||||
|
<div class="logo">
|
||||||
|
<h1>Jordan Hanrahan</h1>
|
||||||
|
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="/about.html">about</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
</header>
|
|
@ -1,6 +0,0 @@
|
||||||
<div class="masthead">
|
|
||||||
<div class="logo">
|
|
||||||
<h1>Jordan Hanrahan</h1>
|
|
||||||
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
|
@ -7,12 +7,21 @@
|
||||||
<title>Jordan Hanrahan - Portfolio</title>
|
<title>Jordan Hanrahan - Portfolio</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="masthead">
|
<header>
|
||||||
|
<div class="masthead">
|
||||||
|
<a href="/">
|
||||||
<div class="logo">
|
<div class="logo">
|
||||||
<h1>Jordan Hanrahan</h1>
|
<h1>Jordan Hanrahan</h1>
|
||||||
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
||||||
</div>
|
</div>
|
||||||
|
</a>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="/about.html">about</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
|
</header>
|
||||||
<!-- the build script should generate links from items in project folder here. -->
|
<!-- the build script should generate links from items in project folder here. -->
|
||||||
<main>
|
<main>
|
||||||
<div class="projects">
|
<div class="projects">
|
||||||
|
|
|
@ -23,11 +23,20 @@
|
||||||
<title>Jordan Hanrahan - Portfolio</title>
|
<title>Jordan Hanrahan - Portfolio</title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<header class="masthead">
|
<header>
|
||||||
|
<div class="masthead">
|
||||||
|
<a href="/">
|
||||||
<div class="logo">
|
<div class="logo">
|
||||||
<h1>Jordan Hanrahan</h1>
|
<h1>Jordan Hanrahan</h1>
|
||||||
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
|
||||||
</div>
|
</div>
|
||||||
|
</a>
|
||||||
|
<nav>
|
||||||
|
<ul>
|
||||||
|
<li><a href="/about.html">about</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h1>XX XX</h1>
|
<h1>XX XX</h1>
|
||||||
|
|
|
@ -1,21 +1,50 @@
|
||||||
html {
|
html {
|
||||||
background-color: #222222;
|
background-color: #202020;
|
||||||
color: #ffffff;
|
color: #f0f0f0;
|
||||||
font-family: sans-serif;
|
font-family: sans-serif;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #e04080;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: #b02050;
|
||||||
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
padding: 80px 16px;
|
padding: 80px 16px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
max-width: 1280px;
|
max-width: 1280px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.masthead {
|
header {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 0;
|
left: 0;
|
||||||
top: 0;
|
top: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
|
background-color: #222222;
|
||||||
|
border-bottom: 1px solid #666666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masthead .logo {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masthead nav {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masthead nav li {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.masthead a, .masthead a:visited {
|
||||||
|
color: #f0f0f0;
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.masthead .logo h1 {
|
.masthead .logo h1 {
|
||||||
|
|
Loading…
Reference in New Issue