fixup! fixup! fixup! fixup! fixup! fixup! fixup! restyle

static/scss/main.scss

@@ -22,8 +22,15 @@ body {
   background-color: $base;
   font-family: Pixeloid;
   color: $text;
-  width: fit-content;
-  margin: 0 8px;
+  width: 100%;
+  /* margin: 0 8px; */
+  margin: 0;
+}
+
+main {
+  max-width: 45rem;
+  margin-inline: auto;
+  padding: 0 8px;
 }
 
 h1 {
@@ -61,6 +68,7 @@ header {
   border-radius: 2px;
   padding: 0 4px;
   color: $subtext0;
+  overflow-wrap: anywhere;
 
   &:hover {
     transition: .3s ease;

templates/host.html

@@ -11,20 +11,22 @@
 
   <h1>О сервере</h1>
 
-  <div class="block">
-    <strong>Хостер</strong>: <a href="https://play2go.cloud/">play2go</a>
-    <p>Неплохой, недорогой. В прошлом были проблемы с сетью</p>
-  </div>
+  <main>
+    <div class="block">
+      <strong>Хостер</strong>: <a href="https://play2go.cloud/">play2go</a>
+      <p>Неплохой, недорогой. В прошлом были проблемы с сетью</p>
+    </div>
 
-  <div class="block">
-    <strong>Характеристики</strong>:
-    <ul>
-      <li>CPU: Ryzen i9</li>
-      <li>RAM: 16 GiB</li>
-      <li>SSD: 120 GiB</li>
-      <li>ETH: 500GiB/s</li>
-      <li>Loc: Deutchland, Frankfurt am Mein</li>
-    </ul>
-  </div>
+    <div class="block">
+      <strong>Характеристики</strong>:
+      <ul>
+        <li>CPU: Ryzen i9</li>
+        <li>RAM: 16 GiB</li>
+        <li>SSD: 120 GiB</li>
+        <li>ETH: 500GiB/s</li>
+        <li>Loc: Deutchland, Frankfurt am Mein</li>
+      </ul>
+    </div>
+  </main>
 </body>
 </html>

templates/index.html

@@ -11,6 +11,8 @@
 
   <h1>Coders Squad</h1>
 
+  <main>
   {% include 'services.tmpl' %}
+  </main>
 </body>
 </html>

templates/services.tmpl

@@ -25,10 +25,10 @@
 				<li>DoH: <span class="mono">...</span></li>
 			</ul>
 		</div>
-		<div>
+		<p>
 			<strong>Yggdrasil</strong>:
 			<span class="mono">200:ee1:bad2:1732:4b91:c3e3:2f08:29b3</span>
-		</div>
+		</p>
 	</div>
 
 	<div class="block">