@xingwangzhe/stalux 1.24.2 → 1.24.4

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@xingwangzhe/stalux",
-    "version": "1.24.2",
+    "version": "1.24.4",
     "description": "A powerful, modern Astro blog theme — use as template or install as plugin",
     "keywords": [
         "astro",
@@ -100,7 +100,6 @@
     "devDependencies": {
         "astro": "^7.2.3",
         "knip": "^6.32.2",
-        "license-checker-rseidelsohn": "5.0.1",
         "oxfmt": "^0.64.0",
         "oxlint": "^1.79.0",
         "typescript": "^7.0.2"

package/src/components/stalux/layout/head.astro

@@ -43,8 +43,6 @@ interface Props {
 }
 
 const props = Astro.props as Props;
-const effectiveTitle = siteConfig.seoTitle || props.title;
-const effectiveDescription = props.description;
 const isArticle = props.isArticle ?? false;
 
 const canonicalBase = siteConfig.canonical || siteConfig.url;
@@ -68,12 +66,20 @@ const isNotFoundPage =
   Astro.url.pathname === "/404" || Astro.url.pathname === "/404/";
 const routeKind = getRouteKind(Astro.url.pathname);
 const isCollectionPage = routeKind.endsWith("-index") || routeKind.endsWith("-detail");
+// seoTitle 是首页的搜索标题，不应覆盖文章/分类等内页标题。
+const effectiveTitle = routeKind === "home" && siteConfig.seoTitle ? siteConfig.seoTitle : props.title;
+const effectiveDescription = props.description;
+const siteTitleSuffix = siteConfig.title ? ` | ${siteConfig.title}` : "";
+const contentTitle =
+  siteTitleSuffix && effectiveTitle.endsWith(siteTitleSuffix)
+    ? effectiveTitle.slice(0, -siteTitleSuffix.length)
+    : effectiveTitle;
 const resolvedNoindex = Boolean(siteConfig.noindex) || isNotFoundPage || Boolean(props.noindex);
 const resolvedNofollow = Boolean(siteConfig.nofollow) || isNotFoundPage;
 
 const openGraphConfig: Record<string, unknown> = {
   basic: {
-    title: effectiveTitle,
+    title: contentTitle,
     type: isArticle ? "article" : "website",
     image: ogImagePath,
     url: canonicalUrl,
@@ -85,7 +91,7 @@ const openGraphConfig: Record<string, unknown> = {
   },
   image: {
     url: ogImagePath,
-    alt: effectiveTitle,
+    alt: contentTitle,
   },
 };
 
@@ -101,11 +107,11 @@ if (isArticle) {
 }
 
 const twitterConfig = {
-  card: "summary_large_image" as TwitterCardType,
-  title: effectiveTitle,
+  card: (props.cover ? "summary_large_image" : "summary") as TwitterCardType,
+  title: contentTitle,
   description: effectiveDescription,
   image: ogImagePath,
-  imageAlt: effectiveTitle,
+  imageAlt: contentTitle,
   ...(siteConfig.twitterSite ? { site: siteConfig.twitterSite } : {}),
 };
 
@@ -140,6 +146,14 @@ const extendedLink = [
 const extendedMeta = [
   { name: "viewport", content: "width=device-width, initial-scale=1" },
   { name: "color-scheme", content: "dark" },
+  ...(!resolvedNoindex
+    ? [
+        {
+          name: "googlebot",
+          content: "max-image-preview:large, max-snippet:-1, max-video-preview:-1",
+        },
+      ]
+    : []),
 ];
 
 let schema: Record<string, unknown>;
@@ -148,55 +162,111 @@ const sameAs = mediaLinksConfig?.items
   .filter((link) => /^https?:\/\//i.test(link));
 const authorEntity = {
   "@type": "Person",
+  "@id": `${siteUrl}/#author`,
   name: authorConfig.name,
+  url: `${siteUrl}/about/`,
   ...(toAbsolute(authorConfig.avatar) ? { image: toAbsolute(authorConfig.avatar) } : {}),
   ...(sameAs.length ? { sameAs } : {}),
 };
 const publisher = {
   "@type": "Organization",
+  "@id": `${siteUrl}/#publisher`,
   name: siteName,
   url: siteUrl,
   ...(authorConfig.avatar ? { logo: toAbsolute(authorConfig.avatar) } : {}),
 };
+const websiteEntity = {
+  "@type": "WebSite",
+  "@id": `${siteUrl}/#website`,
+  url: `${siteUrl}/`,
+  name: siteName,
+  description: siteConfig.description,
+  inLanguage: siteConfig.lang || "zh-CN",
+  publisher: { "@id": `${siteUrl}/#publisher` },
+};
+const breadcrumbItems: Record<string, unknown>[] = [
+  {
+    "@type": "ListItem",
+    position: 1,
+    name: siteName,
+    item: `${siteUrl}/`,
+  },
+];
+if (isArticle && props.categories?.[0]) {
+  breadcrumbItems.push({
+    "@type": "ListItem",
+    position: breadcrumbItems.length + 1,
+    name: props.categories[0],
+    item: `${siteUrl}/categories/${encodeURIComponent(props.categories[0])}/`,
+  });
+}
+if (routeKind !== "home") {
+  breadcrumbItems.push({
+    "@type": "ListItem",
+    position: breadcrumbItems.length + 1,
+    name: contentTitle,
+    item: canonicalUrl,
+  });
+}
+const breadcrumbEntity = {
+  "@type": "BreadcrumbList",
+  "@id": `${canonicalUrl}#breadcrumb`,
+  itemListElement: breadcrumbItems,
+};
 if (isArticle) {
   schema = {
     "@context": "https://schema.org",
-    "@type": "BlogPosting",
-    headline: effectiveTitle,
-    description: effectiveDescription,
-    url: canonicalUrl,
-    ...(ogImagePath ? { image: ogImagePath } : {}),
-    ...(props.date ? { datePublished: props.date } : {}),
-    ...(props.updated || props.date ? { dateModified: props.updated || props.date } : {}),
-    ...(props.tags?.length ? { keywords: props.tags.join(", ") } : {}),
-    author: props.author ? { ...authorEntity, name: props.author } : authorEntity,
-    publisher,
-    inLanguage: siteConfig.lang || "zh-CN",
-    mainEntityOfPage: {
-      "@type": "WebPage",
-      "@id": canonicalUrl,
-    },
+    "@graph": [
+      websiteEntity,
+      authorEntity,
+      publisher,
+      breadcrumbEntity,
+      {
+        "@type": "BlogPosting",
+        "@id": `${canonicalUrl}#article`,
+        headline: contentTitle,
+        description: effectiveDescription,
+        url: canonicalUrl,
+        ...(ogImagePath ? { image: ogImagePath } : {}),
+        ...(props.date ? { datePublished: props.date } : {}),
+        ...(props.updated || props.date ? { dateModified: props.updated || props.date } : {}),
+        ...(props.tags?.length ? { keywords: props.tags.join(", ") } : {}),
+        ...(props.categories?.length ? { articleSection: props.categories } : {}),
+        author: { "@id": `${siteUrl}/#author`, ...(props.author ? { name: props.author } : {}) },
+        publisher: { "@id": `${siteUrl}/#publisher` },
+        isPartOf: { "@id": `${siteUrl}/#website` },
+        inLanguage: siteConfig.lang || "zh-CN",
+        mainEntityOfPage: {
+          "@type": "WebPage",
+          "@id": canonicalUrl,
+        },
+      },
+    ],
   };
 } else if (routeKind === "home") {
   schema = {
     "@context": "https://schema.org",
-    "@type": "WebSite",
-    url: canonicalUrl,
-    name: effectiveTitle,
-    description: effectiveDescription,
-    inLanguage: siteConfig.lang || "zh-CN",
-    publisher,
-    author: authorEntity,
+    "@graph": [websiteEntity, authorEntity, publisher],
   };
 } else {
   schema = {
     "@context": "https://schema.org",
-    "@type": isCollectionPage ? "CollectionPage" : routeKind === "about" ? "AboutPage" : "WebPage",
-    url: canonicalUrl,
-    name: effectiveTitle,
-    description: effectiveDescription,
-    inLanguage: siteConfig.lang || "zh-CN",
-    isPartOf: { "@type": "WebSite", url: siteUrl, name: siteName },
+    "@graph": [
+      websiteEntity,
+      authorEntity,
+      publisher,
+      breadcrumbEntity,
+      {
+        "@type": isCollectionPage ? "CollectionPage" : routeKind === "about" ? "AboutPage" : "WebPage",
+        "@id": canonicalUrl,
+        url: canonicalUrl,
+        name: contentTitle,
+        description: effectiveDescription,
+        inLanguage: siteConfig.lang || "zh-CN",
+        isPartOf: { "@id": `${siteUrl}/#website` },
+        breadcrumb: { "@id": `${canonicalUrl}#breadcrumb` },
+      },
+    ],
   };
 }
 const ldJson = JSON.stringify(schema, null, 2).replace(/<\//g, "<\\/");
@@ -233,4 +303,3 @@ const ldJson = JSON.stringify(schema, null, 2).replace(/<\//g, "<\\/");
   <script type="application/ld+json" set:html={ldJson} />
   <VerCount />
 </head>
-

package/src/pages/links.astro

@@ -7,17 +7,16 @@ import { getSiteData, getLinksData } from "@utils/config-utils";
 const configEntries = await getCollection("config");
 const siteConfig = getSiteData(configEntries);
 const linksConfig = getLinksData(configEntries)!;
-const siteTitle = siteConfig.title;
 const siteDescription = siteConfig.description;
 const linksTitle = linksConfig.title;
 const linksDescription = linksConfig.description;
 ---
 
-		<ListPage
-			    title={siteTitle}
-			    description={siteDescription}
-			    heading={linksTitle}
-			    subheading={linksDescription}
-			>
+<ListPage
+    title={linksTitle}
+    description={linksDescription || siteDescription}
+    heading={linksTitle}
+    subheading={linksDescription}
+>
     <LinkList />
 </ListPage>

package/src/assets/BiCcCircle.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 16 16"><path fill="#cccccc" d="M1 8a7 7 0 1 0 14 0A7 7 0 0 0 1 8m15 0A8 8 0 1 1 0 8a8 8 0 0 1 16 0M5.408 5.89c-.83 0-1.318.64-1.318 1.753v.742c0 1.108.479 1.727 1.318 1.727c.69 0 1.138-.435 1.187-1.05h1.147v.114c-.058 1.147-1.029 1.938-2.343 1.938c-1.612 0-2.518-1.028-2.518-2.729v-.747c0-1.7.914-2.75 2.518-2.75c1.319 0 2.29.812 2.343 1.999v.11H6.595c-.049-.638-.506-1.108-1.187-1.108Zm5.404 0c-.831 0-1.319.64-1.319 1.753v.742c0 1.108.48 1.727 1.319 1.727c.69 0 1.138-.435 1.186-1.05h1.147v.114c-.057 1.147-1.028 1.938-2.342 1.938c-1.613 0-2.518-1.028-2.518-2.729v-.747c0-1.7.914-2.75 2.518-2.75c1.318 0 2.29.812 2.342 1.999v.11h-1.147c-.048-.638-.505-1.108-1.186-1.108Z"/></svg>

package/src/assets/astro.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" width="115" height="48"><path fill="#17191E" d="M7.77 36.35C6.4 35.11 6 32.51 6.57 30.62c.99 1.2 2.35 1.57 3.75 1.78 2.18.33 4.31.2 6.33-.78.23-.12.44-.27.7-.42.18.55.23 1.1.17 1.67a4.56 4.56 0 0 1-1.94 3.23c-.43.32-.9.61-1.34.91-1.38.94-1.76 2.03-1.24 3.62l.05.17a3.63 3.63 0 0 1-1.6-1.38 3.87 3.87 0 0 1-.63-2.1c0-.37 0-.74-.05-1.1-.13-.9-.55-1.3-1.33-1.32a1.56 1.56 0 0 0-1.63 1.26c0 .06-.03.12-.05.2Z"/><path fill="url(#a)" d="M7.77 36.35C6.4 35.11 6 32.51 6.57 30.62c.99 1.2 2.35 1.57 3.75 1.78 2.18.33 4.31.2 6.33-.78.23-.12.44-.27.7-.42.18.55.23 1.1.17 1.67a4.56 4.56 0 0 1-1.94 3.23c-.43.32-.9.61-1.34.91-1.38.94-1.76 2.03-1.24 3.62l.05.17a3.63 3.63 0 0 1-1.6-1.38 3.87 3.87 0 0 1-.63-2.1c0-.37 0-.74-.05-1.1-.13-.9-.55-1.3-1.33-1.32a1.56 1.56 0 0 0-1.63 1.26c0 .06-.03.12-.05.2Z"/><path fill="#17191E" d="M.02 30.31s4.02-1.95 8.05-1.95l3.04-9.4c.11-.45.44-.76.82-.76.37 0 .7.31.82.76l3.04 9.4c4.77 0 8.05 1.95 8.05 1.95L17 11.71c-.2-.56-.53-.91-.98-.91H7.83c-.44 0-.76.35-.97.9L.02 30.31Zm42.37-5.97c0 1.64-2.05 2.62-4.88 2.62-1.85 0-2.5-.45-2.5-1.41 0-1 .8-1.49 2.65-1.49 1.67 0 3.09.03 4.73.23v.05Zm.03-2.04a21.37 21.37 0 0 0-4.37-.36c-5.32 0-7.82 1.25-7.82 4.18 0 3.04 1.71 4.2 5.68 4.2 3.35 0 5.63-.84 6.46-2.92h.14c-.03.5-.05 1-.05 1.4 0 1.07.18 1.16 1.06 1.16h4.15a16.9 16.9 0 0 1-.36-4c0-1.67.06-2.93.06-4.62 0-3.45-2.07-5.64-8.56-5.64-2.8 0-5.9.48-8.26 1.19.22.93.54 2.83.7 4.06 2.04-.96 4.95-1.37 7.2-1.37 3.11 0 3.97.71 3.97 2.15v.57Zm11.37 3c-.56.07-1.33.07-2.12.07-.83 0-1.6-.03-2.12-.1l-.02.58c0 2.85 1.87 4.52 8.45 4.52 6.2 0 8.2-1.64 8.2-4.55 0-2.74-1.33-4.09-7.2-4.39-4.58-.2-4.99-.7-4.99-1.28 0-.66.59-1 3.65-1 3.18 0 4.03.43 4.03 1.35v.2a46.13 46.13 0 0 1 4.24.03l.02-.55c0-3.36-2.8-4.46-8.2-4.46-6.08 0-8.13 1.49-8.13 4.39 0 2.6 1.64 4.23 7.48 4.48 4.3.14 4.77.62 4.77 1.28 0 .7-.7 1.03-3.71 1.03-3.47 0-4.35-.48-4.35-1.47v-.13Zm19.82-12.05a17.5 17.5 0 0 1-6.24 3.48c.03.84.03 2.4.03 3.24l1.5.02c-.02 1.63-.04 3.6-.04 4.9 0 3.04 1.6 5.32 6.58 5.32 2.1 0 3.5-.23 5.23-.6a43.77 43.77 0 0 1-.46-4.13c-1.03.34-2.34.53-3.78.53-2 0-2.82-.55-2.82-2.13 0-1.37 0-2.65.03-3.84 2.57.02 5.13.07 6.64.11-.02-1.18.03-2.9.1-4.04-2.2.04-4.65.07-6.68.07l.07-2.93h-.16Zm13.46 6.04a767.33 767.33 0 0 1 .07-3.18H82.6c.07 1.96.07 3.98.07 6.92 0 2.95-.03 4.99-.07 6.93h5.18c-.09-1.37-.11-3.68-.11-5.65 0-3.1 1.26-4 4.12-4 1.33 0 2.28.16 3.1.46.03-1.16.26-3.43.4-4.43-.86-.25-1.81-.41-2.96-.41-2.46-.03-4.26.98-5.1 3.38l-.17-.02Zm22.55 3.65c0 2.5-1.8 3.66-4.64 3.66-2.81 0-4.61-1.1-4.61-3.66s1.82-3.52 4.61-3.52c2.82 0 4.64 1.03 4.64 3.52Zm4.71-.11c0-4.96-3.87-7.18-9.35-7.18-5.5 0-9.23 2.22-9.23 7.18 0 4.94 3.49 7.59 9.21 7.59 5.77 0 9.37-2.65 9.37-7.6Z"/><defs><linearGradient id="a" x1="6.33" x2="19.43" y1="40.8" y2="34.6" gradientUnits="userSpaceOnUse"><stop stop-color="#D83333"/><stop offset="1" stop-color="#F041FF"/></linearGradient></defs></svg>

package/src/assets/background.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="1440" height="1024" fill="none"><path fill="url(#a)" fill-rule="evenodd" d="M-217.58 475.75c91.82-72.02 225.52-29.38 341.2-44.74C240 415.56 372.33 315.14 466.77 384.9c102.9 76.02 44.74 246.76 90.31 366.31 29.83 78.24 90.48 136.14 129.48 210.23 57.92 109.99 169.67 208.23 155.9 331.77-13.52 121.26-103.42 264.33-224.23 281.37-141.96 20.03-232.72-220.96-374.06-196.99-151.7 25.73-172.68 330.24-325.85 315.72-128.6-12.2-110.9-230.73-128.15-358.76-12.16-90.14 65.87-176.25 44.1-264.57-26.42-107.2-167.12-163.46-176.72-273.45-10.15-116.29 33.01-248.75 124.87-320.79Z" clip-rule="evenodd" style="opacity:.154"/><path fill="url(#b)" fill-rule="evenodd" d="M1103.43 115.43c146.42-19.45 275.33-155.84 413.5-103.59 188.09 71.13 409 212.64 407.06 413.88-1.94 201.25-259.28 278.6-414.96 405.96-130 106.35-240.24 294.39-405.6 265.3-163.7-28.8-161.93-274.12-284.34-386.66-134.95-124.06-436-101.46-445.82-284.6-9.68-180.38 247.41-246.3 413.54-316.9 101.01-42.93 207.83 21.06 316.62 6.61Z" clip-rule="evenodd" style="opacity:.154"/><defs><linearGradient id="b" x1="373" x2="1995.44" y1="1100" y2="118.03" gradientUnits="userSpaceOnUse"><stop stop-color="#D83333"/><stop offset="1" stop-color="#F041FF"/></linearGradient><linearGradient id="a" x1="107.37" x2="1130.66" y1="1993.35" y2="1026.31" gradientUnits="userSpaceOnUse"><stop stop-color="#3245FF"/><stop offset="1" stop-color="#BC52EE"/></linearGradient></defs></svg>

package/src/internal/pagefind.ts

@@ -1,41 +0,0 @@
-/**
- * Pagefind 搜索索引生成器
- *
- * 从原 src/integrations/pagefind.ts 迁移而来，
- * 变为集成的一个内部模块，在构建完成时自动运行。
- */
-
-import path from "node:path";
-import { fileURLToPath } from "node:url";
-
-import type { AstroIntegrationLogger } from "astro";
-
-export async function pagefind(dir: URL, logger: AstroIntegrationLogger): Promise<void> {
-    const outDir = fileURLToPath(dir);
-    logger.info("Running Pagefind indexer...");
-
-    try {
-        const { createIndex } = await import("pagefind");
-        const { index, errors } = await createIndex();
-
-        if (!index) {
-            logger.error("Pagefind failed to create index");
-            errors?.forEach((e) => logger.error(e));
-            return;
-        }
-
-        const { page_count } = await index.addDirectory({ path: outDir });
-        if (page_count === 0) {
-            logger.warn("Pagefind: no pages indexed");
-            return;
-        }
-
-        const { outputPath } = await index.writeFiles({
-            outputPath: path.join(outDir, "pagefind"),
-        });
-
-        logger.info(`Pagefind indexed ${page_count} pages → ${outputPath}`);
-    } catch (error) {
-        logger.error(`Pagefind indexing failed: ${error}`);
-    }
-}

package/src/styles/components/posts/postCategories.module.css

@@ -1,50 +0,0 @@
-.categoriesContainer {
-    display: flex;
-    flex-direction: column;
-    gap: var(--space-xs);
-}
-
-.title {
-    margin: 0;
-    font-size: var(--font-size-base);
-    font-weight: 600;
-    color: var(--white-90p);
-    padding-bottom: var(--space-sm);
-    border-bottom: var(--border-thin) solid var(--white-20p);
-}
-
-.categoryList {
-    display: flex;
-    flex-direction: column;
-    gap: var(--space-sm);
-}
-
-.category {
-    display: inline-flex;
-    padding: var(--space-sm) var(--space-xs);
-    background: var(--white-05p);
-    color: var(--white-80p);
-    border-left: var(--border-thick) solid var(--accent-60p);
-    text-decoration: none;
-    transition:
-        color var(--transition-medium),
-        transform var(--transition-medium);
-    border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
-    font-size: var(--font-size-small);
-    transform: translateX(0);
-}
-
-.category:hover {
-    transform: translateX(4px);
-}
-
-.category:active {
-    transform: translateX(2px);
-}
-
-.empty {
-    color: var(--white-50p);
-    font-size: var(--font-size-small);
-    text-align: center;
-    padding: var(--space-md) 0;
-}

package/src/styles/components/posts/postLeft.module.css

@@ -1,38 +0,0 @@
-/* 左侧边栏 */
-
-.leftSidebar {
-    position: sticky;
-    top: 20px;
-    width: 100%;
-    height: fit-content;
-    max-height: calc(100vh - 40px);
-    overflow-y: auto;
-    display: flex;
-    flex-direction: column;
-    gap: var(--space-lg);
-    padding: var(--space-lg) 0;
-
-    /* 隐藏滚动条但保留滚动功能 */
-    scrollbar-width: none;
-    -ms-overflow-style: none;
-}
-
-.leftSidebar::-webkit-scrollbar {
-    display: none;
-}
-
-@media (max-width: 1200px) {
-    .leftSidebar {
-        display: none;
-    }
-}
-
-.sidebarContainer {
-    display: flex;
-    flex-direction: column;
-    background: var(--black-10p);
-    border-radius: var(--radius-lg);
-    padding: var(--space-md);
-    box-shadow: var(--shadow-sidebar);
-    transition: all var(--transition-normal) ease;
-}

package/src/styles/components/posts/postRight.module.css

@@ -1,60 +0,0 @@
-/* 右侧边栏 - 文章纲要和元数据 */
-
-.rightSidebar {
-    position: sticky;
-    top: 20px;
-    width: 100%;
-    height: fit-content;
-    max-height: calc(100vh - 40px);
-    overflow-y: auto;
-    display: flex;
-    flex-direction: column;
-    gap: var(--space-lg);
-    padding: var(--space-lg) 0;
-
-    /* 为 scrollIntoView 预留底部空间，确保长目录的激活项不会被裁切 */
-    scroll-padding-bottom: 8rem;
-
-    /* 隐藏滚动条但保留滚动功能 */
-    scrollbar-width: none;
-    -ms-overflow-style: none;
-}
-
-.rightSidebar::-webkit-scrollbar {
-    display: none;
-}
-
-.sidebarContainer {
-    display: flex;
-    flex-direction: column;
-    background: var(--black-10p);
-    border-radius: var(--radius-lg);
-    padding: var(--space-md);
-    box-shadow: var(--shadow-sidebar);
-    transition: all var(--transition-normal) ease;
-}
-
-/* 响应式设计 */
-
-@media (max-width: 1400px) {
-    .rightSidebar {
-        width: 240px;
-    }
-}
-
-@media (max-width: 1200px) {
-    .rightSidebar {
-        display: none;
-    }
-}
-
-@media (max-width: 768px) {
-    .rightSidebar {
-        position: static;
-        width: 100%;
-        max-height: none;
-        top: auto;
-        order: 2;
-        padding: 1rem 0;
-    }
-}

package/src/styles/components/posts/postTags.module.css

@@ -1,51 +0,0 @@
-.tagsContainer {
-    display: flex;
-    flex-direction: column;
-    gap: var(--space-xs);
-}
-
-.title {
-    margin: 0;
-    font-size: var(--font-size-base);
-    font-weight: 600;
-    color: var(--white-90p);
-    padding-bottom: var(--space-sm);
-    border-bottom: var(--border-thin) solid var(--white-20p);
-}
-
-.tagList {
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--space-sm);
-}
-
-.tag {
-    display: inline-block;
-    padding: 0.4rem 0.8rem;
-    background: var(--white-10p);
-    border: none;
-    border-radius: var(--radius-full);
-    font-size: var(--font-size-smaller);
-    text-decoration: none;
-    transition:
-        color var(--transition-medium),
-        transform var(--transition-medium);
-    white-space: nowrap;
-    transform: translateY(0);
-    color: var(--white-85p);
-}
-
-.tag:hover {
-    transform: translateY(-2px);
-}
-
-.tag:active {
-    transform: translateY(-1px);
-}
-
-.empty {
-    color: var(--white-50p);
-    font-size: var(--font-size-small);
-    text-align: center;
-    padding: var(--space-md) 0;
-}