Featured articles fix

website/_data/news.yml

@@ -3,7 +3,7 @@
   category: Podcast
   thumbnail: https://images.transistor.fm/file/transistor/images/show/10529/thumb_1656512000-artwork.jpg
   link: https://share.transistor.fm/s/7bf78eb5
-  #featured: true
+  featured: true
   createdAt: 2023-08-09 00:00:00
 
 - title: Interview With Vlad A. Ionescu
@@ -40,7 +40,6 @@
   category: Media Coverage
   thumbnail: https://techcrunch.com/wp-content/uploads/2023/02/GettyImages-1312072591.jpg?w=1390&crop=1
   link: https://techcrunch.com/2023/02/23/earthly-wants-to-reinvent-continuous-integration-to-make-it-faster-and-cheaper/
-  featured: true
   createdAt: 2023-02-23 15:00:00
 
 - title: Fixing the CI/CD experience with Vlad A. Ionescu

website/_includes/newsroom/hero.html

@@ -2,11 +2,16 @@
   <div class="flex flex-col items-center max-w-7xl mx-auto px-4 lg:px-10">
     <h1 class="font-medium max-w-4xl text-[#2d7e5d] text-5xl sm:text-7xl text-center tracking-tight">Newsroom</h1>
 
-    {% assign featured = site.data.news | where:"featured", true %}
+    {% assign newsData = site.data.news %}
+    {% for item in site.news %}
+      {% assign newsData = newsData | push: item %}
+    {% endfor %}
+    {% assign featured = newsData | where:"featured", true %}
+
     <div class="flex mt-10">
       <a href="{{ featured[0].link }}">
         <div class="h-full bg-[#E8F7FE] flex flex flex-col-reverse lg:flex-row gap-6 p-6 rounded-2xl">
-          <div class="w-full lg:w-5/12 h-full bg-white flex flex-col justify-center px-8 py-10 rounded-2xl text-xl">
+          <div class="w-full lg:min-w-[42%] lg:max-w-[496px] h-full bg-white flex flex-1 flex-col justify-center px-8 py-10 rounded-2xl text-xl">
             <div class="flex flex-wrap">
               <p class="mr-1 text-sm uppercase">{{ featured[0].source }} -</p>
               <time class="text-sm" datetime="{{ date | date_to_xmlschema }}">{{ featured[0].createdAt | date: "%B %-d, %Y" }}</time>
@@ -26,9 +31,11 @@ <h1 class="font-medium max-w-4xl text-[#2d7e5d] text-5xl sm:text-7xl text-center
             </div>
           </div>
 
-          <div class="h-full flex-1">
-            <img class="h-full object-cover rounded-2xl" src="{{ featured[0].thumbnail }}" alt="{{ item.title }}" />
-          </div>
+          {% if featured[0].thumbnail %}
+            <div class="w-fit lg:max-w-[632px] h-full mx-auto">
+              <img class="h-full object-cover rounded-2xl" src="{{ featured[0].thumbnail }}" alt="{{ item.title }}" />
+            </div>
+          {% endif %}
         </div>
       </a>
     </div>

website/_layouts/news.html

@@ -3,7 +3,7 @@
 ---
 
 <div class="mt-[70px] pt-6">
-  <div class="max-w-4xl mx-auto px-4 lg:px-10">
+  <div class="max-w-4xl mx-auto px-6 lg:px-10">
     <a href="/newsroom" class="flex items-center">
       <img src="/assets/svg/back.svg" alt="Back" />
       <p class="font-bold ml-1 text-[#2463eb] text-lg">Newsroom</p>

website/_styles/base.css

@@ -259,7 +259,7 @@ main.wave-main.homepage {
 }
 
 .highlight-category {
-  @apply cursor-pointer pb-2 text-[#6B7280] lg:text-xl;
+  @apply cursor-pointer pb-2 text-[#6B7280] text-sm lg:text-xl;
 }
 
 .highlight-category.active {