From bd9964b53d69da792fbfba129b6dea0ad37a071d Mon Sep 17 00:00:00 2001
From: eltrac <hi@eltr.ac>
Date: Mon, 23 Mar 2026 15:13:24 +0800
Subject: feat(shortcode/music): add special style to albums

---
 i18n/en.toml                   |  6 +++++-
 i18n/zh.toml                   |  1 +
 layouts/_shortcodes/music.html | 22 ++++++++++++++++++----
 3 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/i18n/en.toml b/i18n/en.toml
index 82391c89..df17bf44 100644
--- a/i18n/en.toml
+++ b/i18n/en.toml
@@ -85,5 +85,9 @@ interactOnFediverse = "Interact on Fediverse"
 mentionedThisPost = "mentioned this post"
 
 [music]
-netease = "Netease"
+netease = "Netease Music"
+bandcamp = "Bandcamp"
+apple = "Apple Music"
+spotify = "Spotify"
+album = "ALBUM"
 openIn = "Open in {{ . }}"
diff --git a/i18n/zh.toml b/i18n/zh.toml
index edbf6aa4..fffe2e22 100644
--- a/i18n/zh.toml
+++ b/i18n/zh.toml
@@ -96,4 +96,5 @@ netease = "网易云音乐"
 bandcamp = "Bandcamp"
 apple = "Apple Music"
 spotify = "Spotify"
+album = "专辑"
 openIn = "在 {{ . }} 中打开"
diff --git a/layouts/_shortcodes/music.html b/layouts/_shortcodes/music.html
index 31ec45e8..feeb87fb 100644
--- a/layouts/_shortcodes/music.html
+++ b/layouts/_shortcodes/music.html
@@ -1,17 +1,31 @@
 {{ $title := .Get "title" }}
 {{ $cover := .Get "cover" }}
 {{ $artist := .Get "artist" }}
+{{ $isAlbum := .Get "album" }}
+
 {{ $platforms := slice "bandcamp" "apple" "spotify" "netease" }}
 {{ $page := . }}
 
 <div class="flex flex-col md:flex-row md:justify-between md:items-center gap-2">
     <!-- Cover, title, artist -->
     <div class="flex gap-5 items-center">
-        <img class="w-15 h-15 rounded-lg shadow-lg m-0!"
-            alt="{{ $title }} music cover"
-            src="{{ $cover }}" loading="lazy" />
+        <div class="relative">
+            <img class="w-15 h-15 rd-lg shadow-lg m-0!"
+                alt="{{ $title }} music cover"
+                src="{{ $cover }}" loading="lazy" />
+            {{ if $isAlbum }}
+            <div class="w-13 h-13 rd-md bg-neutral-400 dark:bg-neutral-600 absolute top-1 left-3 -z-1"></div>
+            {{ end }}
+        </div>
         <div>
-            <h4 class="m-0 text-size-base">{{ $title }}</h4>
+            <h4 class="m-0 text-size-base flex items-center gap-2">
+                <span>{{ $title }}</span>
+                {{ if $isAlbum }}
+                <span class="font-mono bg-neutral-400 dark:bg-neutral-700 text-white
+                      px-1 rd text-xs leading-relaxed hidden sm:inline-block"
+                    >{{ T "music.album" }}</span>
+                {{ end }}
+            </h4>
             <p class="m-0 text-size-sm text-secondary">{{ $artist }}</p>
         </div>
     </div>
-- 
cgit v1.2.3