Css modified, added description and material
This commit is contained in:
parent
02161b549c
commit
54b0b1a2da
2 changed files with 67 additions and 11 deletions
|
@ -364,12 +364,6 @@ div.collection h1 {
|
|||
font-size: 36pt;
|
||||
}
|
||||
|
||||
div.collection div.col-desc {
|
||||
display: none;
|
||||
padding: 10px;
|
||||
text-align: justify;
|
||||
}
|
||||
|
||||
/* Img Collections
|
||||
=====================*/
|
||||
|
||||
|
@ -396,6 +390,60 @@ div.collection div.col-desc {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Collection Items
|
||||
===================*/
|
||||
|
||||
#collection_padding{
|
||||
padding-top: 50px;
|
||||
}
|
||||
|
||||
.ci_container{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
h1.collection_name{
|
||||
font-size: 32pt;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
section.description{
|
||||
text-align: justify;
|
||||
margin-left: 20px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.collection_item{
|
||||
width: 400px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-top: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.collection_item img{
|
||||
object-fit: cover;
|
||||
object-position: center;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.collection_item img:hover{
|
||||
filter: brightness(50%);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.collection_item h1{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
p.ci_material{
|
||||
font-size: 10pt;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
/* Contacts
|
||||
================== */
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
$db = new PDO('sqlite:projects_data/projects.db') or die('database error');
|
||||
include('header.tpl');
|
||||
?>
|
||||
<div id="content_padding">
|
||||
<div id="collection_padding">
|
||||
<?php
|
||||
// get collection parameters
|
||||
$query = 'select id, name, description, cover_image from collections where id = :id';
|
||||
|
@ -14,13 +14,13 @@ $col_query->execute();
|
|||
$collection_info = $col_query->fetch();
|
||||
|
||||
// get collection items
|
||||
$query = 'select name, material, description, cover_image from collection_items where collection_id = :id';
|
||||
$query = 'select name, material, description, cover_image, id from collection_items where collection_id = :id';
|
||||
$ci_query = $db->prepare($query);
|
||||
$ci_query->bindParam(':id', $_REQUEST['id']);
|
||||
$ci_query->execute();
|
||||
?>
|
||||
|
||||
<h1>
|
||||
<h1 class="collection_name">
|
||||
<? print($collection_info['name']); ?>
|
||||
</h1>
|
||||
<section class="description">
|
||||
|
@ -36,9 +36,17 @@ foreach($ci_query->fetchAll() as $ci) {
|
|||
}
|
||||
$ci_img_url = 'projects_data/img/' . $ci['cover_image'];
|
||||
print("
|
||||
<div class='collection-item'>
|
||||
<img src='{$ci_img_url}' alt='Cover picture of {$ci['name']}' />
|
||||
<div class='collection_item'>
|
||||
<a href='show_ci.php?id={$ci['id']}'>
|
||||
<img src='{$ci_img_url}' alt='Cover picture of {$ci['name']}' />
|
||||
</a>
|
||||
<h1>{$ci['name']}</h1>
|
||||
<p class='ci_material'>
|
||||
{$ci['material']}
|
||||
</p>
|
||||
<p>
|
||||
{$ci['description']}
|
||||
</p>
|
||||
</div>
|
||||
");
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue