K KRDS · 19

Post list

글 목록

A list of numbered post rows under a grey rule. It splits into two columns where there is room.

RuleTwo columns when its spot is wide — it looks at the width of its container, not the screen.

Also known as: PostList
···
usage (Astro)
---
// src/pages/[post].astro
import { PostList } from '../components/registry';
---
<PostList heading="함께 읽으면 좋은 글" headingId="related" posts={related} />
props (TypeScript)
export interface PostListProps {
  posts: PostSummary[];
  heading?: string;
  headingId?: string;
  /** 목록 제목 단계(카드 제목은 그 아래 단계) */
  headingLevel?: 2 | 3;
  showCategory?: boolean;
  /** PostCard 변형 */
  variant?: VariantOf<'PostCard'>;
}

There are no variants. Each row has a 01, 02 number, a bold title, and date with reading time, with no description, separated by grey rules. It uses two columns in wide areas and one at body width.

It is drawn with the post-card variants (list, thumb, number), so its look follows whichever card you choose. It suits places where many posts gather, such as categories and 404.

In this view it shows in the numbered style (number).

Use it when — Variants 1

  1. defaultDefault Nothing to pick — it follows the post card variant.Every site — follows the post card variant
Open as page ↗

Suggest an entry

Tell us about a missing component or variant, or something a pack should fix. We read every suggestion.