New Layout and CSS

This commit is contained in:
Henry V Child 2025-02-08 18:42:22 +01:00
parent 5331eb1094
commit bdc9a19c76
10 changed files with 165 additions and 0 deletions

View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="/styles.css">
<title>{{ block "title" . }}
{{ .Site.Title }}
{{ end }}</title>
</head>
<body>
<div class="container centre">
{{ partial "header/main.html" . }}
{{ block "main" . }}
<!-- The part of the page that begins to differ between templates -->
{{ end }}
{{ partial "footer/main.html" }}
</div>
</body>
</html>

View File

@ -0,0 +1,11 @@
{{ define "main" }}
<main role="main">
<div class="post">
{{ partial "baseof.html" . }}
<article>
{{ .Content }}
</article>
</div>
</main>
{{ end }}

View File

@ -0,0 +1,27 @@
{{ define "main" }}
<section>
<h1>{{ .Title }}</h1>
<div>
<article>
{{ .Content }}
</article>
</div>
</section>
<aside>
<div>
<section>
<h4>{{ .Date.Format "Mon Jan 2, 2006" }}</h4>
<h5>{{ .WordCount }} Words</h5>
</section>
</div>
<div>
{{ with .PrevInSection }}
<a class="previous" href="{{ .Permalink }}"> {{.Title}}</a>
{{ end }}
{{ with .NextInSection }}
<a class="next" href="{{ .Permalink }}"> {{.Title}}</a>
{{ end }}
</div>
</aside>
{{ end }}

View File

@ -0,0 +1,8 @@
<a href="{{ .Permalink }}">
<div>{{ .Title }}</div>
<div>{{ .Summary }}</div>
<div>
<span>{{ .ReadingTime }} Minutes</span>
<span>{{ .Date.Format "Jan 2, 2006" }}</span>
</div>
</a>

15
layouts/index.html Normal file
View File

@ -0,0 +1,15 @@
{{ define "main" }}
<main>
<h2>{{ .Title }}</h2>
<div class="homepage-content">
<!-- Note that the content for index.html, as a sort of list page, will pull from content/_index.md -->
{{.Content}}
</div>
<div>
{{range where .Site.RegularPages "Section" "posts" }}
{{ .Render "summary" }}
{{ end }}
</div>
</main>
{{ end }}

View File

@ -0,0 +1 @@
<footer><a href=mailto:me@henryvchild.eu>me@henryvchild.eu</a></footer>

View File

@ -0,0 +1,7 @@
{{ if .IsTranslated }}
{{ range .Translations }}
<span class="language-switcher">
<a href ="{{ .RelPermalink }}">{{ .Language.LanguageName }}</a>
</span>
{{ end }}
{{ end }}

View File

@ -0,0 +1,4 @@
<header id="header">
<a id="title" href="/{{.Lang}}">Henry Valentine Child</a>
{{ partial "header/menu.html" . }}
</header>

View File

@ -0,0 +1,7 @@
<span id="menu">
{{ range .Site.Menus.main }}
<a class="header_item" href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
{{ partial "header/lang_switch.html" .}}
</span>

65
static/styles.css Normal file
View File

@ -0,0 +1,65 @@
:root {
--background-colour: #0E1428;
--primary-colour: #FFF4EC;
--accent-colour: #D95D39;
}
body {
background-color: var(--background-colour);
color: var(--primary-colour);
line-height: 1.4;
font-family: Fira Code, Monaco, Consolas, Ubuntu Mono, monospace;
align-text: left;
margin: 0 auto;
height: 100vh
}
.header_item {
padding-right: 20px;
}
.container.centre {
display: flex;
flex-direction: column;
align-items: flex-start;
max-width: 864px;
margin: 0 auto;
height: 100vh;
}
#header {
margin-top: 10px;
display: flex;
flex-direction: column;
}
#title {
color: var(--accent-colour);
text-decoration: none;
font-size: 25px;
margin-bottom: 15px;
}
main {
flex-grow: 1;
}
header footer {
flex-shrink: 0;
}
footer {
margin-bottom: 10px;
}
a {
color: var(--primary-colour);
}
li::marker {
color: var(--accent-colour);
}
hr {
color: var(--accent-colour);
}