Tweak style and layout

assets/js/main.js

@@ -56,7 +56,7 @@ listen ("#toc-btn", "click", toggleToc);
 //
 const scrollBtn = document.getElementById('scroll-top-btn');
 const btnVisibility = () => {
-  if ((window.scrollY > 400) && (window.innerWidth >= 1590)) {
+  if ((window.scrollY > 400) && (window.innerWidth >= 1530)) {
       scrollBtn.style.display = "block";
   } else {
       scrollBtn.style.display = "none";

assets/scss/partials/_comments.scss

@@ -16,7 +16,7 @@
 // Comment Post Box
 //
 .isso-postbox {
-  padding: .5em;
+  padding: .7em;
   background-color: var(--c-bg-alt);
   label {
     font-size: .9em;
@@ -24,7 +24,7 @@
 }
 
 .isso-textarea {
-  min-height: 6em;
+  min-height: 7em;
   padding: .1em .3em;
   background-color: var(--c-bg);
 }
@@ -55,6 +55,7 @@
     width: 100%;
     border-color: var(--c-bg-alt);
     letter-spacing: normal;
+    padding: .1em .3em;
   }
 }
 
@@ -94,7 +95,7 @@
 
 .isso-avatar {
   float: left;
-  margin-top: 1.2em;
+  margin-top: 1em;
   > img {
     max-width: 2.5em;
     height: auto;
@@ -103,7 +104,7 @@
 }
 
 .isso-text-wrapper {
-  margin: 1em 0 1em 3.5em;
+  margin: .8em 0 1em 3.5em;
   display: flex;
   flex-direction: column;
 }

assets/scss/partials/_header.scss

@@ -24,5 +24,8 @@
   }
   >a.active {
     color: #fff;
+    &:hover {
+      color: $accent;
+    }
   }
 }

assets/scss/partials/_list.scss

@@ -50,7 +50,7 @@
   }
 }
 
-.album-date {
+.album-info {
   margin-top: .5em;
   margin-bottom: .8em;
   font-size: .8em;

assets/scss/style.scss

@@ -254,6 +254,10 @@ h1#page-title {
   main#site-main {
     margin-top: 3em;
   }
+  #home-center, #home-footer {
+    padding-left: 15vw;
+    padding-right: 15vw;
+  }
   .wrapper {
     max-width: 780px;
     text-align: justify;
@@ -298,19 +302,16 @@ h1#page-title {
   }
 }
 
-@media all and (min-width: 1590px) {
+@media all and (min-width: 1530px) {
   :root {
     --offset: 280px;
   }
-  html {
-    font-size: 1.2em;
-  }
   main#site-main {
     margin-top: 6em;
   }
   #home-center, #home-footer {
-    padding-left: 15vw;
-    padding-right: 15vw;
+    padding-left: 16vw;
+    padding-right: 16vw;
   }
   .wrapper {
     margin-left: var(--offset);
@@ -379,4 +380,7 @@ h1#page-title {
   :root {
     --offset: 380px;
   }
+  html {
+    font-size: 1.2em;
+  }
 }

layouts/gallery/list.html

@@ -19,7 +19,7 @@
 				{{ $abulmLink := .Permalink -}}
 				<a href="{{ $abulmLink }}">{{.Title}}</a>
 			</h2>
-			<p class="album-date">{{ time.Format .Site.Params.dateform .Params.shot_date }}</p>
+			<p class="album-info">{{ time.Format .Site.Params.dateform .Params.shot_date }} &#183; In {{.Params.location}}</p>
 			<a href="{{ $abulmLink }}" class="album-row">
 				{{- range .Params.images -}}
 				<div class="img-tile"><img src="{{. | absURL}}" loading="lazy"></div>