jahnertz/jhan.com.au
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added styles and still thinking about structure

Browse Source
This commit is contained in:
Jahnertz 2023-05-21 22:52:57 +10:00
parent a2904980d4
commit ff267d75cb
6 changed files with 126 additions and 95 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/footer.html Normal file
View File

@ -0,0 +1,4 @@
<div class="footer">
<p>©2021 Jordan Hanrahan</p>
</div>
</html>

1
src/components/head.html
View File

@ -2,5 +2,6 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<link rel="stylesheet" href="/styles.css" />
<title>Jordan Hanrahan - Portfolio</title> <title>Jordan Hanrahan - Portfolio</title>
</head> </head>

4
src/components/masthead.html Normal file
View File

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

17
src/index.html
View File

@ -2,15 +2,20 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<link rel="stylesheet" href="/styles.css" />
<title>Jordan Hanrahan - Portfolio</title> <title>Jordan Hanrahan - Portfolio</title>
</head> </head>
<body> <body>
<h1>Jordan Hanrahan</h1> <div class="masthead">
<h2>Art Direction - Graphic Design - Motion Graphics</h2> <h1>Jordan Hanrahan</h1>
<!-- todo: generate links from items in projec folder {%project-list%} --> <h2>Art Direction - Graphic Design - Motion Graphics</h2>
<ul> </div>
<li><a href="projects/2016-XXXX.html">XX XX</a></li> <!-- the build script should generate links from items in project folder here. -->
</ul> <div class="projects">
<ul>
<li><a href="projects/2016-XXXX.html">XX XX</a></li>
</ul>
</div>
<div class="footer"> <div class="footer">
<p>©2021 Jordan Hanrahan</p> <p>©2021 Jordan Hanrahan</p>
</div> </div>

190
src/projects/2016-XXXX.html
View File

@ -1,106 +1,118 @@
<!-- <!--
--- ---
date: 2021-02-01 date: 2021-02-01
thumbnail: "/uploads/cbc_xxxxportfoliocover_210202_v01.png" thumbnail: "/uploads/cbc_xxxxportfoliocover_210202_v01.png"
title: XX XX title: XX XX
categories: categories:
- Graphic Design - Graphic Design
- Art Direction - Art Direction
project_bg_color: '' project_bg_color: ''
project_fg_color: '' project_fg_color: ''
published: true published: true
showcase: true showcase: true
project_year: 2020 project_year: 2020
--- ---
--> -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="/styles.css" />
<title>Jordan Hanrahan - Portfolio</title>
</head>
<body>
<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>
<h1>XX XX</h1> <img src="/uploads/cbc_xxxx/cbc_xxxxmixmag.jpg" alt="mixmag feature">
<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> Mixmag feature
<img src="/uploads/cbc_xxxx/cbc_xxxxmixmag.jpg" alt="mixmag feature"> <h2>As creative director, I was responsible for the venue's promotional graphics and event branding down to the lighting and visuals. I also oversaw XX XX's web and social presence as part of a creative management team.</h2>
Mixmag feature
<h2>As creative director, I was responsible for the venue's promotional graphics and event branding down to the lighting and visuals. I also oversaw XX XX's web and social presence as part of a creative management team.</h2> <div class="col-2 col-med-3">
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00036.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00058.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00017.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00061.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00044.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00038.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00019.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00039.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00064.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00040.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00005.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00007.jpeg" />
</div>
<div class="col-2 col-med-3"> <h3>Of the many events at XX XX that I developed the brand character for, a few notable examples are:</h3>
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00036.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00058.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00017.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00061.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00044.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00038.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00019.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00039.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00064.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00040.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00005.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00007.jpeg" />
</div>
<h3>Of the many events at XX XX that I developed the brand character for, a few notable examples are:</h3> <h1>Circus<h1>
<h2>A monthly mini-festival event bringing together live music, performers, visual artists and food pop-ups.</h2>
<h1>Circus<h1> <div class="col-2 col-med-3">
<h2>A monthly mini-festival event bringing together live music, performers, visual artists and food pop-ups.</h2> <img src="/uploads/cbc_xxxx/cbc_circusjul2018.gif" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00001.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00003.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00008.jpg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00005.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00006.jpeg" />
</div>
<div class="col-2 col-med-3"> <h1>Elephant</h1>
<img src="/uploads/cbc_xxxx/cbc_circusjul2018.gif" /> <h2>A weekly LGBTQI+ friendly art and fashion themed party which brought experimental installation and artists into an accessible event space.</h2>
<img src="/uploads/cbc_xxxx/cbc_circusposters_00001.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00003.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00008.jpg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00005.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_circusposters_00006.jpeg" />
</div>
<h1>Elephant</h1> <div class="col-2 col-med-3">
<h2>A weekly LGBTQI+ friendly art and fashion themed party which brought experimental installation and artists into an accessible event space.</h2> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00022.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_elephantpompom.gif" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00014.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_elephanteveninggowncomp.gif" />
<img src="/uploads/cbc_xxxx/cbc_elephantposters_00009.jpg" />
<img src="/uploads/cbc_xxxx/cbc_elephantgenderrevealparty.gif" />
</div>
<div class="col-2 col-med-3"> <h1>Layers</h1>
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00022.jpeg" /> <h2>A 'tabula rasa' event that brought new sounds to the venue each week</h2>
<img src="/uploads/cbc_xxxx/cbc_elephantpompom.gif" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00014.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_elephanteveninggowncomp.gif" />
<img src="/uploads/cbc_xxxx/cbc_elephantposters_00009.jpg" />
<img src="/uploads/cbc_xxxx/cbc_elephantgenderrevealparty.gif" />
</div>
<h1>Layers</h1> <div class="col-2 col-med-3">
<h2>A 'tabula rasa' event that brought new sounds to the venue each week</h2> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00053.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00084.jpeg" />
<div class="col-2 col-med-3"> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00050.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00053.jpeg" /> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00031.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00084.jpeg" /> <img src="/uploads/cbc_xxxx/cbc_layers01.gif" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00050.jpeg" /> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00018.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00031.jpeg" /> </div>
<img src="/uploads/cbc_xxxx/cbc_layers01.gif" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00018.jpeg" />
</div>
<h1>\[−\] (Null)</h1> <h1>\[−\] (Null)</h1>
<h2>An experimental sounds evening giving a platform to local ambient and electronic producers</h2> <h2>An experimental sounds evening giving a platform to local ambient and electronic producers</h2>
<div class="col-med-2"> <div class="col-med-2">
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00011.jpeg" /> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00011.jpeg" />
<img src="/uploads/cbc_xxxx/cbc_xxxxposters_00080.jpeg" /> <img src="/uploads/cbc_xxxx/cbc_xxxxposters_00080.jpeg" />
</div> </div>
<h1>Tektonik</h1> <h1>Tektonik</h1>
<h2>Featuring local and international techno DJs.</h2> <h2>Featuring local and international techno DJs.</h2>
<div class="col-2 col-med-4"> <div class="col-2 col-med-4">
<img src="/uploads/180727_tektonik_poster-1_180725_v3_story.jpg" /> <img src="/uploads/180727_tektonik_poster-1_180725_v3_story.jpg" />
<img src="/uploads/180615_tektonik_poster-2_180606_v2_story.jpg" /> <img src="/uploads/180615_tektonik_poster-2_180606_v2_story.jpg" />
<img src="/uploads/tkt_clara3000_poster_02_181013_v4_story.jpg" /> <img src="/uploads/tkt_clara3000_poster_02_181013_v4_story.jpg" />
<img src="/uploads/180824_tektonik_poster-1_180821_v8_story.jpg" /> <img src="/uploads/180824_tektonik_poster-1_180821_v8_story.jpg" />
</div> </div>
<img src="/uploads/180413_tektonik_poster-2_180412_v4_fb.jpg" /> <img src="/uploads/180413_tektonik_poster-2_180412_v4_fb.jpg" />
<h1>The XX XX Venue</h1> <h1>The XX XX Venue</h1>
<div> <div>
<img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_21.jpg" /> <img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_21.jpg" />
<img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_11.jpg" /> <img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_11.jpg" />
<img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_03.jpg" /> <img src="/uploads/cbc_xxxx/cbc_xxxx-2020-venue_180718_03.jpg" />
<img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_10.jpg" /> <img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_10.jpg" />
<img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_08.jpg" /> <img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_08.jpg" />
<img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_07.jpg" /> <img src="/uploads/cbc_xxxx/cbc_venuephotos_xxxx_181213_07.jpg" />
</div> </div>
<div class="footer">
<p>©2021 Jordan Hanrahan</p>
</div>
</body>
</html>

5
src/styles.css Normal file
View File

@ -0,0 +1,5 @@
html {
background-color: #222222;
color: #ffffff;
font-family: sans-serif;
}