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

Make the project info page mobile friendly

This commit is contained in:
Peder Bergebakken Sundt 2018-08-14 02:53:11 +02:00
parent cb9283be16
commit cc2241f71a
2 changed files with 52 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
www/css/projects.css
View File

@ -51,7 +51,7 @@ a.nostyle {
text-align: right;
font-style: italic;
opacity: 0.5;
padding: 0.1em 0.4em;
padding: 0.1em 0.4em;
}
.projects-container {
@ -69,22 +69,52 @@ a.nostyle {
}
}
@media screen and (min-width: 50rem) {
.contentsplit {
display: grid;
grid-template-columns: 17em 2.7fr;
grid-template-areas: "left right";
grid-column-gap: 0.9em;
}
}
@media screen and (max-width: 50rem) {
.contentsplit {
display: grid;
grid-template-rows: auto auto;
grid-template-areas: "right"
"left";
}
.projectmember-container {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto auto;
grid-template-areas: "organizers members"
"join join";
.contentsplit {
display: grid;
grid-template-columns: 1.3fr 2.7fr;
grid-template-areas: "left right";
}
}
.gridl {
padding: 0 1em 0 1em;
box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2);
grid-area: left;
}
.projectmember-container {
padding: 0.1em 1em;
box-shadow: 0 2px 10px 0 rgba(0,0,0,0.2);
}
.projectmember-container h2 {
text-align: center;
}
.projectmember-container >form {
text-align: center;
grid-area: join;
}
.gridr {
border-left: 0;
grid-area: right;
padding:0;
margin:0;
}
.projectmember {

28
www/prosjekt/info.php
View File

@ -44,7 +44,6 @@ if ($attrs){
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="../../css/normalize.css">
<link rel="stylesheet" href="../../css/style.css">
<link rel="stylesheet" href="../../css/events.css">
<link rel="stylesheet" href="../../css/projects.css">
<title>Prosjektverkstedet</title>
@ -67,14 +66,16 @@ if ($attrs){
</div>
<div class="gridl">
<div class="projectmember-container">
<div class="projectlead">
<h2>Prosjektledelsen</h2>
<div class="projectmember">
<?php foreach($members as $i => $data){
<?php foreach($members as $i => $data){
if($data['lead']){
?>
<p><?= $data['role'] ?></p>
<p class="membername"><?= $data['name']; ?></p>
<p><?= $data['name']; ?></p>
<p class="memberrole"><?= $data['role'] ?></p>
<p class="memberuname"><?= $data['uname']; ?></p>
<p class="memberemail"><?= $data['mail']; ?></p>
<?php }
@ -88,19 +89,20 @@ if ($attrs){
if($data['lead']){ continue; }
?>
<div class="projectmember" style="border-color: #6a0;">
<p><?= $data['role'] ? $data['role'] : 'Deltaker' ?></p>
<p class="membername"><?= $data['name']; ?></p>
<p><?= $data['name']; ?></p>
<p class="memberrole"><?= $data['role'] ? $data['role'] : 'Deltaker' ?></p>
<p class="memberuname"><?= $data['uname']; ?></p>
<p class="memberemail"><?= $data['mail']; ?></p>
</div>
<?php } ?>
<p><form action="update.php", method="post">
<input type="hidden" name="title" value="derp"/>
<input type="hidden" name="desc" value="derp"/>
<input type="hidden" name="active" value="derp"/>
<input type="hidden" name="id" value="<?= $projectID ?>"/>
<input type="submit" class="btn" name="join_or_leave" value="<?= ($is_member ? 'Forlat' : 'Bli med!') ?>"></input>
</form></p>
</div>
<form action="update.php", method="post"><p>
<input type="hidden" name="title" value="derp"/>
<input type="hidden" name="desc" value="derp"/>
<input type="hidden" name="active" value="derp"/>
<input type="hidden" name="id" value="<?= $projectID ?>"/>
<input type="submit" class="btn" name="join_or_leave" value="<?= ($is_member ? 'Forlat' : 'Bli med!') ?>"></input>
</p></form>
</div>
</div>
</main>