From e9da362dfe905839545321830146ddaa453adf38 Mon Sep 17 00:00:00 2001
From: Sebin Nyshkim <sebin.nyshkim@icloud.com>
Date: Thu, 26 Mar 2020 12:08:09 +0100
Subject: [PATCH] feat: add avatar to header and align header left

---
 src/App.vue | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 599d52a..b58f404 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,8 +1,11 @@
 <template>
   <div id="app">
     <header>
-      <h1>{{ appName }}</h1>
-      <h2>{{ appSubtitle }}</h2>
+      <img src="/img/sebin-smug-icon.png" alt="Sebin Avatar" />
+      <div>
+        <h1>{{ appName }}</h1>
+        <h2>{{ appSubtitle }}</h2>
+      </div>
     </header>
 
     <section>
@@ -349,7 +352,16 @@ export default {
 }
 
 header {
-  text-align: center;
+  display: flex;
+
+  img {
+    flex: 0 1 20%;
+  }
+
+  div {
+    flex: 0 1 80%;
+    padding-left: 1em;
+  }
 
   h1 {
     font-size: 2.2em;