Styling improvements

This commit is contained in:
Trevor Vallender 2023-10-05 19:22:31 +01:00
parent 8759a9062c
commit 592120aeae
4 changed files with 48 additions and 12 deletions

View File

@ -1,8 +1,8 @@
:root { :root {
--border-color: gray; --border-color: gray;
--highlight-color: #D36200; --highlight-color: #D36200;
--background-color: #CECECE; --background-color: #CCC;
--dark-background-color: #3A3A3A; --dark-background-color: #333;
--inset-background-color: #FFFFFF; --inset-background-color: #FFFFFF;
--alert-border-color: #800000; --alert-border-color: #800000;
--form-error-color: #FF0000; --form-error-color: #FF0000;
@ -35,6 +35,10 @@ h1, h2, h3, h4, h5, h6, h7 {
padding: .5em 0; padding: .5em 0;
} }
h3, h4, h5, h6, h7 {
text-decoration: underline;
}
h1 { h1 {
font-size: 4em; font-size: 4em;
text-align: center; text-align: center;
@ -74,6 +78,10 @@ main {
margin: 0 auto; margin: 0 auto;
} }
p {
margin: .5em 0;
}
a:link, a:visited { a:link, a:visited {
color: var(--highlight-color); color: var(--highlight-color);
} }
@ -82,10 +90,30 @@ a:hover {
text-decoration: none; text-decoration: none;
} }
a:link:has(h1), a:visited:has(h1) { a:link:has(h1), a:visited:has(h1) {
text-decoration: none; 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 { main {
padding: 1em; padding: 1em;
} }

View File

@ -4,12 +4,15 @@
NixOS and free software in general. Im also a maker and dad, and here is where my thoughts get dumped.</p> NixOS and free software in general. Im 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> <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> <dt>Mastodon</dt>
<dd><%= link_to "@tsvallender@ruby.social", "https://ruby.social/@tsvallender" %></dd> <dd><%= link_to "@tsvallender@ruby.social", "https://ruby.social/@tsvallender" %></dd>
<dt>Pixelfed</dt> <dt>Pixelfed</dt>
<dd><%= link_to "@tsvallender@pixelfed.sdf.org", "https://pixelfed.sdf.org/tsvallender" %></dd> <dd><%= link_to "@tsvallender@pixelfed.sdf.org", "https://pixelfed.sdf.org/tsvallender" %></dd>
<dt>Email</dt> <dt>Email</dt>
<dd><%= mail_to "t@tsvallender.co.uk" %></dd> <dd><%= mail_to "t@tsvallender.co.uk" %></dd>
</dl> </dl>
</aside>

View File

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

View File

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