Antoine/Metiers_du_patrimoine_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

FEATURE Handling click on cover

Browse Source
This commit is contained in:
Nonimart 2025-07-10 17:26:41 +02:00
parent 952bbe3969
commit 4236aaacf1
2 changed files with 25 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
template-components/artisans/card-artisans-search.php
View File

@ -23,11 +23,13 @@ $cover_image = get_field('artisan_cover', $postID);
<article class="card-artisans"> <article class="card-artisans">
<a href="<?php echo get_the_permalink($postID) ?>" class="card-artisans__cover-container">
<?php if ($cover_image): ?> <?php if ($cover_image): ?>
<img src="<?php echo $cover_image['url'] ?>" alt="<?php echo $post_title ?>" class="card-artisans__cover-image"> <img src="<?php echo $cover_image['url'] ?>" alt="<?php echo $post_title ?>" class="card-artisans__cover-image">
<?php else: ?> <?php else: ?>
<img src="<?php echo $postDefautlThumbnail ?>" alt="<?php echo $post_title ?>" class="card-artisans__cover-image is-placeholder"> <img src="<?php echo $postDefautlThumbnail ?>" alt="<?php echo $post_title ?>" class="card-artisans__cover-image is-placeholder">
<?php endif; ?> <?php endif; ?>
</a>
<div class="card-artisans__inner"> <div class="card-artisans__inner">
<h2 class="card-artisans__title"><?php echo $post_title ?></h2> <h2 class="card-artisans__title"><?php echo $post_title ?></h2>

23
template-components/artisans/card-artisans.css
View File

@ -1,20 +1,33 @@
.card-artisans { .card-artisans {
@apply bg-white rounded-lg shadowed; @apply bg-white rounded-lg shadowed-md flex flex-col;
&__thumbnail { &__thumbnail {
@apply w-full h-32 lg:h-48 object-cover rounded-t-xl; @apply w-full h-32 lg:h-48 object-cover rounded-t-xl;
} }
&__cover-container {
@apply w-full overflow-hidden rounded-t-xl;
&:hover .card-artisans__cover-image {
@apply scale-105;
filter: brightness(1.1);
}
&:hover .card-artisans__cover-image.is-placeholder {
filter: brightness(1);
}
&:has(.card-artisans__cover-image.is-placeholder) {
transform: scaleX(-1);
}
}
&__cover-image { &__cover-image {
@apply w-full h-32 lg:h-48 object-cover rounded-t-xl; @apply w-full h-32 lg:h-48 object-cover rounded-t-xl;
@apply transition-all duration-300;
&.is-placeholder { &.is-placeholder {
@apply bg-purple-50 py-4; @apply bg-purple-50 py-4;
@apply object-contain; @apply object-contain;
transform: scaleX(-1); /* transform: scaleX(-1); */
object-size: 120%; object-size: 120%;
} }
} }
&__inner { &__inner {
@apply p-6; @apply p-6 w-full grow flex flex-col;
} }
&__title { &__title {
@apply !text-2xl font-bold text-patrimoine-sante-securite !my-0; @apply !text-2xl font-bold text-patrimoine-sante-securite !my-0;
@ -30,7 +43,7 @@
} }
&__adresse { &__adresse {
@apply font-normal underline-offset-4 inline-flex !mt-0 w-full; @apply font-normal underline-offset-4 inline-flex !mt-auto w-full;
&:before { &:before {
@apply inline-flex mr-3 h-6 w-6 bg-center bg-contain bg-no-repeat; @apply inline-flex mr-3 h-6 w-6 bg-center bg-contain bg-no-repeat;
content: ''; content: '';