mirror of
https://github.com/ChenQihan666/MyBlog-Next.git
synced 2026-08-14 11:29:33 +08:00
Sat Naing
38 lines
880 B
Plaintext
38 lines
880 B
Plaintext
---
|
|
import slugify from "@utils/slugify";
|
|
|
|
export interface Props {
|
|
name: string;
|
|
size?: "sm" | "lg";
|
|
}
|
|
|
|
const { name, size = "sm" } = Astro.props;
|
|
|
|
const slug = slugify(name);
|
|
---
|
|
|
|
<li class={`inline-block ${size === "sm" ? "my-1" : "my-3 mx-1"}`}>
|
|
<a
|
|
href={`/tags/${slug}`}
|
|
class={`${size === "sm" ? "py-1 px-2 text-sm" : "p-2 text-lg"}`}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class={`${size === "sm" ? " scale-75" : "scale-125"}`}
|
|
><path
|
|
d="M20 4H8.515a2 2 0 0 0-1.627.838l-4.701 6.581a.997.997 0 0 0 0 1.162l4.701 6.581A2 2 0 0 0 8.515 20H20c1.103 0 2-.897 2-2V6c0-1.103-.897-2-2-2zm0 14H8.515l-4.286-6 4.286-6H20v12z"
|
|
></path>
|
|
</svg>
|
|
<span>{name}</span>
|
|
</a>
|
|
</li>
|
|
|
|
<style>
|
|
a {
|
|
@apply bg-skin-card hover:bg-skin-card-muted rounded;
|
|
}
|
|
a svg {
|
|
@apply w-6 h-6 text-skin-base scale-75;
|
|
}
|
|
</style>
|