v0.2.11: v1.0.0 변경 롤백
Made-with: Cursor
This commit is contained in:
@@ -239,8 +239,29 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.menu-groups {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-groups__list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.menu-group {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.menu-group--nav {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.menu-group__trigger,
|
||||
.menu-group__link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
padding: 6px 0;
|
||||
border: 0;
|
||||
border-radius: 18px;
|
||||
background: none;
|
||||
@@ -664,6 +685,14 @@ body.left-sidebar-collapsed .sidebar--left .sidebar__inner {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.topbar__brand {
|
||||
padding: 0 16px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.topbar__sidebar-toggle {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -725,6 +754,15 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
|
||||
display: block;
|
||||
}
|
||||
|
||||
.topbar__search {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 0 18px;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.search-trigger,
|
||||
.search-modal__input {
|
||||
display: flex;
|
||||
@@ -767,6 +805,15 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.topbar__actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 0 16px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.topbar__search {
|
||||
min-width: min(var(--topbar-search-min), 100%);
|
||||
@@ -1900,6 +1947,12 @@ body:not(.left-sidebar-collapsed) .topbar__sidebar-toggle:hover .topbar__sidebar
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.topbar__brand {
|
||||
grid-column: 1;
|
||||
grid-row: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.topbar__search {
|
||||
display: none;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1,7 +1,7 @@
|
||||
# 배포 가이드
|
||||
|
||||
## 현재 버전
|
||||
- `v1.0.0`
|
||||
- `v0.2.11`
|
||||
|
||||
## Git 기본 설정
|
||||
- 저장소 작성자 정보는 아래 값으로 통일한다.
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
# 의사결정 이력
|
||||
|
||||
## 2026-04-17 v1.0.0
|
||||
헤더 점검 과정에서 `topbar__inner` 구조 클래스가 빠지면 `screen.css`의 3열 그리드가 적용되지 않아 전체 정렬이 쉽게 붕괴되는 문제가 확인됐다. 이후 검색 폭 보정 목적의 유틸리티 클래스가 구조 클래스와 중복되며 충돌 지점이 늘어났기 때문에, 최종 버전에서는 `topbar__inner`/`topbar__brand`/`topbar__search`/`topbar__actions`를 기준 축으로 고정하고 동일 역할의 Tailwind 유틸 중복을 줄이는 방향을 기본 원칙으로 확정했다.
|
||||
|
||||
## 2026-04-17 v0.2.7
|
||||
Ghost 관리자의 Secondary navigation은 기본 테마 헬퍼만으로는 출력 위치가 없어 활용되지 않았다. Primary와 동일한 `ul.nav` 스타일을 재사용하려면 `Home pages` 블록과 같은 아코디언 래퍼 안에 `{{navigation type="secondary"}}`를 두고, 항목이 없을 때는 빈 UI가 나오지 않도록 `{{#if @site.secondary_navigation}}`으로 감싸는 방식이 가장 단순하다.
|
||||
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
# 파일-화면 매핑 가이드
|
||||
|
||||
## 현재 버전
|
||||
- `v1.0.0`
|
||||
- `v0.2.11`
|
||||
|
||||
## 공통 레이아웃
|
||||
- [default.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/default.hbs): 전체 3열 셸, 1296px 공통 폭 계산, 공통 자산 로드
|
||||
- [partials/site/sidebar-left.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/sidebar-left.hbs): 좌측 탐색(Primary `{{navigation}}`, Secondary `{{navigation type="secondary"}}`·`@site.secondary_navigation` 있을 때만)/Tags/카테고리 아코디언/푸터
|
||||
- [page-tags.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/page-tags.hbs): `slug=tags` 페이지용 태그 디렉터리
|
||||
- [tags-index.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/tags-index.hbs): `/tags/` 커스텀 라우트용 태그 디렉터리
|
||||
- [partials/site/topbar.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/topbar.hbs): 상단 3열 헤더, 중앙 검색(최소 폭·라벨 말줄임), 좌측 사이드바 토글, 구조 클래스 기준 레이아웃
|
||||
- [partials/site/topbar.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/topbar.hbs): 상단 3열 헤더, 중앙 검색(최소 폭·라벨 말줄임), 좌측 사이드바 토글
|
||||
- [partials/site/sidebar-right.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/sidebar-right.hbs): 우측 287px 사이드바, Ghost Recommendations 기반 추천 링크/구독/푸터 구성
|
||||
|
||||
## 홈 및 목록
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
# 기술 명세
|
||||
|
||||
## 현재 버전
|
||||
- `v1.0.0`
|
||||
- `v0.2.11`
|
||||
|
||||
## 테마 개요
|
||||
- Ghost `v5` 대응 커스텀 테마
|
||||
@@ -15,7 +15,6 @@
|
||||
- Ghost `navigation`, `get`, `subscribe_form`, `comments`, `pagination` 헬퍼 사용
|
||||
- `@site.accent_color`가 설정된 경우 `default.hbs`의 body 인라인 변수로 전역 `--accent`/`--accent-strong`를 덮어써 테마 포인트 색상을 동기화함
|
||||
- `topbar` 브랜드는 `@site.logo`를 우선 렌더링하고, 로고 미설정 시 `@site.title` 텍스트를 fallback으로 사용함
|
||||
- `topbar` 헤더는 구조 클래스(`topbar__inner`, `topbar__brand`, `topbar__search`, `topbar__actions`)를 레이아웃 기준으로 사용하고, 동일 역할의 Tailwind 유틸 중복은 줄여 구조 클래스와 유틸 충돌을 방지함
|
||||
- 데스크톱 `topbar__inner`는 `var(--sidebar-left) minmax(0, var(--content-column)) var(--sidebar-right)` 3열 그리드이며, `1024px` 이상에서만 검색 셀(`.topbar__search`)에 `min-width: min(--topbar-search-min, 100%)`를 적용해 중앙 검색 최소 폭을 완만히 보장함. 검색 트리거는 라벨(`.search-trigger__label`) 말줄임·단축키 `flex-shrink: 0` 유지. 브랜드 텍스트는 말줄임, 로고 이미지는 `max-width: 100%`로 축소
|
||||
- `1023px` 이하에서는 `topbar__inner`를 `minmax(0, 1fr) auto` 2열로 바꾸고 검색 열을 숨긴 뒤, 브랜드·액션을 각각 1·2열에 배치함(헤더가 3열 정의만 남는 문제 방지)
|
||||
- `home` Hero는 `@site.cover_image`가 있을 때 배경 이미지로 적용하며 오버레이와 텍스트 대비를 함께 조정함
|
||||
|
||||
@@ -1,13 +1,5 @@
|
||||
# 업데이트 로그
|
||||
|
||||
## v1.0.0 - 2026-04-17
|
||||
- `package.json` 버전을 `1.0.0`으로 증가.
|
||||
- `partials/site/topbar.hbs`: `topbar__inner` 구조 클래스를 복구하고 `topbar__brand`, `topbar__search`, `topbar__actions` 구간의 중복 Tailwind 유틸(`flex`, `h-full`, `items-center`, `justify-end` 등)을 정리해 구조 클래스와 유틸 충돌을 최소화.
|
||||
- `partials/site/sidebar-right.hbs`: 추천 fallback 목록 컨테이너의 `rounded-theme`를 제거해 주변 섹션과 모서리 스타일을 통일.
|
||||
- `partials/site/sidebar-left.hbs`, `assets/built/screen.css`: `menu-groups` 구간에서 `display/gap/border-bottom` 단순 구조 속성을 Tailwind 유틸(`block`, `gap-0`, `border-b-0`)로 이동하고 중복 CSS 선언을 제거.
|
||||
- `docs/spec.md`, `docs/map.md`, `docs/deploy.md`, `docs/history.md` 버전을 `v1.0.0`으로 동기화.
|
||||
- `npm run build:tailwind`로 `assets/built/tailwind.css` 재생성.
|
||||
|
||||
## v0.2.11 - 2026-04-17
|
||||
- `package.json` 버전을 `0.2.11`로 증가.
|
||||
- `assets/built/screen.css`: `topbar__inner` 그리드를 `minmax(0, var(--content-column))` 중앙 열로 복구해 데스크톱 3열 배치를 안정화. `minmax(260px, min(720px, 1fr))`·검색 트리거 강제 `min-width` 제거. 브랜드 `overflow: hidden` 제거 및 로고 `max-width: 100%` 보정. `1023px` 이하에서는 `topbar__inner`를 `minmax(0,1fr) auto` 2열로 두고 검색 숨김 시 액션을 그리드 2열에 배치(절대 위치 제거). `1024px` 이상에서만 `.topbar__search`에 `min-width: min(--topbar-search-min, 100%)` 적용.
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "ghost-theme-thred-clone",
|
||||
"version": "1.0.0",
|
||||
"version": "0.2.11",
|
||||
"private": true,
|
||||
"description": "A Ghost theme inspired by the Thred reference layout.",
|
||||
"keywords": [
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
{{#if recommendations}}
|
||||
<ul class="flex flex-col gap-1 overflow-hidden" data-recommendations="">
|
||||
<ul class="flex flex-col gap-1 rounded-theme overflow-hidden" data-recommendations="">
|
||||
{{#each recommendations as |rec|}}
|
||||
<li>
|
||||
<a class="py-1 text-[0.8rem] leading-tight flex items-center gap-2 hover:opacity-75" href="{{rec.url}}" data-recommendation="{{rec.id}}" target="_blank" rel="noopener">
|
||||
{{#if rec.favicon}}
|
||||
<img class="w-[18px] h-[18px] rounded-[4px] aspect-square object-cover" src="{{rec.favicon}}" alt="" loading="lazy" onerror="this.style.display='none'">
|
||||
<img class="w-[18px] h-[18px] rounded-[8px] aspect-square object-cover" src="{{rec.favicon}}" alt="" loading="lazy" onerror="this.style.display='none'">
|
||||
{{/if}}
|
||||
<h3 class="font-medium line-clamp-1 text-ellipsis overflow-hidden" title="{{rec.title}}">{{rec.title}}</h3>
|
||||
</a>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<aside class="sidebar sidebar--left h-full flex flex-col">
|
||||
<nav class="menu-groups block border-b border-brd pl-4 pr-3 sm:pl-5 xl:pl-0 py-3" data-nav="menu" data-primary-nav x-data="{ homePagesOpen: true, secondaryNavOpen: false, membersOpen: false }">
|
||||
<nav class="menu-groups border-b border-brd pl-4 pr-3 sm:pl-5 xl:pl-0 py-3" data-nav="menu" data-primary-nav x-data="{ homePagesOpen: true, secondaryNavOpen: false, membersOpen: false }">
|
||||
<ul class="menu-groups__list flex flex-col gap-0.75 text-typ text-sm">
|
||||
<li class="menu-group menu-group--nav border-b-0 gap-0 nav-toggle is-mainitem flex items-center flex-wrap w-full relative group" :class="{ 'is-open': homePagesOpen }" data-label="Home pages" data-slug="home-pages" data-length="10" aria-haspopup="true">
|
||||
<li class="menu-group menu-group--nav nav-toggle is-mainitem flex items-center flex-wrap w-full relative group" :class="{ 'is-open': homePagesOpen }" data-label="Home pages" data-slug="home-pages" data-length="10" aria-haspopup="true">
|
||||
<a class="menu-group__link menu-group__link--toggle flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="#" role="button" @click.prevent="homePagesOpen = !homePagesOpen" :aria-expanded="homePagesOpen.toString()" aria-haspopup="true">
|
||||
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
|
||||
<span class="menu-link__label">Home pages</span>
|
||||
@@ -18,7 +18,7 @@
|
||||
</li>
|
||||
|
||||
{{#if @site.secondary_navigation}}
|
||||
<li class="menu-group menu-group--nav border-b-0 gap-0 nav-toggle is-mainitem flex items-center flex-wrap w-full relative group menu-group--secondary-nav" :class="{ 'is-open': secondaryNavOpen }" data-label="More links" data-slug="secondary-nav" aria-haspopup="true">
|
||||
<li class="menu-group menu-group--nav nav-toggle is-mainitem flex items-center flex-wrap w-full relative group menu-group--secondary-nav" :class="{ 'is-open': secondaryNavOpen }" data-label="More links" data-slug="secondary-nav" aria-haspopup="true">
|
||||
<a class="menu-group__link menu-group__link--toggle flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="#" role="button" @click.prevent="secondaryNavOpen = !secondaryNavOpen" :aria-expanded="secondaryNavOpen.toString()" aria-haspopup="true">
|
||||
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
|
||||
<span class="menu-link__label">More links</span>
|
||||
@@ -35,7 +35,7 @@
|
||||
</li>
|
||||
{{/if}}
|
||||
|
||||
<li class="menu-group menu-group--nav menu-group--link border-b-0 gap-0 flex items-center flex-wrap w-full relative group" data-label="Tags" data-slug="tags" data-length="4">
|
||||
<li class="menu-group menu-group--nav menu-group--link flex items-center flex-wrap w-full relative group" data-label="Tags" data-slug="tags" data-length="4">
|
||||
<a class="menu-group__link flex gap-2 items-center flex-1 py-1.5 rounded-theme transition-[padding]" href="/tags/">
|
||||
<span class="menu-link__marker w-1 h-4 rounded-sm rounded-l-none transition-all"></span>
|
||||
<span class="menu-link__label">Tags</span>
|
||||
|
||||
@@ -88,7 +88,7 @@
|
||||
{{#match @site.recommendations_enabled}}
|
||||
{{recommendations limit="4"}}
|
||||
{{else}}
|
||||
<ul class="flex flex-col gap-1 overflow-hidden">
|
||||
<ul class="flex flex-col gap-1 rounded-theme overflow-hidden">
|
||||
<li>
|
||||
<a href="{{@site.url}}" class="py-1 text-[0.8rem] leading-tight flex items-center gap-2 hover:opacity-75">
|
||||
<h3 class="font-medium line-clamp-1 text-ellipsis overflow-hidden">{{@site.title}}</h3>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<header class="topbar border-b border-brd bg-bgr/95 supports-[backdrop-filter]:bg-bgr/80">
|
||||
<div class="topbar__inner">
|
||||
<div class="topbar__inner mx-auto">
|
||||
<div class="topbar__brand flex h-full items-center gap-3 px-4 lg:px-0">
|
||||
<button class="topbar__sidebar-toggle group" type="button" data-left-sidebar-toggle aria-expanded="true" aria-label="Toggle left sidebar">
|
||||
<button class="topbar__sidebar-toggle inline-flex items-center justify-center rounded-theme group" type="button" data-left-sidebar-toggle aria-expanded="true" aria-label="Toggle left sidebar">
|
||||
<span class="topbar__sidebar-toggle-icon topbar__sidebar-toggle-icon--open">
|
||||
<i class="icon icon-layout-sidebar size-6 stroke-2" role="presentation">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-layout-sidebar"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z"></path><path d="M9 4l0 16"></path></svg>
|
||||
|
||||
Reference in New Issue
Block a user