Projects/nettsiden
Projects
/
nettsiden
8
2
Fork 0
Code Issues 15 Pull Requests 2 Activity

Fix pagination buttons and mobile view of kalender

This commit is contained in:
Peder Bergebakken Sundt 2018-08-12 03:55:41 +02:00
parent 69dcc15bea
commit fbcae7b67d
2 changed files with 21 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
www/css/calendar.css
View File

@ -1,9 +1,24 @@
.pagination_bar {
display: grid;
grid-template-columns: 8em auto 8em;
grid-template-areas: "left . right";
text-align: center;
}
.pagination_bar >*:nth-child(1) {
grid-area: left;
}
.pagination_bar >*:nth-child(2) {
grid-area: right;
}
figure.calendar { figure.calendar {
margin: 0; margin: 0;
padding:0; padding:0;
overflow-x: auto;
} }
.calendar ul { .calendar ul {
min-width: 43em;
list-style-type: none; list-style-type: none;
padding-left:0; padding-left:0;
@ -88,7 +103,10 @@ figure.calendar {
color: white; color: white;
border-radius: 0.75em; border-radius: 0.75em;
text-align: center; text-align: center;
padding: 0 0.2em;
white-space: nowrap; white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.calendar ul li section + section { .calendar ul li section + section {
margin-top: 0.1em; margin-top: 0.1em;

7
www/kalender/index.php
View File

@ -36,7 +36,7 @@ $days_in_month = date('t', mktime(0, 0, 0, $month, 1, $year));
<main> <main>
<h2 style="text-align:center;">PVV Kalender for <?=$months_translations[$month-1]?> <?=$year?></h2> <h2 style="text-align:center;">PVV Kalender for <?=$months_translations[$month-1]?> <?=$year?></h2>
<p><?php <div class="pagination_bar"><?php
$pmonth = $month-1; $pmonth = $month-1;
$nmonth = $month+1; $nmonth = $month+1;
$pyear=$year; $pyear=$year;
@ -45,9 +45,8 @@ $days_in_month = date('t', mktime(0, 0, 0, $month, 1, $year));
if ($nmonth==13) {$nmonth=1; $nyear++;} if ($nmonth==13) {$nmonth=1; $nyear++;}
?> ?>
<a class="btn noselect" href="../kalender?year=<?=$pyear?>&amp;month=<?=$pmonth?>">Forrige måned</a> <a class="btn noselect" href="../kalender?year=<?=$pyear?>&amp;month=<?=$pmonth?>">Forrige måned</a>
<a class="btn noselect" style="float:right;" href="../kalender?year=<?=$nyear?>&amp;month=<?=$nmonth?>">Neste måned</a> <a class="btn noselect" href="../kalender?year=<?=$nyear?>&amp;month=<?=$nmonth?>">Neste måned</a>
</p> </div>
<figure class="calendar"> <figure class="calendar">
<ul> <ul>