From 3070819beabbfcf53d57b0936704a6f38b505c8d Mon Sep 17 00:00:00 2001
From: jk <jk@nipponalba.scot>
Date: Tue, 24 Nov 2020 08:58:19 +0000
Subject: [PATCH] a few style adjustments

---
 layouts/partials/pagination.html       | 10 ++----
 themes/nipponalba/static/css/style.css | 44 ++++++++++++++++++--------
 2 files changed, 33 insertions(+), 21 deletions(-)

diff --git a/layouts/partials/pagination.html b/layouts/partials/pagination.html
index 7d018afc..e3555efe 100644
--- a/layouts/partials/pagination.html
+++ b/layouts/partials/pagination.html
@@ -3,15 +3,11 @@
 
 <ul class="pagination">
   <li class="pagination__item pagination__item--previous">
-  {{ if $paginator.HasPrev }}<a href="{{ $paginator.Prev.URL }}" class="pagination__link pagination__link--previous">{{end}}
-      OLDER
-      {{ if $paginator.HasPrev }}</a>{{end}}
+  {{ if $paginator.HasPrev }}<a href="{{ $paginator.Prev.URL }}" class="pagination__link pagination__link--previous">{{end}}OLDER{{ if $paginator.HasPrev }}</a>{{end}}
   </li>
-  <li>Page {{ $paginator.PageNumber }} of {{ $paginator.TotalPages }}</li>
+  <li>{{ $paginator.PageNumber }} of {{ $paginator.TotalPages }}</li>
 <li class="pagination__item pagination__item--next">
-{{ if $paginator.HasNext }}<a href="{{ $paginator.Next.URL }}" class="pagination__link pagination__link--next">{{end}}
-  NEWER
-{{ if $paginator.HasNext }}</a>{{end}}
+{{ if $paginator.HasNext }}<a href="{{ $paginator.Next.URL }}" class="pagination__link pagination__link--next">{{end}}NEWER{{ if $paginator.HasNext }}</a>{{end}}
 </li>
 </ul>
 {{ end }}
diff --git a/themes/nipponalba/static/css/style.css b/themes/nipponalba/static/css/style.css
index 77d45178..9e131daf 100644
--- a/themes/nipponalba/static/css/style.css
+++ b/themes/nipponalba/static/css/style.css
@@ -175,6 +175,7 @@ main {
   width: 800px;
   margin: 0 auto;
   background: var(--bg-colour);
+  padding-bottom: 100px;
 }
 
 .about, .archive, .bookmarks {
@@ -311,7 +312,7 @@ main {
   object-position:top;
 }
 .h-entry{
-  width: 98%;
+  width: calc(100% - 22px);
   box-shadow: 0 2px 3px var(--shadow-colour);
   border: 1px solid var(--border-colour);
   border-radius: 15px;
@@ -557,28 +558,48 @@ img.thumb{
   object-fit:cover;
   object-position:top;
   margin: 0 auto;
-
   border: 1px solid var(--text-colour);
 }
 hr{
   border-top:1px dotted var(--text-colour);
   border-bottom:0;
 }
-.pagination {
+#pagination-top{
+  display:block;
+  margin:0;
+  padding:0;
+}
+ul.pagination {
    list-style:none;
    margin: 0 auto;
+   text-align: center;
+   vertical-align: middle;
    border:0px;
+   padding:0;
    padding-top:20px;
-   display:flex;
-   max-width: 340px;
-   width:100%;
+   display:grid;
+   grid-template-columns: 33% 34% 33%;
+   min-width:100%;
+   text-align: center;
 }
 .pagination li{
-  padding:10px 20px;
   font-weight:normal;
+  display:inline;
+  padding: 0;
+  margin: 0;
+}
+
+.pagination > li:nth-child(1){
+  text-align:left;
+  grid-column: 1;
+}
+.pagination > li:nth-child(2){
+  text-align:center;
+  grid-column: 2;
 }
-.pagination-bottom{
-  padding-bottom:100px;
+.pagination > li:nth-child(3){
+  text-align:right;
+  grid-column: 3;
 }
 .pagination a {
   color: var(--text-colour);
@@ -707,9 +728,4 @@ nav #Blogs{
 nav label{
   display:none;
 }
-
-.pagination{
-  height: 30px;
-  max-width: 460px;
-}
 }