diff --git a/assets/fonts/SourceSansPro-Bold.ttf b/assets/fonts/SourceSansPro-Bold.ttf
deleted file mode 100644
index b8879af..0000000
Binary files a/assets/fonts/SourceSansPro-Bold.ttf and /dev/null differ
diff --git a/assets/fonts/SourceSansPro-Light.ttf b/assets/fonts/SourceSansPro-Light.ttf
deleted file mode 100644
index 9b0e83d..0000000
Binary files a/assets/fonts/SourceSansPro-Light.ttf and /dev/null differ
diff --git a/assets/fonts/SourceSansPro-Regular.ttf b/assets/fonts/SourceSansPro-Regular.ttf
deleted file mode 100644
index 98e8579..0000000
Binary files a/assets/fonts/SourceSansPro-Regular.ttf and /dev/null differ
diff --git a/assets/sass/code.scss b/assets/sass/code.scss
index 660b1e6..dd4a795 100644
--- a/assets/sass/code.scss
+++ b/assets/sass/code.scss
@@ -1,18 +1,4 @@
-code {
- background: $dark;
- border-radius: .4rem;
- margin: 0 .2rem;
- padding: .2rem .5rem;
- white-space: nowrap;
-}
-
-p code {
- font-size: .9rem !important;
-}
-
-li code {
- font-size: .9rem !important;
-}
+code { white-space: nowrap; }
pre {
background-color: $background-color !important;
@@ -27,5 +13,6 @@ pre {
max-width: 100%;
overflow-x: auto;
border-left: .3rem solid $code-edge;
+ border-radius: .4rem;
}
}
diff --git a/assets/sass/fonts.scss b/assets/sass/fonts.scss
deleted file mode 100644
index 928985a..0000000
--- a/assets/sass/fonts.scss
+++ /dev/null
@@ -1,25 +0,0 @@
-/*
-You may download the entire Source Sans Pro font family here:
-https://fonts.google.com/specimen/Source+Sans+Pro?query=Source+Sans+Pro
-*/
-@font-face {
- font-family: 'Source Sans Pro';
- src: url('/fonts/SourceSansPro-Light.ttf') format('truetype');
- font-weight: light;
- font-style: normal;
-}
-
-@font-face {
- font-family: 'Source Sans Pro';
- src: url('/fonts/SourceSansPro-Regular.ttf') format('truetype');
- font-weight: normal;
- font-style: normal;
-}
-
-@font-face {
- font-family: 'Source Sans Pro';
- src: url('/fonts/SourceSansPro-Bold.ttf') format('truetype');
- font-weight: bold;
- font-style: normal;
-}
-
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index ca4264b..a625247 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -1,7 +1,6 @@
@import 'colors.scss';
@import 'cards.scss';
@import 'code.scss';
-@import 'fonts.scss';
@mixin screen-max($max) {
@media (max-width: $max - 1) {
@@ -14,95 +13,51 @@ body {
color: $font-color;
margin: 0px;
overflow-y: scroll;
- font-family: 'Source Sans Pro';
+ font-family: 'Helvetica';
+ font-size: 1.1rem;
}
+h2 {font-size: 1.2rem;}
+
header {
background-color: $top-bar;
box-shadow: 0px 5px 10px black;
- .spread {
- gap: 24px;
- display: flex;
- align-items: flex-end;
- justify-content: space-between;
- @include screen-max(1000px){justify-content: center;}
- ul {
- margin: 0px;
- padding: 0px;
- list-style-type: none;
- a {
- text-align: center;
- margin: auto;
- font-weight: bold;
- text-decoration: none;
- color: $font-color-alternate;
- }
- }
- }
nav {
- max-width: 1400px;
- margin: 0px auto;
- padding: 8px;
- flex-wrap: wrap;
- a {
- @include screen-max(1000px){flex-basis: 100%;}
- }
- img {
- max-width: 300px;
- display: block;
- @include screen-max(1000px){margin: auto; flex-basis: 100%;}
- }
- }
-}
+ @include screen-max(500px){text-align: center;}
-a {
- color: $link-color;
+ div {display: inline-block;}
+
+ img { max-width: 300px; }
- &:visited, &:hover {
- color: $link-color-visited;
+ a {
+ margin-right: 12px;
+ font-weight: bold;
+ text-decoration: none;
+ &, &:visited, &:hover {color: $font-color-alternate;}
+ }
}
}
-main {
- max-width: 820px;
- margin: auto;
- @include screen-max(840px){padding: 0px 16px;}
+header, main, section {padding: 0 16px;}
- img {
- width: 100%;
- }
-}
+nav, main, section {max-width: 1200px; margin: auto;}
+main img {max-width: 100%}
-.center-text {
- text-align: center;
- flex-basis: 100%;
-}
+footer {text-align: center;}
-a, p, li, h2 {
- font-size: 1.25rem;
-}
-img {
- object-fit: cover;
+a {
+ color: $link-color;
+ &:visited, &:hover { color: $link-color-visited; }
}
-img.featured {
+img.featured{aspect-ratio: 4/3;}
+img.featured, img.author {
+ display: block;
border-radius: 8px;
+ margin: 12px 0;
+ object-fit: cover;
max-height: 500px;
- max-width: 100%;
- display: block;
-}
-
-.margin {
- margin: 12px auto;
-}
-
-.small-text {
- font-size: 1rem;
-}
-
-.large-text {
- font-size: 2rem;
}
.left-to-right {
@@ -117,26 +72,14 @@ img.featured {
align-items: center;
}
-section {
- max-width: 1000px;
- margin: 16px auto;
- padding: 8px;
-}
-
section.article-list {
+ margin: 8px 0px;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 40px;
}
-.center-box {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
-}
-
.fill-wh {
width: 100%;
height: 100%
diff --git a/layouts/404.html b/layouts/404.html
index 180ba9f..f369e15 100644
--- a/layouts/404.html
+++ b/layouts/404.html
@@ -1,7 +1,7 @@
{{ define "main" }}
-
-
404
-
This page doesn't exist. Let's go home
-
404
+ This page doesn't exist. Let's go home
+
{{ end }}
diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index 721fb3e..efe81ab 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -19,7 +19,7 @@
{{- end }}
- {{ $style := resources.Get "/sass/main.scss" | resources.ToCSS -}}
+ {{ $style := resources.Get "/sass/main.scss" | resources.ToCSS | minify -}}
@@ -29,12 +29,12 @@
</head>
<body>
- {{ partial "header.html" . }}
+{{ partial "header.html" . }}
- {{ block "main" . }}
- {{ end }}
+{{ block "main" . }}
+{{ end }}
- {{ partial "footer.html" . }}
+{{ partial "footer.html" . }}
</body>
</html>
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 7fa7bbf..510673f 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,26 +1,48 @@
{{ define "main" }}
-
{{ $pages := .Site.RegularPages }}
-
- {{if not .IsHome }}
-
- <h1 class="center-text">{{ .Title | markdownify | lower }}</h1>
-
- {{ $pages = .Pages }}
-
+ {{if not .IsHome }} {{ $pages = .Pages }} {{ end }}
+
+ <main>
+ {{ if not .IsHome }}
+ <h1>{{ .Title | markdownify | lower }}</h1>
+ {{ else }}
+ <h1>Beet Box</h1>
+ {{ end }}
+
+ {{ if and .IsSection (not .IsHome) }} {{ partial "article-meta.html" . }} {{ end }}
+
+ {{ with .Content }}
+ <section>
+ {{ . }}
+ </section>
+ {{- end }}
+
+ </main>
+
+ {{ with $pages.Limit 4 }}
+ <section>
+ <h2>Latest Posts:</h2>
+ <section class="article-list">
+ {{ range . }}
+ {{ partial "article.html" . }}
+ {{ end }}
+ </section>
+ </section>
{{ end }}
- {{ if templates.Exists "partials/pre-content.html" }}
- {{ partial "pre-content.html" . }}
+ {{ with $pages }}
+ <section>
+ <h2>All Posts:</h2>
+ {{ range .GroupByDate "2006" }}
+ <p>{{ .Key }}</p>
+ <ul>
+ {{ range .Pages -}}
+ <li><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
+ {{ end -}}
+ </ul>
+ {{ end }}
+ </section>
{{ end }}
- <section>{{ .Content }}</section>
-
- <section class="article-list">
- {{ range $pages }}
- {{ partial "article.html" . }}
- {{ end }}
- </section>
-
{{ end }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 082a91e..c1132e3 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -4,30 +4,17 @@
<main>
{{ partial "article-meta.html" . }}
- {{ if .Params.toc }}
- {{ .TableOfContents }}
- {{ end }}
-
- {{ if templates.Exists "partials/pre-content.html" }}
- {{ partial "pre-content.html" . }}
- {{ end }}
-
{{ .Content }}
+ </main>
- <p>
-
- {{ with .NextInSection }}
- <b>Next: </b><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
- <br>
- {{ end }}
-
- {{ with .PrevInSection }}
- <b>Previous: </b><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
- <br>
- {{ end }}
+ <section>
+ {{ with .NextInSection }}
+ <p>Next: <a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></p>
+ {{ end }}
- <b><a href="/"> >> Home</a></b>
- </p>
+ {{ with .PrevInSection }}
+ <p>Previous: <a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></p>
+ {{ end }}
+ </section>
- </main>
{{ end }}
diff --git a/layouts/authors/list.html b/layouts/authors/list.html
index cd5a915..cdb2c19 100644
--- a/layouts/authors/list.html
+++ b/layouts/authors/list.html
@@ -1,34 +1,33 @@
{{ define "main" }}
- <section class="left-to-right">
+ <section>
{{ with .Resources.GetMatch "avatar" }}
- <img class="shadow featured" src="{{ .RelPermalink }}" alt="{{ .Params.alt }}"/>
+ <img class="shadow author" src="{{ .RelPermalink }}" alt="{{ .Params.alt }}"/>
{{ end }}
<div>
<h1>{{ .Params.name }}</h1>
- <p>{{ .Params.bio }}</p>
-
- <a class="small-text" href={{ .Params.projects}}>Projects</a>
+ <a href={{ .Params.projects }}>Projects</a>
<span> | </span>
- <a class="small-text" href="mailto:{{ .Params.email }}">{{ .Params.email}}</a>
+ <a href="mailto:{{ .Params.email }}">{{ .Params.email}}</a>
</div>
</section>
- <section>
-
+ <main>
{{ .Content }}
-
- <h2>Posts:</h2>
-
- </section>
-
- <section class="article-list">
- {{ range .Data.Pages }}
- {{ partial "article.html" . }}
+ </main>
+
+ <section>
+ <h2>Posts:</h2>
+ {{ with .Data.Pages }}
+ <section class="article-list">
+ {{ range . }}
+ {{ partial "article.html" . }}
{{ end }}
- </section>
+ </section>
+ {{ end }}
+ </section>
{{ end }}
diff --git a/layouts/authors/terms.html b/layouts/authors/terms.html
index 605f26c..5a750d6 100644
--- a/layouts/authors/terms.html
+++ b/layouts/authors/terms.html
@@ -1,7 +1,7 @@
{{ define "main" }}
-<h1 class="center-text">Authors</h1>
<section>
+ <h1 class="center-text">Authors</h1>
{{ range .Data.Pages }}
{{ partial "article-alternate.html" . }}
{{ end }}
diff --git a/layouts/games/list.html b/layouts/games/list.html
deleted file mode 100644
index 5da3fbe..0000000
--- a/layouts/games/list.html
+++ /dev/null
@@ -1,27 +0,0 @@
-{{ define "main" }}
-
- <main>
- {{ partial "article-meta.html" . }}
-
- {{ if .Params.toc }}
- {{ .TableOfContents }}
- {{ end }}
-
- {{ .Content }}
- </main>
-
- {{ if gt (len .Data.Pages) 0 }}
-
- <section>
- <h2>Devlogs:</h2>
- </section>
-
- <section class="article-list">
- {{ range .Data.Pages }}
- {{ partial "article.html" . }}
- {{ end }}
- </section>
-
- {{ end }}
-
-{{ end }}
diff --git a/layouts/games/meta-extra.html b/layouts/games/meta-extra.html
deleted file mode 100644
index 32bff1e..0000000
--- a/layouts/games/meta-extra.html
+++ /dev/null
@@ -1,7 +0,0 @@
-{{ with .Params.releaseDate }}
- <h2 class="small-text">Released: {{ dateFormat "Mon | Jan 2, 2006" . }}</h2>
-{{ end }}
-
-<h2 class="small-text">Platforms:
-<span class="margin small-text">{{ delimit .Params.platforms " ยท " }}</span>
-</h2>
diff --git a/layouts/partials/article-meta.html b/layouts/partials/article-meta.html
index 31d94e3..85b8c7d 100644
--- a/layouts/partials/article-meta.html
+++ b/layouts/partials/article-meta.html
@@ -1,25 +1,19 @@
<section>
- <h1 class="large-text">{{ .Title | markdownify }}</h1>
-
{{ with .Params.authors }}
{{ $author := (index . 0) }}
- <h2>
- Author: <a href={{ printf "/%s/%s" "authors" (urlize $author) }}>{{ $author }}</a>
- </h2>
+ <h4>Author: <a href={{ printf "/%s/%s" "authors" (urlize $author) }}>{{ $author }}</a></h4>
{{ end }}
{{ with .Date }}
- <h2 class="small-text">Posted: {{ .Format "Mon | Jan 2, 2006" }}</h2>
+ <h4>Posted: {{ .Format "Mon | Jan 2, 2006" }}</h4>
{{ end }}
- {{ .Render "meta-extra" }}
-
{{ range (.GetTerms "tags") }}
<span>
- <a class="small-text" href="{{ .Permalink }}">{{ .LinkTitle }}</a>
+ <a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
</span>
{{ end }}
{{ $image := (.Resources.GetMatch "featured") }}
- {{ partial "image.html" (dict "image" $image "alt" .Params.featured.alt "class" "shadow featured margin") }}
+ {{ partial "image.html" (dict "image" $image "alt" .Params.featured.alt "class" "shadow featured") }}
</section>
diff --git a/layouts/partials/article.html b/layouts/partials/article.html
index ab6853a..e6fa05d 100644
--- a/layouts/partials/article.html
+++ b/layouts/partials/article.html
@@ -2,13 +2,13 @@
<a href=" {{.Permalink }}">
{{ $image := .Resources.GetMatch "featured" }}
- {{ partial "image.html" (dict "image" $image "alt" .Params.featured.alt) }}
+ {{ partial "image-small.html" (dict "image" $image "alt" .Params.featured.alt) }}
</a>
<div>
{{ with index (.GetTerms "tags") 0 }}
- <a class="small-text" href="{{ .Permalink }}">{{ .LinkTitle }}</a>
+ <a href="{{ .Permalink }}">{{ .LinkTitle }}</a>
{{ end }}
<h2 class="title">{{ .Title | markdownify }}</h2>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index 0061455..afd8cb9 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,5 +1,5 @@
<footer>
<hr>
- <p class="center-text"><a class="small-text" href="/authors">Authors</a></p>
- <p class="center-text small-text">{{ $.Site.Copyright | safeHTML }}</p>
+ <p><a href="/authors">Authors</a></p>
+ <p>{{ $.Site.Copyright | safeHTML }}</p>
</footer>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 52ae509..da6f5b5 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,11 +1,11 @@
<header>
- <nav class="spread">
+ <nav>
<a href="/"><img src="{{ .Site.Params.logo }}" alt="The {{ .Site.Title }} Logo"></a>
- <ul class="spread">
- {{ range .Site.Params.HeaderLinks }}
- <li><a href="{{ .url }}" title="{{ .title }}">{{ .title }}</a></li>
- {{ end }}
- <li>{{ printf `<a href="/index.xml" title="%s">RSS</a>` $.Site.Title | safeHTML }}</li>
- </ul>
+ <div>
+ {{ range .Site.Params.HeaderLinks -}}
+ <a href="{{ .url }}" title="{{ .title }}">{{ .title }}</a>
+ {{ end -}}
+ {{ printf `<a href="/index.xml" title="%s">RSS</a>` $.Site.Title | safeHTML }}
+ </div>
</nav>
</header>
diff --git a/layouts/partials/image-small.html b/layouts/partials/image-small.html
new file mode 100644
index 0000000..9c4c468
--- /dev/null
+++ b/layouts/partials/image-small.html
@@ -0,0 +1,28 @@
+<img class="{{ .class }}"
+ {{- with .image -}}
+
+ {{ $smallest := (.Resize "305x webp q60") }}
+
+ srcset="
+ {{- with $smallest -}}
+ {{ printf "%s %dw," .RelPermalink .Width }}
+ {{- end -}}
+
+ {{- with (.Resize "480x webp q60") -}}
+ {{ printf "%s %dw," .RelPermalink .Width }}
+ {{- end -}}
+
+ "
+
+ sizes="
+ (max-width: 480px) 305px;
+ 480px"
+
+ src="
+ {{- with $smallest -}}
+ {{ .RelPermalink }}
+ {{- end -}}"
+
+ alt="{{ .Params.alt }}"
+ {{- end -}}
+>
diff --git a/layouts/partials/image.html b/layouts/partials/image.html
index 144df08..9c567e9 100644
--- a/layouts/partials/image.html
+++ b/layouts/partials/image.html
@@ -1,18 +1,35 @@
<img class="{{ .class }}"
{{- with .image -}}
+
+ {{ $smallest := (.Resize "320x webp q60") }}
+
srcset="
- {{- with (.Resize "600x q40") -}}
+ {{- with $smallest -}}
+ {{ printf "%s %dw," .RelPermalink .Width }}
+ {{- end -}}
+
+ {{- with (.Resize "480x webp q60") -}}
+ {{ printf "%s %dw," .RelPermalink .Width }}
+ {{- end -}}
+
+ {{- with (.Resize "600x webp q70") -}}
+ {{ printf "%s %dw," .RelPermalink .Width }}
+ {{- end -}}
+
+ {{- with (.Resize "800x webp q90") -}}
{{ printf "%s %dw," .RelPermalink .Width }}
{{- end -}}
- {{- with (.Resize "1200x q65") -}}
- {{ printf "%s %dw" .RelPermalink .Width }}
- {{- end -}}"
+ "
- sizes="(max-width: 900px) 600px, (min-width: 901px) 1200px"
+ sizes="
+ (max-width: 480px) 320px;
+ (max-width: 600px) 480px;
+ (max-width: 800px) 600px;
+ 800px"
src="
- {{- with (.Resize "600x q40") -}}
+ {{- with $smallest -}}
{{ .RelPermalink }}
{{- end -}}"
diff --git a/layouts/partials/posts-artfully-enumerated.html b/layouts/partials/posts-artfully-enumerated.html
new file mode 100644
index 0000000..8b13789
--- /dev/null
+++ b/layouts/partials/posts-artfully-enumerated.html
@@ -0,0 +1 @@
+
diff --git a/layouts/partials/posts-enumerated.html b/layouts/partials/posts-enumerated.html
new file mode 100644
index 0000000..38b1727
--- /dev/null
+++ b/layouts/partials/posts-enumerated.html
@@ -0,0 +1,20 @@
+{{ with . }}
+<section>
+ <h2>Latest Posts:</h2>
+ <section class="article-list">
+ {{ range .Limit 5 }}
+ {{ partial "article.html" . }}
+ {{ end }}
+ </section>
+
+ <h2>All Posts:</h2>
+ {{ range .GroupByDate "2006" }}
+ <p>{{ .Key}}</p>
+ <ul>
+ {{ range .Pages -}}
+ <li><a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a></li>
+ {{ end -}}
+ </ul>
+ {{ end }}
+</section>
+{{ end }}