Adds option for simple vs boxed header style on items list.
This commit is contained in:
parent
2c72969ff1
commit
baf8893a70
|
@ -39,6 +39,16 @@ $options = [
|
||||||
'prefix' => $prefix,
|
'prefix' => $prefix,
|
||||||
]),
|
]),
|
||||||
'inner-options' => [
|
'inner-options' => [
|
||||||
|
$prefix . 'page_header_background_style' => [
|
||||||
|
'label' => __('Header style', 'blocksy-tainacan'),
|
||||||
|
'type' => 'ct-radio',
|
||||||
|
'value' => 'boxed',
|
||||||
|
'view' => 'text',
|
||||||
|
'choices' => [
|
||||||
|
'simple' => __('Simple', 'blocksy'),
|
||||||
|
'boxed' => __('Boxed', 'blocksy'),
|
||||||
|
],
|
||||||
|
],
|
||||||
$prefix . 'hero_elements' => [
|
$prefix . 'hero_elements' => [
|
||||||
'label' => __('Elements', 'blocksy'),
|
'label' => __('Elements', 'blocksy'),
|
||||||
'type' => 'ct-layers',
|
'type' => 'ct-layers',
|
||||||
|
|
|
@ -22,7 +22,7 @@
|
||||||
background: transparent !important;
|
background: transparent !important;
|
||||||
padding: 6px 13px;
|
padding: 6px 13px;
|
||||||
@include display-grid;
|
@include display-grid;
|
||||||
grid-template-columns: 1fr minmax(auto, 1300px) 1fr;
|
grid-template-columns: 0fr 100% 1fr;
|
||||||
grid-template-rows: auto 1fr;
|
grid-template-rows: auto 1fr;
|
||||||
grid-template-areas:
|
grid-template-areas:
|
||||||
". searchcontrol ."
|
". searchcontrol ."
|
||||||
|
@ -33,10 +33,8 @@
|
||||||
.search-control {
|
.search-control {
|
||||||
grid-area: searchcontrol;
|
grid-area: searchcontrol;
|
||||||
border-radius: 0 0 var(--borderRadius, 3px) var(--borderRadius, 3px);
|
border-radius: 0 0 var(--borderRadius, 3px) var(--borderRadius, 3px);
|
||||||
background-color: var(--tainacan-item-background-color, white);
|
|
||||||
padding: 20px 20px 6px 20px !important;
|
padding: 20px 20px 6px 20px !important;
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
box-shadow: var(--boxShadow, 0px 12px 18px -6px rgba(34, 56, 101, 0.04));
|
|
||||||
|
|
||||||
.search-control-item {
|
.search-control-item {
|
||||||
margin-bottom: 20px !important;
|
margin-bottom: 20px !important;
|
||||||
|
@ -281,11 +279,8 @@ body:not(.tainacan-admin-page) {
|
||||||
--linkInitialColor: var(--tainacan-secondary, #3eaf7c);
|
--linkInitialColor: var(--tainacan-secondary, #3eaf7c);
|
||||||
|
|
||||||
.tainacan-collection-header__box {
|
.tainacan-collection-header__box {
|
||||||
width: var(--maxSiteWidth, 1290px);
|
width: 100%;
|
||||||
border-radius: var(--borderRadius,3px) var(--borderRadius, 3px) 0 0;
|
|
||||||
background-color: var(--tainacan-item-background-color,#fff);
|
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
box-shadow: var(--boxShadow,0 12px 18px -6px rgba(34,56,101,.04));
|
|
||||||
|
|
||||||
.page-title {
|
.page-title {
|
||||||
margin-bottom: 4px;
|
margin-bottom: 4px;
|
||||||
|
@ -309,3 +304,19 @@ body:not(.tainacan-admin-page) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.page.has-page-header-style-boxed {
|
||||||
|
.theme-items-list:not(.is-fullscreen) {
|
||||||
|
grid-template-columns: 1fr minmax(auto, 1300px) 1fr;
|
||||||
|
}
|
||||||
|
.tainacan-collection-header .tainacan-collection-header__box {
|
||||||
|
width: var(--maxSiteWidth, 1290px);
|
||||||
|
border-radius: var(--borderRadius,3px) var(--borderRadius, 3px) 0 0;
|
||||||
|
background-color: var(--tainacan-item-background-color,#fff);
|
||||||
|
box-shadow: var(--boxShadow,0 12px 18px -6px rgba(34,56,101,.04));
|
||||||
|
}
|
||||||
|
.search-control {
|
||||||
|
background-color: var(--tainacan-item-background-color, white);
|
||||||
|
box-shadow: var(--boxShadow, 0px 12px 18px -6px rgba(34, 56, 101, 0.04));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
@ -188,6 +188,7 @@
|
||||||
}
|
}
|
||||||
.swiper-button-next,
|
.swiper-button-next,
|
||||||
.swiper-button-prev {
|
.swiper-button-prev {
|
||||||
|
background-image: none;
|
||||||
top: 65px;
|
top: 65px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
border-radius: 30px;
|
border-radius: 30px;
|
||||||
|
@ -261,9 +262,12 @@
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
.attachment-without-image img {
|
.attachment-without-image img {
|
||||||
|
box-sizing: border-box;
|
||||||
padding: 36px;
|
padding: 36px;
|
||||||
background-color: #dbdbdb;
|
background-color: #dbdbdb;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
|
max-width: var(--attachments-size,140px);
|
||||||
|
max-height: var(--attachments-size,140px);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -298,7 +302,10 @@
|
||||||
min-height: 54px;
|
min-height: 54px;
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
.pswp__caption__center {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Metadata list -------------------------------------
|
// Metadata list -------------------------------------
|
||||||
|
|
34
style.css
34
style.css
|
@ -40,7 +40,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
display: -ms-grid;
|
display: -ms-grid;
|
||||||
display: grid;
|
display: grid;
|
||||||
grid-template-columns: 1fr minmax(auto, 1300px) 1fr;
|
grid-template-columns: 0fr 100% 1fr;
|
||||||
grid-template-rows: auto 1fr;
|
grid-template-rows: auto 1fr;
|
||||||
grid-template-areas: ". searchcontrol ." "itemslist itemslist itemslist";
|
grid-template-areas: ". searchcontrol ." "itemslist itemslist itemslist";
|
||||||
}
|
}
|
||||||
|
@ -48,10 +48,8 @@
|
||||||
.theme-items-list .search-control {
|
.theme-items-list .search-control {
|
||||||
grid-area: searchcontrol;
|
grid-area: searchcontrol;
|
||||||
border-radius: 0 0 var(--borderRadius, 3px) var(--borderRadius, 3px);
|
border-radius: 0 0 var(--borderRadius, 3px) var(--borderRadius, 3px);
|
||||||
background-color: var(--tainacan-item-background-color, white);
|
|
||||||
padding: 20px 20px 6px 20px !important;
|
padding: 20px 20px 6px 20px !important;
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
box-shadow: var(--boxShadow, 0px 12px 18px -6px rgba(34, 56, 101, 0.04));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.theme-items-list .search-control .search-control-item {
|
.theme-items-list .search-control .search-control-item {
|
||||||
|
@ -305,11 +303,8 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
|
||||||
}
|
}
|
||||||
|
|
||||||
.tainacan-collection-header .tainacan-collection-header__box {
|
.tainacan-collection-header .tainacan-collection-header__box {
|
||||||
width: var(--maxSiteWidth, 1290px);
|
width: 100%;
|
||||||
border-radius: var(--borderRadius, 3px) var(--borderRadius, 3px) 0 0;
|
|
||||||
background-color: var(--tainacan-item-background-color, #fff);
|
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
box-shadow: var(--boxShadow, 0 12px 18px -6px rgba(34, 56, 101, 0.04));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.tainacan-collection-header .tainacan-collection-header__box .page-title {
|
.tainacan-collection-header .tainacan-collection-header__box .page-title {
|
||||||
|
@ -335,6 +330,22 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
|
||||||
border-radius: var(--borderRadius, 3px);
|
border-radius: var(--borderRadius, 3px);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.page.has-page-header-style-boxed .theme-items-list:not(.is-fullscreen) {
|
||||||
|
grid-template-columns: 1fr minmax(auto, 1300px) 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page.has-page-header-style-boxed .tainacan-collection-header .tainacan-collection-header__box {
|
||||||
|
width: var(--maxSiteWidth, 1290px);
|
||||||
|
border-radius: var(--borderRadius, 3px) var(--borderRadius, 3px) 0 0;
|
||||||
|
background-color: var(--tainacan-item-background-color, #fff);
|
||||||
|
box-shadow: var(--boxShadow, 0 12px 18px -6px rgba(34, 56, 101, 0.04));
|
||||||
|
}
|
||||||
|
|
||||||
|
.page.has-page-header-style-boxed .search-control {
|
||||||
|
background-color: var(--tainacan-item-background-color, white);
|
||||||
|
box-shadow: var(--boxShadow, 0px 12px 18px -6px rgba(34, 56, 101, 0.04));
|
||||||
|
}
|
||||||
|
|
||||||
/* Single Item Page */
|
/* Single Item Page */
|
||||||
.tainacan-item-single {
|
.tainacan-item-single {
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
@ -543,6 +554,7 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
|
||||||
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-button-prev,
|
.tainacan-item-single .tainacan-item-section__gallery-items .swiper-button-prev,
|
||||||
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-next,
|
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-next,
|
||||||
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-prev {
|
.tainacan-item-single .tainacan-item-section__attachments .swiper-button-prev {
|
||||||
|
background-image: none;
|
||||||
top: 65px;
|
top: 65px;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
border-radius: 30px;
|
border-radius: 30px;
|
||||||
|
@ -646,9 +658,12 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
|
||||||
|
|
||||||
.tainacan-item-single .tainacan-item-section__gallery-items .tainacan-item-section__attachments-file .attachment-without-image img,
|
.tainacan-item-single .tainacan-item-section__gallery-items .tainacan-item-section__attachments-file .attachment-without-image img,
|
||||||
.tainacan-item-single .tainacan-item-section__attachments .tainacan-item-section__attachments-file .attachment-without-image img {
|
.tainacan-item-single .tainacan-item-section__attachments .tainacan-item-section__attachments-file .attachment-without-image img {
|
||||||
|
box-sizing: border-box;
|
||||||
padding: 36px;
|
padding: 36px;
|
||||||
background-color: #dbdbdb;
|
background-color: #dbdbdb;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
|
max-width: var(--attachments-size, 140px);
|
||||||
|
max-height: var(--attachments-size, 140px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.tainacan-item-single .pswp__zoom-wrap .attachment-without-image {
|
.tainacan-item-single .pswp__zoom-wrap .attachment-without-image {
|
||||||
|
@ -680,6 +695,11 @@ body:not(.tainacan-admin-page) .tainacan-modal-content .modal-card-body {
|
||||||
padding: 12px;
|
padding: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.tainacan-item-single .pswp__caption__center {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
.tainacan-item-single .tainacan-item-section__metadata {
|
.tainacan-item-single .tainacan-item-section__metadata {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
-moz-column-width: var(--metadata-column-width, 400px);
|
-moz-column-width: var(--metadata-column-width, 400px);
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -4,6 +4,7 @@ $prefix = blocksy_manager()->screen->get_prefix();
|
||||||
|
|
||||||
$page_container_classes = 'page type-page hentry singular';
|
$page_container_classes = 'page type-page hentry singular';
|
||||||
$page_container_classes = $page_container_classes . ( get_theme_mod($prefix . '_filters_panel_background_style', 'boxed') == 'boxed' ? ' has-filters-panel-style-boxed' : '' );
|
$page_container_classes = $page_container_classes . ( get_theme_mod($prefix . '_filters_panel_background_style', 'boxed') == 'boxed' ? ' has-filters-panel-style-boxed' : '' );
|
||||||
|
$page_container_classes = $page_container_classes . ( get_theme_mod($prefix . '_page_header_background_style', 'boxed') == 'boxed' ? ' has-page-header-style-boxed' : '' );
|
||||||
|
|
||||||
$filters_panel_size = get_theme_mod($prefix . '_filters_panel_size', '20%');
|
$filters_panel_size = get_theme_mod($prefix . '_filters_panel_size', '20%');
|
||||||
$page_container_style = '--tainacan-filter-menu-width-theme:' . $filters_panel_size . ';';
|
$page_container_style = '--tainacan-filter-menu-width-theme:' . $filters_panel_size . ';';
|
||||||
|
@ -42,7 +43,15 @@ $page_container_style .= 'background-color: var(--tainacan-background-color, #f8
|
||||||
|
|
||||||
<?php get_header(); ?>
|
<?php get_header(); ?>
|
||||||
<article class="<?php echo $page_container_classes ?>" style="<?php echo $page_container_style ?>">
|
<article class="<?php echo $page_container_classes ?>" style="<?php echo $page_container_style ?>">
|
||||||
<header class="tainacan-collection-header" style="background-image: <?php if ( get_header_image() ) { echo('linear-gradient(to bottom, rgba(255, 255, 255, 0.3), var(--tainacan-background-color, var(--background-color, #f8f9fb))), url(' . get_header_image() . ')'); } else { echo ''; } ?>">
|
<header
|
||||||
|
class="tainacan-collection-header"
|
||||||
|
style="background-image:
|
||||||
|
<?php if ( get_header_image() ) {
|
||||||
|
echo('linear-gradient(to bottom, rgba(255, 255, 255, ' . (get_theme_mod($prefix . '_page_header_background_style', 'boxed') == 'boxed' ? '0.3' : '0.8') . '), var(--tainacan-background-color, var(--background-color, #f8f9fb))), url(' . get_header_image() . ')');
|
||||||
|
} else {
|
||||||
|
echo '';
|
||||||
|
} ?>"
|
||||||
|
>
|
||||||
<div class="tainacan-collection-header__box">
|
<div class="tainacan-collection-header__box">
|
||||||
<?php
|
<?php
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue