Spendenübersicht

src/css/sections/spenden.css

@@ -1,6 +1,6 @@
 #spenden {
   & .spenden {
-    margin-top: var(--space-xxl);
+    margin-top: var(--space-xl);
   }
 }
 
@@ -22,6 +22,10 @@
   }
 }
 
+.spenden + h2 {
+  margin-top: calc(var(--space-xxl) * 1.5);
+}
+
 .spende {
   height: 100%;
   padding-top: var(--space-xl);
@@ -43,6 +47,7 @@
     border-radius: 50%;
     border: 10px solid var(--color-card-bg);
     margin: calc(var(--space-xxl) * -1) auto 0;
+    background-color: var(--color-card-bg);
     background-size: 100%;
     background-repeat: no-repeat;
   }
@@ -64,6 +69,12 @@
     align-items: center;
   }
 
+  & .info {
+    color: var(--color-secondary);
+    font-weight: var(--font-weight-bold);
+    margin-bottom: 0;
+  }
+
   & .social {
     & a {
       position: absolute;

src/includes/mixins.pug

@@ -58,8 +58,11 @@ mixin spende(d, trunc = false)
           if d.github
             a.github(href=`https://github.com/${d.github}` target="_blank" rel="nofollow noopener"): +sprite('github', 'GitHub')
       .foot
-        a.button(href=d.spendenURL target="_blank" rel="nofollow noopener")
-          = `Spende an ${d.name}`
+        if d.spendenURL
+          a.button(href=d.spendenURL target="_blank" rel="nofollow noopener")
+            = `Spende an ${d.name}`
+        else if d.info
+          p.info= d.info
 
 mixin episodeItem(e)
   article.episodeItem&attributes(attributes)

src/index.pug

@@ -72,7 +72,7 @@ block main
         Wenn du möchtest, dass wir im Podcast deinen "Shout-Out" vorlesen, dann bist du mit 21.000 Sats dabei!
         Wir sammeln alle Einnahmen bis die 1.000.000 Sats voll sind. Dann lassen wir in unserer Telegram-Gruppe
         darüber abstimmen welches Bitcoin-Projekt aus Deutschland diese kostbaren Sats bekommen soll.
-        Wenn du also einen Shout-Out in unserem Podcast kaufst, unterstützt du damit auch ein Bitcoin Projekt.
+        Wenn du also einen Shout-Out in unserem Podcast kaufst, [unterstützt](/spenden/) du damit auch ein Bitcoin Projekt.
 
       a.button(href=site.meta.shoutoutUrl target="_blank" rel="nofollow noopener") Shout-Out senden
 

src/media.pug

@@ -60,7 +60,9 @@ block main
             img(src=assetPath(`/img/media/einundzwanzig-wallpaper-dezentralschweiz-0${i}-preview.jpg`) alt=`Wallpaper Meetup Schweiz ${1}`)
 
         p
-          a(href="https://drive.google.com/drive/folders/1SWZfGja8DoYuXsV5shCPm67Bthgmgtl2" target="_blank" rel="noopener noreferrer") Weitere Wallpaper
+          a(href="https://drive.google.com/drive/folders/1SWZfGja8DoYuXsV5shCPm67Bthgmgtl2" target="_blank" rel="noopener noreferrer"
+
+          ) Weitere Wallpaper
 
       article
         h2 Schriften

src/spenden.pug

@@ -1,19 +1,28 @@
 extends /template.pug
 
 block vars
-  - const title = 'Spendenregister'
-  - const description = 'Diese spendenfinanzierten Projekte, Initiativen und Entwickler halten wir für unterstützenswert.'
+  - const title = 'Spenden'
+  - const description = 'Die folgenden Projekte, Initiativen und Entwickler haben wir mit den Shout-Out-Beiträgen der Community bereits unterstützt.'
 
 block main
   #spenden.wrap
     section
       h1= title
+
+      h2 Spendenübersicht
       p= description
 
+      ul.spenden
+        each s in spendenuebersicht
+          +spende(s)
+
+      h2 Spendenregister
+      p Diese spendenfinanzierten Projekte, Initiativen und Entwickler halten wir für unterstützenswert.
+
       :markdown-it(html linkify typographer)
         Neue Vorschläge können gerne [per Pull Request](https://github.com/Einundzwanzig-Podcast/einundzwanzig.space/edit/master/content/spenden/) hinzugefügt werden.
         Hier gibt es ein [Video-Tutorial](https://www.youtube.com/watch?v=BNJc9LExEzU), wie ein neuer Pull Request erstellt werden kann.
 
       ul.spenden(data-shuffle)
-        each s in shuffle(spenden)
+        each s in shuffle(spendenregister)
           +spende(s)