From 7755a7721d98173232ef169a59465578f863557c Mon Sep 17 00:00:00 2001
From: Aarni Halinen <aarni.halinen@gmail.com>
Date: Tue, 30 Mar 2021 22:19:22 +0300
Subject: [PATCH] fix event page images & improve html semantics

---
 src/views/ActualPage/ActualPageHero.tsx |  1 -
 src/views/EventPage/EventPageView.tsx   | 27 ++++++++++++++++---------
 2 files changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/views/ActualPage/ActualPageHero.tsx b/src/views/ActualPage/ActualPageHero.tsx
index 422607d..88fa1cd 100644
--- a/src/views/ActualPage/ActualPageHero.tsx
+++ b/src/views/ActualPage/ActualPageHero.tsx
@@ -49,7 +49,6 @@ const ActualPageHero: React.FC = () => (
         linkText="Yritysyhteistyö&nbsp;›"
       />
       <HeroAsideItem
-        // TODO: Too long
         header="Uusia suhteita ulkopaikkakuntalaisten kanssa"
         link="#ulkosuhteet"
         linkText="Ulkoiset suhteet&nbsp;›"
diff --git a/src/views/EventPage/EventPageView.tsx b/src/views/EventPage/EventPageView.tsx
index 0f87d7a..29ebba9 100644
--- a/src/views/EventPage/EventPageView.tsx
+++ b/src/views/EventPage/EventPageView.tsx
@@ -15,7 +15,6 @@ interface EventPageViewProps {
 }
 
 const StyledTextSection = styled(TextSection)`
-  margin: auto;
   align-items: center;
 
   & > h1 {
@@ -25,13 +24,16 @@ const StyledTextSection = styled(TextSection)`
     }
   }
 
-  time {
-    p {
+  & > div {
+    margin: auto;
+
+    & > p {
       font-size: 0.9rem;
       font-weight: bold;
       line-height: 0.4rem;
     }
   }
+
 `;
 
 const SignupButtons = styled.div`
@@ -58,18 +60,23 @@ const EventPageView: React.FC<EventPageViewProps> = ({ event }) => {
         <Image
           src={event.image || event.tags[0].icon}
           alt={event.title_fi}
+          objectFit="scale-down"
           layout="responsive"
-          width={0}
-          height={0}
+          width={16}
+          height={9}
         />
       </h1>
       <div>
         <Content source={event.content_fi} escapeHtml={false} />
-        <time>
-          <p>Paikka: {event.location_fi}</p>
-          <p>Alkaa: {date_start}</p>
-          <p>Päättyy: {date_end}</p>
-        </time>
+        <p>
+          Paikka: {event.location_fi}
+        </p>
+        <p>
+          <time>Alkaa: {date_start}</time>
+        </p>
+        <p>
+          <time>Päättyy: {date_end}</time>
+        </p>
         {/* We may have multiple signup forms. Generate own Button for each one */}
         <SignupButtons>
           {event.signupForm.map((sf) => (