From 8376f56097139cac92d7e5f67372b7a99c173b03 Mon Sep 17 00:00:00 2001
From: FestplattenSchnitzel <festplatte.schnitzel@posteo.de>
Date: Wed, 9 Feb 2022 02:55:05 +0100
Subject: [PATCH] Add Mastodon social icon

---
 sipa/static/css/bootstrap-social.css |  6 ++++++
 sipa/templates/base.html             | 13 ++++++++++---
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/sipa/static/css/bootstrap-social.css b/sipa/static/css/bootstrap-social.css
index 662a736c..48f6fa2d 100644
--- a/sipa/static/css/bootstrap-social.css
+++ b/sipa/static/css/bootstrap-social.css
@@ -79,6 +79,12 @@
 .btn-linkedin:active,.btn-linkedin.active,.open>.dropdown-toggle.btn-linkedin{background-image:none}
 .btn-linkedin.disabled,.btn-linkedin[disabled],fieldset[disabled] .btn-linkedin,.btn-linkedin.disabled:hover,.btn-linkedin[disabled]:hover,fieldset[disabled] .btn-linkedin:hover,.btn-linkedin.disabled:focus,.btn-linkedin[disabled]:focus,fieldset[disabled] .btn-linkedin:focus,.btn-linkedin.disabled.focus,.btn-linkedin[disabled].focus,fieldset[disabled] .btn-linkedin.focus,.btn-linkedin.disabled:active,.btn-linkedin[disabled]:active,fieldset[disabled] .btn-linkedin:active,.btn-linkedin.disabled.active,.btn-linkedin[disabled].active,fieldset[disabled] .btn-linkedin.active{background-color:#007bb6;border-color:rgba(0,0,0,0.2)}
 .btn-linkedin .badge{color:#007bb6;background-color:#fff}
+.btn-mastodon{color:#fff;background-color:#3088d4;border-color:rgba(0,0,0,0.2)}.btn-mastodon:focus,.btn-mastodon.focus{color:#fff;background-color:#246ead;border-color:rgba(0,0,0,0.2)}
+.btn-mastodon:hover{color:#fff;background-color:#246ead;border-color:rgba(0,0,0,0.2)}
+.btn-mastodon:active,.btn-mastodon.active,.open>.dropdown-toggle.btn-mastodon{color:#fff;background-color:#246ead;border-color:rgba(0,0,0,0.2)}.btn-mastodon:active:hover,.btn-mastodon.active:hover,.open>.dropdown-toggle.btn-mastodon:hover,.btn-mastodon:active:focus,.btn-mastodon.active:focus,.open>.dropdown-toggle.btn-mastodon:focus,.btn-mastodon:active.focus,.btn-mastodon.active.focus,.open>.dropdown-toggle.btn-mastodon.focus{color:#fff;background-color:#1e5b8f;border-color:rgba(0,0,0,0.2)}
+.btn-mastodon:active,.btn-mastodon.active,.open>.dropdown-toggle.btn-mastodon{background-image:none}
+.btn-mastodon.disabled,.btn-mastodon[disabled],fieldset[disabled] .btn-mastodon,.btn-mastodon.disabled:hover,.btn-mastodon[disabled]:hover,fieldset[disabled] .btn-mastodon:hover,.btn-mastodon.disabled:focus,.btn-mastodon[disabled]:focus,fieldset[disabled] .btn-mastodon:focus,.btn-mastodon.disabled.focus,.btn-mastodon[disabled].focus,fieldset[disabled] .btn-mastodon.focus,.btn-mastodon.disabled:active,.btn-mastodon[disabled]:active,fieldset[disabled] .btn-mastodon:active,.btn-mastodon.disabled.active,.btn-mastodon[disabled].active,fieldset[disabled] .btn-mastodon.active{background-color:#3088d4;border-color:rgba(0,0,0,0.2)}
+.btn-mastodon .badge{color:#3088d4;background-color:#fff}
 .btn-microsoft{color:#fff;background-color:#2672ec;border-color:rgba(0,0,0,0.2)}.btn-microsoft:focus,.btn-microsoft.focus{color:#fff;background-color:#125acd;border-color:rgba(0,0,0,0.2)}
 .btn-microsoft:hover{color:#fff;background-color:#125acd;border-color:rgba(0,0,0,0.2)}
 .btn-microsoft:active,.btn-microsoft.active,.open>.dropdown-toggle.btn-microsoft{color:#fff;background-color:#125acd;border-color:rgba(0,0,0,0.2)}.btn-microsoft:active:hover,.btn-microsoft.active:hover,.open>.dropdown-toggle.btn-microsoft:hover,.btn-microsoft:active:focus,.btn-microsoft.active:focus,.open>.dropdown-toggle.btn-microsoft:focus,.btn-microsoft:active.focus,.btn-microsoft.active.focus,.open>.dropdown-toggle.btn-microsoft.focus{color:#fff;background-color:#0f4bac;border-color:rgba(0,0,0,0.2)}
diff --git a/sipa/templates/base.html b/sipa/templates/base.html
index 46738f19..fff94c4d 100644
--- a/sipa/templates/base.html
+++ b/sipa/templates/base.html
@@ -357,21 +357,28 @@ <h2>{{ _("Kontakt") }} </h2>
                                 <hr>
 
                                 <div class="row">
-                                    <div class="col-xs-4 text-center">
+                                    <div class="col-xs-3 text-center">
+                                        <a class="btn btn-social-icon btn-mastodon"
+                                           href="https://social.anoxinon.de/@ag_dsn"
+                                           aria-label="Mastodon">
+                                            <span class="fa fa-mastodon" aria-hidden="true"></span>
+                                        </a>
+                                    </div>
+                                    <div class="col-xs-3 text-center">
                                         <a class="btn btn-social-icon btn-twitter"
                                            href="https://twitter.com/ag_dsn"
                                            aria-label="Twitter">
                                             <span class="fa fa-twitter" aria-hidden="true"></span>
                                         </a>
                                     </div>
-                                    <div class="col-xs-4 text-center">
+                                    <div class="col-xs-3 text-center">
                                         <a class="btn btn-social-icon btn-facebook"
                                            href="https://www.facebook.com/DresdnerStudentenNetz"
                                            aria-label="Facebook">
                                             <span class="fa fa-facebook" aria-hidden="true"></span>
                                         </a>
                                     </div>
-                                    <div class="col-xs-4 text-center">
+                                    <div class="col-xs-3 text-center">
                                         <a class="btn btn-social-icon btn-github"
                                            href="https://github.com/agdsn/sipa"
                                            aria-label="Github">