Compare commits

...

2 Commits

Author SHA1 Message Date
7a90646ac3 Colourscheme + add fontawesome
Probably overkill but hey :P
2020-04-23 16:48:44 +01:00
21bbb417a5 Mockup of slanted colum layout 2020-04-23 16:12:04 +01:00
9 changed files with 4471 additions and 15 deletions

View File

@@ -1,9 +1,9 @@
title: Arona Jones title: Arona Jones
email: aj@aronajones.com email: aj@aronajones.com
description: >- description: >-
The personal website, blog and portfolio of Arona Jones, the Frenetic Scribbler Portfolio of Arona Jones, a Swiss-born British Developer, Writer and Stage Technician.
baseurl: "" baseurl: ""
url: "https://www.aronajones.com" # the base hostname & protocol for your site, e.g. http://example.com url: "https://aronajones.com" # the base hostname & protocol for your site, e.g. http://example.com
twitter_username: aronajones_ twitter_username: aronajones_
github_username: FreneticScribbler github_username: FreneticScribbler

10
_includes/head.html Normal file
View File

@@ -0,0 +1,10 @@
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
{%- seo -%}
<link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
{%- feed_meta -%}
<link rel="stylesheet" type="text/css" href="custom.css">
<script defer src="fontawesome.js"></script>
</head>

View File

@@ -7,11 +7,8 @@
{%- include header.html -%} {%- include header.html -%}
<main class="page-content" aria-label="Content" style="background-image: url('christian-wiediger-WkfDrhxDMC8-unsplash.jpg'); background-repeat: no-repeat; background-size: cover;"> <main class="page-content" aria-label="Content">
<div class="wrapper"> {{ content }}
{{ content }}
</div>
<a style="background-color:black;color:white;text-decoration:none;padding:4px 6px;font-family:-apple-system, BlinkMacSystemFont, &quot;San Francisco&quot;, &quot;Helvetica Neue&quot;, Helvetica, Ubuntu, Roboto, Noto, &quot;Segoe UI&quot;, Arial, sans-serif;font-size:12px;font-weight:bold;line-height:1.2;display:inline-block;border-radius:3px" href="https://unsplash.com/@christianw?utm_medium=referral&amp;utm_campaign=photographer-credit&amp;utm_content=creditBadge" target="_blank" rel="noopener noreferrer" title="Download free do whatever you want high-resolution photos from Christian Wiediger"><span style="display:inline-block;padding:2px 3px"><svg xmlns="http://www.w3.org/2000/svg" style="height:12px;width:auto;position:relative;vertical-align:middle;top:-2px;fill:white" viewBox="0 0 32 32"><title>unsplash-logo</title><path d="M10 9V0h12v9H10zm12 5h10v18H0V14h10v9h12v-9z"></path></svg></span><span style="display:inline-block;padding:2px 3px">Christian Wiediger</span></a>
</main> </main>
{%- include footer.html -%} {%- include footer.html -%}

View File

@@ -1,7 +1,6 @@
--- ---
layout: default layout: default
--- ---
<div class="home"> <div class="home">
{%- if page.title -%} {%- if page.title -%}
<h1 class="page-heading">{{ page.title }}</h1> <h1 class="page-heading">{{ page.title }}</h1>

43
custom.css Normal file
View File

@@ -0,0 +1,43 @@
body {
background: #202226;
color: #00ADFF;
}
.bigimage {
transform: skew(-10deg);
color: white;
padding: 2em;
height: 50vh;
width: 100%;
text-align: center;
}
/*My kingdom for a 'backdrop-filter'!*/
img.background {
color: black;
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
-webkit-filter: blur(2px);
filter: blur(2px);
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;
}
.bigimage:hover img {
-webkit-filter: blur(0);
filter: blur(0);
}
a.button {
transform: skew(10deg);
color: white;
touch-callout: none;
user-select: none;
display: inline-block;
border: .2em solid;
position: relative;
cursor: pointer;
overflow: hidden;
padding: 0.5em;
background: rgba(255, 255, 255, 0.3);
}

4391
fontawesome.js Normal file

File diff suppressed because one or more lines are too long

View File

Before

Width:  |  Height:  |  Size: 1.5 MiB

After

Width:  |  Height:  |  Size: 1.5 MiB

23
index.html Normal file
View File

@@ -0,0 +1,23 @@
---
---
<!DOCTYPE html>
<html lang="{{ page.lang | default: site.lang | default: "en" }}">
{%- include head.html -%}
<body>
<header class="site-header">
<div class="wrapper" style="text-align: center;">
<h1 style="padding-top: 0.5em;">Arona Jones</h1>
</div>
</header>
<main aria-label="Content">
<div style="display: flex; justify-content: center; background: black; margin-left: -3vw; margin-right: -3vw;">
<div class="bigimage"><img class="background" src="img/christian-wiediger-WkfDrhxDMC8-unsplash.jpg"><a class="button" href=""><span class="fas fa-file-code"></span> Development</a></div>
<div class="bigimage"><img class="background" src="img/1*0V2rDSk8SOr6mpfFf28EJA.jpeg"><a class="button" href=""><span class="fas fa-pen-fancy"></span> Writing</a></div>
<div class="bigimage"><img class="background" src="img/1*kV4-rHsyoDl4ursB1CG72Q.jpeg"><a class="button" href=""><span class="fas fa-lightbulb"></span> Technical</a></div>
<div class="bigimage"><img class="background" src="img/1*2J4xTO7JYBYA3dcMwwGSlw.jpeg"><a class="button" href="blog"><span class="fas fa-portrait"></span> Personal</a></div>
</div>
</main>
</body>
{%- include footer.html -%}
</html>

View File

@@ -1,7 +0,0 @@
---
# Feel free to add content and custom Front Matter to this file.
# To modify the layout, see https://jekyllrb.com/docs/themes/#overriding-theme-defaults
layout: home
---