Compare commits

...

10 Commits

Author SHA1 Message Date
Nonimart
e0dea30251 REFACTOR Moving some utilities functions to the parent theme to make them more reusable
Some checks failed
continuous-integration/drone/push Build is failing
2026-02-24 17:38:30 +01:00
Nonimart
77aec29cf9 REFINING 2026-02-24 17:38:00 +01:00
Nonimart
0468c1704a REFACTORING 2026-02-24 17:37:26 +01:00
Nonimart
d91f7c46c8 FEATURE Displaying the main author in the header 2026-02-24 17:37:14 +01:00
Nonimart
37656d8b05 FEATURE Adding a page-single class to wrapper to best handle the styles 2026-02-24 17:36:33 +01:00
Nonimart
77fe8c8ec0 REFACTOR Moving the component 2026-02-24 17:36:22 +01:00
Nonimart
4d0912f964 FEATURE Adding a page-single class to wrapper to best handle the styles 2026-02-24 17:34:23 +01:00
Nonimart
980a494795 REFACTOR Refining 2026-02-24 17:33:55 +01:00
Nonimart
789af27cd9 REFACTOR Moving style to parent carhop theme 2026-02-24 17:33:20 +01:00
Nonimart
e617bc8643 REFACTOR Moving style to parent carhop theme 2026-02-24 17:33:13 +01:00
14 changed files with 21 additions and 742 deletions

View File

@ -290,66 +290,6 @@ add_filter('the_content', 'apply_footnotes_urls_to_content', 10);
/**
* Récupère le nombre de likes d'un post
*
* Cette fonction utilitaire récupère le compteur de likes stocké
* dans les métadonnées d'un post. Retourne 0 si aucun like n'existe.
*
* @param int $post_id L'ID du post
* @return int Le nombre de likes (0 si aucun)
*/
function get_post_likes_count($post_id)
{
$likes_count = get_post_meta($post_id, 'likes_count', true);
return $likes_count ? intval($likes_count) : 0;
}
/**
* Affiche le nombre de likes d'un post avec formatage
*
* Cette fonction utilitaire formate l'affichage du compteur de likes
* avec une icône optionnelle et la gestion du pluriel.
*
* @param int $post_id L'ID du post
* @param bool $show_icon Afficher l'icône cœur (défaut: true)
* @return string Le texte formaté (ex: "❤️ 5 likes" ou "3 like")
*/
function display_likes_count($post_id, $show_icon = true)
{
$likes_count = get_post_likes_count($post_id);
$icon = $show_icon ? '❤️ ' : '';
return $icon . $likes_count . ' like' . ($likes_count > 1 ? 's' : '');
}
/**
* Construit les URL de partage pour un post
*
* Cette fonction génère les URL de partage pour un post spécifique.
* Elle retourne un tableau associatif contenant les URL de partage pour Facebook, Twitter-X et LinkedIn.
*
* @return array Tableau associatif contenant les URL de partage
*/
function build_share_urls()
{
$post_id = get_the_ID();
$postUrl = get_permalink($post_id);
$postTitle = get_the_title($post_id);
$facebookUrl = 'https://www.facebook.com/sharer.php?u=' . $postUrl;
$twitterUrl = 'https://twitter.com/intent/tweet?text=' . $postTitle . '&url=' . get_the_permalink(get_the_id());
$linkedInUrl = 'https://www.linkedin.com/feed/?shareActive=true&text=' . $postTitle . ' ' . $postUrl;
return array(
'Facebook' => $facebookUrl,
'Twitter-X' => $twitterUrl,
'Linkedin' => $linkedInUrl,
'postUrl' => $postUrl
);
}
/**
* Génère les métadonnées Open Graph pour le partage sur les réseaux sociaux

View File

@ -24,7 +24,7 @@
@import './components/authors-list.css';
@import './components/article-content.css';
@import './components/content-meta.css';
@import './components/post-header.css';
/* @import './components/post-header.css'; */
@import './components/sommaire-index.css';
@import './components/index-panel.css';
@import './components/footnotes-index.css';

View File

@ -68,56 +68,6 @@
@apply ml-auto;
}
#listen-article,
#stop-reading {
@apply rounded-full w-12 h-12 flex items-center justify-center m-0 p-0 transition-all duration-300;
}
#listen-article {
@apply bg-primary text-white;
&:hover {
@apply scale-110;
}
img {
@apply w-6 h-6;
}
&[data-reading-status='playing'] {
/* @apply bg-blue-500; */
@apply bg-white border border-primary;
/* &:hover {
@apply bg-red-500;
} */
#play-reading {
@apply hidden;
}
#pause-reading {
@apply block;
}
}
&[data-reading-status='stopped'] {
#play-reading {
@apply block;
}
#pause-reading {
@apply hidden;
}
}
&[data-reading-status='paused'] {
@apply bg-yellow-500;
#play-reading {
@apply block;
}
#pause-reading {
@apply hidden;
}
}
}
#stop-reading {
@apply bg-primary hidden;
img {
@apply w-4 h-4;
}
}
&:has(
#listen-article[data-reading-status='playing'],
#listen-article[data-reading-status='paused']
@ -128,21 +78,21 @@
}
}
.toolbar-actions {
/* .toolbar-actions {
@apply flex items-center gap-3 ml-auto;
@media screen and (max-width: 1024px) {
@apply absolute left-0 translate-y-full;
bottom: -20px;
}
}
} */
}
body:has(
.content-wrapper[data-active-tab='authors'],
.content-wrapper[data-active-tab='references'],
.content-wrapper[data-active-tab='table-of-contents'],
.content-wrapper[data-active-tab='informations']
) {
) {
@media screen and (max-width: 1024px) {
#article-toolbar {
@apply mb-0;

View File

@ -2,10 +2,6 @@
@apply p-8 border border-primary relative grid gap-y-4 gap-12 bg-white;
grid-template-columns: 1fr;
transition: transform 0.3s ease-out;
&:hover {
transform: translateY(-4px);
}
@screen lg {
grid-template-columns: 1fr 40px;
}

View File

@ -1,251 +0,0 @@
.post-header {
@apply bg-primary text-white py-8 2xl:py-16 px-2 lg:px-4 md:px-8 overflow-x-hidden;
h1.post-header__title,
h2.post-header__title {
@apply uppercase font-medium text-4xl md:text-5xl lg:text-5xl text-white;
line-height: 1.2;
}
&__inner {
@apply mx-auto grid gap-24;
@screen xl {
@apply container;
}
&--has-thumbnail {
@screen lg {
grid-template-columns: 4fr 1fr;
}
}
&--no-thumbnail {
grid-template-columns: 1fr;
}
}
.content-meta__revue-issue {
@apply bg-white text-primary;
}
.thumbnail-wrapper {
@apply order-2 lg:order-1 relative z-20 h-fit;
width: calc(100% - 40px);
padding: 1.2rem;
/* max-width: calc(70% - 40px);
@apply mx-auto; */
@screen lg {
/* transform: translateX(-10px); */
}
&:before {
content: '';
@apply bg-white block absolute top-0 left-0 border border-carhop-green-700 w-full h-full z-10;
}
img {
aspect-ratio: 4/5;
/* max-height: 200px; */
@apply max-h-[200px] lg:max-h-full h-full relative z-10;
@apply object-cover;
/* width: calc(100% - 2rem);
height: calc(100% - 2rem);
margin: 0 auto; */
}
.thumbnail-overlay {
@apply absolute z-0 rotate-3 top-6 left-6 w-full h-full border border-primary bg-white flex items-center justify-center;
transform: translate(2px, 2px) rotate(2deg);
/* transform: translate(12px, 12px) rotate(3deg); */
background-image: linear-gradient(#efe8ff, #efe8ff);
background-size: calc(100% - 12px) calc(100% - 12px);
background-repeat: no-repeat;
background-position: center;
background-blend-mode: color-burn;
&:after {
content: '';
@apply bg-carhop-purple-200;
width: calc(100% - 2rem);
height: calc(100% - 2rem);
}
}
}
.post-details {
@apply flex flex-col xl:flex-row xl:justify-between gap-x-4 gap-y-8 mt-12;
grid-template-columns: 1fr 1fr;
&__label {
@apply uppercase font-bold text-lg text-white;
letter-spacing: 0.2em;
}
}
.socials-buttons {
@apply flex flex-wrap justify-start xl:justify-end gap-4 h-fit shrink-0;
@screen xl {
min-width: 570px;
}
&__button {
@apply bg-white text-carhop-green-700 px-4 lg:px-6 md:px-8 !py-3 lg:!py-4 font-normal rounded-full w-max flex items-center gap-2;
transition: transform 0.3s ease-in-out;
&:hover {
transform: scale(1.05);
}
&[disabled] {
@apply opacity-50 cursor-not-allowed;
}
img {
@apply w-7 h-7 filter-primary;
}
&--like {
transition: all 0.3s ease-in-out;
.button-action-text {
max-width: 0;
overflow: hidden;
white-space: nowrap;
}
.likes-count {
max-width: 200px;
overflow: hidden;
/* transition: max-width 0.3s ease-in-out; */
white-space: nowrap;
}
&[data-likes-count='0'] {
.button-action-text {
max-width: 200px;
}
.likes-count {
max-width: 0;
}
}
&:hover {
.button-action-text {
max-width: 200px;
transition: max-width 0.3s ease-in-out;
}
.likes-count {
max-width: 0;
}
}
&.is-disabled {
@apply opacity-100 cursor-not-allowed hover:opacity-80;
.likes-count {
@apply block;
}
.button-action-text {
@apply max-w-0;
}
}
&.is-disabled:hover {
.button-action-text {
@apply max-w-[200px];
}
.likes-count {
@apply max-w-0;
}
}
}
&--share {
.socials-buttons__share-links {
@apply max-w-0 opacity-0 overflow-hidden max-h-7;
transition: all 0.3s ease-in-out;
}
&.is-open .socials-buttons__share-links {
@apply max-w-[200px] opacity-100;
}
.share-icon {
@apply max-w-[200px];
}
&.is-open {
.share-icon {
@apply max-w-0 overflow-hidden;
}
.socials-buttons__share-links {
overflow: visible;
}
.share-button {
transform: scale(1) !important;
transition: transform 0.2s ease-in-out !important;
}
.share-button:hover {
transform: scale(1.02) !important;
}
.copy-link,
.share-link {
@apply block w-7 h-7;
&:hover {
}
}
}
.share-link {
display: inline-block;
transition: transform 0.2s ease-in-out !important;
&:hover {
transform: scale(1.2) !important;
}
}
}
}
&__share-links {
@apply flex flex-wrap gap-2;
}
.share-link {
@apply transition-all duration-300;
&:after {
content: none;
}
img {
@apply w-7 h-7 filter-none;
}
&--copy-link {
@apply relative bg-transparent border-0 p-0 cursor-pointer;
.copy-feedback {
@apply absolute left-1/2 -translate-x-1/2 -bottom-8 bg-white text-primary px-3 py-1 rounded-md text-sm font-medium whitespace-nowrap z-50;
animation: fadeIn 0.3s ease-in-out;
}
}
}
}
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translate(-50%, -5px);
}
to {
opacity: 1;
transform: translate(-50%, 0);
}
}
.article-meta__related-revue {
flex-shrink: 1;
}
.article-meta__related-revue a {
@apply hover:underline underline-offset-8 text-white;
text-decoration-color: #fff;
text-decoration-thickness: 1px;
}
.article-meta__value {
@apply text-white font-light tracking-wide;
letter-spacing: 0.0015em;
}

View File

@ -1,88 +0,0 @@
.page--single-auteurs {
@apply max-w-screen-xl mx-auto px-4;
&__header {
@apply py-12 !my-0 bg-primary alignfull pb-80;
h1 {
@apply !text-5xl uppercase mb-8 col-span-2 !text-white;
}
p {
@apply text-white;
}
.inner {
@apply mx-auto flex flex-col lg:flex-row gap-24 justify-center items-center max-w-screen-xl;
}
.sub-infos {
@apply text-lg text-white flex gap-2 py-4;
.data-type {
@apply uppercase font-medium text-lg tracking-widest;
}
.articles-amount {
@apply flex items-center gap-2;
&::before {
content: '';
@apply block w-6 h-6 bg-no-repeat bg-center;
background-image: url('../resources/img/icons/icon-activites.svg');
background-size: contain;
}
}
}
.author-card__profile-picture {
@apply block col-span-2 lg:col-span-1 relative z-10 w-48 h-48 p-0;
.profile-picture-container {
@apply relative z-10 w-full h-full bg-white p-4;
z-index: 2;
}
.background-picture {
@apply absolute inset-0 w-full h-full bg-white;
z-index: -1;
transform: translate(30px, 30px) rotate(5deg);
&:after {
content: '';
@apply absolute inset-0 w-full h-full bg-carhop-green-100;
z-index: 2;
top: 1rem;
left: 1rem;
width: calc(100% - 2rem);
height: calc(100% - 2rem);
}
}
}
.infos {
@apply max-w-screen-md;
}
}
&__comities-list {
@apply flex flex-wrap gap-2 items-center col-span-2 text-primary font-normal pt-4;
}
&__comity {
@apply text-lg flex items-center gap-2 font-light tracking-wide;
&:before {
@apply content-[''] block w-6 h-6 bg-no-repeat bg-center;
background-size: contain;
}
+ .page--single-auteurs__comity {
@apply before:content-['|'] before:mx-2 before:text-primary;
}
&--redaction {
&:before {
background-image: url('../resources/img/icons/carhop-plume-white.svg');
}
}
}
&__latest-publication {
transform: translateY(-200px);
margin-bottom: -150px;
p {
@apply text-white uppercase text-lg font-semibold tracking-widest mb-8;
}
}
}

View File

@ -2,14 +2,14 @@
.page--single-articles {
.content-wrapper {
/* @apply bg-yellow-400; */
@apply container;
/* @apply container;
@apply mx-auto grid gap-12 lg:py-12 py-6 items-start;
grid-template-columns: 1fr 2fr;
@media (max-width: 1024px) {
grid-template-columns: 1fr;
}
} */
&[data-active-tab='article'] {
#article-tags,

View File

@ -3,7 +3,7 @@ get_header();
$revueID = get_field('related_revue', get_the_ID());
?>
<div class="page--single-articles" data-article-id="<?php echo get_the_ID(); ?>">
<div class="page-single page--single-articles" data-article-id="<?php echo get_the_ID(); ?>">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php get_template_part('template-parts/post-header'); ?>

View File

@ -1,151 +0,0 @@
<?php
get_header();
$author_id = get_the_ID();
$description = get_field('description', $author_id);
$profilePicture = get_field('profile_thumbnail', $author_id);
$profilePictureUrl = $profilePicture['url'] ?? '';
$profilePictureAlt = $profilePicture['alt'] ?? '';
$comity = get_field('comity', $author_id);
$articlesAmount = get_author_articles_amount($author_id);
$is_carhop_member = get_field('is_carhop_member', $ID);
$carhop_member_id = get_field('carhop_member', $ID);
if ($is_carhop_member && isset($carhop_member_id)) {
switch_to_blog(1);
$description = get_field('description', $carhop_member_id);
$comity = get_field('comity', $carhop_member_id);
restore_current_blog();
}
?>
<div class="page--single-auteurs" data-author-id="<?php echo $author_id; ?>">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<div class="page--single-auteurs__header">
<div class="inner container">
<div class="author-card__profile-picture">
<div class="profile-picture-container">
<?php if ($profilePictureUrl) : ?>
<img src="<?php echo $profilePictureUrl; ?>" alt="<?php echo $profilePictureAlt; ?>">
<?php else : ?>
<div class="author-card__profile-picture-placeholder">
</div>
<?php endif; ?>
</div>
<div class="background-picture"></div>
</div>
<div class="author-card__content">
<p class="page--single-auteurs__subinfo sub-infos">
<span class="data-type">Auteur·e</span>
<?php if ($articlesAmount) : ?>
<span class="articles-amount">
<?php echo $articlesAmount; ?> articles
</span>
<?php endif; ?>
</p>
<h1 class="page--single-auteurs__title"><?php the_title(); ?></h1>
<div class="infos">
<p><?php echo $description; ?></p>
<?php if ($comity) : ?>
<p class="page--single-auteurs__comities-list">
<?php foreach ($comity as $comity_value) : ?>
<?php
$comities = get_field_object('comity');
$comity_label = $comities['choices'][$comity_value] ?? null;
?>
<?php if ($comity_label) : ?>
<span class="page--single-auteurs__comity page--single-auteurs__comity--<?php echo $comity_value ?>"><?php echo $comity_label ?></span>
<?php endif; ?>
<?php endforeach; ?>
</p>
<?php endif; ?>
</div>
</div>
</div>
</div>
<div class="page--single-auteurs__latest-publication">
<p>Dernière publication</p>
<?php
$latestArticle = get_posts(array(
'post_type' => 'articles',
'posts_per_page' => 1,
'orderby' => 'date',
'order' => 'DESC',
'post_not_in' => array(913),
'meta_query' => array(
array(
'key' => 'authors',
'value' => $author_id,
'compare' => 'LIKE'
)
),
));
if (isset($latestArticle[0])) : ?>
<?php
get_template_part('template-parts/dynamiques/article-card', null, array(
'ID' => $latestArticle[0]->ID,
'showCover' => true,
));
?>
<?php endif; ?>
</div>
<?php
$authorArticles = get_posts(array(
'post_type' => 'articles',
'posts_per_page' => -1,
'post__not_in' => array($latestArticle[0]->ID),
'meta_query' => array(
array(
'key' => 'authors', // Ajustez selon votre structure
'value' => $author_id,
'compare' => 'LIKE'
)
),
));
?>
<ul class="post-grid__list">
<?php foreach ($authorArticles as $article) : ?>
<?php get_template_part('template-parts/articles/card-article', null, array(
'ID' => $article->ID,
'showAuthors' => true,
)); ?>
<?php endforeach; ?>
</ul>
<?php endwhile; ?>
<?php endif; ?>
</div>
<?php
get_footer();

View File

@ -7,7 +7,7 @@ $articles = get_field('articles', $current_issue->ID);
?>
<div class="page--single-revue" data-revue-id="<?php echo get_the_ID(); ?>">
<div class="page-single page--single-revue" data-revue-id="<?php echo get_the_ID(); ?>">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>

View File

@ -1,51 +0,0 @@
<?php
$postId = $args['postId'] ?? get_the_ID();
$authors = get_field('authors', $postId);
$isArticle = is_singular('articles');
if ($isArticle) {
$authors = get_field('authors', $postId);
} else {
$authors = getRevueAuthors($postId);
}
if (empty($authors)) return;
// Construire une meta_query avec OR pour chaque auteur
$meta_query = array('relation' => 'OR');
foreach ($authors as $author_id) {
$meta_query[] = array(
'key' => 'authors',
'value' => '"' . $author_id . '"', // Recherche la valeur sérialisée
'compare' => 'LIKE'
);
}
$authorsLastPosts = get_posts(array(
'post_type' => $isArticle ? 'articles' : 'revues',
'posts_per_page' => 6,
'orderby' => 'date',
'order' => 'DESC',
'meta_query' => $meta_query,
));
if (empty($authorsLastPosts) || count($authorsLastPosts) < 2) return;
?>
<div class="authors-last-publications">
<?php if (count($authors) <= 1) : ?>
<h3 class="title-small">Ses dernières publications</h3>
<?php else : ?>
<h3 class="title-small">Leurs dernières publications</h3>
<?php endif; ?>
<?php foreach ($authorsLastPosts as $post) : ?>
<?php get_template_part('template-parts/articles/card-article', null, array(
'ID' => $post->ID,
'showAuthors' => true,
)); ?>
<?php endforeach; ?>
</div>
<?php wp_reset_postdata(); ?>

View File

@ -1,29 +0,0 @@
<?php
$postId = $args['postId'];
$isArticle = is_singular('articles');
$componentTitle = $isArticle ? 'Auteur·e·s de l\'article' : 'Auteur·e·s de la revue';
$authors = [];
if ($isArticle) {
$authors = get_field('authors', $postId);
} else {
$authors = getRevueAuthors($postId);
}
if (empty($authors)) return;
?>
<section class="authors-list">
<h3 class="authors-list__title"><?php echo $componentTitle; ?></h3>
<?php foreach ($authors as $authorID) : ?>
<?php get_template_part(
'template-parts/authors/card-author',
null,
array(
'ID' => $authorID,
)
); ?>
<?php endforeach; ?>
</section>

View File

@ -1,42 +0,0 @@
<?php
$ID = $args['ID'];
$name = get_the_title($ID);
$link = get_the_permalink($ID);
$profilePicture = get_field('profile_thumbnail', $ID);
$profilePictureUrl = $profilePicture['url'] ?? '';
$profilePictureAlt = $profilePicture['alt'] ?? '';
$description = get_field('description', $ID);
$is_carhop_member = get_field('is_carhop_member', $ID);
$carhop_member_id = get_field('carhop_member', $ID);
if ($is_carhop_member && isset($carhop_member_id)) {
switch_to_blog(1);
$description = get_field('description', $carhop_member_id);
restore_current_blog();
}
// write_log($is_carhop_member);
$totalArticles = count_user_articles($ID, 'articles');
?>
<a href="<?php echo $link; ?>" class="author-card">
<div class="author-card__profile-picture">
<?php if ($profilePictureUrl) : ?>
<img src="<?php echo $profilePictureUrl; ?>" alt="<?php echo $profilePictureAlt; ?>">
<?php else : ?>
<div class="author-card__profile-picture-placeholder">
</div>
<?php endif; ?>
</div>
<div class="author-card__infos">
<h3 class="author-card__name"><?php echo $name; ?></h3>
<p class="author-card__articles-amount"><?php echo $totalArticles; ?> article<?php echo $totalArticles > 1 ? 's' : ''; ?></p>
</div>
<div class="author-card__description">
<?php echo $description; ?>
</div>
</a>

View File

@ -19,6 +19,7 @@ $citeReference = get_field('cite_reference', $post_id);
$likes_count = get_post_likes_count($post_id);
$authors = get_field('authors', $post_id);
?>
<section class="post-header post-header--<?php echo $post_type; ?> ">
@ -56,7 +57,11 @@ $likes_count = get_post_likes_count($post_id);
<?php elseif ($post_type === 'articles') : ?>
<h1 class="post-header__title"> <?php echo get_the_title(); ?></h1>
<?php endif; ?>
<?php if ($authors && is_array($authors) && count($authors) > 0) : ?>
<a class="post-header__main-author" href="<?php echo get_the_permalink($authors[0]->ID); ?>">
<?php echo $authors[0]->post_title; ?>
</a>
<?php endif; ?>
<div class="post-details">
<?php if ($post_type === 'revues') : ?>
<div class="revue-meta">