v0.1.30 본문 타이포그래피와 태그 배지 보정

This commit is contained in:
2026-04-14 12:43:35 +09:00
parent 4c460e62fc
commit 8c591b3b93
12 changed files with 285 additions and 34 deletions

View File

@@ -1,21 +1,18 @@
{{!< default}}
{{#post}}
<main class="content-area content-area--post">
<article class="post-article {{post_class}}">
<section class="px-4 sm:px-5 mt-6 mb-8">
<main class="flex-2 max-w-content">
<section class="px-4 sm:px-[max(2vmin,20px)] mt-6 mb-8">
<div class="max-w-content mx-auto flex flex-col gap-2.5">
<h1 class="font-semibold text-xl sm:text-2xl leading-[1.125]">{{title}}</h1>
<div class="relative border-b border-brd pb-4">
<div class="flex flex-wrap gap-2 sm:gap-1.5 items-center text-xs text-typ-tone" data-post-card-info>
<div class="flex flex-wrap gap-2 sm:gap-1.5 items-center text-xs text-typ-tone *:after:content-['/'] *:after:ml-2 sm:*:after:ml-1.5 *:after:text-brd *:last:after:hidden!" data-post-card-info>
<time data-post-card-date datetime="{{date format="YYYY-MM-DD"}}">{{date format="MMM D, YYYY"}}</time>
{{#primary_author}}
<span class="opacity-70">/</span>
<a data-post-card-author href="{{url}}" class="hover:opacity-75">{{name}}</a>
{{/primary_author}}
{{#if primary_tag}}
<span class="opacity-70">/</span>
<ul class="flex flex-wrap items-center font-medium" data-post-card-tags>
<li{{#if primary_tag.accent_color}} style="--color-accent: {{primary_tag.accent_color}};"{{/if}}>
<a href="{{primary_tag.url}}" class="bg-accent/10 px-1.5 py-px rounded-sm text-typ hover:bg-accent/5 hover:text-accent">{{primary_tag.name}}</a>
@@ -23,7 +20,6 @@
</ul>
{{/if}}
{{#if comments}}
<span class="opacity-70">/</span>
<a data-post-card-comments class="flex gap-0.5 items-center hover:opacity-75" href="#comments">
<img class="size-3.5 -mt-px pointer-events-none" src="{{asset "icons/chat_bubble.svg"}}" alt="">
<span class="pointer-events-none">{{comment_count empty="0" singular="" plural="" autowrap="false"}}</span>
@@ -48,9 +44,10 @@
</figure>
{{/if}}
</div>
</section>
</section>
<article class="post-article {{post_class}}">
<div class="post-body">
<div class="post-body px-4 sm:px-[max(2vmin,20px)]">
<section class="post-content kg-content ghost-content prose prose-theme">
{{content}}
</section>