From f554c9fb48420479913f7164fcef7559de92ec72 Mon Sep 17 00:00:00 2001
From: Jake Howard <git@theorangeone.net>
Date: Wed, 17 Aug 2022 13:40:07 +0100
Subject: [PATCH] Add custom buttons to hero

---
 static/src/scss/base.scss                     |  2 +-
 .../blog/templates/blog/blog_list_page.html   |  5 +++
 website/common/templates/wagtail_base.html    | 42 ++++++++++---------
 3 files changed, 28 insertions(+), 21 deletions(-)

diff --git a/static/src/scss/base.scss b/static/src/scss/base.scss
index 9f3da3f..2341372 100644
--- a/static/src/scss/base.scss
+++ b/static/src/scss/base.scss
@@ -32,7 +32,7 @@ a {
   transition: color 0.25s, background-color 0.25s;
 
   @include dark-mode {
-    &:hover {
+    &:not(.button):hover {
       color: $grey-lighter;
     }
   }
diff --git a/website/blog/templates/blog/blog_list_page.html b/website/blog/templates/blog/blog_list_page.html
index 0d950d6..0e4d4fc 100644
--- a/website/blog/templates/blog/blog_list_page.html
+++ b/website/blog/templates/blog/blog_list_page.html
@@ -6,6 +6,11 @@
   <link rel="alternate" type="application/rss+xml" href="{% routablepageurl page 'feed' %}">
 {% endblock %}
 
+{% block hero_buttons %}
+  <a class="button is-radiusless" href="{% routablepageurl page 'feed' %}" title="View feed"><i class="fas fa-rss" aria-hidden="true"></i></a>
+  {{ block.super }}
+{% endblock %}
+
 {% block post_content %}
   <section class="container">
     {% for page in child_pages %}
diff --git a/website/common/templates/wagtail_base.html b/website/common/templates/wagtail_base.html
index 66811cd..e8bed08 100644
--- a/website/common/templates/wagtail_base.html
+++ b/website/common/templates/wagtail_base.html
@@ -23,29 +23,31 @@
             {% include "common/content-details.html" %}
           </div>
           <div class="column is-narrow dropdown-wrapper is-hidden-touch is-grouped">
-            {% if page.table_of_contents %}
-              <div class="dropdown is-hoverable is-right" id="table-of-contents">
-                <div class="dropdown-trigger">
-                  <button class="button is-radiusless" aria-haspopup="true" aria-controls="toc-menu">
-                    <span>Table of Contents</span>
-                    <span class="icon is-small">
-                      <i class="fas fa-angle-down" aria-hidden="true"></i>
-                    </span>
-                  </button>
-                </div>
-                <div class="dropdown-menu" id="toc-menu" role="menu">
-                  <div class="dropdown-content menu">
-                    <ul class="menu-list">
-                      {% for toc_item in page.table_of_contents %}
-                        {% include "common/toc-item.html" %}
-                      {% endfor %}
-                    </ul>
+            {% block hero_buttons %}
+              {% if page.table_of_contents %}
+                <div class="dropdown is-hoverable is-right" id="table-of-contents">
+                  <div class="dropdown-trigger">
+                    <button class="button is-radiusless" aria-haspopup="true" aria-controls="toc-menu">
+                      <span>Table of Contents</span>
+                      <span class="icon is-small">
+                        <i class="fas fa-angle-down" aria-hidden="true"></i>
+                      </span>
+                    </button>
+                  </div>
+                  <div class="dropdown-menu" id="toc-menu" role="menu">
+                    <div class="dropdown-content menu">
+                      <ul class="menu-list">
+                        {% for toc_item in page.table_of_contents %}
+                          {% include "common/toc-item.html" %}
+                        {% endfor %}
+                      </ul>
+                    </div>
                   </div>
                 </div>
-              </div>
-            {% endif %}
+              {% endif %}
 
-            <button class="button is-radiusless scroll-top">Top <i class="fas fa-angle-up ml-2" aria-hidden="true"></i></button>
+              <button class="button is-radiusless scroll-top">Top <i class="fas fa-angle-up ml-2" aria-hidden="true"></i></button>
+            {% endblock %}
           </div>
         </div>
       </div>