From 79bb4504a0e14be9b0937e34e2fef31791f794bf Mon Sep 17 00:00:00 2001
From: Xin <xin@imfing.com>
Date: Sat, 28 Dec 2024 13:50:22 +0000
Subject: [PATCH] feat: add support for icon in badge shortcode (#525)

* feat: add icon support to badge shortcodes

- Introduced an optional icon parameter to both badge.html files.
- Updated the badge rendering to include the icon alongside the content.
- Enhanced the layout for better alignment of icon and text.

* feat: add new feature shortcode

* docs: update badge doc
---
 exampleSite/content/docs/guide/shortcodes/others.md |  7 +++----
 exampleSite/layouts/shortcodes/new-feature.html     | 11 +++++++++++
 layouts/partials/shortcodes/badge.html              |  6 +++++-
 layouts/shortcodes/badge.html                       |  3 +++
 4 files changed, 22 insertions(+), 5 deletions(-)
 create mode 100644 exampleSite/layouts/shortcodes/new-feature.html

diff --git a/exampleSite/content/docs/guide/shortcodes/others.md b/exampleSite/content/docs/guide/shortcodes/others.md
index 8c96e65b..37ce56fc 100644
--- a/exampleSite/content/docs/guide/shortcodes/others.md
+++ b/exampleSite/content/docs/guide/shortcodes/others.md
@@ -34,16 +34,15 @@ Result:
 {{< badge content="warning" type="warning" >}} &nbsp;
 {{< badge content="error" type="error" >}}
 
-With link:
+With link and icon:
 
 ```
-{{</* badge content="Releases" link="https://github.com/imfing/hextra/releases" */>}}
+{{</* badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" */>}}
 ```
 
 Result:
 
-{{< badge content="Releases" link="https://github.com/imfing/hextra/releases" >}}
-
+{{< badge content="Releases" link="https://github.com/imfing/hextra/releases" icon="github" >}}
 
 ## YouTube
 
diff --git a/exampleSite/layouts/shortcodes/new-feature.html b/exampleSite/layouts/shortcodes/new-feature.html
new file mode 100644
index 00000000..fadf7ec9
--- /dev/null
+++ b/exampleSite/layouts/shortcodes/new-feature.html
@@ -0,0 +1,11 @@
+{{- $version := .Get "version" | default "" -}}
+{{- $icon := .Get "icon" | default "" -}}
+{{- $defaultLink := cond (eq $version "") "https://github.com/imfing/hextra/tree/main" (printf "https://github.com/imfing/hextra/releases/tag/%s" $version) -}}
+{{- $link := .Get "link" | default $defaultLink -}}
+{{- $content := cond (eq $version "") "New in main branch" (printf "New in %s" $version) -}}
+
+<div style="margin-top: 1rem; display: inline-flex;">
+  <a href="{{ $link }}" title="{{ $link | plainify }}" target="_blank">
+    {{- partial "shortcodes/badge" (dict "content" $content "border" true "icon" $icon) -}}
+  </a>
+</div>
diff --git a/layouts/partials/shortcodes/badge.html b/layouts/partials/shortcodes/badge.html
index 3e249d76..38d91668 100644
--- a/layouts/partials/shortcodes/badge.html
+++ b/layouts/partials/shortcodes/badge.html
@@ -2,6 +2,7 @@
 {{- $type := .type -}}
 {{- $class := .class | default "" -}}
 {{- $border := .border | default false -}}
+{{- $icon := .icon | default "" -}}
 
 {{- $defaultClass := "hx-text-gray-600 hx-bg-gray-100 dark:hx-bg-neutral-800 dark:hx-text-neutral-200 hx-border-gray-200 dark:hx-border-neutral-700" -}}
 {{- $warningClass := "hx-border-yellow-100 hx-bg-yellow-50 hx-text-yellow-900 dark:hx-border-yellow-200/30 dark:hx-bg-yellow-700/30 dark:hx-text-yellow-200" -}}
@@ -11,6 +12,9 @@
 {{- $borderClass := cond (eq $border true) "hx-border" "" -}}
 {{- $badgeClass := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) -}}
 <div class="hextra-badge {{ $class }}">
-  <div class="hx-inline-flex hx-items-center hx-rounded-full hx-px-2.5 hx-leading-6 hx-text-[.65rem] {{ $borderClass }} {{ $badgeClass }}">{{- $content -}}</div>
+  <div class="hx-inline-flex hx-gap-1 hx-items-center hx-rounded-full hx-px-2.5 hx-leading-6 hx-text-[.65rem] {{ $borderClass }} {{ $badgeClass }}">
+    {{- with $icon -}}{{- partial "utils/icon" (dict "name" . "attributes" "height=12") -}}{{- end -}}
+    {{- $content -}}
+  </div>
 </div>
 {{- /* Strip trailing newline. */ -}}
diff --git a/layouts/shortcodes/badge.html b/layouts/shortcodes/badge.html
index e09e05db..370083ae 100644
--- a/layouts/shortcodes/badge.html
+++ b/layouts/shortcodes/badge.html
@@ -3,6 +3,7 @@
   {{- $type := .Get "type" | default "" -}}
   {{- $class := .Get "class" | default "" -}}
   {{- $link := .Get "link" | default "" -}}
+  {{- $icon := .Get "icon" | default "" -}}
 
   {{- if $link -}}
     <a href="{{ $link }}" title="{{ $content | plainify }}" target="_blank">
@@ -11,6 +12,7 @@
         "type" $type
         "class" $class
         "border" true
+        "icon" $icon
         )
       -}}
     </a>
@@ -20,6 +22,7 @@
       "type" $type
       "class" $class
       "border" true
+      "icon" $icon
       )
     -}}
   {{- end -}}