build: apply supplemental ui for antora

antora-playbook.yml

@@ -16,3 +16,4 @@ ui:
   bundle:
     url: https://gitlab.com/antora/antora-ui-default/-/jobs/artifacts/HEAD/raw/build/ui-bundle.zip?job=bundle-stable
     snapshot: true
+  supplemental_files: ./supplemental-ui

supplemental-ui/css/docs.css

@@ -0,0 +1,41 @@
+body {
+  font-size: 16px;
+}
+
+h2 {
+  margin: 60px 0 20px;
+  padding-bottom: 10px;
+  border-bottom: 1px solid #eee;
+}
+
+h3 {
+  margin: 40px 0 20px;
+}
+
+h4 {
+  margin: 20px 0 10px;
+}
+
+h5 {
+  margin: 20px 0 10px;
+  font-size: 16px;
+}
+
+table {
+  font-size: 14px;
+}
+
+th {
+  padding: 8px;
+}
+
+td {
+  word-wrap: break-word;
+  max-width: 200px;
+  padding: 8px;
+  line-height: 1.4;
+}
+
+.nav > li > a:focus, .nav > li > a:hover {
+  background-color: #fff;
+}

supplemental-ui/partials/head-styles.hbs

@@ -0,0 +1,2 @@
+<link rel='stylesheet' href='{{{uiRootPath}}}/css/site.css' />
+<link rel='stylesheet' href='{{{uiRootPath}}}/css/docs.css' />

supplemental-ui/partials/header-content.hbs

@@ -0,0 +1,39 @@
+<header class="header">
+  <nav class="navbar">
+    <div class="navbar-brand">
+      <a class="navbar-item" href="{{{or site.url siteRootPath}}}">
+        <img src="{{{uiRootPath}}}/img/hawtio_logo.svg" alt="{{site.title}}" height="40px" />
+      </a>
+      {{#if env.SITE_SEARCH_PROVIDER}}
+      <div class="navbar-item search hide-for-print">
+        <div id="search-field" class="field">
+          <input id="search-input" type="text" placeholder="Search the docs"{{#if page.home}} autofocus{{/if}}>
+        </div>
+      </div>
+      {{/if}}
+      <button class="navbar-burger" aria-controls="topbar-nav" aria-expanded="false" aria-label="Toggle main menu">
+        <span></span>
+        <span></span>
+        <span></span>
+      </button>
+    </div>
+    <div id="topbar-nav" class="navbar-menu">
+      <div class="navbar-end">
+        <a class="navbar-item" href="/">Home</a>
+        <a class="navbar-item" href="/docs/">Docs</a>
+        <a class="navbar-item" href="https://github.com/hawtio/hawtio/releases">Download</a>
+        <a class="navbar-item" href="/community/">Community</a>
+        <a class="navbar-item" href="https://github.com/hawtio/hawtio">
+          <img src="{{{uiRootPath}}}/img/social/github-light-32.png" alt="GitHub" height="20px" />
+        </a>
+        <a class="navbar-item" href="https://twitter.com/hawtio">
+          <img src="{{{uiRootPath}}}/img/social/twitter-white.png" alt="Twitter" height="20px" />
+        </a>
+        <a class="navbar-item" href="https://stackoverflow.com/questions/tagged/hawtio">
+          <img src="{{{uiRootPath}}}/img/social/stackoverflow.png" alt="StackOverflow" height="20px" />
+        </a>
+      </div>
+    </div>
+  </nav>
+</header>
+