From 54f805e5278fa1d1985d5e31a20d0e9d005e3698 Mon Sep 17 00:00:00 2001
From: tree <tree@hidden.cz>
Date: Sat, 24 Feb 2024 02:24:55 +0100
Subject: [PATCH] event detail responsivity fixes

---
 src/components/SpeakerList.astro |  2 +-
 src/pages/event/[id].astro       | 10 ++++------
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/components/SpeakerList.astro b/src/components/SpeakerList.astro
index e2178e5..0f7c8b2 100644
--- a/src/components/SpeakerList.astro
+++ b/src/components/SpeakerList.astro
@@ -12,7 +12,7 @@ import core from "../core.json";
         <div class="w3pn-speaker-list grid grid-cols-1 gap-6 mt-4">
             {item.speakers.map(spId => getSpeaker(core, spId)).map((speaker) => (
                 <div class="flex gap-4">
-                    <div><img class={`${thumbSize === 'big' ? 'w-16 h-16' : 'w-14 h-14'} aspect-square rounded-full`} src={speaker.imageUrl} /></div>
+                    <div><img class={`${thumbSize === 'big' ? 'w-16 h-16' : 'w-14 h-14'} aspect-square rounded-full object-contain`} src={speaker.imageUrl} /></div>
                     <div>
                         <div>
                             <span class="text-white">{speaker.name}</span>
diff --git a/src/pages/event/[id].astro b/src/pages/event/[id].astro
index 2a842a8..6c82f46 100644
--- a/src/pages/event/[id].astro
+++ b/src/pages/event/[id].astro
@@ -22,7 +22,10 @@ const ext = findExt(EventsExt, item)
 
 	<div class="middle-pane-medium mt-10">
 
-        <div class="sm:flex w-full">
+        <div class="lg:flex w-full ">
+            <div class="lg:mr-10 mb-8 lg:mb-0">
+                <div><img src={ext ? ext.coverUrl : '/logo.svg'} class="rounded border border-white/20 w-80 aspect-square object-contain" class:list={[!ext ? 'p-10' : '']} /></div>
+            </div>
             <div class="grow">
                 <h1 id="upcoming">W3PN {nameRenderer(item, true)}</h1>
 
@@ -69,11 +72,6 @@ const ext = findExt(EventsExt, item)
                     </div>
                 </div>
             </div>
-            <div class="items-right">
-                {ext &&
-                    <div><img src={ext.coverUrl} class="rounded border border-white/20 w-80 h-80 aspect-square" /></div>
-                }
-            </div>
         </div>
 
         <SpeakerList {item} thumbSize="big"/>