Fix aktiviter in mobile mode

This commit is contained in:
Peder Bergebakken Sundt 2018-08-12 03:54:39 +02:00
parent 79e413d194
commit 31a7470b37
6 changed files with 48 additions and 20 deletions

View File

@ -44,9 +44,6 @@ $day = (isset($_GET['day']))
?> ?>
<article> <article>
<h2> <h2>
<?php if ($event->getImageURL()) { ?>
<img src="<?= $event->getImageURL() ?>">
<?php } ?>
<?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?><strong><?php } ?> <?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?><strong><?php } ?>
<em><?= $event->getRelativeDate() ?></em> <em><?= $event->getRelativeDate() ?></em>
<?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?></strong><?php } ?> <?php if (\pvv\side\Agenda::isToday($event->getStart())) { ?></strong><?php } ?>
@ -55,6 +52,9 @@ $day = (isset($_GET['day']))
<?php } else { ?> <?php } else { ?>
<?= $event->getName() ?> <?= $event->getName() ?>
<?php } ?> <?php } ?>
<?php if ($event->getImageURL()) { ?>
<img src="<?= $event->getImageURL() ?>">
<?php } ?>
</h2> </h2>
<ul class="subtext"> <ul class="subtext">
<li>Tid: <strong><?= Agenda::getFormattedDate($event->getStart()) ?></strong></li> <li>Tid: <strong><?= Agenda::getFormattedDate($event->getStart()) ?></strong></li>

View File

@ -22,7 +22,11 @@ $nextEvent = $activity->getNextEventFrom(new DateTimeImmutable);
?> ?>
<article> <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"> <ul class="subtext">
<li>Tid: <li>Tid:
<strong> <strong>

View File

@ -29,9 +29,12 @@ h2 img {
border-radius: 0.1em; border-radius: 0.1em;
box-shadow: 0 2px 2px gray; box-shadow: 0 2px 2px gray;
margin-left: 1em; margin-left: 1em;
clear: right;
margin-bottom: 0.8em;
clear: left;
} }
article:first-child h2 img { article:first-child h2 img {
max-width: 10em; max-width: 12em;
} }
h4 { h4 {
margin-top: 0; margin-top: 0;
@ -96,13 +99,31 @@ p + .subtext {
} }
@media screen and (max-width: 50rem) { @media screen and (max-width: 50rem) {
h2 img { article h2 {
display: none; text-align: center;
position: relative;
border-bottom-left-radius: 0.3em;
border-bottom-right-radius: 0.3em;
max-height: 30vh;
overflow-y: hidden;
} }
.subtext { article h2 em {
margin-top: -1em;
}
.subtext li {
display: block; 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;
} }
} }

View File

@ -219,7 +219,6 @@ nav #usermenu li:first-child:hover {
body { body {
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
min-height: 100vh;
} }
* { * {
@ -240,7 +239,7 @@ main h2 {
} }
article { article {
margin-bottom: 7vh; overflow-y: hidden;
} }
.gridsplit { .gridsplit {

View File

@ -22,7 +22,11 @@ $nextEvent = $activity->getNextEventFrom(new DateTimeImmutable);
?> ?>
<article> <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"> <ul class="subtext">
<li>Tid: <li>Tid:
<strong> <strong>