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

Adds option to adjust documents columns size.

This commit is contained in:
mateuswetah 2020-12-30 00:31:53 -03:00
parent 4b95c60a96
commit c71b9e48f9
20 changed files with 258 additions and 103 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
inc/options/posts/tainacan-item-single.php
View File

@ -12,13 +12,9 @@ $options = [
[
blocksy_rand_md5() => [
'type' => 'ct-title',
'label' => __( 'Tainacan Item Elements', 'blocksy' ),
'label' => __( 'Tainacan Item Elements', 'blocksy-tainacan' ),
],
],
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/gallery-mode.php', [
'prefix' => $post_type->name . '_single',
'enabled' => 'no'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/tainacan-single-structure.php', [
'prefix' => $post_type->name . '_single'
], false),
@ -26,12 +22,10 @@ $options = [
'prefix' => $post_type->name . '_single',
'enabled' => 'yes'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/document-attachments.php', [
'prefix' => $post_type->name . '_single',
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/metadata-list.php', [
'prefix' => $post_type->name . '_single',
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/hide-download-button.php', [
'prefix' => $post_type->name . '_single',
'enabled' => 'no'
], false),
], false)
];

34
inc/options/single-elements/document-attachments-columns.php Normal file
View File

@ -0,0 +1,34 @@
<?php
if (! isset($prefix)) {
$prefix = '';
}
$options = [
blocksy_rand_md5() => [
'type' => 'ct-condition',
'condition' => [
$prefix . 'page_structure_type' => 'type-gm|type-mg'
],
'options' => [
$prefix . 'document_attachments_columns' => [
'label' => __( 'Document and Attachments columns width', 'blocksy-tainacan' ),
'desc' => __( 'This option is only available when using two columns layout', 'blocksy-tainacan'),
'type' => 'ct-slider',
'value' => '60%',
'units' => blocksy_units_config([
[
'unit' => '%',
'min' => 20,
'max' => 80,
]
]),
'responsive' => false,
'divider' => 'top',
'sync' => blocksy_sync_single_post_container([
'prefix' => $prefix
])
],
],
]
];

34
inc/options/single-elements/document-attachments.php Normal file
View File

@ -0,0 +1,34 @@
<?php
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
$options = [
$prefix . 'document-attachments' => [
'label' => __( 'Document & Attachments', 'blocksy-tainacan' ),
'type' => 'ct-panel',
'sync' => blocksy_sync_whole_page([
'prefix' => $prefix,
]),
'inner-options' => [
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/gallery-mode.php', [
'prefix' => $prefix,
'enabled' => 'no'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/hide-download-button.php', [
'prefix' => $prefix,
'enabled' => 'no'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/hide-files-name.php', [
'prefix' => $prefix,
'enabled' => 'no'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/document-attachments-columns.php', [
'prefix' => $prefix
], false)
]
]
];

7
inc/options/single-elements/gallery-mode.php
View File

@ -2,10 +2,7 @@
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
if (! isset($enabled)) {
$enabled = 'no';
}
@ -18,7 +15,7 @@ $options = [
'setting' => [ 'transport' => 'postMessage' ],
'desc' => __( 'Merges Document and Attachments section in a single carousel.', 'blocksy-tainacan' ),
'sync' => blocksy_sync_single_post_container([
'prefix' => $prefix
])
'prefix' => $prefix,
]),
]
];

7
inc/options/single-elements/hide-download-button.php
View File

@ -2,10 +2,7 @@
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
if (! isset($enabled)) {
$enabled = 'no';
}
@ -18,7 +15,7 @@ $options = [
'setting' => [ 'transport' => 'postMessage' ],
'desc' => __( 'Toggle to never display a "Download" button when hovering the document.', 'blocksy-tainacan' ),
'sync' => blocksy_sync_single_post_container([
'prefix' => $prefix
])
'prefix' => $prefix,
]),
]
];

21
inc/options/single-elements/hide-files-name.php Normal file
View File

@ -0,0 +1,21 @@
<?php
if (! isset($prefix)) {
$prefix = '';
}
if (! isset($enabled)) {
$enabled = 'no';
}
$options = [
$prefix . 'hide_files_name' => [
'label' => __( 'Hide files name', 'blocksy-tainacan' ),
'type' => 'ct-switch',
'value' => $enabled,
'setting' => [ 'transport' => 'postMessage' ],
'desc' => __( 'Toggle to hide the attachments and document name on the carousel.', 'blocksy-tainacan' ),
'sync' => blocksy_sync_single_post_container([
'prefix' => $prefix,
]),
]
];

4
inc/options/single-elements/metadata-columns.php
View File

@ -2,13 +2,11 @@
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
$options = [
$prefix . 'metadata_columns' => [
'label' => __( 'Metadata columns width', 'blocksy' ),
'label' => __( 'Metadata columns width', 'blocksy-tainacan' ),
'type' => 'ct-slider',
'value' => [
'mobile' => '200px',

8
inc/options/single-elements/metadata-list.php
View File

@ -8,22 +8,22 @@ if (! isset($prefix)) {
$options = [
$prefix . 'metadata-list' => [
'label' => __( 'Metadata List', 'blocksy-tainacan' ),
'label' => __( 'Metadata list', 'blocksy-tainacan' ),
'type' => 'ct-panel',
'sync' => blocksy_sync_whole_page([
'prefix' => $prefix,
]),
'inner-options' => [
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/show-title-metadata.php', [
'prefix' => $post_type->name . '_single',
'prefix' => $prefix,
'enabled' => 'yes'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/show-thumbnail.php', [
'prefix' => $post_type->name . '_single',
'prefix' => $prefix,
'enabled' => 'no'
], false),
blocksy_get_options(get_stylesheet_directory() . '/inc/options/single-elements/metadata-columns.php', [
'prefix' => $post_type->name . '_single'
'prefix' => $prefix
], false)
]
]

3
inc/options/single-elements/show-thumbnail.php
View File

@ -2,10 +2,7 @@
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
if (! isset($enabled)) {
$enabled = 'no';
}

4
inc/options/single-elements/show-title-metadata.php
View File

@ -2,8 +2,6 @@
if (! isset($prefix)) {
$prefix = '';
} else {
$prefix = $prefix . '_';
}
if (! isset($enabled)) {
@ -16,7 +14,7 @@ $options = [
'type' => 'ct-switch',
'value' => $enabled,
'setting' => [ 'transport' => 'postMessage' ],
'desc' => __( 'Toggle to hide or not the core title from the metadada list, as it already appears on the page title.', 'blocksy' ),
'desc' => __( 'Toggle to hide or not the core title from the metadada list, as it already appears on the page title.', 'blocksy-tainacan' ),
'sync' => blocksy_sync_single_post_container([
'prefix' => $prefix
])

10
inc/options/single-elements/tainacan-single-structure.php
View File

@ -16,27 +16,27 @@ $options = [
'choices' => [
'type-dam' => [
'src' => blocksy_tainacan_image_picker_url( 'type-dam.svg' ),
'title' => __( 'Document, Attachments, Metadata', 'blocksy' ),
'title' => __( 'Document, Attachments, Metadata', 'blocksy-tainacan' ),
],
'type-dma' => [
'src' => blocksy_tainacan_image_picker_url( 'type-dma.svg' ),
'title' => __( 'Document, Metadata, Attachments', 'blocksy' ),
'title' => __( 'Document, Metadata, Attachments', 'blocksy-tainacan' ),
],
'type-mda' => [
'src' => blocksy_tainacan_image_picker_url( 'type-mda.svg' ),
'title' => __( 'Metadata, Document, Attachments', 'blocksy' ),
'title' => __( 'Metadata, Document, Attachments', 'blocksy-tainacan' ),
],
'type-gm' => [
'src' => blocksy_tainacan_image_picker_url( 'type-gm.svg' ),
'title' => __( 'Metadata to the right', 'blocksy' ),
'title' => __( 'Metadata to the right', 'blocksy-tainacan' ),
],
'type-mg' => [
'src' => blocksy_tainacan_image_picker_url( 'type-mg.svg' ),
'title' => __( 'Metadata to the left', 'blocksy' ),
'title' => __( 'Metadata to the left', 'blocksy-tainacan' ),
],
],
'sync' => blocksy_sync_single_post_container([

56
js/attachments-carousel.js
View File

@ -1,33 +1,33 @@
const attachmentsThumbsSwiper = new Swiper('.swiper-container-thumbs', {
spaceBetween: 12,
slidesPerView: 8,
spaceBetween: 16,
slidesPerView: 'auto',
// Responsive breakpoints
breakpoints: {
// when window width is >= 320px
320: {
slidesPerView: 1
},
// when window width is >= 480px
480: {
slidesPerView: 2
},
// when window width is >= 640px
768: {
slidesPerView: 3
},
// when window width is >= 640px
960: {
slidesPerView: 4
},
// when window width is >= 640px
1024: {
slidesPerView: 5
},
// when window width is >= 640px
1280: {
slidesPerView: 6
}
},
// breakpoints: {
// // when window width is >= 320px
// 320: {
// slidesPerView: 1
// },
// // when window width is >= 480px
// 480: {
// slidesPerView: 2
// },
// // when window width is >= 640px
// 768: {
// slidesPerView: 3
// },
// // when window width is >= 640px
// 960: {
// slidesPerView: 4
// },
// // when window width is >= 640px
// 1024: {
// slidesPerView: 5
// },
// // when window width is >= 640px
// 1280: {
// slidesPerView: 6
// }
// },
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',

56
sass/tainacan-item-single.scss
View File

@ -7,17 +7,16 @@
align-items: start;
grid-column-gap: 32px;
column-gap: 32px;
grid-row-gap: 2.25rem;
row-gap: 2.25rem;
.tainacan-item-section {
max-width: var(--block-max-width);;
align-self: flex-start;
align-self: start;
margin-bottom: 2.25rem;
}
.tainacan-item-section--document { grid-area: document }
.tainacan-item-section--document,
.tainacan-item-section--gallery { grid-area: document }
.tainacan-item-section--attachments { grid-area: attachments }
.tainacan-item-section--gallery { grid-area: gallery }
.tainacan-item-section--metadata { grid-area: metadata }
&.tainacan-item-single--layout-type-dam {
@ -25,30 +24,51 @@
'document'
'attachments'
'metadata';
grid-template-columns: 100%;
}
&.tainacan-item-single--layout-type-dma {
grid-template-areas:
'document'
'metadata'
'attachments';
grid-template-columns: 100%;
}
&.tainacan-item-single--layout-type-mda {
grid-template-areas:
'metadata'
'document'
'attachments';
grid-template-columns: 100%;
}
&.tainacan-item-single--layout-type-mg {
grid-template-areas:
'metadata gallery document'
'metadata gallery attachments'
'metadata . .'
'metadata document'
'metadata attachments'
'metadata .';
grid-template-columns: 60% 40%;
@media only screen and (max-width: 960px) {
grid-template-areas:
'metadata'
'document'
'attachments';
grid-template-columns: 100% !important;
}
}
&.tainacan-item-single--layout-type-gm {
grid-template-areas:
'gallery document metadata'
'gallery attachments metadata'
'. . metadata'
'document metadata'
'attachments metadata'
'. metadata';
grid-template-columns: 60% 40%;
@media only screen and (max-width: 960px) {
grid-template-areas:
'document'
'attachments'
'metadata';
grid-template-columns: 100% !important;
}
}
// Headings and spacing ----------------------------
@ -159,7 +179,7 @@
.tainacan-item-section__gallery-items,
.tainacan-item-section__attachments {
position: relative;
padding: 0 60px;
padding: 0px;
.swiper-button-disabled {
display: none;
@ -167,6 +187,16 @@
.swiper-button-next,
.swiper-button-prev {
top: 65px;
padding: 20px;
border-radius: 30px;
background-color: var(--background-color, #f8f9fb);
border: 1px solid var(--paletteColor1, #3eaf7c);
}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next {
left: -20px;
}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
right: -20px;
}
.swiper-slide-thumb-active {
font-weight: bold;
@ -185,7 +215,7 @@
cursor: pointer;
word-break: break-all;
font-size: 0.875em;
//padding: 0 6px;
max-width: 157px;
@media only screen and (max-width: 380px) {
margin: 10px 0;
@ -196,6 +226,7 @@
width: 140px;
height: 140px;
object-fit: cover;
transition: border-bottom 0.3s ease;
&:focus {
outline: none;
}
@ -225,6 +256,7 @@
}
--swiper-theme-color: var(--paletteColor1, #3eaf7c);
--swiper-navigation-color: var(--paletteColor1, #3eaf7c);
--swiper-navigation-size: 1.1rem;
// Photoswip zoom ---------------------------------
.pswp__zoom-wrap .attachment-without-image {

54
style.css
View File

@ -316,19 +316,20 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
align-items: start;
grid-column-gap: 32px;
column-gap: 32px;
grid-row-gap: 2.25rem;
row-gap: 2.25rem;
--swiper-theme-color: var(--paletteColor1, #3eaf7c);
--swiper-navigation-color: var(--paletteColor1, #3eaf7c);
--swiper-navigation-size: 1.1rem;
}
.tainacan-item-single .tainacan-item-section {
max-width: var(--block-max-width);
align-self: flex-start;
align-self: start;
margin-bottom: 2.25rem;
}
.tainacan-item-single .tainacan-item-section--document {
.tainacan-item-single .tainacan-item-section--document,
.tainacan-item-single .tainacan-item-section--gallery {
grid-area: document;
}
@ -336,32 +337,47 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
grid-area: attachments;
}
.tainacan-item-single .tainacan-item-section--gallery {
grid-area: gallery;
}
.tainacan-item-single .tainacan-item-section--metadata {
grid-area: metadata;
}
.tainacan-item-single.tainacan-item-single--layout-type-dam {
grid-template-areas: 'document' 'attachments' 'metadata';
grid-template-columns: 100%;
}
.tainacan-item-single.tainacan-item-single--layout-type-dma {
grid-template-areas: 'document' 'metadata' 'attachments';
grid-template-columns: 100%;
}
.tainacan-item-single.tainacan-item-single--layout-type-mda {
grid-template-areas: 'metadata' 'document' 'attachments';
grid-template-columns: 100%;
}
.tainacan-item-single.tainacan-item-single--layout-type-mg {
grid-template-areas: 'metadata gallery document' 'metadata gallery attachments' 'metadata . .';
grid-template-areas: 'metadata document' 'metadata attachments' 'metadata .';
grid-template-columns: 60% 40%;
}
@media only screen and (max-width: 960px) {
.tainacan-item-single.tainacan-item-single--layout-type-mg {
grid-template-areas: 'metadata' 'document' 'attachments';
grid-template-columns: 100% !important;
}
}
.tainacan-item-single.tainacan-item-single--layout-type-gm {
grid-template-areas: 'gallery document metadata' 'gallery attachments metadata' '. . metadata';
grid-template-areas: 'document metadata' 'attachments metadata' '. metadata';
grid-template-columns: 60% 40%;
}
@media only screen and (max-width: 960px) {
.tainacan-item-single.tainacan-item-single--layout-type-gm {
grid-template-areas: 'document' 'attachments' 'metadata';
grid-template-columns: 100% !important;
}
}
.tainacan-item-single h1 {
@ -483,7 +499,7 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
.tainacan-item-single .tainacan-item-section__gallery-items,
.tainacan-item-single .tainacan-item-section__attachments {
position: relative;
padding: 0 60px;
padding: 0px;
}
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-button-disabled,
@ -496,6 +512,22 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-next,
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-prev {
top: 65px;
padding: 20px;
border-radius: 30px;
background-color: var(--background-color, #f8f9fb);
border: 1px solid var(--paletteColor1, #3eaf7c);
}
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-button-prev, .tainacan-item-single .tainacan-item-section__gallery-items .swiper-container-rtl .swiper-button-next,
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-prev,
.tainacan-item-single .tainacan-item-section__attachments .swiper-container-rtl .swiper-button-next {
left: -20px;
}
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-button-next, .tainacan-item-single .tainacan-item-section__gallery-items .swiper-container-rtl .swiper-button-prev,
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-next,
.tainacan-item-single .tainacan-item-section__attachments .swiper-container-rtl .swiper-button-prev {
right: -20px;
}
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-slide-thumb-active,
@ -521,6 +553,7 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
cursor: pointer;
word-break: break-all;
font-size: 0.875em;
max-width: 160px;
}
@media only screen and (max-width: 380px) {
@ -536,6 +569,7 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
width: 140px;
height: 140px;
object-fit: cover;
transition: border-bottom 0.3s ease;
}
.tainacan-item-single .tainacan-item-section__gallery-items .tainacan-item-section__attachments-file img:focus,

4
style.css.map
View File

File diff suppressed because one or more lines are too long

2
style.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
style.min.css.map
View File

File diff suppressed because one or more lines are too long

19
tainacan/item-single-page.php
View File

@ -13,7 +13,24 @@ do_action( 'blocksy-tainacan-single-item-top' );
do_action( 'blocksy-tainacan-single-item-after-title' );
echo '<div class="tainacan-item-single tainacan-item-single--layout-'. get_theme_mod( $prefix . '_page_structure_type', 'type-dam') . '">';
$page_structure_type = get_theme_mod( $prefix . '_page_structure_type', 'type-dam');
$template_columns_style = '';
if ($page_structure_type == 'type-gm' || $page_structure_type == 'type-mg') {
$column_documents_attachments_width = 60;
$column_metadata_width = 40;
$column_documents_attachments_width = intval(substr(get_theme_mod( $prefix . '_document_attachments_columns', '60%'), 0, -1));
$column_metadata_width = 100 - $column_documents_attachments_width;
if ($page_structure_type == 'type-gm') {
$template_columns_style = 'grid-template-columns: ' . $column_documents_attachments_width . '% calc(' . $column_metadata_width . '% - 32px)';
} else {
$template_columns_style = 'grid-template-columns: ' . $column_metadata_width . '% calc(' . $column_documents_attachments_width . '% - 32px)';
}
}
echo '<div class="tainacan-item-single tainacan-item-single--layout-'. $page_structure_type . '" style="' . $template_columns_style .'">';
get_template_part( 'template-parts/tainacan-item-single-document' );
do_action( 'blocksy-tainacan-single-item-after-document' );

6
template-parts/tainacan-item-single-attachments.php
View File

@ -33,7 +33,7 @@
echo wp_get_attachment_image( $attachment->ID, 'blocksy-tainacan-item-attachments', true );
echo '<br>';
?>
<span class="swiper-slide-name <?php if (get_theme_mod('tainacan_single_item_hide_files_name', false)) echo 'sr-only' ?>"><?php echo get_the_title( $attachment->ID ); ?></span>
<span class="swiper-slide-name <?php if (get_theme_mod( $prefix . '_hide_files_name', 'no') == 'yes') echo 'sr-only' ?>"><?php echo get_the_title( $attachment->ID ); ?></span>
</a>
</li>
<?php
@ -47,7 +47,7 @@
echo wp_get_attachment_image( $attachment->ID, 'blocksy-tainacan-item-attachments', true );
echo '<br>';
?>
<span class="swiper-slide-name <?php if (get_theme_mod('tainacan_single_item_hide_files_name', false)) echo 'sr-only' ?>"><?php echo get_the_title( $attachment->ID ); ?></span>
<span class="swiper-slide-name <?php if (get_theme_mod( $prefix . '_hide_files_name', 'no') == 'yes') echo 'sr-only' ?>"><?php echo get_the_title( $attachment->ID ); ?></span>
</a>
</li>
<?php endif;
@ -107,7 +107,7 @@
the_post_thumbnail('tainacan-medium');
echo '<br>';
?>
<span class="swiper-slide-name <?php if (get_theme_mod('tainacan_single_item_hide_files_name', false)) echo 'sr-only' ?>"><?php echo __( 'Document', 'blocksy-tainacan' ); ?></span>
<span class="swiper-slide-name <?php if (get_theme_mod( $prefix . '_hide_files_name', 'no') == 'yes') echo 'sr-only' ?>"><?php echo __( 'Document', 'blocksy-tainacan' ); ?></span>
</li>
<?php endif; ?>
<?php foreach ( $attachments as $attachment ) {

4
template-parts/tainacan-item-single-metadata.php
View File

@ -8,7 +8,9 @@
<?php echo esc_html( get_theme_mod($prefix . '_section_metadata_label', __( 'Metadata', 'blocksy-tainacan' ) ) ); ?>
</h2>
<?php endif; ?>
<div class="tainacan-item-section__metadata" style="column-width: <?php echo get_theme_mod( $prefix . '_metadata_columns', ['mobile' => '200px', 'tablet' => '300px', 'desktop' => '400px' ] )['desktop'] ?>">
<div
class="tainacan-item-section__metadata"
style="column-width: <?php echo get_theme_mod( $prefix . '_metadata_columns', ['mobile' => '200px', 'tablet' => '300px', 'desktop' => '400px' ] )['desktop'] ?>">
<?php if (has_post_thumbnail() && (get_theme_mod($prefix . '_show_thumbnail', 'no') === 'yes') ): ?>
<div class="tainacan-item-section__metadata-thumbnail">
<h3><?php _e( 'Thumbnail', 'blocksy-tainacan' ); ?></h3>