tmdinosaurcenter
/
tainacan-theme
mirror of https://github.com/tainacan/tainacan-theme.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

initial masonry view mode

This commit is contained in:
Fabiano 2018-05-30 17:01:18 -03:00
parent baa4a234f9
commit 6d37229156
4 changed files with 43 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/assets/scss/_view-mode-masonry.scss Normal file
View File

@ -0,0 +1,22 @@
.tainacan-masonry-container {
padding: 0;
column-gap: 20px;
column-count: 1;
@media only screen and (min-width: 576px) {
column-count: 2;
}
@media only screen and (min-width: 768px) {
column-count: 3;
}
@media only screen and (min-width: 992px) {
column-count: 4;
}
.card{
border: none;
img{
width: 100%;
height: auto;
}
}
}

4
src/assets/scss/style.scss
View File

@ -204,4 +204,6 @@ form{
@import "_view-mode-grid.scss";
@import "_view-mode-mosaic.scss";
@import "_view-mode-mosaic.scss";
@import "_view-mode-masonry.scss";

6
src/functions.php
View File

@ -72,6 +72,12 @@ if(!function_exists('tainacan_setup')) {
'icon' => '<span class="icon"><i class="mdi mdi-view-quilt mdi-24px"></i></span>',
'dynamic_metadata' => false,
]);
tainacan_register_view_mode('masonry', [
'label' => 'Masonry view',
'description' => 'A masonry view',
'icon' => '<span class="icon"><i class="mdi mdi-account mdi-24px"></i></span>',
'dynamic_metadata' => false,
]);
}
}

12
src/tainacan/view-mode-masonry.php Normal file
View File

@ -0,0 +1,12 @@
<?php if (have_posts()): ?>
<div class="tainacan-masonry-container card-columns p-3">
<?php while (have_posts()): the_post(); ?>
<div class="card">
<?php the_post_thumbnail('large'); ?>
<div class="card-body">
<h5 class="card-title"><?php the_title(); ?></h5>
</div>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>