Design tweaks

- Enforce a maximum width and center contents
- Move navigatin from footer to header (don't know why I thought the
  footer was a good place for navigation)
This commit is contained in:
Alejandro Angulo 2021-10-02 01:10:15 -07:00
parent 2ecff7a82f
commit cc813c7a52
No known key found for this signature in database
GPG key ID: A8B58A203A659A98
6 changed files with 33 additions and 37 deletions

View file

@ -6,6 +6,6 @@
</pre> </pre>
<p> <p>
<a href="{{ .Site.BaseURL }}">Go home</a> or use the navigation at the bottom of the page to navigate to another page. <a href="{{ .Site.BaseURL }}">Go home</a> or use the navigation at the top to navigate to another page.
</p> </p>
{{ end }} {{ end }}

View file

@ -4,9 +4,7 @@
<p> <p>
<h3><a class="title" href="{{ .RelPermalink }}">{{ .Title }}</a></h3> <h3><a class="title" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
{{ partial "metadata.html" . }} {{ partial "metadata.html" . }}
<a class="summary" href="{{ .RelPermalink }}"> <p class="summary">{{ .Summary }}</p>
<p>{{ .Summary }}</p>
</a>
</p> </p>
{{ end }} {{ end }}
{{ end }} {{ end }}

View file

@ -1,6 +1,5 @@
{{ define "main" }} {{ define "main" }}
<h1>{{ .Title }}</h1> <h1>{{ .Title }}</h1>
{{ partial "metadata.html" . }} {{ partial "metadata.html" . }}
<br><br>
{{ .Content }} {{ .Content }}
{{ end }} {{ end }}

View file

@ -1,16 +0,0 @@
<div id="site-footer">
<div class="lhs">
<a class="home-link" href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
</div>
<div class="rhs">
<nav id="nav" class="nav justify-content-center">
{{ range .Site.Menus.main }}
<a class="nav-link" href="{{ .URL }}">
{{ $text := print .Name | safeHTML }}
{{ $text }}
</a>
{{ end }}
</nav>
<span class="current-page">[{{ .Title }}]</span>
</div>
</div>

View file

@ -1,8 +1,18 @@
{{ $currentPage := . }} <div id="header">
{{ if $currentPage.IsHome }} <div id="banner">
<pre> <div class="lhs">
░█░█░█▀▀░█░░░█░░░█▀█░░░█░█░█▀█░█▀▄░█░░░█▀▄ <a class="home-link" href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
░█▀█░█▀▀░█░░░█░░░█░█░░░█▄█░█░█░█▀▄░█░░░█░█ </div>
░▀░▀░▀▀▀░▀▀▀░▀▀▀░▀▀▀░░░▀░▀░▀▀▀░▀░▀░▀▀▀░▀▀░ <div class="rhs">
</pre> <nav id="nav" class="nav justify-content-center">
{{ range .Site.Menus.main }}
<a class="nav-link" href="{{ .URL }}">
{{ $text := print .Name | safeHTML }}
{{ $text }}
</a>
{{ end }} {{ end }}
</nav>
<span class="current-page">[{{ .Title }}]</span>
</div>
</div>
</div>

View file

@ -2,6 +2,8 @@ body {
background-color: #1d2021; background-color: #1d2021;
color: #ffffdf; color: #ffffdf;
margin: 1em; margin: 1em;
max-width: 800px;
margin: 1em auto 0;
} }
a { a {
@ -15,17 +17,14 @@ a:hover {
color: #1d2021; color: #1d2021;
} }
#header-link {
text-decoration: none;
}
#content { #content {
margin-bottom: 2em; margin-top: 2em;
padding-top: 0.1em;
} }
#site-footer { #header {
background-color: #3a3a3a; background-color: #3a3a3a;
bottom: 0; top: 0;
left: 0; left: 0;
margin: 0; margin: 0;
padding: 3px 0; padding: 3px 0;
@ -33,7 +32,12 @@ a:hover {
width: 100%; width: 100%;
} }
#site-footer .current-page { #banner {
max-width: 800px;
margin: 0 auto;
padding: 0.3em 0;
}
#banner .current-page {
color: #ffaf00; color: #ffaf00;
padding: 0 5px; padding: 0 5px;
} }
@ -69,4 +73,5 @@ a:hover {
.highlight .chroma { .highlight .chroma {
padding: 1em; padding: 1em;
overflow-x: scroll;
} }