better css isolation for homepage

Author: MoralCode

_layouts/default.html

@@ -20,27 +20,32 @@
 	<style>
 		body {
 			font-family: sans-serif;
+			margin: 0;
+			background-color: #f9f9f9;
+		}
+
+		section.mainPage {
 			display: flex;
 			flex-direction: column;
 			align-items: center;
 			justify-content: center;
 			min-height: 100vh;
-			margin: 0;
-			padding: 2rem;
-			background-color: #f9f9f9;
 		}
 
 		img.logo {
 			max-width: 150px;
 			margin-bottom: 1rem;
+			margin: 0 auto;
+			display: block;
 		}
 
-		h1 {
+		h1.siteTitle {
 			font-size: 2.5em;
 			font-weight: bold;
+			text-align: center;
 		}
 
-		p {
+		section.mainPage > p {
 			font-size: 1.2em;
 			max-width: 600px;
 			text-align: center;

index.html

@@ -2,12 +2,14 @@
 layout: default
 title: Open Rowing Community
 ---
-<img class="logo" src="logo.svg" />
-<h1>{{ page.title }}</h1>
-<p>
-  <a href="https://pub.dev/publishers/openrowing.com/packages"><img alt="Static Badge" src="https://img.shields.io/badge/pub.dev-openrowing.com-blue"></a><br>
-  We're building open, community-first software for the sport of rowing. 🚣‍♀️</p>
-<p></p>
-<p><a href="https://codeberg.org/OpenRowingCommunity">Explore our Code →</a></p>
-<p><a href="https://matrix.to/#/#openrowing:matrix.org">Chat with Us →</a></p>
+<section class="mainPage">
+  <img class="logo" src="logo.svg" />
+  <h1 class="siteTitle">{{ page.title }}</h1>
+  <p>
+    <a href="https://pub.dev/publishers/openrowing.com/packages"><img alt="Static Badge" src="https://img.shields.io/badge/pub.dev-openrowing.com-blue"></a><br>
+    We're building open, community-first software for the sport of rowing. 🚣‍♀️</p>
+  <p></p>
+  <p><a href="https://codeberg.org/OpenRowingCommunity">Explore our Code →</a></p>
+  <p><a href="https://matrix.to/#/#openrowing:matrix.org">Chat with Us →</a></p>
 
+</section>