From 09918290f02240264a55a121868727a596ba82a9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yannik=20R=C3=B6del?= <hey@yannik.info>
Date: Sat, 4 Feb 2023 18:22:39 +0100
Subject: [PATCH] Tweak styles for CoderDojo page action boxes

---
 sites/coderdojo/index.md        |  4 +++-
 styles/components/_actions.scss | 14 ++++++++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/sites/coderdojo/index.md b/sites/coderdojo/index.md
index 46365ce..c81cc88 100644
--- a/sites/coderdojo/index.md
+++ b/sites/coderdojo/index.md
@@ -28,10 +28,12 @@ Kostenlose Programmier- und Techniktreffen für Kinder und Jugendliche im Raum W
 
   <a href="https://seu2.cleverreach.com/f/148340-147129" target="_blank">
     <h3>Newsletter</h3>
+    <span>Bleibe über neue Veranstaltungen informiert.</span>
   </a>
 
   <a href="mailto:kontakt@angestoepselt.de">
-    <h3>Mentor werden</h3>
+    <h3>Kontakt</h3>
+    <span>Wir suchen immer interessierte Kursleitende!</span>
   </a>
 </section>
 
diff --git a/styles/components/_actions.scss b/styles/components/_actions.scss
index 41a5971..879efb7 100644
--- a/styles/components/_actions.scss
+++ b/styles/components/_actions.scss
@@ -55,6 +55,16 @@
 			height: 10rem;
 		}
 
+		> span {
+			color: colors.$gray-600;
+		}
+
+		> span,
+		> em {
+			margin-top: layout.$small-gap;
+			margin-bottom: layout.$small-gap;
+		}
+
 		&:hover {
 			background-color: colors.$gray-100;
 			transform: translateY(-0.5rem);
@@ -94,6 +104,10 @@
 			&:not(:first-of-type) {
 				grid-column: span 2;
 			}
+
+			&:nth-child(4):last-child {
+				grid-column: 3 / span 4;
+			}
 		}
 	}
 }