Styling improvements

app/assets/stylesheets/main.css

@@ -1,8 +1,8 @@
 :root {
   --border-color: gray;
   --highlight-color: #D36200;
-  --background-color: #CECECE;
-  --dark-background-color: #3A3A3A;
+  --background-color: #CCC;
+  --dark-background-color: #333;
   --inset-background-color: #FFFFFF;
   --alert-border-color: #800000;
   --form-error-color: #FF0000;
@@ -35,6 +35,10 @@ h1, h2, h3, h4, h5, h6, h7 {
   padding: .5em 0;
 }
 
+h3, h4, h5, h6, h7 {
+  text-decoration: underline;
+}
+
 h1 {
   font-size: 4em;
   text-align: center;
@@ -74,6 +78,10 @@ main {
   margin: 0 auto;
 }
 
+p {
+  margin: .5em 0;
+}
+
 a:link, a:visited {
   color: var(--highlight-color);
 }
@@ -82,10 +90,30 @@ a:hover {
   text-decoration: none;
 }
 
-
 a:link:has(h1), a:visited:has(h1) {
   text-decoration: none;
 }
+
+aside {
+  margin: 1em auto;
+  padding: .5em;
+  background-color: var(--inset-background-color);
+  border: 1px solid var(--border-color);
+  float: left;
+}
+
+dl {
+  line-height: 1.3em;
+}
+
+dt {
+  font-weight: bold;
+}
+
+dd {
+  margin-left: 2em;
+}
+
 main {
   padding: 1em;
 }

app/views/home_pages/index.html.erb

@@ -4,12 +4,15 @@
 NixOS and free software in general. I’m also a maker and dad, and here is where my thoughts get dumped.</p>
 
 <p>The code for my personal projects <%= link_to "can be found here", "https://git.tsvallender.co.uk/web" %></p>
-<h3>Find me:</h3>
-<dl>
+
+<aside>
+  <h3>Find me:</h3>
+  <dl>
     <dt>Mastodon</dt>
     <dd><%= link_to "@tsvallender@ruby.social", "https://ruby.social/@tsvallender" %></dd>
     <dt>Pixelfed</dt>
     <dd><%= link_to "@tsvallender@pixelfed.sdf.org", "https://pixelfed.sdf.org/tsvallender" %></dd>
     <dt>Email</dt>
     <dd><%= mail_to "t@tsvallender.co.uk" %></dd>
-</dl>
+  </dl>
+</aside>

app/views/microposts/index.html.erb

@@ -2,6 +2,8 @@
 
 <%= link_to t(".new"), new_micropost_path if logged_in? %>
 
+<%= t(".intro_html") %>
+
 <% if @microposts.empty? %>
   <p><%= t(".empty") %></p>
 <% else %>

config/locales/views/microposts/en.yml

@@ -4,6 +4,9 @@ en:
       microposts: μposts
       empty: You have no μposts yet.
       new: New μpost
+      intro_html: >
+        <p>This is a log of learning and collected notes and thoughts along the way. It’s public,
+        but that doesn’t mean it’s likely to be interesting to many people.</p>
     new:
       create: Create μpost
     edit: