Update the internals of the styling a little

Fixes #4
This commit is contained in:
BBaoVanC 2021-09-27 14:16:52 -05:00
parent 718efd865e
commit f0cd329901
Signed by: bbaovanc
GPG Key ID: 18089E4E3CCF1D3A
5 changed files with 31 additions and 15 deletions

View File

@ -6,7 +6,7 @@
{{- partial "header.html" . -}}
{{ partial "navbar.html" . }}
<div class="row">
<div class="page">
{{ if and (ne .Params.Toc false) .IsPage }}
<div class="side">
<h3>Table of Contents</h3>

View File

@ -27,11 +27,12 @@
{{ else }}
<small>
Site-wide tags:
<div>
<span class="tags">
<br />
{{ range .Site.Taxonomies.tags }}
<a href="{{ .Page.Permalink }}">#{{ .Page.Title }}</a>&nbsp;
{{ end }}
</div>
</span>
</small>
{{ end }}
{{ end }}

View File

@ -1,12 +1,27 @@
{{ define "main" }}
<h1>{{ .Title | markdownify }}</h1>
<!-- I'd like to get rid of the unnaturally large gap between the
header and the metadata (date, tags, etc) -->
{{ if .Date }}
<time datetime="{{ .Date.Format "2006-01-02" }}" pubdate>
{{ .Date.Format "2006-01-02" }}
<time datetime="{{ .Date.Format "January 2, 2006" }}" pubdate>
{{ .Date.Format "January 2, 2006" }}
</time>
{{ if ne .Lastmod .Date }}
( Modified
<time datetime="{{ .Lastmod.Format "January 2, 2006" }}" pubdate>
{{ .Lastmod.Format "January 2, 2006" }}
</time>
) <!-- I don't know how to get rid of the whitespace in between here,
so I'll just live with it for now. -->
{{ end }}
{{ end }}
<br />
<span class="tags">
{{ range (.GetTerms "tags") }}
<a href="{{ .Permalink }}">#{{ .LinkTitle }}</a>
{{ end }}
</span>
{{ .Content }}
{{ end }}

View File

@ -1,6 +1,6 @@
<div class="navbar">
<nav id="main">
<a href="{{ "/" | relURL }}">Home</a>
{{ range .Site.Menus.main }}
<a href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
</div>
</nav>

View File

@ -1,10 +1,10 @@
@media screen and (max-width: 700px) {
.row {
.page {
flex-direction: column;
}
}
@media screen and (max-width: 400px) {
.navbar a {
#main a {
float: none;
width: 100%;
}
@ -35,11 +35,11 @@ blockquote {
font-size: 40px;
}
.navbar {
#main {
overflow: hidden;
background-color: #222;
}
.navbar a {
#main a {
float: left;
display: block;
color: lightgray;
@ -47,7 +47,7 @@ blockquote {
padding: 14px 20px;
text-decoration: none;
}
.navbar a:hover {
#main a:hover {
background-color: #444;
color: white;
}
@ -55,7 +55,7 @@ blockquote {
* {
box-sizing: border-box;
}
.row {
.page {
flex: 1;
display: flex;
flex-wrap: wrap;