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

introducing the component

Browse Source
This commit is contained in:
Antoine M 2023-10-26 17:48:59 +02:00
parent 61670edfdf
commit 98d3243b32
5 changed files with 164 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
template-components/heading-box.css Normal file
View File

@ -0,0 +1,30 @@
.heading-box {
@apply container
bg-primary
text-white
text-center
mx-auto
py-12
rounded-2xl
pt-20
mt-8
relative;
/* max-w-screen-2xl
px-8 mx-auto
relative
pt-20; */
&__title {
@apply uppercase font-medium text-xl tracking-widest;
}
&__description {
@apply font-bold text-4xl max-w-screen-md mx-auto pt-4 max-w-md mx-auto;
line-height: 1.2;
}
&__page-icon {
@apply mx-auto w-28 absolute top-0 left-1/2;
transform: translate(-50%, -50%);
}
}

15
template-components/heading-box.php Normal file
View File

@ -0,0 +1,15 @@
<?php
$title = $args['title'];
$description = $args['description'];
$pageIcon = $args['pageIcon'] ?? null;
?>
<div class="heading-box ">
<?php if ($pageIcon) : ?>
<img class="heading-box__page-icon" src="<?php echo $pageIcon['url'] ?>" alt="" />
<?php endif; ?>
<h1 class="heading-box__title"><?php echo $title ?></h1>
<p class="heading-box__description"> <?php echo $description ?></p>
</div>

39
template-components/news-heading-box.css Normal file
View File

@ -0,0 +1,39 @@
.news-heading-box {
@apply container
bg-primary
text-white
mx-auto
py-12
px-8
rounded-3xl
mt-8
relative
flex
flex-nowrap
justify-between;
.post-infos-capsule {
@apply mt-4;
}
&__type {
@apply uppercase font-medium text-xl tracking-widest;
}
&__title {
@apply font-bold text-4xl pt-4 max-w-xl;
line-height: 1.2;
}
&__page-icon {
@apply mx-auto w-28 absolute top-0 left-1/2;
transform: translate(-50%, -50%);
}
&__content {
flex-shrink: 1;
flex-grow: 2;
}
&__thumbnail {
@apply w-80 h-56 object-cover rounded-3xl;
flex-shrink: 2;
}
}

32
template-components/news-heading-box.php Normal file
View File

@ -0,0 +1,32 @@
<?php
$title = $args['title'];
$description = $args['description'];
$news_type = $args['news_type'] ?? null;
$thumbnail = $args['thumbnail'] ?? null;
$published = $args['published'] ?? null;
?>
<div class="news-heading-box ">
<div class="news-heading-box__content">
<?php if ($news_type) : ?>
<h2 class="news-heading-box__type"><?php echo $news_type[0]->name ?></h2>
<?php endif; ?>
<h1 class="news-heading-box__title"> <?php echo $title ?></h1>
<?php
get_template_part("template-components/post-infos-capsule", null, array(
"postID" => get_the_ID(),
"published" => $published
));
?>
</div>
<?php if ($thumbnail) echo $thumbnail ?>
<!-- <img class="news-heading-box__thumbnail" src="<?php echo $thumbnail ?>" alt=""> -->
</div>

48
template-components/post-infos-capsule.php Normal file
View File

@ -0,0 +1,48 @@
<?php
$postID = $args['postID'];
$published = $args['published'] ?? null;
$modified = $args['modified'] ?? null;
function build_share_urls($postID)
{
$postUrl = get_permalink($postID);
$postTitle = get_the_title($postID);
$facebookUrl = 'https://www.facebook.com/sharer.php?u=' . $postUrl;
$twitterUrl = 'https://www.facebook.com/sharer.php?u=' . $postUrl;
$linkedInUrl = 'https://www.linkedin.com/feed/?shareActive=true&text=' . $postTitle . ' ' . $postUrl;
return array(
'facebook' => $facebookUrl,
'twitter-x' => $twitterUrl,
'linkedin' => $linkedInUrl
);
}
$shareUrls = build_share_urls($postID);
?>
<div class="post-infos-capsule">
<div class="post-infos-capsule__share">
Partager sur
<?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) : ?>
<!-- <img src="<?php echo get_template_directory_uri() . '/resources/img/graphic-assets/icone-social-' . $key . '.svg' ?>" /> -->
<?php endif; ?>
</a>
<?php endforeach; ?>
</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>
<?php endif; ?>
</div>