Switch to tailwind (#16)

* Add tailwind to project
* Adapt previous design into tailwind
* Remove bootstrap
* Fix docker steps

views/layout.pug

@@ -11,40 +11,36 @@ html
         link(rel='icon' type='image/png' sizes='96x96' href='/images/favicon-96x96.png')
         link(rel='icon' type='image/png' sizes='16x16' href='/images/favicon-16x16.png')
 
-        link(rel='stylesheet', href='/stylesheets/bootstrap.css')
         link(rel='stylesheet', href='/stylesheets/style.css')
         block head
-    body
-        article
-            header
-                // Navbar
-                nav.navbar
-                    // Navbar brand
-                    a.navbar-brand(href='/')
-                        span EEEE.
-                    // Collapse button
-                    button.navbar-toggler.ham-button(type='button' data-toggle='collapse' data-target='#navbarSupportedContent23' aria-controls='navbarSupportedContent23' aria-expanded='false' aria-label='Toggle navigation' style='cursor: pointer;')
-                        .ham
-                            span
-                            span
-                            span
-                            span
-                    // Collapsible content
-                    #navbarSupportedContent23.collapse.navbar-collapse
-                        // Links
-                        ul.navbar-nav.mr-auto
-                            block nav-links
 
-            main
+    body.flex.flex-col.min-h-screen.bg-black.text-pink.font-mono.text-xl
+        nav
+            div(class="mx-auto px-5")
+                div.relative.flex.items-center.justify-between.h-16
+                    div.flex-shrink-0.flex.items-center
+                        p.block.text-3xl.font-extra.font
+                            a(href="/") EEEE.
+                    
+                    div(class="absolute inset-y-0 right-0 flex items-center")    
+                        div(id="menu").tham.tham-e-squeeze.tham-w-8
+                            div.tham-box
+                                div(class="tham-inner bg-pink")
+
+            div
+                ul(class="hidden transition duration-500 ease-in-out text-center mx-5 list-none mb-5" id="menu-items")
+                    block nav-links
+
+        main(class="flex flex-grow sm:items-stretch")
+            div(class="flex flex-col sm:flex-row flex-grow max-w-4xl mx-auto px-5")
                 block content
 
-            footer
-                p © 2020 |
-                    |
-                    |
-                    a(href="/") EEEE.
+        footer.w-full.text-center.p-4.text-base
+            p.font-mono © 2020 |
+                |
+                |
+                a(href="/").underline EEEE.
 
         script(src="/javascript/jquery-3.5.1.min.js")
-        script(src="/javascript/bootstrap.js")
         script(src="/javascript/nav.js")
         block scripts