From 249e35361910d1dbb0b6f03fc1e1db0be119d185 Mon Sep 17 00:00:00 2001
From: Gabriel Arakaki Giovanini <mail@gabrielgio.me>
Date: Tue, 12 Jul 2022 16:05:27 +0200
Subject: ref: Refactor css

- Move to display to flex
- Move away from `px`. Now most of the size are using `em`
---
 index.html | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index 54231b4..9fad9fe 100644
--- a/index.html
+++ b/index.html
@@ -27,18 +27,18 @@ body {
 }
 
 header {
-    position: relative;
+    display: flex;
+    justify-content: space-between;
     margin: auto;
-    margin-bottom: 20px;
+    margin-bottom: 1em;
     background: #0062cc;
-    padding: 10px;
+    padding: .75em;
     max-width: 960px;
 }
 
 nav {
-    position: absolute;
-    top: 10px;
-    right: 10px;
+    top: .75em;
+    right: .75em;
 }
 
 .warning {
@@ -59,6 +59,7 @@ nav {
   color: #000;
   border-radius: 0;
   text-decoration: none;
+  transition: 0.5s all;
 }
 
 .btn:hover {
@@ -72,10 +73,14 @@ nav li {
 
 .section {
     justify-content: center;
-    margin-bottom: 20px;
+    margin-bottom: 1em;
     display: flex;
 }
 
+.section input {
+    max-width: 10em;
+}
+
 .form-ctl {
     border-radius: 0;
     border-color: #888;
@@ -95,7 +100,7 @@ main {
             <nav>
                 <ul>
                     <li>
-                    <a class="btn" href="https://git.sr.ht/~gabrielgio/tres">Código fonte ➤</a>
+                        <a class="btn" href="https://git.sr.ht/~gabrielgio/tres">Código fonte ➤</a>
                     </li>
                 </ul>
             </nav>
-- 
cgit v1.2.3