diff --git a/iamkonstantin_web/static/css/iamkonstantin_web.css b/iamkonstantin_web/static/css/iamkonstantin_web.css
index 0de4b85..65005f7 100644
--- a/iamkonstantin_web/static/css/iamkonstantin_web.css
+++ b/iamkonstantin_web/static/css/iamkonstantin_web.css
@@ -1,12 +1,4 @@
-footer {
- border-top: 2px dotted;
- text-align: center;
-}
-
-header {
- border-bottom: 2px dotted;
-}
.skip-link {
position: absolute;
diff --git a/iamkonstantin_web/templates/base.html b/iamkonstantin_web/templates/base.html
index 79b4747..f47bad8 100644
--- a/iamkonstantin_web/templates/base.html
+++ b/iamkonstantin_web/templates/base.html
@@ -1,7 +1,7 @@
{% load static wagtailcore_tags tailwind_tags %}
-
+
@@ -39,15 +39,24 @@
{% endblock %}
</head>
-<body class="bg-gray-50 font-serif leading-normal tracking-normal {% block body_class %}{% endblock %}">
+<body class="flex h-full bg-zinc-50 dark:bg-black {% block body_class %}{% endblock %}">
+<div class="fixed inset-0 flex justify-center sm:px-8">
+ <div class="flex w-full max-w-7xl lg:px-8">
+ <div class="w-full bg-white ring-1 ring-zinc-100 dark:bg-zinc-900 dark:ring-zinc-300/20"></div>
+ </div>
+</div>
-{% include "includes/header.html" %}
+<div class="relative flex w-full">
+ {% include "includes/header.html" %}
-<main id="main">
-{% block content %}{% endblock %}
-</main>
+ <main id="main" class="flex w-full">
+ {% block content %}{% endblock %}
+ </main>
-{% include "includes/footer.html" %}
+
+ {% include "includes/footer.html" %}
+
+</div>
{# Global javascript #}
<script type="text/javascript" src="{% static 'js/iamkonstantin_web.js' %}"></script>
diff --git a/iamkonstantin_web/templates/includes/header.html b/iamkonstantin_web/templates/includes/header.html
index 5410092..9df9919 100644
--- a/iamkonstantin_web/templates/includes/header.html
+++ b/iamkonstantin_web/templates/includes/header.html
@@ -3,14 +3,14 @@
<a href="#main" class="skip-link">Skip to content</a>
{% get_site_root as site_root %}
- <nav>
- <p>
- <a href="{% pageurl site_root %}">{{ site_root.title }}</a> |
+ <nav class="w-full flex justify-center my-8">
+ <ul class="flex space-x-8">
+ <li><a href="{% pageurl site_root %}">{{ site_root.title }}</a></li>
{% for menuitem in site_root.get_children.live.in_menu %}
- <a href="{% pageurl menuitem %}">{{ menuitem.title }}</a>{% if not forloop.last %} | {% endif %}
+ <li><a href="{% pageurl menuitem %}">{{ menuitem.title }}</a></li>
{% endfor %}
- | <a href="/search/">Search</a>
- </p>
+ <li><a href="/search/">Search</a></li>
+ </ul>
</nav>
{% wagtailuserbar "top-right" %}
</header>
\ No newline at end of file