From 3e076a61bd234df8bf940e6c5824caceb51d9026 Mon Sep 17 00:00:00 2001
From: Rauhul Varma <rauhul@apple.com>
Date: Sat, 27 Jan 2024 15:32:44 -0800
Subject: [PATCH 1/2] Add support for tags to blog posts

Adds simple tag bubbles that can be added to blog posts. In the future
we may want to make these selectable for filtering and include a search
bar as was done for swift-evolution.
---
 _layouts/post.html              | 11 +++++++-
 assets/stylesheets/_screen.scss | 48 +++++++++++++++++++++++----------
 blog/index.html                 | 12 ++++++++-
 3 files changed, 55 insertions(+), 16 deletions(-)

diff --git a/_layouts/post.html b/_layouts/post.html
index 578108f2d..00c073caf 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -5,8 +5,17 @@
 <article class="post">
   <header>
     <h1>{{ page.title }}</h1>
+    <div class="subtitle">
+      <time pubdate datetime="{{ page.date | date_to_xmlschema }}">
+        {{ page.date | date: "%B %-d, %Y" }}
+      </time>
 
-    <time pubdate datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: "%B %-d, %Y" }}</time>
+      <div class="tags">
+        {% for tag in page.tag %}
+          <div class="tag"><span>{{ tag }}</span></div>
+        {% endfor %}
+      </div>
+    </div>
     {% include authors.html authors=page.author compact=true %}
   </header>
 
diff --git a/assets/stylesheets/_screen.scss b/assets/stylesheets/_screen.scss
index 01bddef44..46d9f641c 100644
--- a/assets/stylesheets/_screen.scss
+++ b/assets/stylesheets/_screen.scss
@@ -570,21 +570,41 @@ article {
       padding-top: 0em;
     }
 
-    time {
-      display: block;
-      text-transform: uppercase;
-      font-size: 14px;
-      font-weight: 400;
-      color: var(--color-figure-gray-tertiary);
-      margin-right: 3em;
-      margin-bottom: 1.25em;
-    }
+    .subtitle {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 1em;
 
-    .tags {
-      display: block;
-      font-size: 12px;
-      font-weight: 400;
-      margin-top: 0;
+      time {
+        flex-shrink: 0;
+        margin-top: 0.2em + 0.15em;
+        text-transform: uppercase;
+        font-size: 0.8em;
+        font-weight: 400;
+        color: var(--color-figure-gray-tertiary);
+      }
+
+      .tags {
+        display: flex;
+        flex-direction: row;
+        /* Allow tags to wrap to additional lines */
+        flex-wrap: wrap;
+        /* Add a small gap between additional lines */
+        gap: 0.4em;
+        /* Align to trailing edge */
+        justify-content: flex-end;
+
+        .tag {
+          text-transform: uppercase;
+          font-size: 0.8em;
+          font-weight: 400;
+          margin-left: 0.5em; /* Adjust margin as needed for spacing between tags */
+          color: var(--color-figure-gray-tertiary);
+          border: 0.15em solid var(--color-nav-rule);
+          border-radius: 0.5rem;
+          padding: 0.15em 0.4em;
+        }
+      }
     }
   }
 
diff --git a/blog/index.html b/blog/index.html
index 279279d3a..08133fb35 100644
--- a/blog/index.html
+++ b/blog/index.html
@@ -8,7 +8,17 @@
   <article id="{{ post.id }}" class="summary">
     <header>
       <h2 class="title"><a href="{{ post.url }}">{{ post.title }}</a></h2>
-      <time pubdate datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date: "%B %-d, %Y" }}</time>
+      <div class="subtitle">
+        <time pubdate datetime="{{ post.date | date_to_xmlschema }}">
+          {{ post.date | date: "%B %-d, %Y" }}
+        </time>
+
+        <div class="tags">
+          {% for tag in post.tag %}
+            <div class="tag"><span>{{ tag }}</span></div>
+          {% endfor %}
+        </div>
+      </div>
     </header>
     <section class="excerpt">
       {{ post.excerpt }}

From 50abed33d2943ed1f23c32dd674a6796ed0570aa Mon Sep 17 00:00:00 2001
From: Rauhul Varma <rauhul@apple.com>
Date: Tue, 27 Aug 2024 14:25:38 -0700
Subject: [PATCH 2/2] add embedded tag to 2 blog posts

---
 _posts/2024-03-12-byte-sized-swift-tiny-games-playdate.md | 1 +
 _posts/2024-04-03-embedded-swift-examples.md              | 1 +
 2 files changed, 2 insertions(+)

diff --git a/_posts/2024-03-12-byte-sized-swift-tiny-games-playdate.md b/_posts/2024-03-12-byte-sized-swift-tiny-games-playdate.md
index 9c4c32255..6a04f46cf 100644
--- a/_posts/2024-03-12-byte-sized-swift-tiny-games-playdate.md
+++ b/_posts/2024-03-12-byte-sized-swift-tiny-games-playdate.md
@@ -4,6 +4,7 @@ published: true
 date: 2024-03-12 10:00:00
 title: "Byte-sized Swift: Building Tiny Games for the Playdate"
 author: [rauhul]
+tag: [embedded]
 ---
 
 I'm excited to share [swift-playdate-examples](https://github.com/apple/swift-playdate-examples), a technical demonstration of using Swift to build games for [Playdate](https://play.date/), a handheld game system by [Panic](https://panic.com).
diff --git a/_posts/2024-04-03-embedded-swift-examples.md b/_posts/2024-04-03-embedded-swift-examples.md
index b83f5aa62..3c2d19df9 100644
--- a/_posts/2024-04-03-embedded-swift-examples.md
+++ b/_posts/2024-04-03-embedded-swift-examples.md
@@ -4,6 +4,7 @@ published: true
 date: 2024-04-03 10:00:00
 title: "Get Started with Embedded Swift on ARM and RISC-V Microcontrollers"
 author: [kubamracek]
+tag: [embedded]
 ---
 
 We're pleased to introduce a [repository of example projects](https://github.com/apple/swift-embedded-examples) that demonstrate how Embedded Swift can be used to develop software on a range of microcontrollers.