millironx/pages
1
0
Fork 0
Code Issues Pull requests Releases Packages Activity

Compare commits

base: millironx:f08b173cc439ad1775f8f07ddf2c5d99be5ee99c
Branches Tags
millironx:master
millironx:pages
millironx:feat/characters
millironx:indiewebpub
millironx:feat/indiweb
millironx:feat/no-node
millironx:feat/css-cleanup
millironx:feature/woodpecker
millironx:feature/about
millironx:hotfix/postcss
millironx:gh-pages
...
compare: millironx:2fe579bcc7c00781f77ce80e0c3ed6b0eb6234dd
Branches Tags
millironx:pages
millironx:master
millironx:feat/characters
millironx:indiewebpub
millironx:feat/indiweb
millironx:feat/no-node
millironx:feat/css-cleanup
millironx:feature/woodpecker
millironx:feature/about
millironx:hotfix/postcss
millironx:gh-pages

2 commits
f08b173cc4 ... 2fe579bcc7

Author SHA1 Message Date
Thomas A. Christensen II
2fe579bcc7
feat: Make page occupy middle of screen
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
Details
2025-10-20 09:36:04 -05:00
Thomas A. Christensen II
a85c956e12
perf: Add contain directive to scrolling header 2025-10-20 08:01:46 -05:00
3 changed files with 46 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

21
assets/styles/millironx.css
View file

@ -203,6 +203,19 @@ body {
flex-direction: column;
min-height: 98vh;
margin: 0 8px;
align-items: center;
}
.container {
max-width: min(60rem, 100vw - 2rem);
}
.footer-inner {
width: min(60rem, 100vw - 2rem);
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
}
a {
@ -295,14 +308,14 @@ figure:has(blockquote) > figcaption {
}
footer {
display: flex;
flex-direction: column;
align-items: center;
background-color: var(--container-background);
margin: 0 0 -1em -1em;
width: calc(100% - 1em);
padding: 0.25em 1.25em;
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
font-size: smaller;
}
form {

3
assets/styles/scrolling-header.css
View file

@ -18,6 +18,8 @@
animation: sticky-header linear forwards;
animation-timeline: scroll();
animation-range: 0 30vh;
contain: content;
}
@keyframes blurry-header {
@ -60,6 +62,7 @@
main section {
margin: 0 0.25em;
contain: content;
}
} /* end @supports */
} /* end @media */

46
layouts/_default/baseof.html
View file

@ -37,31 +37,37 @@
<body>
<header>
<object data="{{ $millironx.Permalink }}">
<img src="{{ $millironx.Permalink }}" alt="Milliron X" />
</object>
<h1 class="font-small-caps">Milliron X</h1>
</header>
<div class="row" id="content">
{{ partial "sidebar" . }}
<main>{{ block "main" . }}{{ .Content }}{{ end }}</main>
<div class="container">
<header>
<object data="{{ $millironx.Permalink }}">
<img src="{{ $millironx.Permalink }}" alt="Milliron X" />
</object>
<h1 class="font-small-caps">Milliron X</h1>
</header>
<div class="row" id="content">
{{ partial "sidebar" . }}
<main>{{ block "main" . }}{{ .Content }}{{ end }}</main>
</div>
</div>
<footer>
{{ $brandedbull := resources.Get "graphics/brandedbull.svg" }}
{{ $brandedbullsmall := $brandedbull | resources.Minify }}
<img src="{{ $brandedbullsmall.Permalink }}" height="95rem" />
<div class="container">
<div class="footer-inner">
<img src="{{ $brandedbullsmall.Permalink }}" height="95rem" />
<p>
&copy; {{ now | time.Format "2006" }} Thomas A. Christensen II
<br />
Licensed
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"
>CC-BY 4.0</a
>
<br />
Built with <a href="https://gohugo.io">Hugo</a> v{{ hugo.Version }}
</p>
<p>
&copy; {{ now | time.Format "2006" }} Thomas A. Christensen II
<br />
Licensed
<a rel="license" href="http://creativecommons.org/licenses/by/4.0/"
>CC-BY 4.0</a
>
<br />
Built with <a href="https://gohugo.io">Hugo</a> v{{ hugo.Version }}
</p>
</div>
</div>
</footer>
{{ with .Params.validation }}{{- partial "form-validation.html" -}}{{ end }}