add icons for social media links

themes/hugo-theme-flat/layouts/partials/side-contact.html

@@ -1,19 +1,17 @@
 <div class="side-contact">
     <h2>Kontakt</h2>
-
-
+    <br />
     <ul>
             <li>
                 kontakt@c3re.de
             </li>
             <li>
-                <a href="https://matrix.to/#/#hackerhuette:matrix.c3re.de">Matrix Chat</a>
+                02361/8488096
             </li>
         <li>
-            <a href="https://chaos.social/@c3re">Mastodon</a>
-        </li>
-        <li>
-            <a href="https://github.com/orgs/c3re">Github</a>
+                <a class="icon" href="https://matrix.to/#/#hackerhuette:matrix.c3re.de"><img alt="Matrix Chat" src="/img/matrix.png" /></a>
+            <a class="icon" href="https://chaos.social/@c3re"><img alt="Mastodon" src="/img/mastodon.png" /></a>
+            <a class="icon" href="https://github.com/orgs/c3re"><img alt="Github" src="/img/github.png" /></a>
         </li>
 
     </ul>

themes/hugo-theme-flat/static/css/style.css

@@ -199,6 +199,9 @@ a.external:after {
 .side-contact {
   background-color: var(--color-bg-content);
 }
+.side-contact .icon {
+  margin-right: 1em;
+}
 
 /* place header in the center of header-wrapper */
 .header-wrapper {