From 31a7470b37afe1877882cca464425b2d5cbffb3e Mon Sep 17 00:00:00 2001
From: Peder Bergebakken Sundt <pbsds@hotmail.com>
Date: Sun, 12 Aug 2018 03:54:39 +0200
Subject: [PATCH] Fix aktiviter in mobile mode

---
 www/aktiviteter/index.php |  6 +++---
 www/anime/index.php       |  6 +++++-
 www/brettspill/index.php  | 10 +++++-----
 www/css/events.css        | 37 +++++++++++++++++++++++++++++--------
 www/css/style.css         |  3 +--
 www/nerdepitsa/index.php  |  6 +++++-
 6 files changed, 48 insertions(+), 20 deletions(-)

diff --git a/www/aktiviteter/index.php b/www/aktiviteter/index.php
index 43cb3f8..abf801a 100644
--- a/www/aktiviteter/index.php
+++ b/www/aktiviteter/index.php
@@ -44,9 +44,6 @@ $day = (isset($_GET['day']))
 		?>
 		<article>
 			<h2>
-				<?php if ($event->getImageURL()) { ?>
-				<img src="<?= $event->getImageURL() ?>">
-				<?php } ?>
 				<?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?><strong><?php } ?>
 				<em><?= $event->getRelativeDate() ?></em>
 				<?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?></strong><?php } ?>
@@ -55,6 +52,9 @@ $day = (isset($_GET['day']))
 				<?php } else { ?>
 				<?= $event->getName() ?>
 				<?php } ?>
+				<?php if ($event->getImageURL()) { ?>
+				<img src="<?= $event->getImageURL() ?>">
+				<?php } ?>
 			</h2>
 			<ul class="subtext">
 				<li>Tid: <strong><?= Agenda::getFormattedDate($event->getStart()) ?></strong></li>
diff --git a/www/anime/index.php b/www/anime/index.php
index 9062068..993497b 100755
--- a/www/anime/index.php
+++ b/www/anime/index.php
@@ -22,7 +22,11 @@ $nextEvent = $activity->getNextEventFrom(new DateTimeImmutable);
 ?>
 
 <article>
-	<h2><img src="../sosiale/animekveld.jpg"><em><?= $nextEvent->getRelativeDate()?></em> Animekveld</h2>
+	<h2><em><?= $nextEvent->getRelativeDate()?></em> Animekveld
+		<?php if ($nextEvent->getImageURL()) { ?>
+		<img src="<?= $nextEvent->getImageURL() ?>">
+		<?php } ?>
+	</h2>
 	<ul class="subtext">
 		<li>Tid:
 		<strong>
diff --git a/www/brettspill/index.php b/www/brettspill/index.php
index 9808fe4..d916c99 100755
--- a/www/brettspill/index.php
+++ b/www/brettspill/index.php
@@ -26,11 +26,11 @@ $nextEvent = $activity->getNextEventFrom(new DateTimeImmutable);
 
 <article>
 
-<h2><em><?= $nextEvent->getRelativeDate()?></em> Brettspillkveld
-	<?php if ($nextEvent->getImageURL()) { ?>
-	<img src="<?= $nextEvent->getImageURL() ?>">
-	<?php } ?>
-</h2>
+	<h2><em><?= $nextEvent->getRelativeDate()?></em> Brettspillkveld
+		<?php if ($nextEvent->getImageURL()) { ?>
+		<img src="<?= $nextEvent->getImageURL() ?>">
+		<?php } ?>
+	</h2>
 	<ul class="subtext">
 		<li>Tid:
 		<strong>
diff --git a/www/css/events.css b/www/css/events.css
index 5f93b88..8bbcbf1 100644
--- a/www/css/events.css
+++ b/www/css/events.css
@@ -29,11 +29,14 @@ h2 img {
 	border-radius: 0.1em;
 	box-shadow: 0 2px 2px gray;
 	margin-left: 1em;
+	clear: right;
+	margin-bottom: 0.8em;
+	clear: left;
 }
 article:first-child h2 img {
-	max-width: 10em;
+	max-width: 12em;
 }
-h4 {
+	h4 {
 	margin-top: 0;
 	margin-bottom: -0.6em;
 }
@@ -96,13 +99,31 @@ p + .subtext {
 }
 
 @media screen and (max-width: 50rem) {
-	h2 img {
-		display: none;
+	article h2 {
+		text-align: center;
+		position: relative;
+		border-bottom-left-radius: 0.3em;
+		border-bottom-right-radius: 0.3em;
+		max-height: 30vh;
+		overflow-y: hidden;
 	}
-	.subtext {
-		margin-top: -1em;
-	}
-	.subtext li {
+	article h2 em {
 		display: block;
+		top:0;
+		left: 0;
+		position: absolute;
+		
+	}
+	article h2 img {
+		border: none;
+		box-shadow: none;
+		border-radius: 0.3em;
+		float: none;
+		margin: 0;
+		max-width: none !important;
+		width: 100%;
+	}
+	article .subtext {
+		margin-top: -1em !important;
 	}
 }
diff --git a/www/css/style.css b/www/css/style.css
index 613a26f..e8e7a42 100644
--- a/www/css/style.css
+++ b/www/css/style.css
@@ -219,7 +219,6 @@ nav #usermenu li:first-child:hover {
 body {
 	overflow-y: scroll;
 	overflow-x: hidden;
-	min-height: 100vh;
 }
 
 * {
@@ -240,7 +239,7 @@ main h2 {
 }
 
 article {
-	margin-bottom: 7vh;
+	overflow-y: hidden;
 }
 
 .gridsplit {
diff --git a/www/nerdepitsa/index.php b/www/nerdepitsa/index.php
index de9183c..0da74ee 100755
--- a/www/nerdepitsa/index.php
+++ b/www/nerdepitsa/index.php
@@ -22,7 +22,11 @@ $nextEvent = $activity->getNextEventFrom(new DateTimeImmutable);
 ?>
 
 <article>
-	<h2><img src="../sosiale/nerdepitsa.jpg"><em><?= $nextEvent->getRelativeDate()?></em> Nerdepitsa</h2>
+	<h2><em><?= $nextEvent->getRelativeDate()?></em> Nerdepitsa
+		<?php if ($nextEvent->getImageURL()) { ?>
+		<img src="<?= $nextEvent->getImageURL() ?>">
+		<?php } ?>
+	</h2>
 	<ul class="subtext">
 		<li>Tid:
 		<strong>