Make list of projects look nice. Added Drift and Styret on the top
This commit is contained in:
parent
4445f659a7
commit
6601ec041e
|
|
@ -1,14 +1,19 @@
|
|||
.project-card {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
border-radius: 4px;
|
||||
width: 18em;
|
||||
height: 8em;
|
||||
padding: 0;
|
||||
margin: 0 1em 1em 0;
|
||||
border: 1px solid #002244;
|
||||
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
|
||||
box-sizing: border-box;
|
||||
border-radius: 0.3em;
|
||||
border: 0 solid #048;
|
||||
border-left-width: 0.7em;
|
||||
box-shadow: 0.1em 0.2em 0.5em 0em rgba(0,0,0,0.3);
|
||||
overflow: hidden;
|
||||
top:0;
|
||||
min-height: 6em;
|
||||
margin:0;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.project-card:hover {
|
||||
box-shadow: 0.1em 0.2em 0.5em 0em rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.project-title {
|
||||
|
|
@ -19,50 +24,61 @@
|
|||
|
||||
.card-content {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: .6em;
|
||||
height: 4.3em;
|
||||
margin: .6em;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.card-content p {
|
||||
height: 2.5em;
|
||||
overflow: hidden;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
|
||||
.project-organizer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
padding: .3em .6em;
|
||||
border-top: 1px solid #002244;
|
||||
font-size: .8em;
|
||||
}
|
||||
|
||||
.card-content * {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.projects-divider {
|
||||
border: 0;
|
||||
margin-bottom: 2em;
|
||||
.project-organizer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: 0;
|
||||
font-size: .8em;
|
||||
text-align: right;
|
||||
font-style: italic;
|
||||
opacity: 0.5;
|
||||
padding: 0.1em 0.4em;
|
||||
}
|
||||
|
||||
.projects-container {
|
||||
margin-top: 2em;
|
||||
margin-bottom: 3em;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-column-gap: 0.5em;
|
||||
grid-row-gap: 1.3em;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 60em) {
|
||||
.projects-container {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.gridr {
|
||||
border-left: 0;
|
||||
grid-area: right;
|
||||
}
|
||||
|
||||
.projectmember {
|
||||
|
|
@ -103,4 +119,4 @@
|
|||
display: inline-block;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,31 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="no">
|
||||
<title>Driftverkstedet</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
||||
<link rel="stylesheet" href="../css/normalize.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/splash.css">
|
||||
|
||||
<header>Drift­verk­stedet</header>
|
||||
|
||||
<main>
|
||||
|
||||
<article>
|
||||
<h2>Drift</h2>
|
||||
|
||||
<p>
|
||||
Hei
|
||||
<p>
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
<nav><ul>
|
||||
<li><a href="../">hjem</a></li>
|
||||
<li class="active"><a href="../prosjekt/">prosjekter</a></li>
|
||||
<li><a href="../kalender/">kalender</a></li>
|
||||
<li><a href="../aktiviteter/">aktiviteter</a></li>
|
||||
<li><a href="../kontakt/">kontakt</a></li>
|
||||
<li><a href="../pvv/">wiki</a></li>
|
||||
</nav>
|
||||
|
|
@ -5,7 +5,6 @@ $translation = ['i dag', 'i morgen', 'denne uka', 'neste uke', 'denne måneden',
|
|||
$projectManager = new \pvv\side\ProjectManager($pdo);
|
||||
$projects = $projectManager->getAll();
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="no">
|
||||
<head>
|
||||
|
|
@ -26,21 +25,60 @@ $projects = $projectManager->getAll();
|
|||
</nav>
|
||||
|
||||
<main>
|
||||
<h2>Prosjekter</h2>
|
||||
<h2>Projekter</h2>
|
||||
<p>
|
||||
PVV er et kult miljø der du kan bli med på mye rart.
|
||||
På denne siden har vi en liten oversikt over forskjellige prosjekter og organer i PVV.
|
||||
</p>
|
||||
<br>
|
||||
<br>
|
||||
<h2>Faste poster</h2>
|
||||
<div class="projects-container">
|
||||
<a class="nostyle" href="../styret/"><div class="project-card" style="border-color:#b93;">
|
||||
<div class="card-content">
|
||||
<h4 class="project-title">Styret</h4>
|
||||
<p>
|
||||
Styret har ansvaret for den daglige driften av PVV, og har myndighet som gitt i PVVs lover.
|
||||
Lederen for PVV velges om høsten og sitter i et år. Resten av styret velges for et halvår om
|
||||
gangen, selv om praksis er at bare mindre justeringer gjøres i vårsemesteret.
|
||||
</p>
|
||||
<p class="project-organizer">Organisert av Styreleder</p>
|
||||
</div>
|
||||
</div></a>
|
||||
<a class="nostyle" href="../drift/"><div class="project-card" style="border-color:#184;">
|
||||
<div class="card-content">
|
||||
<h4 class="project-title">Drift</h4>
|
||||
<p>
|
||||
Drift har ansvaret for å drive maskinene på PVV.
|
||||
Driftsgruppen har ingen strenge krav til aktivitet eller erfaring for å bli medlem,
|
||||
så selv om du er ny i virket går det fint an å bare observere og absorbere i begynnelsen.
|
||||
Vi vil gjøre vårt beste for å gi god hjelp og service til våre brukere.
|
||||
</p>
|
||||
<p class="project-organizer">Organisert av Driftskordinator</p>
|
||||
</div>
|
||||
</div></a>
|
||||
<?php /*Her kan vi legge til PR og TriKom hvis det er ønskelig*/ ?>
|
||||
</div>
|
||||
|
||||
<h2>Medlems-prosjekter</h2>
|
||||
<?php
|
||||
if(count($projects) == 0){
|
||||
?>
|
||||
<p>PVV har for øyeblikket ingen aktive prosjekter. Tenker du at noe bør gjøres? Har du en kul ide for noe PVV kan samarbeide om? Sett opp et prosjekt!</p>
|
||||
<br>
|
||||
<a class="btn" href="edit.php?new=1">Lag prosjekt</a>
|
||||
<a class="btn" href="mine.php">Mine prosjekter</a>
|
||||
<center>
|
||||
<a class="btn" href="edit.php?new=1">Lag prosjekt</a>
|
||||
<a class="btn" href="mine.php">Mine prosjekter</a>
|
||||
</center>
|
||||
<br>
|
||||
<?php
|
||||
}else{
|
||||
?>
|
||||
<p>Lyst til å gjøre noe kult? Her er et utvalg av de prosjektene som PVVere har laget. Mangler det noe, eller brenner du for noe annet? Sett opp et eget prosjekt!</p>
|
||||
<a class="btn" href="edit.php?new=1">Lag prosjekt</a>
|
||||
<a class="btn" href="mine.php">Mine prosjekter</a>
|
||||
<hr class="projects-divider">
|
||||
<p>
|
||||
Lyst til å gjøre noe kult? Her er et utvalg av de prosjektene som PVVere har holder på med. Mangler det noe, eller brenner du for noe annet?<br>
|
||||
Sett opp et eget prosjekt da vel!
|
||||
</p>
|
||||
<div class="projects-container">
|
||||
|
||||
<?php
|
||||
$randProjects = array_rand($projects, min(6, count($projects)));
|
||||
|
|
@ -55,11 +93,16 @@ $projects = $projectManager->getAll();
|
|||
<div class="project-card">
|
||||
<div class="card-content">
|
||||
<h4 class="project-title"><?= $project->getName(); ?></h4>
|
||||
<p><?= $project->getDescription()[0]; ?></p>
|
||||
<p><?= implode('<br>',array_slice($project->getDescription(), 0, 2)); ?></p>
|
||||
</div>
|
||||
<p class="project-organizer">Organisert av<br><?= $owner['name']; ?></p>
|
||||
<p class="project-organizer">Organisert av <?= $owner['name']; ?></p>
|
||||
</div>
|
||||
<?php } ?>
|
||||
</div>
|
||||
<center>
|
||||
<a class="btn" href="edit.php?new=1">Lag prosjekt</a>
|
||||
<a class="btn" href="mine.php">Mine prosjekter</a>
|
||||
</center>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
|
|
|||
|
|
@ -1,31 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="no">
|
||||
<title>Styreverkstedet</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
|
||||
<link rel="stylesheet" href="../css/normalize.css">
|
||||
<link rel="stylesheet" href="../css/style.css">
|
||||
<link rel="stylesheet" href="../css/splash.css">
|
||||
|
||||
<header>Styre­verk­stedet</header>
|
||||
|
||||
<main>
|
||||
|
||||
<article>
|
||||
<h2>Styret</h2>
|
||||
|
||||
<p>
|
||||
Hei
|
||||
<p>
|
||||
</article>
|
||||
|
||||
</main>
|
||||
|
||||
<nav><ul>
|
||||
<li><a href="../">hjem</a></li>
|
||||
<li class="active"><a href="../prosjekt/">prosjekter</a></li>
|
||||
<li><a href="../kalender/">kalender</a></li>
|
||||
<li><a href="../aktiviteter/">aktiviteter</a></li>
|
||||
<li><a href="../kontakt/">kontakt</a></li>
|
||||
<li><a href="../pvv/">wiki</a></li>
|
||||
</nav>
|
||||
Loading…
Reference in New Issue