style: scale to width for mobile phones, increase font, smooth scrolling

RaphaelPour · Jan 23, 2024 · d50b3d7 · d50b3d7
1 parent 68bc5b1
commit d50b3d7
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git 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:[email protected]&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
@@ -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
@@ -7,9 +7,10 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>    
     <link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:[email protected]&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; }