v0.1.11 아코디언 아이콘 및 상세 메타 수정

This commit is contained in:
2026-04-13 17:26:18 +09:00
parent 0e3a723eef
commit 38a98bb07a
6 changed files with 75 additions and 12 deletions

View File

@@ -284,15 +284,36 @@ input {
.menu-group__chevron {
color: var(--text-dim);
font-size: 14px;
transition: transform 0.22s ease, color 0.22s ease;
display: inline-flex;
align-items: center;
justify-content: center;
width: 16px;
height: 16px;
transition: color 0.22s ease;
}
.menu-group__chevron-icon {
width: 16px;
height: 16px;
display: block;
}
.menu-group__chevron-icon--up {
display: none;
}
.menu-group.is-open .menu-group__chevron {
transform: rotate(180deg);
color: var(--text-soft);
}
.menu-group.is-open .menu-group__chevron-icon--down {
display: none;
}
.menu-group.is-open .menu-group__chevron-icon--up {
display: block;
}
.sidebar-card {
padding: 18px 0 0;
border-top: 1px solid var(--border);
@@ -808,6 +829,10 @@ input {
font-weight: 700;
}
.meta-pill:hover {
color: var(--text);
}
.meta-item {
display: inline-flex;
align-items: center;
@@ -1006,6 +1031,8 @@ input {
}
.post-tag {
display: inline-flex;
align-items: center;
color: var(--accent);
font-weight: 700;
}
@@ -1308,6 +1335,10 @@ input {
gap: 8px;
}
.topbar__actions .button--accent {
padding-inline: 12px;
}
.icon-button--search-mobile {
display: inline-flex;
}
@@ -1376,6 +1407,14 @@ input {
height: 34px;
}
.search-shortcut {
display: none;
}
.search-trigger {
width: min(100%, 100%);
}
.post-card {
grid-template-columns: 1fr;
}
@@ -1415,4 +1454,8 @@ input {
gap: 6px;
font-size: 12px;
}
.meta-divider {
font-size: 11px;
}
}

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="ffffff"><path d="M480-344 240-584l56-56 184 184 184-184 56 56-240 240Z"/></svg>

After

Width:  |  Height:  |  Size: 177 B

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="ffffff"><path d="M480-528 296-344l-56-56 240-240 240 240-56 56-184-184Z"/></svg>

After

Width:  |  Height:  |  Size: 178 B

View File

@@ -1,6 +1,6 @@
{
"name": "ghost-theme-thred-clone",
"version": "0.1.10",
"version": "0.1.11",
"private": true,
"description": "A Ghost theme inspired by the Thred reference layout.",
"keywords": [

View File

@@ -7,7 +7,10 @@
<span class="menu-link__marker"></span>
<span class="menu-link__label">Home pages</span>
</span>
<span class="menu-group__chevron">⌄</span>
<span class="menu-group__chevron" aria-hidden="true">
<img class="menu-group__chevron-icon menu-group__chevron-icon--down" src="{{asset "icons/keyboard_arrow_down.svg"}}" alt="">
<img class="menu-group__chevron-icon menu-group__chevron-icon--up" src="{{asset "icons/keyboard_arrow_up.svg"}}" alt="">
</span>
</button>
<div class="menu-group__content" data-accordion-content>
{{navigation}}
@@ -20,7 +23,10 @@
<span class="menu-link__marker"></span>
<span class="menu-link__label">Tags</span>
</span>
<span class="menu-group__chevron">⌄</span>
<span class="menu-group__chevron" aria-hidden="true">
<img class="menu-group__chevron-icon menu-group__chevron-icon--down" src="{{asset "icons/keyboard_arrow_down.svg"}}" alt="">
<img class="menu-group__chevron-icon menu-group__chevron-icon--up" src="{{asset "icons/keyboard_arrow_up.svg"}}" alt="">
</span>
</button>
<div class="menu-group__content" data-accordion-content>
<ul class="link-list">
@@ -39,7 +45,10 @@
<span class="menu-link__marker"></span>
<span class="menu-link__label">Authors</span>
</span>
<span class="menu-group__chevron">⌄</span>
<span class="menu-group__chevron" aria-hidden="true">
<img class="menu-group__chevron-icon menu-group__chevron-icon--down" src="{{asset "icons/keyboard_arrow_down.svg"}}" alt="">
<img class="menu-group__chevron-icon menu-group__chevron-icon--up" src="{{asset "icons/keyboard_arrow_up.svg"}}" alt="">
</span>
</button>
<div class="menu-group__content" data-accordion-content>
<ul class="link-list">
@@ -58,7 +67,10 @@
<span class="menu-link__marker"></span>
<span class="menu-link__label">Members</span>
</span>
<span class="menu-group__chevron">⌄</span>
<span class="menu-group__chevron" aria-hidden="true">
<img class="menu-group__chevron-icon menu-group__chevron-icon--down" src="{{asset "icons/keyboard_arrow_down.svg"}}" alt="">
<img class="menu-group__chevron-icon menu-group__chevron-icon--up" src="{{asset "icons/keyboard_arrow_up.svg"}}" alt="">
</span>
</button>
<div class="menu-group__content" data-accordion-content>
<ul class="link-list">

View File

@@ -6,15 +6,21 @@
<header class="post-header">
<div class="post-header__inner">
{{#if primary_tag}}
<a class="post-tag" href="{{primary_tag.url}}">{{primary_tag.name}}</a>
<a class="post-tag" href="{{primary_tag.url}}"{{#if primary_tag.accent_color}} style="--tag-accent: {{primary_tag.accent_color}};"{{/if}}>{{primary_tag.name}}</a>
{{/if}}
<h1 class="post-title">{{title}}</h1>
<div class="post-meta">
<time datetime="{{date format="YYYY-MM-DD"}}">{{date format="MMM D, YYYY"}}</time>
<time class="meta-item" datetime="{{date format="YYYY-MM-DD"}}">{{date format="MMM D, YYYY"}}</time>
{{#primary_author}}
<span>{{name}}</span>
<span class="meta-divider">/</span>
<span class="meta-item">{{name}}</span>
{{/primary_author}}
<span>{{reading_time}}</span>
{{#if primary_tag}}
<span class="meta-divider">/</span>
<a class="meta-pill" href="{{primary_tag.url}}"{{#if primary_tag.accent_color}} style="--tag-accent: {{primary_tag.accent_color}};"{{/if}}>{{primary_tag.name}}</a>
{{/if}}
<span class="meta-divider">/</span>
<span class="meta-item">{{reading_time}}</span>
</div>
</div>
{{#if feature_image}}