v0.1.24 메인 피드 스타일 정리

This commit is contained in:
2026-04-14 10:59:43 +09:00
parent 615dd8968d
commit 21897b8fd3
11 changed files with 170 additions and 72 deletions

View File

@@ -1,11 +1,15 @@
<section class="hero">
<h1 class="hero__title">Ideas <em>published</em> for meaningful conversation, discussed and shaped by the community</h1>
{{#if @site.description}}
<p class="hero__description">{{@site.description}}</p>
{{/if}}
{{subscribe_form
placeholder="Your email"
button_class="button button--light"
form_class="subscribe-form subscribe-form--hero"
}}
<section class="hero home-hero" data-home-hero>
<div class="home-hero__inner">
<div class="home-hero__content">
<h1 class="hero__title">Ideas <em>published</em> for meaningful conversation, <em>discussed</em> and shaped by the community</h1>
{{#if @site.description}}
<p class="hero__description">{{@site.description}}</p>
{{/if}}
{{subscribe_form
placeholder="Your email"
button_class="button button--light button--subscribe"
form_class="subscribe-form subscribe-form--hero"
}}
</div>
</div>
</section>

View File

@@ -1,12 +1,12 @@
<section class="stack-section" data-tabs>
<div class="tab-row-wrap">
<div class="tab-row" role="tablist" aria-label="Homepage sections">
<section class="stack-section home-feed" data-tabs data-home-content>
<div class="tab-row-wrap home-feed__toolbar">
<div class="tab-row home-feed__tabs" role="tablist" aria-label="Homepage sections">
<button class="tab-row__button is-active" type="button" data-tab-trigger="latest">Latest</button>
<button class="tab-row__button" type="button" data-tab-trigger="featured">Featured</button>
<button class="tab-row__button" type="button" data-tab-trigger="updated">Updated</button>
<button class="tab-row__button" type="button" data-tab-trigger="categories">Categories</button>
</div>
<button class="view-toggle" type="button" aria-label="Change view">
<button class="view-toggle home-feed__view-toggle" type="button" aria-label="Change view">
<span class="view-toggle__grid"></span>
<span class="view-toggle__chevron">⌄</span>
</button>
@@ -30,22 +30,22 @@
<div class="tab-panel" data-tab-panel="categories">
<div class="category-overview">
{{#get "tags" limit="4" include="count.posts"}}
{{#get "tags" limit="8" include="count.posts" order="count.posts desc"}}
{{#foreach tags}}
<section class="category-overview__row">
<div>
<section class="category-overview__row"{{#if accent_color}} style="--tag-accent: {{accent_color}};"{{/if}}>
<div class="category-overview__intro">
<h2>{{name}}</h2>
{{#if description}}
<p>{{description}}</p>
{{else}}
<p>{{plural count.posts empty="No posts yet" singular="% post in this category" plural="% posts in this category"}}</p>
{{/if}}
<a href="{{url}}">View all ↗</a>
<a class="category-overview__link" href="{{url}}">View all ↗</a>
</div>
<ol>
<ol class="category-overview__posts">
{{#get "posts" filter=(concat "tag:" slug) limit="5"}}
{{#foreach posts}}
<li><a href="{{url}}">{{title}}</a></li>
<li><a href="{{url}}" data-number="{{@number}}. ">{{title}}</a></li>
{{/foreach}}
{{/get}}
</ol>