From d50b3d772da03d933d62341265c92ac1c6029004 Mon Sep 17 00:00:00 2001
From: Raphael Pour <info@raphaelpour.de>
Date: Tue, 23 Jan 2024 23:39:12 +0100
Subject: [PATCH] style: scale to width for mobile phones, increase font,
 smooth scrolling

---
 cmd/index.tmpl  | 3 ++-
 cmd/post.tmpl   | 5 +++--
 cmd/static.tmpl | 5 +++--
 3 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/cmd/index.tmpl b/cmd/index.tmpl
index cb27d98..21f11e0 100644
--- a/cmd/index.tmpl
+++ b/cmd/index.tmpl
@@ -9,7 +9,8 @@
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>    
         <link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap" rel="stylesheet">
 		<style>
-			body { max-width: 80ch; margin-left: auto; margin-right: auto; font-family: "Roboto Slab", serif;}
+            html { scroll-behavior: smooth; font-size: 20px;}
+			body { width: 80ch; margin-left: auto; margin-right: auto; font-family: "Roboto Slab", serif;}
 			h1 { margin:0px;}
 			pre { width:100%;overflow:auto}
 			.date { margin-top:10px;font-size: small; color: gray; }
diff --git a/cmd/post.tmpl b/cmd/post.tmpl
index 658dae6..ef739d3 100644
--- a/cmd/post.tmpl
+++ b/cmd/post.tmpl
@@ -13,9 +13,10 @@
         <meta property="og:image" content="{{.FeaturedImage}}"/>
         {{end}}
 		<style>
+            html { scroll-behavior: smooth; font-size: 20px;}
 			h1 { margin:0px;}
-			body { max-width:80ch; margin-right: auto; margin-left: auto; font-family: "Roboto Slab", serif}
-			img { max-width:80ch; }
+			body { width:80ch; margin-right: auto; margin-left: auto; font-family: "Roboto Slab", serif}
+            img { width:80ch; }
 			.footnotes > hr { border: 1px #EEE solid; }
 			.footnotes > ol { color: gray;}
 			.date { margin-top:10px;font-size: small; color: gray; }
diff --git a/cmd/static.tmpl b/cmd/static.tmpl
index adcc4b2..549ba53 100644
--- a/cmd/static.tmpl
+++ b/cmd/static.tmpl
@@ -7,9 +7,10 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>    
     <link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap" rel="stylesheet">
 		<style>
+            html { scroll-behavior: smooth; font-size: 20px;}
 			h1 { margin:0px;}			
-			body { max-width:80ch; margin-right: auto; margin-left: auto; font-family: "Roboto Slab", serif}
-			img { max-width:80ch; }
+			body { width:80ch; margin-right: auto; margin-left: auto; font-family: "Roboto Slab", serif}
+			img { width:80ch; }
 			.footnotes > hr { border: 1px #EEE solid; }
 			.footnotes > ol { color: gray;}
 			.date { margin-top:10px;font-size: small; color: gray; }