From c6a92c3046a42843ead25a72809d17270351c416 Mon Sep 17 00:00:00 2001
From: Nikita Karamov <nick@karamoff.dev>
Date: Fri, 12 Mar 2021 21:08:53 +0100
Subject: [PATCH] New, more Mastodon-like header

---
 src/index.pug             |  3 +--
 src/style/_variables.scss |  2 ++
 src/style/main.scss       | 17 ++++++++++++-----
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/src/index.pug b/src/index.pug
index 964fb7d..a73276f 100644
--- a/src/index.pug
+++ b/src/index.pug
@@ -40,9 +40,8 @@ html(lang="en")
 			h1
 				img(src="/icon.svg" width=72 height=72 alt="toot")
 			p
-				| Quickly post on any
+				| for
 				img(src="/mastodon.svg" width=95.5 height=27)
-				| instance
 		main
 			form#form
 				section
diff --git a/src/style/_variables.scss b/src/style/_variables.scss
index 49e7d7a..7216bc4 100644
--- a/src/style/_variables.scss
+++ b/src/style/_variables.scss
@@ -29,3 +29,5 @@ $button-hover-bg: #4ea2df;
 $button-text: white;
 
 $input-bg: #131419;
+
+$border-color: #303643;
diff --git a/src/style/main.scss b/src/style/main.scss
index 7dce27f..e23a03a 100644
--- a/src/style/main.scss
+++ b/src/style/main.scss
@@ -46,19 +46,26 @@ body {
 }
 
 header {
+	border-bottom: 1px solid $border-color;
+	padding: 1.5rem 0;
 	text-align: center;
-	padding-top: 2rem;
+	width: 100%;
 
 	h1 {
-		margin: 0 0 8px;
+		display: inline-block;
+		margin: 0 1rem 0 0;
+		vertical-align: middle;
 	}
 
 	p {
-		margin: 0 0 26px;
+		display: inline-block;
+		line-height: 1.2rem;
+		margin: 0;
+		text-align: left;
+		vertical-align: middle;
 
 		img {
-			display: inline;
-			margin-bottom: -11px;
+			vertical-align: middle;
 		}
 	}
 }