CSS: Don't make buttons glow everywhere

This looked rather odd on the blog

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

diff --git a/src/scss/style.scss b/src/scss/style.scss
index 783d08db7737a4b8183ba1fbccd3c849b58a445b..1133237058d5c7b6e00cbbcd4265de012c52b1d0 100644 (file)
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -56,7 +56,7 @@ body {
 }
 
 @each $color, $value in $theme-colors {
-       .btn-outline-#{$color} {
+       .btn-glow-#{$color} {
                background-color: rgba($value, .15);
        }
 }

diff --git a/src/templates/index.html b/src/templates/index.html
index 815d7a6ab2b8ec8b9eacca947e8fd8aa17499f78..6171c7133086e457a704dbcb369ddc5cc738b440 100644 (file)
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -18,8 +18,8 @@
                                        <h1 class="display-1">The Open Source Firewall Distribution</h1>
 
                                        <div class="btn-toolbar">
-                                               <a class="btn btn-outline-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a>
-                                               <a class="btn btn-outline-secondary btn-lg ml-3" href="/features">{{ _("Features") }}</a>
+                                               <a class="btn btn-outline-primary btn-glow-primary btn-lg mr-3" href="/download">{{ _("Download") }}</a>
+                                               <a class="btn btn-outline-secondary btn-glow-secondary btn-lg ml-3" href="/features">{{ _("Features") }}</a>
                                        </div>
                                </div>
                        </div>