add a logo.webp and implement in index
This commit is contained in:
@ -1,53 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<meta property="og:image" content="/_assets/img/cropped.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="/_assets/img/fav.png">
|
||||
{# <link rel="stylesheet" href="/_assets/css/normalize.css" /> #}
|
||||
{# <link rel="stylesheet" href="/_assets/css/styles.css"/> #}
|
||||
|
||||
{% set normalise %}
|
||||
{% include "normalize.css" %}
|
||||
{% endset %}
|
||||
<style>
|
||||
{{normalise | cssmin | safe}}
|
||||
</style>
|
||||
{% set css %}
|
||||
{% include "styles.css" %}
|
||||
{% endset %}
|
||||
<style>
|
||||
{{css | cssmin | safe}}
|
||||
</style>
|
||||
{% if title %}
|
||||
<title>{{ site.title }} - {{ title }}</title>
|
||||
{% else %}
|
||||
<title>{{ site.title }}</title>
|
||||
{% endif %}
|
||||
{% if description %}
|
||||
<meta name="description" content="{{ description }}">
|
||||
{% else %}
|
||||
<meta name="description" content="{{ site.description }}">
|
||||
{% endif %}
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div>
|
||||
{# <header>{% include 'partials/header.njk' %}</header> #}
|
||||
{# <hr/> #}
|
||||
<article>
|
||||
<h2>{{ title }}</h2>
|
||||
{{ content | safe }}
|
||||
</article>
|
||||
</div>
|
||||
<footer>
|
||||
<hr/>
|
||||
{% include 'partials/footer.njk' %}
|
||||
</footer>
|
||||
</main>
|
||||
<aside>{% include 'partials/sidebar.njk' %}</aside>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
---
|
||||
layout: layout/core.njk
|
||||
---
|
||||
<h2>{{ title }}</h2>
|
||||
{{ content | safe}}
|
@ -1,11 +1,16 @@
|
||||
---
|
||||
layout: layout/base.njk
|
||||
layout: layout/core.njk
|
||||
---
|
||||
{% set previousPost = collections.post | getPreviousCollectionItem(page) %}
|
||||
{% set nextPost = collections.post | getNextCollectionItem(page) %}
|
||||
<sup>{{ page.date.toLocaleDateString("en-UK") }}</sup>
|
||||
<article class="blog-post">{{ content | safe}}</article>
|
||||
<div class="nav-buttons">
|
||||
<div class="nav-buttons nav-buttons-top">
|
||||
{% if nextPost %}<a href="{{ nextPost.url }}"><== next</a>{% else %}x=={% endif %}
|
||||
{% if previousPost %}<a href="{{ previousPost.url }}">prev ==></a>{% else %}==x{% endif %}
|
||||
</div>
|
||||
<h2>{{ title }}</h2>
|
||||
<span class="date-tag">{{ page.date.toLocaleDateString("en-UK") }}</span>
|
||||
<article class="blog-post">{{ content | safe}}</article>
|
||||
<div class="nav-buttons nav-buttons-bottom">
|
||||
{% if nextPost %}<a href="{{ nextPost.url }}"><== next</a>{% else %}x=={% endif %}
|
||||
{% if previousPost %}<a href="{{ previousPost.url }}">prev ==></a>{% else %}==x{% endif %}
|
||||
</div>
|
50
src/_includes/layout/core.njk
Normal file
50
src/_includes/layout/core.njk
Normal file
@ -0,0 +1,50 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<meta property="og:image" content="/_assets/img/cropped.png"/>
|
||||
<link rel="icon" type="image/x-icon" href="/_assets/img/fav.png">
|
||||
{# <link rel="stylesheet" href="/_assets/css/normalize.css" /> #}
|
||||
{# <link rel="stylesheet" href="/_assets/css/styles.css"/> #}
|
||||
|
||||
{% set normalise %}
|
||||
{% include "normalize.css" %}
|
||||
{% endset %}
|
||||
<style>
|
||||
{{normalise | cssmin | safe}}
|
||||
</style>
|
||||
{% set css %}
|
||||
{% include "styles.css" %}
|
||||
{% endset %}
|
||||
<style>
|
||||
{{css | cssmin | safe}}
|
||||
</style>
|
||||
{% if title %}
|
||||
<title>{{ site.title }} - {{ title }}</title>
|
||||
{% else %}
|
||||
<title>{{ site.title }}</title>
|
||||
{% endif %}
|
||||
{% if description %}
|
||||
<meta name="description" content="{{ description }}">
|
||||
{% else %}
|
||||
<meta name="description" content="{{ site.description }}">
|
||||
{% endif %}
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<div class="page-content">
|
||||
{# <header>{% include 'partials/header.njk' %}</header> #}
|
||||
{# <hr/> #}
|
||||
{{ content | safe }}
|
||||
</div>
|
||||
<footer>
|
||||
<hr/>
|
||||
{% include 'partials/footer.njk' %}
|
||||
</footer>
|
||||
</main>
|
||||
<aside>{% include 'partials/sidebar.njk' %}</aside>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
@ -1,5 +1,5 @@
|
||||
<div class="link_tiles_grid">
|
||||
<a href="{{ collections.post[-1].page.url }}">
|
||||
<a class="bouncy" href="{{ collections.post[-1].page.url }}">
|
||||
<img src="_assets/img/most_recent.jpg" alt="Mitsuami from the Splatoon manga saying 'pyo'. The image links to the most recent post on the website."/>
|
||||
newest!
|
||||
</a>
|
||||
|
@ -68,7 +68,7 @@ a:visited {
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
transform: translate(0px,-2px);
|
||||
transform: translate(0px, -2px);
|
||||
}
|
||||
|
||||
hr {
|
||||
@ -199,7 +199,7 @@ nav {
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
.sidebar-contents>img{
|
||||
.sidebar-contents>img {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -233,6 +233,7 @@ nav {
|
||||
|
||||
/* switch to two tiles when it gets really small */
|
||||
@media all and (max-width: 545px) {
|
||||
|
||||
.link_tiles_grid>a,
|
||||
.link_tiles_grid>a>img {
|
||||
width: calc((100vw - 85px)/2);
|
||||
@ -244,6 +245,18 @@ nav {
|
||||
}
|
||||
}
|
||||
|
||||
.page-content {
|
||||
/* TODO fix this magic number */
|
||||
min-height: calc(100vh - 95px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.date-tag {
|
||||
font-size: smaller;
|
||||
}
|
||||
|
||||
article>p {
|
||||
margin-top: 0;
|
||||
}
|
||||
@ -256,7 +269,7 @@ details {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.pages-article>p{
|
||||
.pages-article>p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@ -279,7 +292,30 @@ footer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.nav-buttons-bottom {
|
||||
justify-self: flex-end;
|
||||
}
|
||||
|
||||
.bouncy {
|
||||
animation: bounce 1s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
|
||||
}
|
||||
|
||||
@keyframes bounce {
|
||||
0%, 100% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
50% {
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
75% {
|
||||
transform: translateY(0);
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
animation-delay: 3s; /* add a 3 second delay before restarting the animation */
|
||||
}
|
||||
}
|
||||
|
||||
/* body > footer {
|
||||
|
Reference in New Issue
Block a user