Cleaning up a bit

website/docs/stylesheets/extra.css

@@ -0,0 +1,12 @@
+.md-announce a, .md-announce a:focus, .md-announce a:hover {
+   color: white;
+}
+
+strong {
+    white-space: nowrap;
+}
+
+.md-announce .twitter {
+   margin-left: .2em;
+   color: #00ACEE;
+}

website/mkdocs.yml

@@ -30,6 +30,9 @@ repo_name: onechart/onechart
 repo_url: https://github.com/onechart/onechart
 edit_uri: https://github.com/onechart/onechart/website
 
+extra_css:
+  - stylesheets/extra.css
+
 # Copyright
 copyright: Copyright © 2020 Laszlo Fogas
 
@@ -50,7 +53,7 @@ theme:
   language: en
   features:
     - navigation.tabs
-    - navigation.instant
+#    - navigation.instant
   palette:
     scheme: default
     primary: indigo
@@ -60,7 +63,7 @@ theme:
     code: Roboto Mono
   favicon: assets/favicon.png
   icon:
-    logo: logo
+    logo: fontawesome/regular/circle
 
 # Plugins
 plugins:

website/overrides/home.html

@@ -3,19 +3,59 @@
 <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
 {% endblock %}
 
+{% block htmltitle %}
+<title>{{ config.site_name }}</title>
+{% endblock %}
+
 {% block tabs %}
 {{ super() }}
-<section class="container mx-auto">
+
-    <div class="md-grid md-typeset">
+<style>
-        <div class="tx-hero">
+
-            <div class="tx-hero__content">
+    /* Application header should be static for the landing page */
-                <h1>Technical documentation that just works</h1>
+    .md-header {
-                <p>{{ config.site_description }}</p>
+        position: initial;
-            </div>
+    }
-        </div>
+
+    /* Remove spacing, as we cannot hide it completely */
+    .md-main__inner {
+        margin: 0;
+    }
+
+    /* Hide main content for now */
+    .md-content {
+        display: none;
+    }
+
+    /* Hide table of contents */
+    @media screen and (min-width: 60em) {
+        .md-sidebar--secondary {
+            display: none;
+        }
+    }
+
+    /* Hide navigation */
+    @media screen and (min-width: 76.25em) {
+        .md-sidebar--primary {
+            display: none;
+        }
+    }
+</style>
+
+<main class="mt-10 mx-auto max-w-screen-xl px-4 sm:mt-12 sm:px-6 md:mt-16 lg:mt-20 xl:mt-28">
+    <div class="text-center">
+        <h2 class="text-4xl tracking-tight leading-10 font-extrabold text-gray-900 sm:text-5xl sm:leading-none md:text-6xl">
+            One chart to rule them all
+        </h2>
+        <p class="mt-3 max-w-md mx-auto text-base text-gray-500 sm:text-lg md:mt-5 md:text-xl md:max-w-3xl">
+            A generic Helm chart for your application deployments - Because no-one can remember the Kubernetes yaml syntax
+        </p>
     </div>
-</section>
+</main>
+
+<div class="container mx-auto">
+    <h2></h2>
+    <h2> <br/> </h2>
+</div>
 {% endblock %}
-{% block site_nav %}{% endblock %}
 {% block content %}{% endblock %}
-{% block footer %}{% endblock %}

website/overrides/main.html

@@ -1,2 +1,11 @@
 {% extends "base.html" %}
 
+{% block announce %}
+<a href="https://twitter.com/laszlocph">
+    For updates follow <strong>@laszlocph</strong> on
+    <span class="twemoji twitter">
+      {% include ".icons/fontawesome/brands/twitter.svg" %}
+    </span>
+    <strong>Twitter</strong>
+</a>
+{% endblock %}