feat(styles): Improve sidebar width

bahlo · Apr 8, 2024 · fbcc19d · fbcc19d
1 parent 36726e3
commit fbcc19d
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 5 deletions.
diff --git a/src/templates/layout.rs b/src/templates/layout.rs
@@ -145,7 +145,7 @@ impl Layout {
                             main #main {
                                 (context.content)
                             }
-                            br; // Looks better in HTML-only
+                            br.hidden; // Looks better in HTML-only
                             aside {
                                 (PreEscaped(include_str!("../../static/arne.svg")))
                                 h1.hero__heading { (smart_quotes("Hej, I'm Arne—")) }
@@ -185,7 +185,7 @@ impl Layout {
                                 }
                             }
                         }
-                        br; // Looks better in HTML-only
+                        br.hidden; // Looks better in HTML-only
                         footer.footer {
                             span.footer_copyright {
                                 (PreEscaped("&copy; 2013 &ndash; ")) (Utc::now().format("%Y")) " Arne Bahlo"

diff --git a/styles/_aside.scss b/styles/_aside.scss
@@ -1,4 +1,6 @@
 aside {
+  width: 256px;
+
   nav ul {
     list-style: none;
     padding: 0;

diff --git a/styles/_base.scss b/styles/_base.scss
@@ -62,11 +62,13 @@ img {
 
 .top-part {
   display: flex;
+  gap: 2rem;
+  margin-bottom: 2rem;
 }
 
 main {
-  width: 768px;
-  padding-right: 2rem;
+  width: 500px;
+  flex-grow: 1;
 }
 
 @media (max-width: 960px) {
@@ -76,11 +78,14 @@ main {
 
   main {
     width: 100%;
-    padding-right: 0;
   }
 }
 
 footer {
   display: flex;
   justify-content: space-between;
+}
+
+.hidden {
+  display: none;
 }