Adjust sidebar

- add mastodon link
- add hint on Digitale Oberlausitz e.V.
- small changes to margins
- replaced H3 with P elements

src/components/sidebar.tsx

@@ -3,7 +3,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"
 
 import bannerJSON from "../../content/banner.json"
 
-import { faFacebook, faGithub, faTwitter } from "@fortawesome/free-brands-svg-icons"
+import { faFacebook, faGithub, faTwitter, faMastodon } from "@fortawesome/free-brands-svg-icons"
 import { faCalendarAlt, faEnvelope, faRss } from "@fortawesome/free-solid-svg-icons"
 
 import { Col, Row } from "reactstrap"
@@ -16,14 +16,20 @@ const Sidebar = () => (
           <img alt="Logo der JUG Görlitz" src={require("../../content/images/logo.png").default} />
         </Col>
         <Col sm="6" xs="12" md="12">
-          <h3>
+          <strong>Organisiert vom <br/><a href="https://digitale-oberlausitz.eu">Digitale Oberlausitz e.V.</a></strong>
+          <p>
             Wir sind Mitglied im
             <br />
             <a href="http://www.ijug.eu/">iJUG Verband</a>
-          </h3>
+          </p>
 
-          <h3>Andere Medien</h3>
+          <p>Links:</p>
           <ul className="list-unstyled">
+            <li>
+              <a href="https://ijug.social/@Juggr">
+                <FontAwesomeIcon icon={faMastodon} /> Mastodon
+              </a>
+            </li>
             <li>
               <a href="https://twitter.com/jug_gr">
                 <FontAwesomeIcon icon={faTwitter} /> Twitter

src/styles/style.css

@@ -25,16 +25,22 @@ h2 {
   margin-bottom: 0;
 }
 
-.sidebar h3 {
+.sidebar strong {
+  display: block;
+  font-size: 1.3em;
+  margin-bottom: 1em;
+}
+.sidebar p {
   font-size: 1.2em;
+  margin-bottom: .5em;
 }
 
 .sidebar ul {
   font-size: 1.1em;
 }
 
 .sidebar li {
-  margin-bottom: 0;
+  margin-bottom: 0.2em;
 }
 
 .sidebar li > ul {
@@ -59,7 +65,7 @@ a:hover {
   color: #23527c;
   text-decoration: none;
 
-  /* 
+  /*
     this adds a line under the link that (other then text-decoration: underline) will also
      be below the icons
      */