Skip to content

feat: update .gitignore and add ecosystem section to index.html #21

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
cable8mm merged 1 commit into from
Oct 10, 2026
Merged

feat: update .gitignore and add ecosystem section to index.html #21

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,5 @@ dist/
build/
.env
.env.*
.playwright-mcp/
.playwright-mcp/
.vscode/
93 changes: 93 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -445,6 +445,99 @@ <h2 class="mt-5 text-xl font-bold tracking-tight text-slate-950">
</article>
</section>

<!-- 생태계 & 패키지 (Ecosystem & Integrations) -->
<section aria-label="생태계 및 연동 라이브러리" class="mt-12">
<div class="-mx-5 sm:mx-0 rounded-none sm:rounded-2xl border-y-2 border-x-0 sm:border-2 border-slate-900 bg-white p-5 sm:p-7 shadow-none sm:sticker-shadow">
<div class="flex flex-wrap items-center justify-between gap-2 border-b border-slate-100 pb-4">
<div>
<div class="inline-block rounded-md border border-slate-900 bg-violet-200 px-2 py-0.5 text-[10px] font-extrabold uppercase tracking-wide text-slate-900">
Ecosystem 📦
</div>
<h2 class="mt-2 text-xl font-bold tracking-tight text-slate-950">
연동 패키지 &amp; 생태계
</h2>
</div>
<span class="font-mono text-xs text-slate-500">Packages &amp; Real-world Usage</span>
</div>

<div class="mt-5 grid gap-4 sm:grid-cols-2">
<!-- Laravel ImageForge 카드 -->
<div class="flex flex-col justify-between rounded-xl border-2 border-slate-900 bg-slate-50/60 p-4 transition-all hover:bg-white hover:-translate-y-0.5">
<div>
<div class="flex items-center justify-between gap-2">
<span class="inline-flex items-center gap-1.5 rounded-md border border-slate-900 bg-rose-100 px-2 py-0.5 text-[11px] font-mono font-bold text-rose-900">
<span class="h-1.5 w-1.5 rounded-full bg-rose-500"></span>
Laravel
</span>
<a
href="https://github.com/replworks/laravel-imageforge"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center gap-1 text-[11px] font-mono font-bold text-slate-600 hover:text-slate-950 underline underline-offset-2"
>
<span>GitHub</span>
<svg xmlns="http://www.w3.org/2000/svg" class="h-3 w-3" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
</svg>
</a>
</div>

<h3 class="mt-3 font-mono text-sm font-bold text-slate-900">
<a
href="https://github.com/replworks/laravel-imageforge"
target="_blank"
rel="noopener noreferrer"
class="hover:text-indigo-600 hover:underline"
>
replworks/laravel-imageforge
</a>
</h3>
<p class="mt-1.5 text-xs text-slate-600 leading-relaxed font-medium">
Image Forge를 Laravel 애플리케이션에서 간편하게 연동하고 최적화 URL을 생성하는 패키지입니다.
</p>
</div>

<!-- 도입 사례 뱃지 / 썸네일 -->
<div class="mt-4 pt-3.5 border-t border-slate-200/80">
<div class="flex items-center justify-between text-xs mb-2.5">
<span class="text-[11px] font-bold text-slate-500 uppercase tracking-wider">실제 적용 서비스</span>
<a
href="https://wifinote.net"
target="_blank"
rel="noopener noreferrer"
class="inline-flex items-center gap-1 font-mono text-[11px] font-bold text-indigo-700 bg-indigo-50 hover:bg-indigo-100 px-2 py-0.5 rounded border border-indigo-200 transition"
>
<span>wifinote.net</span>
<svg xmlns="http://www.w3.org/2000/svg" class="h-2.5 w-2.5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
</svg>
</a>
</div>

<a
href="https://wifinote.net"
target="_blank"
rel="noopener noreferrer"
class="group relative block overflow-hidden rounded-lg border-2 border-slate-900 bg-slate-900 sticker-shadow-sm transition hover:-translate-y-0.5"
>
<img
src="https://img.repl.net/wifinote/assets/seo/og.png?w=640&amp;f=webp"
alt="wifinote.net 서비스 썸네일 미리보기"
loading="lazy"
class="w-full aspect-[1.91/1] object-cover transition-transform duration-300 group-hover:scale-105 opacity-95 group-hover:opacity-100"
width="640"
height="335"
/>
<div class="absolute bottom-1.5 right-1.5 rounded bg-slate-900/80 px-1.5 py-0.5 font-mono text-[9px] font-bold text-emerald-300 backdrop-blur-xs">
⚡ img.repl.net (w=480, webp)
</div>
</a>
</div>
</div>
</div>
</div>
</section>

<!-- 하단 푸터 (L2 단일 링크 요구사항 만족) -->
<footer class="mt-auto pt-14 pb-8 flex flex-col sm:flex-row sm:items-center justify-between gap-4 border-t border-slate-200 text-sm text-slate-500 font-medium">
<div class="flex flex-col gap-1 sm:flex-row sm:items-center sm:gap-2 order-2 sm:order-1">
Expand Down
Loading