updating post infos capsule with taxonomy colors and globalized styles
This commit is contained in:
parent
82b31474f7
commit
43e0f81e37
|
|
@ -25,7 +25,6 @@
|
|||
@import './components/brochures-grid.css';
|
||||
@import './components/card-grid-container.css';
|
||||
@import './components/filters-toolbar.css';
|
||||
@import './components/post-infos-capsule.css';
|
||||
|
||||
@import '../../template-components/cards/card-news.css';
|
||||
@import '../../template-components/cards/card-frequent_question.css';
|
||||
|
|
@ -34,6 +33,7 @@
|
|||
@import '../../template-components/posts-components/chapter-header.css';
|
||||
@import '../../template-components/heading-box.css';
|
||||
@import '../../template-components/news-heading-box.css';
|
||||
@import '../../template-components/post-infos-capsule.css';
|
||||
|
||||
/* ########### LAYOUT ############ */
|
||||
@import './layout/header.css';
|
||||
|
|
|
|||
|
|
@ -60,7 +60,9 @@ body.akoestiek,
|
|||
@apply text-acoustique-coproprietes;
|
||||
}
|
||||
}
|
||||
time {
|
||||
.post-infos-capsule__share,
|
||||
.post-infos-capsule__publication-date,
|
||||
.post-infos-capsule__modification-date {
|
||||
@apply text-acoustique-coproprietes;
|
||||
}
|
||||
}
|
||||
|
|
@ -165,7 +167,9 @@ body.energie,
|
|||
@apply text-energies-urbanisme;
|
||||
}
|
||||
}
|
||||
time {
|
||||
.post-infos-capsule__share,
|
||||
.post-infos-capsule__publication-date,
|
||||
.post-infos-capsule__modification-date {
|
||||
@apply text-energies-urbanisme;
|
||||
}
|
||||
}
|
||||
|
|
@ -272,7 +276,9 @@ body.isolation,
|
|||
@apply text-isolation-quotidien;
|
||||
}
|
||||
}
|
||||
time {
|
||||
.post-infos-capsule__share,
|
||||
.post-infos-capsule__publication-date,
|
||||
.post-infos-capsule__modification-date {
|
||||
@apply text-isolation-quotidien;
|
||||
}
|
||||
}
|
||||
|
|
@ -370,7 +376,9 @@ body.erfgoed,
|
|||
@apply text-patrimoine-renovation;
|
||||
}
|
||||
}
|
||||
time {
|
||||
.post-infos-capsule__share,
|
||||
.post-infos-capsule__publication-date,
|
||||
.post-infos-capsule__modification-date {
|
||||
@apply text-patrimoine-renovation;
|
||||
}
|
||||
}
|
||||
|
|
@ -468,7 +476,9 @@ body.circulaire-renovatie,
|
|||
@apply text-location-renovation-circulaire;
|
||||
}
|
||||
}
|
||||
time {
|
||||
.post-infos-capsule__share,
|
||||
.post-infos-capsule__publication-date,
|
||||
.post-infos-capsule__modification-date {
|
||||
@apply text-location-renovation-circulaire;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
51
template-components/post-infos-capsule.css
Normal file
51
template-components/post-infos-capsule.css
Normal file
|
|
@ -0,0 +1,51 @@
|
|||
.post-infos-capsule {
|
||||
@apply flex flex-wrap justify-start gap-x-8 gap-y-5;
|
||||
&__share,
|
||||
&__publication-date,
|
||||
&__modification-date {
|
||||
@apply bg-white text-primary
|
||||
rounded-full
|
||||
px-4
|
||||
sm:px-6
|
||||
py-2
|
||||
w-fit
|
||||
h-auto
|
||||
flex justify-center
|
||||
items-center
|
||||
font-medium;
|
||||
}
|
||||
&__share {
|
||||
@apply gap-1 md:gap-2;
|
||||
.share-button {
|
||||
@apply bg-primary w-8 h-8 rounded-full p-4 relative;
|
||||
transition: transform 0.3s ease-in-out;
|
||||
&:before {
|
||||
@apply absolute w-3 h-3 bg-contain bg-center bg-no-repeat;
|
||||
width: 25px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
content: '';
|
||||
}
|
||||
&:hover {
|
||||
transform: scale(1.05);
|
||||
filter: brightness(1.4);
|
||||
}
|
||||
}
|
||||
.share-button--facebook {
|
||||
&:before {
|
||||
background-image: url('../resources/img/graphic-assets/icone-social-facebook.svg');
|
||||
}
|
||||
}
|
||||
.share-button--twitter-x {
|
||||
&:before {
|
||||
background-image: url('../resources/img/graphic-assets/icone-social-twitter-x.svg');
|
||||
}
|
||||
}
|
||||
.share-button--linkedin {
|
||||
&:before {
|
||||
background-image: url('../resources/img/graphic-assets/icone-social-linkedin.svg');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -3,10 +3,9 @@ $postID = $args['postID'];
|
|||
$published = $args['published'] ?? null;
|
||||
$modified = $args['modified'] ?? null;
|
||||
|
||||
|
||||
|
||||
function build_share_urls($postID)
|
||||
{
|
||||
if (!function_exists('build_share_urls')) {
|
||||
function build_share_urls($postID)
|
||||
{
|
||||
$postUrl = get_permalink($postID);
|
||||
$postTitle = get_the_title($postID);
|
||||
$facebookUrl = 'https://www.facebook.com/sharer.php?u=' . $postUrl;
|
||||
|
|
@ -18,6 +17,7 @@ function build_share_urls($postID)
|
|||
'twitter-x' => $twitterUrl,
|
||||
'linkedin' => $linkedInUrl
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$shareUrls = build_share_urls($postID);
|
||||
|
|
@ -27,7 +27,9 @@ $shareUrls = build_share_urls($postID);
|
|||
|
||||
<div class="post-infos-capsule">
|
||||
<div class="post-infos-capsule__share">
|
||||
Partager sur
|
||||
<?php
|
||||
__('Partager sur', 'homegrade-theme__texte-fonctionnel')
|
||||
?>
|
||||
<?php foreach ($shareUrls as $key => $shareUrl) : ?>
|
||||
<a class="share-button share-button--<?php echo $key ?>" href='<?php echo $shareUrl ?>' target="_blank" title="<?php echo __("Partager ce contenu sur", "homegrade-theme__texte-fonctionnel") . $key ?>">
|
||||
<?php if ($key) : ?>
|
||||
|
|
@ -38,11 +40,13 @@ $shareUrls = build_share_urls($postID);
|
|||
</div>
|
||||
<?php if ($published) : ?>
|
||||
<div class="post-infos-capsule__publication-date">
|
||||
|
||||
<time><?php echo __("Publié le ", "homegrade-theme__texte-fonctionnel") . $published ?></time>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php if ($modified) : ?>
|
||||
<time class="post-infos-capsule__publication-date"><?php echo __("Publié le ", "homegrade-theme__texte-fonctionnel") . $modified ?></time>
|
||||
<div class="post-infos-capsule__modification-date">
|
||||
<time><?php echo __("Mis à jour le ", "homegrade-theme__texte-fonctionnel") . $modified ?></time>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
Loading…
Reference in New Issue
Block a user