mirror of
https://github.com/ChenQihan666/MyBlog-Next.git
synced 2026-08-14 11:29:33 +08:00
Sat Naing
38 lines
1.0 KiB
Plaintext
38 lines
1.0 KiB
Plaintext
---
|
|
export interface Props {
|
|
name: string;
|
|
size?: "sm" | "lg";
|
|
}
|
|
|
|
const { name, size = "sm" } = Astro.props;
|
|
---
|
|
|
|
<li
|
|
class={`inline-block ${
|
|
size === "sm" ? "my-1 underline-offset-4" : "my-3 mx-1 underline-offset-8"
|
|
}`}
|
|
>
|
|
<a
|
|
href={`/tags/${name}`}
|
|
class={`${size === "sm" ? "pr-1 text-sm" : "pr-2 text-lg"} group`}
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class={`${size === "sm" ? " scale-75" : "scale-110"}`}
|
|
><path
|
|
d="M16.018 3.815 15.232 8h-4.966l.716-3.815-1.964-.37L8.232 8H4v2h3.857l-.751 4H3v2h3.731l-.714 3.805 1.965.369L8.766 16h4.966l-.714 3.805 1.965.369.783-4.174H20v-2h-3.859l.751-4H21V8h-3.733l.716-3.815-1.965-.37zM14.106 14H9.141l.751-4h4.966l-.752 4z"
|
|
></path>
|
|
</svg>
|
|
<span>{name}</span>
|
|
</a>
|
|
</li>
|
|
|
|
<style>
|
|
a {
|
|
@apply underline decoration-dashed hover:text-skin-accent relative hover:-top-0.5 focus-visible:p-1;
|
|
}
|
|
a svg {
|
|
@apply w-6 h-6 text-skin-base scale-95 opacity-80 -mr-5 group-hover:fill-skin-accent;
|
|
}
|
|
</style>
|