blog: Encourage people to follow the blog or Twitter

Make follow buttons larger and eye-catching.

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/src/scss/_variables.scss b/src/scss/_variables.scss
index d44447ede4e0689d4d5f9ebfd4d03c3ee61ca68f..77d3051bb2c3db8ed11c854d20f9595c55f4e207 100644 (file)
--- a/src/scss/_variables.scss
+++ b/src/scss/_variables.scss
@@ -12,8 +12,9 @@ $red:                                         #ee2e31;
 $yellow:                                       #e7e247;
 $cyan:                                         #2ee8c8;
 
-// Lightning Wire Labs colour
+// Brand colours
 $lwl:                                          #4b0082;
+$twitter:                                      #00acee;
 
 // Theme
 $primary:                                      $red;
@@ -23,6 +24,7 @@ $dark:                                                $gray-800;
 
 $theme-colors: (
        "lwl"                                   : $lwl,
+       "twitter"               : $twitter,
 );
 
 $body-bg:                                      $dark;

diff --git a/src/templates/blog/base.html b/src/templates/blog/base.html
index a242947104648b7ef8e55f1c7e19cccec21809f9..d06dbf3a651473ce60ae3af369bbe8370c8332cd 100644 (file)
--- a/src/templates/blog/base.html
+++ b/src/templates/blog/base.html
@@ -7,7 +7,7 @@
 {% block content %}
        <div class="row">
                <div class="col-12 col-lg-3 d-none d-lg-block">
-                       <nav class="mb-5">
+                       <nav class="mb-3">
                                <ul class="nav flex-column">
                                        <li class="nav-item">
                                                <a class="nav-link {% if request.path == "/" %}active{% end %}" href="/">
@@ -38,15 +38,19 @@
                                                                alt="{{ _("Lightning Wire Labs") }}">
                                                </a>
                                        </li>
-
-                                       <li class="nav-item">
-                                               <a class="nav-link d-flex justify-content-between" href="/feed.xml">
-                                                       <span>{{ _("RSS Feed") }}</span> <span class="fas fa-rss"></span>
-                                               </a>
-                                       </li>
                                </ul>
                        </nav>
 
+                       <a class="btn btn-primary btn-block mb-3" href="/feed.xml">
+                               <i class="fas fa-rss-square fa-3x mb-2"></i>
+                               <br>{{ _("Subscribe to our Blog") }}
+                       </a>
+
+                       <a class="btn btn-twitter btn-block mb-5" href="https://twitter.com/ipfire">
+                               {{ _("Or follow us on Twitter") }}
+                               <i class="fab fa-twitter"></i>
+                       </a>
+
                        {% module BlogHistoryNavigation() %}
                </div>