Project cards

This commit is contained in:
halworsen 2018-02-14 17:56:19 +01:00
parent 9f935cd810
commit cf058dc7a9
3 changed files with 79 additions and 19 deletions

59
www/css/projects.css Normal file
View File

@ -0,0 +1,59 @@
.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);
}
.project-title {
padding-bottom: .1em;
margin: 0;
text-overflow: ellipsis;
}
.card-content {
display: block;
overflow: hidden;
margin: 0;
padding: .6em;
height: 4.3em;
}
.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;
}
@media screen and (max-width: 50rem) {
.projects {
display: inline-block;
}
}

View File

@ -69,7 +69,8 @@ if($new == 0){
<input type="text" name="title" value="<?= $project->getName() ?>" class="boxinput" style="width:66%;"><br>
<p class="subtitle no-chin">Beskrivelse</p>
<p class="subnote">Hva går prosjektet ditt ut ?</p>
<p class="subnote no-chin">Hva går prosjektet ditt ut ?</p>
<p class="subnote">Den første linjen blir vist prosjektkortet, prøv å holde den kort!</p>
<textarea name="desc" style="width:100%" rows="8" class="boxinput"><?= implode($project->getDescription(), "\n"); ?></textarea>
<?= '<input type="hidden" name="id" value="' . $project->getID() . '" />' ?>

View File

@ -22,6 +22,7 @@ $projects = $projectManager->getAll();
<link rel="stylesheet" href="../css/style.css">
<link rel="stylesheet" href="../css/nav.css">
<link rel="stylesheet" href="../css/splash.css">
<link rel="stylesheet" href="../css/projects.css"
</head>
<body>
@ -45,27 +46,26 @@ $projects = $projectManager->getAll();
<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">
<ul class="calendar-events">
<?php
$randProjects = array_rand($projects, min(3, count($projects)));
if (!is_array($randProjects)) {
$randProjects = [$randProjects];
};
foreach($randProjects as $i) {
$project = $projects[$i];
?>
<?php
$randProjects = array_rand($projects, min(6, count($projects)));
if (!is_array($randProjects)) {
$randProjects = [$randProjects];
};
foreach($randProjects as $i) {
$project = $projects[$i];
?>
<li>
<p class="noborder no-chin"><?= "<a href=\"project/?id=" . $project->getID() . "\">" . $project->getName() . "</a>"; ?></p>
<p class="subnote"><?= "Organisert av: " . $project->getOwner(); ?></p>
<span>
<p><?= implode($project->getDescription(), "</p>\n<p>"); ?></p>
</span>
</li>
<div class="project-card">
<div class="card-content">
<h4 class="project-title"><?= $project->getName(); ?></h4>
<p><?= $project->getDescription()[0]; ?></p>
</div>
<p class="project-organizer">Organisert av<br><?= $project->getOwner(); ?></p>
</div>
<?php } ?>
</ul>
<?php } ?>
<?php
}
?>