finish switching to classless, got a color scheme worked out too

This commit is contained in:
Brian Picciano 2022-08-16 21:32:50 -06:00
parent 5bc4c2fe4e
commit bf8412969a
5 changed files with 170 additions and 141 deletions

View File

@ -0,0 +1,69 @@
:root {
--m-red: #EE7F38;
--m-dark: #023B47;
--m-light: #fefcf3;
--m-blue: #295E52;
--nc-tx-1: var(--m-dark);
--nc-tx-2: #000;
--nc-bg-1: #FFF;
--nc-bg-2: var(--m-light);
--nc-bg-3: var(--m-dark);
--nc-lk-1: var(--m-blue);
--nc-lk-2: var(--m-red);
--nc-lk-tx: #FFF;
--nc-ac-1: var(--m-red);
--nc-ac-tx: var(--m-light);
}
html {
font-family: Georgia, serif;
font-size: 1.3em;
}
header {
background: var(--nc-bg-1);
}
h1, h2, h3, h4, h5, h6, .button-primary, .button, header, footer {
font-family: var(--nc-font-sans);
}
h1, h2, h3 {
border-bottom: 0;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
text-decoration: none;
color: var(--nc-tx-1);
}
ul {
list-style: circle;
}
hr {
margin: 2rem 0 2rem 0;
border-color: var(--nc-bg-3);
opacity: 25%;
}
table td form,
table td input {
margin: 0;
width: 100%;
}
table tr:nth-child(even) {
background-color: initial;
}

View File

@ -1,70 +1,27 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html>
<head> <head>
<meta charset="utf-8">
<link rel="stylesheet" href="{{ StaticURL "new.css" }}"> <link rel="stylesheet" href="{{ StaticURL "new.css" }}">
<link rel="stylesheet" href="{{ StaticURL "mediocre.css" }}">
<style type="text/css">
html {
font-family: Georgia, serif;
}
h1, h2, h3, h4, h5, h6, .button-primary, .button, header, footer {
font-family: var(--nc-font-sans);
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
text-decoration: none;
color: var(--nc-tx-1);
}
ul {
list-style: circle;
}
hr {
margin: 2rem 0 2rem 0;
border-color: var(--nc-bg-3);
}
</style>
</head> </head>
<body> <body>
<header> <header>
<a href="{{ BlogURL "/" }}"><strong>Mediocre Blog</strong></a>
<p> by
<a href="{{ BlogURL "/" }}"><strong>Mediocre Blog</strong></a> <a href="https://mediocregopher.com">mediocregopher</a>
by &nbsp;&nbsp;&nbsp;//&nbsp;&nbsp;&nbsp;
<a href="https://mediocregopher.com">mediocregopher</a> <a href="{{ BlogURL "follow" }}">Follow</a>
&nbsp;&nbsp; &nbsp;/&nbsp;
<a href="{{ BlogURL "follow" }}">Follow</a> <a href="{{ BlogURL "feed.xml" }}">RSS</a>
&nbsp;&nbsp; &nbsp;/&nbsp;
<a href="{{ BlogURL "feed.xml" }}">RSS</a> License: <a href="{{ StaticURL "wtfpl.txt" }}">WTFPL</a>
</p>
</header> </header>
{{ template "body" . }} {{ template "body" . }}
<footer>
<hr/>
<p>
Unless otherwised specified, all works are licensed under the
<a href="{{ StaticURL "wtfpl.txt" }}">WTFPL</a>.
</p>
</footer>
</body> </body>
</html> </html>

View File

@ -1,87 +1,96 @@
{{ define "body" }} {{ define "body" }}
<form method="POST" action="{{ BlogURL "posts/" }}"> {{ if gt (len .Payload.Tags) 0 }}
<p>
Existing tags:
<em>
{{ range $i, $tag := .Payload.Tags }}
{{ if ne $i 0 }} {{ end }}{{ $tag }}
{{ end }}
</em>
</p>
{{ end }}
<div class="row"> <form method="POST" action="{{ BlogURL "posts/" }}">
<div class="columns six"> <table>
<label for="idInput">Unique ID</label>
<tr>
<td>
Unique ID
</td>
<td>
{{ if eq .Payload.Post.ID "" }} {{ if eq .Payload.Post.ID "" }}
<input
id="idInput"
name="id"
class="u-full-width"
type="text"
placeholder="e.g. how-to-fly-a-kite"
value="{{ .Payload.Post.ID }}" />
{{ else }}
<a href="{{ PostURL .Payload.Post.ID }}" target="_blank">{{ .Payload.Post.ID }}</a>
<input name="id" type="hidden" value="{{ .Payload.Post.ID }}" />
{{ end }}
</div>
<div class="columns three">
<label for="tagsInput">Tags (space separated)</label>
<input <input
id="tagsInput" name="id"
name="tags"
class="u-full-width"
type="text" type="text"
value="{{ range $i, $tag := .Payload.Post.Tags }}{{ if ne $i 0 }} {{ end }}{{ $tag }}{{ end }}" /> placeholder="e.g. how-to-fly-a-kite"
<p class="light"> value="{{ .Payload.Post.ID }}" />
Existing tags: {{ range $i, $tag := .Payload.Tags }}{{ if ne $i 0 }} {{ end }}{{ $tag }}{{ end }} {{ else }}
</p> <a href="{{ PostURL .Payload.Post.ID }}" target="_blank">{{ .Payload.Post.ID }}</a>
</div> <input name="id" type="hidden" value="{{ .Payload.Post.ID }}" />
{{ end }}
</td>
</tr>
<div class="columns three"> <tr>
<label for="seriesInput">Series</label> <td>
<p>Tags (space separated)</p>
</td>
<td>
<input
name="tags"
type="text"
value="{{- range $i, $tag := .Payload.Post.Tags -}}
{{- if ne $i 0 }} {{ end }}{{ $tag -}}
{{- end -}}
"/>
</td>
</tr>
<tr>
<td>Series</td>
<td>
<input <input
id="seriesInput"
name="series" name="series"
class="u-full-width"
type="text" type="text"
value="{{ .Payload.Post.Series }}" /> value="{{ .Payload.Post.Series }}" />
</div> </td>
</tr>
</div> <tr>
<td>Title</td>
<div class="row"> <td>
<div class="columns six">
<label for="titleInput">Title</label>
<input <input
id="titleInput"
name="title" name="title"
class="u-full-width"
type="text" type="text"
value="{{ .Payload.Post.Title }}" /> value="{{ .Payload.Post.Title }}" />
</div> </td>
</tr>
<div class="columns six"> <tr>
<label for="descrInput">Description</label> <td>Description</td>
<td>
<input <input
id="descrInput"
name="description" name="description"
class="u-full-width"
type="text" type="text"
value="{{ .Payload.Post.Description }}" /> value="{{ .Payload.Post.Description }}" />
</div> </td>
</tr>
</div> </table>
<div class="row"> <p>
<div class="columns twelve"> <textarea
<textarea name="body"
name="body" placeholder="Blog body"
class="u-full-width" style="width:100%;height: 75vh;"
placeholder="Blog body" >
style="height: 50vh;" {{- .Payload.Post.Body -}}
> </textarea>
{{- .Payload.Post.Body -}} </p>
</textarea>
</div>
</div>
<p>
<input <input
type="submit" type="submit"
value="Preview" value="Preview"
@ -89,14 +98,18 @@
formtarget="_blank" formtarget="_blank"
/> />
<input type="submit" value="Save" formaction="{{ BlogURL "posts/" }}" /> {{ if eq .Payload.Post.ID "" }}
<input type="submit" value="Publish" formaction="{{ BlogURL "posts/" }}" />
{{ else }}
<input type="submit" value="Update" formaction="{{ BlogURL "posts/" }}" />
{{ end }}
<a href="{{ BlogURL "posts/" }}"> <a href="{{ BlogURL "posts/" }}">
<button type="button">Cancel</button> <button type="button">Back</button>
</a> </a>
</p>
</form> </form>
{{ end }} {{ end }}
{{ template "base.html" . }} {{ template "base.html" . }}

View File

@ -12,7 +12,7 @@
</h1> </h1>
<p> <p>
{{ .Payload.Description }} <em>- {{ .Payload.Description }}</em>
</p> </p>
<hr/> <hr/>

View File

@ -1,36 +1,22 @@
{{ define "posts-nextprev" }}
{{ if or (ge .Payload.PrevPage 0) (ge .Payload.NextPage 0) }}
<div id="page-turner">
{{ if ge .Payload.PrevPage 0 }}
<a style="float: left;" href="?p={{ .Payload.PrevPage}}">Newer</a>
{{ end }}
{{ if ge .Payload.NextPage 0 }}
<a style="float:right;" href="?p={{ .Payload.NextPage}}">Older</a>
{{ end }}
</div>
{{ end }}
{{ end }}
{{ define "body" }} {{ define "body" }}
<p style="text-align: center;"> <p>
<a href="{{ BlogURL "posts/" }}?edit"> <a href="{{ BlogURL "posts/" }}?edit">
<button>New Post</button> <button>New Post</button>
</a> </a>
</p> </p>
{{ template "posts-nextprev" . }} {{ if ge .Payload.PrevPage 0 }}
<p>
<a href="?p={{ .Payload.PrevPage}}">&lt; &lt; Previous Page</a>
</p>
{{ end }}
<table style="margin-top: 2rem;"> <table>
{{ range .Payload.Posts }} {{ range .Payload.Posts }}
<tr> <tr>
<td>{{ .PublishedAt }}</td> <td>{{ .PublishedAt.Local.Format "2006-01-02 15:04:05 MST" }}</td>
<td><a href="{{ PostURL .ID }}" target="_blank">{{ .Title }}</a></td> <td><a href="{{ PostURL .ID }}" target="_blank">{{ .Title }}</a></td>
<td> <td>
<a href="{{ PostURL .ID }}?edit"> <a href="{{ PostURL .ID }}?edit">
@ -50,7 +36,11 @@
</table> </table>
{{ template "posts-nextprev" . }} {{ if ge .Payload.NextPage 0 }}
<p>
<a href="?p={{ .Payload.NextPage}}">Next Page &gt; &gt;</a>
</p>
{{ end }}
{{ end }} {{ end }}