From 41a40c007cfd320ea84ccc1a350fe76cfa9ed1cd Mon Sep 17 00:00:00 2001
From: Antoine M <antoine.martinon@deligraph.com>
Date: Wed, 10 Jan 2024 16:50:21 +0100
Subject: [PATCH] introducing component

---
 template-components/heading-box--job.php  |  8 +++---
 template-components/heading-box--jobs.css | 35 +++++++++++++++++++++++
 2 files changed, 39 insertions(+), 4 deletions(-)
 create mode 100644 template-components/heading-box--jobs.css

diff --git a/template-components/heading-box--job.php b/template-components/heading-box--job.php
index b96ce29..ebe1153 100644
--- a/template-components/heading-box--job.php
+++ b/template-components/heading-box--job.php
@@ -10,13 +10,13 @@ $subtitle = $args['subtitle'] ?? null;
 
 ?>
 
-<div class="heading-box heading-box--news ">
+<div class="heading-box heading-box--jobs ">
 
-	<div class="heading-box--news__content">
+	<div class="heading-box--jobs__content">
 		<?php if ($subtitle) : ?>
-			<h2 class="heading-box__subtitle heading-box--news__type"><?php echo $subtitle ?></h2>
+			<h2 class="heading-box__subtitle heading-box--jobs__type"><?php echo $subtitle ?></h2>
 		<?php endif; ?>
-		<h1 class="heading-box__title heading-box--news__title"> <?php echo $title ?></h1>
+		<h1 class="heading-box__title heading-box--jobs__title"> <?php echo $title ?></h1>
 
 		<?php
 
diff --git a/template-components/heading-box--jobs.css b/template-components/heading-box--jobs.css
new file mode 100644
index 0000000..9612788
--- /dev/null
+++ b/template-components/heading-box--jobs.css
@@ -0,0 +1,35 @@
+.heading-box--jobs {
+  @apply mt-8
+   flex
+   relative
+   flex-nowrap
+   justify-between;
+  .post-infos-capsule {
+    @apply mt-8;
+  }
+  &__type {
+    @apply !text-xl !my-0 !tracking-widest font-bold;
+  }
+  &__title {
+    @apply !text-4xl font-bold;
+  }
+
+  &__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 
+    hidden 
+    lg:block;
+
+    flex-shrink: 2;
+  }
+}