Merge branch 'devel_custom_hugo_theme' of https://git.freifunk-rhein-sieg.net/Freifunk-Rhein-Sieg/freifunk-rhein-sieg.net into devel_custom_hugo_theme

site/content/communities.md

@@ -0,0 +1,86 @@
+---
+title: "Communities"
+date: 2020-02-09T10:17:09+01:00
+draft: true
+---
+
+# Unterstützte Communities oder Communities unserer Mitglieder
+
+{{< community_deck_start >}}
+
+
+{{< community 
+    name="Freifunk Troisdorf" 
+    description="Die nichtkommerzielle Initiative für den Aufbau freier WLAN-Netzwerke in Troisdorf"
+    link="https://freifunk-troisdorf.de/"
+    facebook="https://www.facebook.com/freifunktdf"
+    twitter=""
+    email=""
+>}}
+
+{{< community 
+    name="Freifunk Siegburg" 
+    description=""
+    link="http://www.freifunk-siegburg.de/"
+    facebook="https://de-de.facebook.com/freifunksiegburg"
+    twitter="https://twitter.com/ff_siegburg"
+    email=""
+>}}
+
+{{< community 
+    name="Freifunk Rheinbach" 
+    description=""
+    link="http://freifunk-rheinbach.de/"
+    facebook="https://www.facebook.com/ffrhb"
+    twitter=""
+    email=""
+>}}
+
+
+{{< community_deck_end >}}
+{{< community_deck_start >}}
+
+
+{{< community 
+    name="Freifunk Altenkirchen" 
+    description=""
+    link=""
+    facebook=""
+    twitter=""
+    email=""
+>}}
+
+{{< community 
+    name="Freifunk Lohmar" 
+    description=""
+    link=""
+    facebook=""
+    twitter=""
+    email=""
+>}}
+
+{{< community 
+    name="Freifunk Meckenheim" 
+    description=""
+    link=""
+    facebook=""
+    twitter=""
+    email=""
+>}}
+
+
+{{< community_deck_end >}}
+{{< community_deck_start >}}
+
+
+{{< community 
+    name="Freifunk Sankt Augustin" 
+    description=""
+    link=""
+    facebook=""
+    twitter=""
+    email=""
+>}}
+
+
+{{< community_deck_end >}}

site/themes/hugo_ff_theme/layouts/shortcodes/community.html

@@ -0,0 +1,38 @@
+<div class="card bg-yellow">
+    <div class="card-body">
+        <h5 class="card-title text-center">{{ .Get "name" }}</h5>
+        <p class="card-text text-center">{{ .Get "description" }}</p>
+    </div>
+    <div class="card-footer p-0">
+        <div class="row m-0">
+
+            {{ if .Get "link" }}
+            <div class="col p-0">
+                <a class="btn btn-on-com-card w-100" href="{{ .Get "link" }}" target="_blank">Link</a>
+            </div>
+            {{ end }}
+
+            {{ if .Get "facebook" }}
+            <div class="col p-0">
+                <a class="btn btn-on-com-card w-100" href="{{ .Get "facebook" }}" target="_blank">Facebook</a>
+            </div>
+            {{ end }}
+
+            {{ if .Get "twitter" }}
+            <div class="col p-0">
+                <a class="btn btn-on-com-card w-100" href="{{ .Get "twitter" }}" target="_blank">Twitter</a>
+            </div>
+            {{ end }}
+
+            {{ if .Get "email" }}
+            <div class="col p-0">
+                <a class="btn btn-on-com-card w-100" href="{{ .Get "email" }}" target="_blank">Email</a>
+            </div>
+            {{ end }}
+
+        </div>
+       
+            
+        
+    </div>
+</div>

site/themes/hugo_ff_theme/layouts/shortcodes/community_deck_end.html

@@ -0,0 +1 @@
+</div>

site/themes/hugo_ff_theme/layouts/shortcodes/community_deck_start.html

@@ -0,0 +1 @@
+<div class="card-deck mb-4">

site/themes/hugo_ff_theme/static/css/custom.css

@@ -39,3 +39,32 @@ footer{
 .navbar-toggler-icon{
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")!important;
 }
+
+.bg-yellow{
+    background-color: #ffb400;
+}
+
+.btn-on-com-card:hover{
+    background-color: hsl(42, 100%, 45%);
+}
+
+@media all and (max-width: 900px) {
+    .card-deck {
+      display:block!important;
+    }
+
+    .card{
+        margin-bottom:15px!important;
+    }
+
+}
+
+@media all and (max-width: 700px) {
+    .container{
+        width: 100%!important;
+    }
+
+    h1{margin: 1em 0;overflow-wrap: break-word;}
+    h2{margin-top: 1em;overflow-wrap: break-word;}
+    h3{margin-top: 0.5em;overflow-wrap: break-word;}
+}