added nav

trunk
Jahnertz 2023-05-22 00:02:55 +10:00
parent 717aa2e805
commit 2c07310a9a
5 changed files with 74 additions and 18 deletions

View File

@ -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>

View File

@ -1,6 +0,0 @@
<div class="masthead">
<div class="logo">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
</div>
</div>

View File

@ -7,12 +7,21 @@
<title>Jordan Hanrahan - Portfolio</title>
</head>
<body>
<header class="masthead">
<div class="logo">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
<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>
</div>
</header>
<!-- the build script should generate links from items in project folder here. -->
<main>
<div class="projects">

View File

@ -23,10 +23,19 @@
<title>Jordan Hanrahan - Portfolio</title>
</head>
<body>
<header class="masthead">
<div class="logo">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
<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>
<main>

View File

@ -1,21 +1,50 @@
html {
background-color: #222222;
color: #ffffff;
background-color: #202020;
color: #f0f0f0;
font-family: sans-serif;
}
a {
color: #e04080;
}
a:visited {
color: #b02050;
}
main {
padding: 80px 16px;
margin: 0 auto;
max-width: 1280px;
}
.masthead {
header {
position: fixed;
left: 0;
top: 0;
width: 100%;
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 {