From 7c24f570de1fbfc18883a1d6cac1d4c7f3eba01f Mon Sep 17 00:00:00 2001
From: Jonas Werner <s5260822@stud.uni-frankfurt.de>
Date: Thu, 20 Mar 2025 15:16:23 +0100
Subject: [PATCH] centered image in speech view

---
 src/main/resources/static/index.css     | 7 +++++++
 src/main/resources/templates/speech.ftl | 7 +++++--
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/main/resources/static/index.css b/src/main/resources/static/index.css
index 7b4108d..3c319f2 100644
--- a/src/main/resources/static/index.css
+++ b/src/main/resources/static/index.css
@@ -82,7 +82,14 @@ body {
 
 main {
     width: 80%;
+    flex: 1
+}
+
+.centered-content {
+    display: flex;
     justify-content: center;
+    align-items: center;
+    padding: 0 auto;
 }
 
 /* Heading Styling */
diff --git a/src/main/resources/templates/speech.ftl b/src/main/resources/templates/speech.ftl
index 0fd7304..8c282d8 100644
--- a/src/main/resources/templates/speech.ftl
+++ b/src/main/resources/templates/speech.ftl
@@ -32,11 +32,14 @@
     <br>
 <main>
     <#if picture??>
-         <img style="max-width: 400px; height: auto;" src="data:image/jpeg;base64,${picture}" alt="Foto von ${s.speakerName}" />
+        <div class="centered-content">
+            <img style="max-width: 400px; height: auto; margin-bottom: 20px" src="data:image/jpeg;base64,${picture}" alt="Foto von ${s.speakerName}" />
+        </div>
     <#else>
         <h2>(kein Foto verfügbar)</h2>
     </#if>
-    <br> <br>
+    <br>
+    <br>
 
     <#list s.content as c>
         <#include "speechContent.ftl">