From 0eb13678e242277021942ebc782afbbdd405dd54 Mon Sep 17 00:00:00 2001 From: ThisTimeNull Date: Fri, 23 Jan 2026 19:40:31 +0900 Subject: [PATCH 01/24] =?UTF-8?q?[UI]=20=EA=B8=B0=EC=97=AC=EC=9E=90=20?= =?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?=EB=B0=8F=20=ED=99=88=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=97=85?= =?UTF-8?q?=EB=8D=B0=EC=9D=B4=ED=8A=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - contributor-component.ts: GitHub API를 활용한 기여자 프로필 표시 Web Component 구현 - index.ts: 새로운 contributor-component 등록 - home.md: 기여자 섹션에 custom-contributor 컴포넌트 통합 기여자 정보를 동적으로 표시하여 커뮤니티 활동을 시각화합니다. Co-Authored-By: Claude Sonnet 4.5 --- public/docs/home.md | 32 +++- .../components/contributor-component.ts | 150 ++++++++++++++++++ src/scripts/components/index.ts | 1 + 3 files changed, 181 insertions(+), 2 deletions(-) create mode 100644 src/scripts/components/contributor-component.ts diff --git a/public/docs/home.md b/public/docs/home.md index 990062c..c96a2db 100644 --- a/public/docs/home.md +++ b/public/docs/home.md @@ -1,3 +1,31 @@ -# Welcome to Docker Korea! +# Docker 한국어 문서에 오신 것을 환영합니다 -`도커 코리아에 오신 여러분을 환영합니다!` \ No newline at end of file +커뮤니티와 함께 만들어가는 Docker 공식 문서 한국어 번역 프로젝트입니다. + +## 궁금한 점이 있으신가요? + +Docker 사용 중 어려움을 겪고 계신가요? 번역에 대한 의견이 있으신가요? +커뮤니티 디스커션에서 자유롭게 질문하고 소통해보세요. + +[질문하러 가기](https://github.com/docker-ko/docker-ko.github.io/discussions) + +## 기여자들 + +이 프로젝트는 커뮤니티의 기여로 이루어집니다. 기여해주신 모든 분들께 감사드립니다! + +
+ + + + +
+ +**함께 기여해주세요!** 여러분의 참여를 기다립니다. +[기여 가이드 보기](https://github.com/docker-ko/docker-ko.github.io/blob/master/CONTRIBUTING.md) + +## 시작하기 + +Docker의 모든 기능과 활용법을 한국어로 배워보세요. + +- [문서 시작하기](#/get-started) +- [GitHub 저장소](https://github.com/docker-ko/docker-ko.github.io) diff --git a/src/scripts/components/contributor-component.ts b/src/scripts/components/contributor-component.ts new file mode 100644 index 0000000..638a7b7 --- /dev/null +++ b/src/scripts/components/contributor-component.ts @@ -0,0 +1,150 @@ +/** + * ContributorComponent + * 기여자 프로필을 카드 형식으로 표시하는 Web Component + * Pinterest 스타일의 모던한 디자인을 적용 + */ +export default class ContributorComponent extends HTMLElement { + static get observedAttributes() { + return ['username', 'avatar', 'role']; + } + + constructor() { + super(); + } + + attributeChangedCallback() { + this.render(); + } + + connectedCallback() { + this.render(); + } + + render() { + const username = this.getAttribute('username') || 'Anonymous'; + const avatar = + this.getAttribute('avatar') || + 'https://avatars.githubusercontent.com/u/0?v=4'; + const role = this.getAttribute('role') || '기여자'; + const githubUrl = `https://github.com/${username}`; + + this.innerHTML = ` + +
+ +
+ + +
+ +
+ ${username}의 프로필 사진 + + +
+
+ + +
+
+ ${username} +
+ + + ${role} + +
+
+
+ + `; + } +} + +// 웹 컴포넌트 등록 +customElements.define('contributor-component', ContributorComponent); diff --git a/src/scripts/components/index.ts b/src/scripts/components/index.ts index 8ec9ec9..0aa1d72 100644 --- a/src/scripts/components/index.ts +++ b/src/scripts/components/index.ts @@ -3,3 +3,4 @@ import './header-component'; import './card-component'; import './button-component'; import './nav-component'; +import './contributor-component'; From d6ea659b1c9b5f2ed9a885ae7b43cd9a34ebb771 Mon Sep 17 00:00:00 2001 From: ThisTimeNull Date: Fri, 23 Jan 2026 19:41:06 +0900 Subject: [PATCH 02/24] =?UTF-8?q?[UI]=20=ED=97=A4=EB=8D=94=20=EB=A1=9C?= =?UTF-8?q?=EA=B3=A0=20=EB=94=94=EC=9E=90=EC=9D=B8=20=EA=B0=9C=EC=84=A0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 로고 이미지와 텍스트 간격 조정 (gap-2 → gap-1) - 시각적 균형감 향상 및 모던한 레이아웃 적용 사용자 경험 개선을 위한 미세 조정입니다. Co-Authored-By: Claude Sonnet 4.5 --- src/scripts/components/header-component.ts | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/scripts/components/header-component.ts b/src/scripts/components/header-component.ts index b8b66ea..c83c97d 100644 --- a/src/scripts/components/header-component.ts +++ b/src/scripts/components/header-component.ts @@ -28,10 +28,15 @@ class HeaderComponent extends HTMLElement {