Browse Source

Squashed commit of the following:

commit a8b9873182
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 21:31:12 2025 -0500

    fix some layouts

commit 86a069e5ef
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 21:25:20 2025 -0500

    only show labels if posts exist

commit c310b74e89
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 21:14:09 2025 -0500

    correct order of heading tags; remove larger images for mobile

commit 7c0421e3c8
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 21:13:49 2025 -0500

    minify css

commit 3f92309a91
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 20:17:11 2025 -0500

    more lighthouse fixes; simplifications to scss

commit e71d36ae03
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 20:16:50 2025 -0500

    remove fonts

commit ce224c6bd1
Author: Alexander Avery <alex.avery@beetbox.io>
Date:   Mon Feb 3 18:17:54 2025 -0500

    begin simplification
master
Alexander Avery 3 weeks ago
parent
commit
dd67510773
  1. BIN
      assets/fonts/SourceSansPro-Bold.ttf
  2. BIN
      assets/fonts/SourceSansPro-Light.ttf
  3. BIN
      assets/fonts/SourceSansPro-Regular.ttf
  4. 17
      assets/sass/code.scss
  5. 25
      assets/sass/fonts.scss
  6. 111
      assets/sass/main.scss
  7. 8
      layouts/404.html
  8. 10
      layouts/_default/baseof.html
  9. 58
      layouts/_default/list.html
  10. 31
      layouts/_default/single.html
  11. 33
      layouts/authors/list.html
  12. 2
      layouts/authors/terms.html
  13. 27
      layouts/games/list.html
  14. 7
      layouts/games/meta-extra.html
  15. 14
      layouts/partials/article-meta.html
  16. 4
      layouts/partials/article.html
  17. 4
      layouts/partials/footer.html
  18. 14
      layouts/partials/header.html
  19. 28
      layouts/partials/image-small.html
  20. 29
      layouts/partials/image.html
  21. 1
      layouts/partials/posts-artfully-enumerated.html
  22. 20
      layouts/partials/posts-enumerated.html

BIN
assets/fonts/SourceSansPro-Bold.ttf

Binary file not shown.

BIN
assets/fonts/SourceSansPro-Light.ttf

Binary file not shown.

BIN
assets/fonts/SourceSansPro-Regular.ttf

Binary file not shown.

17
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;
}
}

25
assets/sass/fonts.scss

@ -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;
}

111
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%

8
layouts/404.html

@ -1,7 +1,7 @@
{{ define "main" }}
<div class="center-box">
<h1>404</h1>
<h2 class="center-text">This page doesn't exist. Let's go <a href="/">home</a></h2>
</div>
<main>
<h1>404</h1>
<h2>This page doesn't exist. Let's go <a href="/">home</a></h2>
</main>
{{ end }}

10
layouts/_default/baseof.html

@ -19,7 +19,7 @@
<meta name="description" content="{{ delimit . "," }}">
{{- end }}
{{ $style := resources.Get "/sass/main.scss" | resources.ToCSS -}}
{{ $style := resources.Get "/sass/main.scss" | resources.ToCSS | minify -}}
<link rel="stylesheet" href="{{ $style.Permalink }}">
<title>
@ -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>

58
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 }}

31
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 }}

33
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 }}

2
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 }}

27
layouts/games/list.html

@ -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 }}

7
layouts/games/meta-extra.html

@ -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>

14
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>

4
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>

4
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>

14
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>

28
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 -}}
>

29
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 -}}"

1
layouts/partials/posts-artfully-enumerated.html

@ -0,0 +1 @@

20
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 }}
Loading…
Cancel
Save