From d38947d3165733bb7cdf1e07cf44fb9ee9319c89 Mon Sep 17 00:00:00 2001
From: Matthias Puchstein <matthias@puchstein.bayern>
Date: Wed, 16 Jul 2025 21:15:52 +0200
Subject: [PATCH] added dynamic tags display to `DreamPage` for improved
 visualization and categorization of dream data

Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
---
 src/pages/DreamPage.tsx | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/src/pages/DreamPage.tsx b/src/pages/DreamPage.tsx
index fd5931d..39df153 100644
--- a/src/pages/DreamPage.tsx
+++ b/src/pages/DreamPage.tsx
@@ -183,7 +183,22 @@ export default function DreamPage() {
                         <span className="font-medium mb-1 sm:mb-0">Datum</span>
                         <span>
                             {formatDateNumeric(dream.date)}
-                          </span>
+                        </span>
+                    </div>
+                    <div className="flex flex-col sm:flex-row sm:justify-between">
+                        <span className="font-medium mb-1 sm:mb-0">Tags</span>
+                        <div className="flex flex-wrap gap-2">
+                            {dream.tags.map((tag, index) => (
+                                <span key={index} className="px-2 py-1 text-xs rounded-full"
+                                      style={{
+                                          background: 'var(--accent-gradient)',
+                                          color: 'white',
+                                          boxShadow: '0 2px 5px var(--shadow)'
+                                      }}>
+                                    {tag}
+                                </span>
+                            ))}
+                        </div>
                     </div>
                 </div>
             </div>