v0.1.40 홈 피드 및 문서 버전 정리
Made-with: Cursor
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
# 배포 가이드
|
||||
|
||||
## 현재 버전
|
||||
- `v0.1.31`
|
||||
- `v0.1.40`
|
||||
|
||||
## Git 기본 설정
|
||||
- 저장소 작성자 정보는 아래 값으로 통일한다.
|
||||
@@ -65,6 +65,13 @@ npm run build:tailwind
|
||||
- Alpine 결과물은 `assets/built/alpine.js`에 생성된다.
|
||||
- Tailwind 결과물은 `assets/built/tailwind.css`에 생성되고, Ghost 테마에서 `screen.css` 다음에 로드된다.
|
||||
|
||||
## 업로드용 zip 생성
|
||||
```bash
|
||||
npm run zip:version
|
||||
```
|
||||
|
||||
- 현재 `package.json` 버전을 기준으로 `thred-inspired-theme-v0.x.x.zip` 파일을 생성한다.
|
||||
|
||||
## `/tags/`, `/authors/` 연결 방법
|
||||
- 가장 쉬운 방법은 Ghost Admin에서 페이지를 만들고 슬러그를 각각 `tags`, `authors`로 지정한 뒤 템플릿을 연결하는 방식이다.
|
||||
- 페이지 방식 대신 커스텀 라우트를 쓰려면 [routes.yaml.example](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/routes.yaml.example)를 기준으로 Ghost의 `routes.yaml`에 `/tags/`, `/authors/`를 연결한다.
|
||||
|
||||
@@ -1,5 +1,29 @@
|
||||
# 의사결정 이력
|
||||
|
||||
## 2026-04-16 v0.1.40
|
||||
최근 수정이 누적되면서 `update/spec/map/deploy/history` 문서의 버전 표기가 서로 어긋났고, 커밋 메시지도 기존 저장소 패턴과 달라져 추적성이 떨어졌다. 그래서 이번에는 기능 자체를 더 넓게 바꾸기보다, 이미 진행한 홈 히어로/탭 피드/태그 카드 보정 작업을 기준으로 문서 버전 체계를 `v0.1.40`으로 맞추고 기록 형식을 기존 흐름에 맞춰 정리했다. 이렇게 해야 다음 작업자가 문서와 커밋 히스토리만 보고도 현재 상태를 빠르게 파악할 수 있다.
|
||||
|
||||
## 2026-04-14 v0.1.38
|
||||
업로드용 zip을 매번 수동 명령으로 만들면 작업 마무리 단계에서 반복 비용이 계속 생긴다. 그래서 현재 `package.json` 버전을 그대로 파일명에 반영하는 `npm run zip:version` 스크립트를 추가해, 사용자가 별도 옵션 없이도 바로 업로드용 압축 파일을 만들 수 있게 정리했다. 이 방식이면 버전 표기와 파일명이 자연스럽게 맞춰지고, 이후 반복 작업도 훨씬 단순해진다.
|
||||
|
||||
## 2026-04-14 v0.1.37
|
||||
참고 사이트의 목록 UX는 페이지 이동보다 하단 버튼으로 다음 목록을 이어 붙이는 방식이었고, 현재 Ghost 기본 `{{pagination}}` 링크 UI는 그 경험과 다르게 느껴졌다. 그래서 서버 쪽 데이터 구조를 바꾸지 않고, Ghost가 렌더링한 다음 페이지 HTML을 그대로 가져와 목록 부분만 파싱해 append 하는 방식을 선택했다. 이 방식은 기존 템플릿 구조를 크게 해치지 않으면서도, 다음 페이지가 없으면 버튼이 자동으로 사라지는 동작까지 비교적 안전하게 구현할 수 있다.
|
||||
|
||||
## 2026-04-14 v0.1.36
|
||||
`tag.hbs`는 개별 태그 아카이브용인데, 사용자가 기대한 화면은 `/tags/` 태그 목록 인덱스였다. 확인 결과 테마 안의 링크와 템플릿은 이미 준비돼 있었지만, 로컬 Ghost가 실제로 읽는 `.docker/ghost/content/settings/routes.yaml`에는 `/tags/`, `/authors/` 라우트가 빠져 있었다. 그래서 테마 템플릿을 더 손대기보다, 로컬 Ghost 설정 라우트를 예시 파일과 맞추는 쪽이 문제 원인과 해결책이 가장 명확하다고 판단했다.
|
||||
|
||||
## 2026-04-14 v0.1.35
|
||||
Ghost의 `tag.hbs`는 이미 태그 컨텍스트와 페이지네이션 컨텍스트를 함께 제공하는데, 여기에 다시 `{{#tag}}` 블록을 감싸면 내부 partial에서 `{{pagination}}`이 현재 페이징 스코프를 잃을 수 있다. 그래서 태그 템플릿은 블록 헬퍼 없이 현재 컨텍스트를 바로 쓰도록 정리했다. 작성자 템플릿의 아바타는 데이터가 없어서가 아니라 크기 유틸리티가 빠져 실질적으로 보이지 않던 상태였기 때문에, 이미지와 fallback 모두 명시적인 크기를 부여해 화면에 안정적으로 표시되도록 수정했다.
|
||||
|
||||
## 2026-04-14 v0.1.34
|
||||
우측 사이드바는 레이아웃 복구 과정에서 CSS 구조 중심 마크업으로 너무 많이 되돌아가면서, 사용자가 앞서 적용해둔 Tailwind 기반 정리 흐름이 사실상 사라졌다. 그래서 이번에는 우측 사이드바도 좌측/헤더와 같은 기준으로, `sidebar--right`와 기존 블록 클래스는 유지하되 실제 배치와 간격은 Tailwind 유틸리티로 다시 표현하는 방식으로 재정리했다. 이렇게 하면 기존 폭 계산과 스타일 훅은 보존하면서도, 사용자가 직접 이어서 수정하기 쉬운 구조를 다시 확보할 수 있다.
|
||||
|
||||
## 2026-04-14 v0.1.33
|
||||
좌측 사이드바 닫힘 애니메이션이 사라진 직접적인 원인은 데스크톱 접힘 상태에서 `.sidebar--left`를 `display: none`으로 처리한 데 있었다. 이 방식은 레이아웃 정리는 쉽지만 전환 프레임이 모두 사라지기 때문에, 이번에는 그리드 첫 열을 `0`으로 줄이면서 사이드바와 내부 콘텐츠에 `opacity`와 `transform` 전환을 주는 방식으로 바꿨다. 이렇게 하면 기존 셸 폭 계산은 유지하면서도 사용자가 기대하는 열리고 닫히는 움직임을 다시 복원할 수 있다.
|
||||
|
||||
## 2026-04-14 v0.1.32
|
||||
최근 레이아웃 붕괴는 Tailwind 마크업을 유지하려는 수정과, 기존 `screen.css` 및 `theme.js`가 기대하는 구조 클래스가 어긋난 것이 함께 겹치면서 발생했다. 그래서 이번에는 원래 셸 구조를 단순 복원하는 대신, `site-shell`, `topbar__inner`, `sidebar--left`, `sidebar--right`처럼 폭 계산과 토글 동작에 직접 연결된 훅은 유지하고 그 위에만 Tailwind 유틸리티를 다시 얹는 하이브리드 방식으로 정리했다. 이렇게 하면 사용자가 선호하는 Tailwind 중심 수정 흐름을 유지하면서도, 1296px 헤더 정렬과 287px 사이드바 계산 같은 핵심 레이아웃 기준을 다시 안정적으로 보존할 수 있다.
|
||||
|
||||
## 2026-04-14 v0.1.31
|
||||
zip 업로드 없이 로컬 Ghost에서 바로 확인하려면 자동 sync가 필요했지만, `fs.watch` 기반 재귀 watcher는 현재 환경에서 `EMFILE` 오류로 안정적으로 유지되지 않았다. 그래서 별도 의존성을 추가하지 않고, 제외 디렉터리를 뺀 파일 목록의 수정 시간을 주기적으로 비교하는 polling 방식으로 `dev:watch`를 구현했다. 이 방식은 다소 단순하지만 현재 저장소 크기에서는 충분히 가볍고, 사용자가 템플릿을 저장한 뒤 바로 브라우저 새로고침으로 확인할 수 있다는 점이 더 중요하다고 판단했다.
|
||||
|
||||
|
||||
11
docs/map.md
11
docs/map.md
@@ -1,17 +1,17 @@
|
||||
# 파일-화면 매핑 가이드
|
||||
|
||||
## 현재 버전
|
||||
- `v0.1.31`
|
||||
- `v0.1.40`
|
||||
|
||||
## 공통 레이아웃
|
||||
- [default.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/default.hbs): 전체 3열 셸과 공통 자산 로드
|
||||
- [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): 좌측 탐색/직접 링크형 Tags·Authors 메뉴/카테고리 아코디언/푸터
|
||||
- [page-tags.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/page-tags.hbs): `slug=tags` 페이지용 태그 디렉터리
|
||||
- [page-authors.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/page-authors.hbs): `slug=authors` 페이지용 작성자 디렉터리
|
||||
- [tags-index.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/tags-index.hbs): `/tags/` 커스텀 라우트용 태그 디렉터리
|
||||
- [authors-index.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/authors-index.hbs): `/authors/` 커스텀 라우트용 작성자 디렉터리
|
||||
- [partials/site/topbar.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/topbar.hbs): 상단 검색/CTA/다크모드
|
||||
- [partials/site/sidebar-right.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/site/sidebar-right.hbs): 구독/추천/작성자/푸터
|
||||
- [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 사이드바, Tailwind 기반 작성자/구독/추천/푸터 구성
|
||||
|
||||
## 홈 및 목록
|
||||
- [home.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/home.hbs): 메인 홈
|
||||
@@ -19,6 +19,7 @@
|
||||
- [partials/home/hero.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/home/hero.hbs): 홈 히어로 영역
|
||||
- [partials/home/tabbed-feed.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/home/tabbed-feed.hbs): Latest/Featured/Updated/Categories 탭과 카테고리 개요 행
|
||||
- [partials/lists/post-items.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/lists/post-items.hbs): Tailwind 기반 리스트형 포스트 카드, 댓글 아이콘, 우측 공유 액션, 메타 정보, 태그 accent 배지
|
||||
- [partials/lists/post-feed.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/lists/post-feed.hbs): 목록 래퍼와 `Load More` 확장형 페이지네이션 연결
|
||||
|
||||
## 상세 및 아카이브
|
||||
- [post.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/post.hbs): 포스트 상세
|
||||
@@ -32,8 +33,10 @@
|
||||
- [assets/built/tailwind.css](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/assets/built/tailwind.css): Tailwind 빌드 결과물
|
||||
- [assets/built/alpine.js](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/assets/built/alpine.js): Alpine.js 로컬 배포 파일
|
||||
- [assets/built/theme.js](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/assets/built/theme.js): 인터랙션 스크립트
|
||||
- [partials/pagination.hbs](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/partials/pagination.hbs): 다음 페이지가 있을 때만 표시되는 `Load More` 버튼
|
||||
- [assets/styles/tailwind.css](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/assets/styles/tailwind.css): Tailwind 입력 파일, `prose` 타이포그래피 규칙, accent/구분선 보조 유틸리티
|
||||
- [tailwind.config.js](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/tailwind.config.js): Tailwind 스캔 경로, 테마 설정, preflight 초기화 설정
|
||||
- [scripts/dev-watch.js](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/scripts/dev-watch.js): 로컬 파일 변경 감지 후 `dev:sync`와 Tailwind watch를 함께 실행하는 개발용 watcher
|
||||
- [routes.yaml.example](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/routes.yaml.example): Ghost 커스텀 라우트 예시
|
||||
- [package.json](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/package.json): Ghost 테마 메타데이터
|
||||
- [package.json](/Users/bicute/Desktop/UGREEN/GHOST%20THEME/package.json): Ghost 테마 메타데이터, `zip:version` 압축 스크립트
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
# 기술 명세
|
||||
|
||||
## 현재 버전
|
||||
- `v0.1.31`
|
||||
- `v0.1.40`
|
||||
|
||||
## 테마 개요
|
||||
- Ghost `v5` 대응 커스텀 테마
|
||||
@@ -17,13 +17,15 @@
|
||||
- Tailwind 기본 초기화(`preflight`)를 활성화해 브라우저 기본 마진과 폼 스타일을 리셋
|
||||
- Alpine.js 로컬 자산(`assets/built/alpine.js`)을 전역 로드
|
||||
- `npm run dev:watch`는 초기 `dev:prepare` 실행 후 Tailwind `--watch`와 파일 변경 감지 기반 `dev:sync`를 함께 실행함
|
||||
- `npm run zip:version`은 현재 `package.json` 버전명을 기준으로 업로드용 zip을 생성함
|
||||
- 좌측 카테고리 영역은 Alpine.js로 제어되며 `1024px` 이상에서 기본 열림, 미만에서 기본 닫힘
|
||||
- 좌측 네비게이션 마커와 카테고리 마커는 동일한 세로 바 → 원형 hover 패턴 사용
|
||||
- 전역 `ol`, `ul`, `menu` 기본 패딩과 리스트 스타일 리셋 적용
|
||||
- `author.hbs`는 페이지 컨텍스트의 작성자 데이터를 직접 사용
|
||||
- `page-tags.hbs`, `page-authors.hbs`는 각각 `slug=tags`, `slug=authors` 페이지에 연결 가능
|
||||
- 태그/작성자 디렉터리 목록은 현재 `limit="100"` 기준
|
||||
- `tags-index.hbs`, `authors-index.hbs`는 `routes.yaml` 커스텀 라우트로 `/tags/`, `/authors/`에 연결 가능
|
||||
- `tags-index.hbs`, `authors-index.hbs`는 Ghost `routes.yaml` 커스텀 라우트로 `/tags/`, `/authors/`에 연결됨
|
||||
- 로컬 개발 환경의 실제 라우트 설정은 `.docker/ghost/content/settings/routes.yaml`을 기준으로 사용함
|
||||
- 홈 메인 피드는 히어로, 탭형 목록, 카테고리 개요를 원본 비주얼 밀도에 가깝게 재구성
|
||||
- 리스트형 `post-card`는 Tailwind 유틸리티 중심 마크업으로 구성되며, 썸네일은 `aspect-square sm:aspect-video` 비율을 사용
|
||||
- 각 카드 항목은 `border-b border-brd` 구분선을 유지하고, 콘텐츠 래퍼는 `min-w-0` 기준으로 줄바꿈 폭을 제어
|
||||
@@ -31,6 +33,7 @@
|
||||
- 포스트 본문은 `prose prose-theme` 클래스를 사용하며, Typography 플러그인 대신 Tailwind 입력 파일에서 원본 기준 타이포그래피 규칙을 직접 제공함
|
||||
- 본문 `ul`, `ol`은 전역 리스트 리셋과 별개로 `prose` 범위 안에서 실제 마커와 들여쓰기를 다시 적용함
|
||||
- 태그 배지는 `--color-accent` 기반 배경 혼합색(`bg-accent/10`, `hover:bg-accent/5`)을 사용함
|
||||
- 홈 Latest, 기본 index, 태그 아카이브, 작성자 아카이브의 목록 영역은 `Load More` 버튼 기반 확장형 페이지네이션을 사용함
|
||||
|
||||
## 주요 스타일 방향
|
||||
- 밝은 크림톤 배경 + 오렌지 포인트
|
||||
|
||||
@@ -1,8 +1,18 @@
|
||||
# 업데이트 로그
|
||||
|
||||
## v0.1.40 - 2026-04-16
|
||||
- 문서 버전 표기를 `v0.1.40`으로 정합성 수정.
|
||||
- `docs/history.md` 의사결정 이력 최신 버전 항목 추가.
|
||||
- 홈 히어로/탭 피드/태그 카드 원본 기준 보정 작업 반영 및 형식 정리.
|
||||
|
||||
## v0.1.39 - 2026-04-16
|
||||
- `tags-index.hbs` 태그 카드 목록 마크업을 원본(Thred) 구조 기준으로 변환 수정.
|
||||
- `tags-index.hbs` 태그 카드 좌측 보더/호버 배경이 각 태그 `accent_color`를 항상 사용하도록 수정.
|
||||
- `tags-index.hbs` 태그 카드 호버 시 보더 색 변경을 제거하고 내부 배경만 `accent_color` 25%로 보이도록 수정.
|
||||
- `tags-index.hbs` 태그 카드 좌측 보더 색을 인라인 `border-left-color`로 고정해 클래스 우선순위 영향 없이 항상 액센트 색이 표시되도록 수정.
|
||||
- `tags-index.hbs`에서 `accent_color` 미지정 태그는 컬러 fallback을 제거해 좌측 포인트 컬러가 표시되지 않도록 수정.
|
||||
- `partials/home/hero.hbs` 기존 히어로 섹션을 제거하고 원본 구조 기반 수동 구독 폼으로 교체, 미지원 클래스/Alpine 이벤트를 Ghost 동작 기준으로 정리.
|
||||
- `partials/home/tabbed-feed.hbs` 탭/모바일 피드 선택 UI를 원본 구조 기준 Alpine 마크업으로 재구성하고, 피드/카테고리 데이터 바인딩은 기존 Ghost 헬퍼 흐름으로 유지.
|
||||
|
||||
## v0.1.38 - 2026-04-14
|
||||
- `npm run zip:version` 압축 스크립트 추가.
|
||||
|
||||
Reference in New Issue
Block a user