refining publication page

This commit is contained in:
Antoine M 2023-11-20 17:39:05 +01:00
parent a415c97764
commit 09dcac2f34
3 changed files with 98 additions and 51 deletions

View File

@ -27,4 +27,15 @@
&__button { &__button {
@apply col-span-2 flex justify-end; @apply col-span-2 flex justify-end;
} }
&__video-thumbnail {
@apply w-full h-auto rounded-lg col-span-2 object-cover;
aspect-ratio: 16/9;
width: 100%;
}
&--webinaires {
&__row {
@apply grid-cols-12;
}
}
} }

View File

@ -17,7 +17,7 @@
} }
&__titling { &__titling {
@apply flex items-center gap-4 w-fit; @apply flex items-center gap-4 w-fit pb-4;
&__icon { &__icon {
@apply bg-secondary rounded-full w-8 h-8 flex items-center justify-center; @apply bg-secondary rounded-full w-8 h-8 flex items-center justify-center;
img { img {
@ -28,10 +28,12 @@
&__title { &__title {
@apply font-bold text-secondary text-xl; @apply font-bold text-secondary text-xl;
} }
&__subtitle {
@apply font-bold text-secondary text-base pb-2;
}
} }
&__comment { &__comment {
@apply pt-4 max-w-3xl pr-6 text-secondary; @apply max-w-3xl pr-6 text-secondary;
line-height: 1.6; line-height: 1.6;
} }
@ -41,6 +43,28 @@
max-width: 200px; max-width: 200px;
/* transform: scale(2) translate(-50%, -20%); */ /* transform: scale(2) translate(-50%, -20%); */
} }
&__thumbnail-cover {
position: relative;
img {
@apply rounded-2xl object-cover;
aspect-ratio: 16/9;
max-width: 400px;
}
&:before {
content: '';
@apply bg-neutral-900
inset-0
z-30
absolute
w-full h-full
opacity-30
rounded-2xl;
content: '';
/* @apply absolute inset-0 bg-gradient-to-t from-secondary to-transparent; */
}
}
.cta { .cta {
@apply mt-8; @apply mt-8;
} }

View File

@ -4,7 +4,6 @@ $current_page_id = get_queried_object_id();
$pageIcon = get_field('page_icon', get_queried_object_id()) ?? null; $pageIcon = get_field('page_icon', get_queried_object_id()) ?? null;
$posts_per_page = 5; $posts_per_page = 5;
// #### BROCHURES QUERY // #### BROCHURES QUERY
@ -39,22 +38,9 @@ $fichesInfosPosts = new WP_Query($args);
// #### VIDÉOS & WEBINAIRES QUERY // #### VIDÉOS & WEBINAIRES QUERY
$args = array( $videosWebinairesDatas = get_field('videos_webinaires', $current_page_id)['videos_webinaires_datas'] ?? null;
'post_type' => 'fiches-infos',
'posts_per_page' => $posts_per_page,
'post_status' => 'publish',
'order' => 'DESC',
'orderby' => 'date',
'meta_key' => 'brochure_pdf',
'meta_value' => '',
'meta_compare' => '!=',
// ICI METAQUERY FOR LE PDF
);
$fichesInfosPosts = new WP_Query($args);
$total_posts_found = $brochuresPosts->found_posts + $fichesInfosPosts->found_posts + 100;
$total_posts_found = $brochuresPosts->found_posts + $fichesInfosPosts->found_posts + count($videosWebinairesDatas);
?> ?>
<div class="template-archives template-archives--publications"> <div class="template-archives template-archives--publications">
@ -86,7 +72,7 @@ $total_posts_found = $brochuresPosts->found_posts + $fichesInfosPosts->found_pos
<div class="filters-toolbar filters-toolbar--archive-news"> <div class="filters-toolbar filters-toolbar--archive-news">
<p class="filters-toolbar__posts-results-amount filter-disable" role="status"> <p class="filters-toolbar__posts-results-amount filter-disable" role="status">
<span class="results-amount"> <span class="results-amount">
<?php echo $posts->found_posts ?> <?php echo $total_posts_found ?>
</span> </span>
<span class="results-text"> <span class="results-text">
<?php echo __("résultat(s)", "homegrade-theme__texte-fonctionnel"); ?> <?php echo __("résultat(s)", "homegrade-theme__texte-fonctionnel"); ?>
@ -137,8 +123,8 @@ $total_posts_found = $brochuresPosts->found_posts + $fichesInfosPosts->found_pos
<p class="section_titling__subtitle">Curabitur eleifend neque eu erat lacinia tincidunt</p> <p class="section_titling__subtitle">Curabitur eleifend neque eu erat lacinia tincidunt</p>
</div> </div>
<?php <?php
$highlightedBrochureRelatedPost = get_field('highlighted_brochure', $current_page_id) ?? null; $highlightedBrochure = get_field('highlighted_brochure', $current_page_id) ?? null;
$highlightedBrochurePdf = get_field('brochure_pdf', $highlightedBrochureRelatedPost->ID) ?? null; $highlightedBrochurePdf = get_field('brochure_pdf', $highlightedBrochure['post']) ?? null;
$highlightedBrochureCover = get_field('brochure_cover_image', $highlightedBrochurePdf['ID']) ?? null; $highlightedBrochureCover = get_field('brochure_cover_image', $highlightedBrochurePdf['ID']) ?? null;
$highlightedBrochureComment = get_field('highlighted_brochure_comment', $current_page_id) ?? null; $highlightedBrochureComment = get_field('highlighted_brochure_comment', $current_page_id) ?? null;
?> ?>
@ -258,38 +244,64 @@ $total_posts_found = $brochuresPosts->found_posts + $fichesInfosPosts->found_pos
<h2 class="section_titling__title"><?php echo __("Nos vidéos et webinaires", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></h2> <h2 class="section_titling__title"><?php echo __("Nos vidéos et webinaires", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></h2>
<p class="section_titling__subtitle">Phasellus elit turpis, viverra id porta gravida</p> <p class="section_titling__subtitle">Phasellus elit turpis, viverra id porta gravida</p>
</div> </div>
<ul class="publications-grid">
<?php if ($fichesInfosPosts->have_posts()) : while ($fichesInfosPosts->have_posts()) : $fichesInfosPosts->the_post(); ?>
<?php <?php
$ficheInfoPdf = get_field('brochure_pdf', get_the_ID()); $highlightedWebinaire = get_field('highlighted_webinaire', $current_page_id) ?? null;
// $ficheInfoCover = get_field('brochure_cover', get_the_ID());
// $ficheInfoCover = get_field('brochure_cover_image', $ficheInfoPdf['ID']);
$ficheInfoEdition = get_field('brochure_edition', get_the_ID());
$thematique = get_the_terms(get_the_ID(), 'thematiques')[0];
$rootThematic = getParentThematique($thematique);
$rootThematicIcon = get_field('taxonomy_pictures', "thematiques_" . $rootThematic->term_id)['icon'] ?? null;
?> ?>
<li class="publications-grid__row"> <?php if ($highlightedBrochurePdf) : ?>
<div class="highlighted-publication">
<div class="highlighted-publication__infos">
<?php if ($rootThematicIcon) : ?> <div class="highlighted-publication__titling">
<img class="publications-grid__icon" src="<?php echo $rootThematicIcon['url'] ?>" /> <div class="highlighted-publication__titling__icon">
<img src="<?php echo get_template_directory_uri() . '/resources/img/graphic-assets/house-homegrade-icon.svg' ?>" alt="">
</div>
<h3 class="highlighted-publication__titling__title">
<?php echo __("Sélection de nos conseillers", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?>
</h3>
</div>
<?php if ($highlightedWebinaire['title']) : ?>
<h4 class="highlighted-publication__titling__subtitle"><?php echo $highlightedWebinaire['title'] ?></h4>
<?php endif; ?> <?php endif; ?>
<h2 class="publications-grid__title"><?php echo get_the_title() ?></h2> <?php if ($highlightedWebinaire['commentary']) : ?>
<p class="publications-grid__thematique thematique-tag thematique-tag--<?php echo $rootThematic->slug ?>"><?php echo $rootThematic->name ?></p> <p class="highlighted-publication__comment"><?php echo $highlightedWebinaire['commentary'] ?></p>
<?php if ($ficheInfoEdition) : ?>
<p class="publications-grid__edition"><?php echo $ficheInfoEdition ?></p>
<?php endif; ?> <?php endif; ?>
<a class="cta cta--secondary cta--button" href="<?php echo $highlightedWebinaire['url'] ?>" target="_blank"><?php echo __("Consulter la vidéo", "homegrade-theme__texte-fonctionnel__archive-publications") ?></a>
</div>
<?php if ($highlightedWebinaire['thumbnail']) : ?>
<div class="highlighted-publication__thumbnail-cover">
<img src='<?php echo $highlightedWebinaire['thumbnail']['url'] ?>' alt="<?php echo $highlightedWebinaire['thumbnail']['alt'] ?>" />
</div>
<?php endif; ?>
</div>
<?php endif; ?>
<ul class="publications-grid publications-grid--webinaires">
<?php foreach ($videosWebinairesDatas as $videoData) : ?>
<li class="publications-grid__row publications-grid--webinaires__row">
<img class="publications-grid__video-thumbnail" src="<?php echo $videoData['thumbnail']['url'] ?>" />
<h2 class="publications-grid__title"><?php echo $videoData['title'] ?></h2>
<?php if ($videoData['thematique']) : ?>
<p class="publications-grid__thematique thematique-tag thematique-tag--<?php echo $videoData['thematique']->slug ?>"><?php echo $videoData['thematique']->name ?></p>
<?php endif; ?>
<?php if (!$videoData['thematique']) : ?>
<p class="publications-grid__thematique thematique-tag thematique-tag--general"><?php echo __("Général", "homegrade-theme_texte-fonctionnel") ?></p>
<?php endif; ?>
<p class="publications-grid__edition"><?php echo $videoData['date'] ?></p>
<div class="publications-grid__button"> <div class="publications-grid__button">
<a href="<?php echo $brochurePdf['url'] ?>" class=" cta cta--secondary cta--button" href="#" target="_blank"><?php echo __("Consulter le pdf", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></a> <a href="<?php echo $videoData['url'] ?>" class=" cta cta--secondary cta--button" target="_blank"><?php echo __("Voir la vidéo", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></a>
</div> </div>
</li> </li>
<?php endwhile ?>
<?php endif; ?> <?php endforeach; ?>
</ul> </ul>
<button id="load-more-brochures" class="cta cta--button cta--shadowed" target="_blank"><?php echo __("Consulter plus de fiches infos", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></button> <button id="load-more-brochures" class="cta cta--button cta--shadowed" target="_blank"><?php echo __("Consulter plus de fiches infos", "homegrade-theme__texte-fonctionnel__publications-archive-brochures") ?></button>