added styling on masthead

trunk
Jahnertz 2023-05-21 23:29:28 +10:00
parent 31d71fb3fe
commit 93f07fe1a9
4 changed files with 35 additions and 5 deletions

View File

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

View File

@ -8,11 +8,14 @@
</head>
<body>
<div class="masthead">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction - Graphic Design - Motion Graphics</h2>
<div class="logo">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
</div>
</div>
<!-- the build script should generate links from items in project folder here. -->
<div class="projects">
<h1>Projects</h1>
<ul>
<li><a href="projects/2016-XXXX.html">XX XX</a></li>
</ul>

View File

@ -23,6 +23,12 @@
<title>Jordan Hanrahan - Portfolio</title>
</head>
<body>
<div class="masthead">
<div class="logo">
<h1>Jordan Hanrahan</h1>
<h2>Art Direction · Graphic Design · Motion Graphics</h2>
</div>
</div>
<h1>XX XX</h1>
<h2>Until it's recent closure, **XX XX** was one of South-East Asia's premiere venues for dance music, bringing local DJs and producers to the fore, while hosting international acts such as **Kevin Saunderson** <small>(KMS, Detroit)</small>, **FJAAK** <small>(50Weapons, Berlin)</small>, **Answer Code Request** <small>(Berghain/Ostgut Ton, Berlin)</small>, Jamie XX, **Chris Cruse** <small>(Spotlight, LA)</small>, **ND_Baumecker** <small>(Ostgut Ton, Berlin)</small>, **Sofie** <small>(Stones Throw/Boiler Room, LA)</small>, **Milton Bradley** <small>(Do Not Resist The Beat/Alien Rain, Berlin)</small> and many more.</h2>

View File

@ -4,8 +4,27 @@ html {
font-family: sans-serif;
}
body {
padding: 80px 16px;
margin: 0 auto;
max-width: 1280px;
}
.masthead {
font-size: 0.8em;
position: absolute;
left: 0;
top: 0;
width: 100%;
padding: 8px 16px;
}
.masthead .logo h1 {
font-size: 1.375rem; /*22pt*/
line-height: 0.5rem;
}
.masthead .logo h2 {
font-size: 0.5rem;
}
.projects li {