kaffa/anvil-hosting
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 개발자 터미널 스타일 UI 전면 적용

Browse Source 
- index.html: GitHub Dark 테마 터미널 스타일 랜딩 페이지
- terms.html, privacy.html, sla.html: 법적 페이지 터미널 UI 적용
- ASCII 아트 로고, vim 상태바, JSON 코드 블록
- Fira Code 모노스페이스 폰트, 터미널 그린 컬러 팔레트

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
kappa
2026-01-30 07:30:07 +09:00
parent 7f71b5edb0
commit a4e9dc2dd8
4 changed files with 816 additions and 1644 deletions
Download Patch File Download Diff File Expand all files Collapse all files

309
privacy.html
View File

@@ -1,165 +1,172 @@
<!DOCTYPE html>
<html lang="ko" class="scroll-smooth">
<html class="dark scroll-smooth" lang="ko">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>개인정보처리방침 - Anvil Hosting</title>
<!-- Tailwind CSS -->
<link rel="stylesheet" href="style.css">
<!-- Fonts -->
<link rel="stylesheet" href="fonts.css">
<!-- Favicon -->
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><rect fill='%230ea5e9' rx='20' width='100' height='100'/><text x='50' y='70' font-size='60' text-anchor='middle' fill='white' font-family='sans-serif' font-weight='bold'>A</text></svg>">
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
<link href="https://fonts.googleapis.com" rel="preconnect"/>
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500&display=swap" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/>
<script src="https://cdn.tailwindcss.com"></script>
<script>
tailwind.config = {
darkMode: "class",
theme: {
extend: {
colors: {
"primary": "#3fb950",
"background-dark": "#0d1117",
"terminal-bg": "#010409",
"terminal-border": "#30363d",
"terminal-text": "#c9d1d9",
"terminal-muted": "#8b949e",
"terminal-cyan": "#58a6ff",
"terminal-amber": "#d29922",
},
fontFamily: {
"display": ["Space Grotesk", "sans-serif"],
"mono": ["Fira Code", "monospace"],
},
},
},
}
</script>
</head>
<body class="font-sans antialiased bg-dark-900 text-slate-300">
<body class="bg-background-dark text-terminal-text font-mono min-h-screen flex flex-col p-4 md:p-8">
<!-- Header -->
<nav class="fixed w-full z-50 top-0 border-b border-white/5 bg-dark-900/80 backdrop-blur-md">
<div class="max-w-7xl mx-auto px-6 h-16 flex items-center justify-between">
<a href="/" class="flex items-center gap-2 group">
<div class="w-8 h-8 rounded bg-brand-500 flex items-center justify-center text-white font-bold font-mono text-xl shadow-lg shadow-brand-500/20">A</div>
<span class="font-bold text-lg tracking-tight">Anvil<span class="text-brand-400">.Hosting</span></span>
</a>
<a href="/" class="text-sm text-slate-400 hover:text-white transition">← 메인으로</a>
<div class="w-full max-w-4xl mx-auto bg-background-dark border border-terminal-border rounded-lg overflow-hidden flex flex-col">
<!-- Window Title Bar -->
<div class="bg-[#161b22] px-4 py-3 flex items-center justify-between border-b border-terminal-border">
<div class="flex items-center gap-2">
<div class="w-3 h-3 rounded-full bg-[#ff5f56]"></div>
<div class="w-3 h-3 rounded-full bg-[#ffbd2e]"></div>
<div class="w-3 h-3 rounded-full bg-[#27c93f]"></div>
</div>
</nav>
<span class="text-xs text-terminal-muted">cat /etc/anvil/privacy.md</span>
<a href="/" class="text-xs text-terminal-muted hover:text-primary transition">cd ~</a>
</div>
<!-- Main Content -->
<main class="pt-24 pb-16">
<div class="max-w-4xl mx-auto px-6">
<!-- Page Header -->
<div class="mb-12">
<h1 class="text-4xl md:text-5xl font-bold mb-4">개인정보처리방침</h1>
<p class="text-slate-400">최종 수정일: 2026년 1월 20일</p>
<!-- Content -->
<div class="p-6 md:p-8 space-y-8">
<!-- Header -->
<div class="border-b border-terminal-border pb-6">
<div class="flex items-center gap-2 text-sm text-terminal-muted mb-4">
<span class="text-primary">$</span> cat privacy.md
</div>
<!-- Privacy Content -->
<div class="glass-card p-8 md:p-12 rounded-2xl space-y-12">
<!-- Section 1 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제1조 (기본 원칙)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>LIBEHAIM Inc.(이하 "회사")는 <strong class="text-brand-400">고객의 개인정보를 직접 수집, 저장, 처리하지 않습니다.</strong></p>
<p>회사는 개인정보 최소화 원칙에 따라 서비스 운영에 필요한 최소한의 정보만을 외부 플랫폼을 통해 처리하며, 자체 데이터베이스에 개인정보를 보관하지 않습니다.</p>
</div>
</section>
<!-- Section 2 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제2조 (서비스 제공 방식)</h2>
<div class="space-y-4 text-slate-300 leading-relaxed">
<p>회사의 서비스는 다음과 같은 방식으로 제공됩니다:</p>
<div class="glass-panel p-4 rounded-lg">
<p><strong class="text-white">1. 텔레그램 봇 기반 서비스</strong></p>
<ul class="list-disc list-inside ml-4 space-y-1 mt-2">
<li>모든 고객 상호작용은 텔레그램 플랫폼을 통해 이루어집니다</li>
<li>텔레그램 계정 정보는 <a href="https://telegram.org/privacy" target="_blank" rel="noopener noreferrer" class="text-brand-400 hover:underline">텔레그램의 개인정보처리방침</a>에 따라 텔레그램에서 관리됩니다</li>
<li>회사는 텔레그램 사용자 ID만을 서비스 식별 목적으로 일시적으로 참조합니다</li>
</ul>
</div>
<div class="glass-panel p-4 rounded-lg">
<p><strong class="text-white">2. 결제 처리</strong></p>
<ul class="list-disc list-inside ml-4 space-y-1 mt-2">
<li>결제는 외부 결제 대행사를 통해 처리됩니다</li>
<li>회사는 결제 정보(카드번호, 계좌정보 등)를 직접 수집하거나 저장하지 않습니다</li>
<li>결제 관련 개인정보는 해당 결제 대행사의 개인정보처리방침에 따라 관리됩니다</li>
</ul>
</div>
<div class="glass-panel p-4 rounded-lg">
<p><strong class="text-white">3. 정적 웹사이트</strong></p>
<ul class="list-disc list-inside ml-4 space-y-1 mt-2">
<li>본 웹사이트(hosting.anvil.it.com)는 정적 웹사이트입니다</li>
<li>쿠키, 트래킹 코드, 분석 도구를 사용하지 않습니다</li>
<li>회원가입이나 로그인 기능이 없습니다</li>
</ul>
</div>
</div>
</section>
<!-- Section 3 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제3조 (서버 운영 관련)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>클라우드 인프라 서비스 특성상 다음 정보가 기술적으로 생성될 수 있습니다:</p>
<ul class="list-disc list-inside ml-4 space-y-2">
<li><strong class="text-white">서버 접속 로그:</strong> 고객이 생성한 서버의 시스템 로그는 해당 서버 내에만 존재하며, 고객이 직접 관리합니다</li>
<li><strong class="text-white">네트워크 로그:</strong> DDoS 방어 및 보안 목적으로 IP 주소가 일시적으로 기록될 수 있으며, 보안 목적 달성 후 자동 삭제됩니다</li>
</ul>
</div>
</section>
<!-- Section 4 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제4조 (제3자 서비스)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>회사 서비스 이용 시 다음 제3자 서비스의 개인정보처리방침이 적용될 수 있습니다:</p>
<ul class="list-disc list-inside ml-4 space-y-2">
<li><a href="https://telegram.org/privacy" target="_blank" rel="noopener noreferrer" class="text-brand-400 hover:underline">Telegram Privacy Policy</a> - 봇 서비스 이용 시</li>
<li><a href="https://www.cloudflare.com/privacypolicy/" target="_blank" rel="noopener noreferrer" class="text-brand-400 hover:underline">Cloudflare Privacy Policy</a> - 웹사이트 호스팅</li>
</ul>
</div>
</section>
<!-- Section 5 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제5조 (이용자의 권리)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>회사는 개인정보를 보유하지 않으므로 별도의 열람, 정정, 삭제 절차가 필요하지 않습니다.</p>
<p>텔레그램 계정 정보에 대한 권리 행사는 텔레그램에 직접 요청하시기 바랍니다.</p>
<p>서비스 이용 중 생성된 서버 데이터는 고객이 직접 관리하며, 서비스 해지 시 고객의 요청에 따라 완전히 삭제됩니다.</p>
</div>
</section>
<!-- Section 6 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제6조 (문의처)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>개인정보 관련 문의사항은 아래 연락처로 문의하시기 바랍니다.</p>
<ul class="list-none ml-4 space-y-2">
<li><strong class="text-white">회사명:</strong> LIBEHAIM Inc.</li>
<li><strong class="text-white">대표:</strong> Taro Tanaka</li>
<li><strong class="text-white">주소:</strong> #202 K-Flat, 3-1-13 Higashioi, Shinagawa-ku, Tokyo 140-0011, Japan</li>
<li><strong class="text-white">고객 지원:</strong> <a href="https://t.me/AnvilForgeBot" target="_blank" rel="noopener noreferrer" class="text-brand-400 hover:underline">@AnvilForgeBot</a> (Telegram)</li>
</ul>
</div>
</section>
<!-- Section 7 -->
<section>
<h2 class="text-2xl font-bold text-white mb-4">제7조 (방침 변경)</h2>
<div class="space-y-3 text-slate-300 leading-relaxed">
<p>이 개인정보처리방침은 2026년 1월 20일부터 적용됩니다.</p>
<p>방침이 변경되는 경우 서비스 내 공지를 통해 안내드립니다.</p>
</div>
</section>
</div>
<!-- Back to Home -->
<div class="mt-12 text-center">
<a href="/" class="inline-flex items-center gap-2 text-brand-400 hover:text-brand-300 transition">
<svg class="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/></svg>
메인 페이지로 돌아가기
</a>
</div>
<h1 class="text-2xl md:text-3xl font-display font-bold text-white mb-2"># 개인정보처리방침</h1>
<p class="text-terminal-muted text-sm">// 최종 수정일: 2026년 1월 20일</p>
</div>
</main>
<!-- Footer -->
<footer class="py-8 border-t border-white/5">
<div class="max-w-7xl mx-auto px-6 text-center text-sm text-slate-500">
<p>© 2026 LIBEHAIM Inc. All rights reserved.</p>
<!-- Section 1 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제1조 (기본 원칙)</h2>
<div class="bg-primary/10 border border-primary/30 rounded p-4">
<p class="text-primary font-bold mb-2">💡 핵심: 개인정보를 직접 수집, 저장, 처리하지 않습니다.</p>
<p class="text-terminal-text text-sm">회사는 개인정보 최소화 원칙에 따라 서비스 운영에 필요한 최소한의 정보만을 외부 플랫폼을 통해 처리하며, 자체 데이터베이스에 개인정보를 보관하지 않습니다.</p>
</div>
</section>
<!-- Section 2 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제2조 (서비스 제공 방식)</h2>
<div class="bg-terminal-bg rounded border border-terminal-border p-4 space-y-4 text-sm">
<div>
<p class="text-terminal-amber font-bold mb-2">// 1. 텔레그램 봇 기반 서비스</p>
<p class="text-terminal-muted pl-4">- 모든 고객 상호작용은 텔레그램 플랫폼을 통해 이루어집니다</p>
<p class="text-terminal-muted pl-4">- 텔레그램 계정 정보는 텔레그램에서 관리됩니다</p>
<p class="text-terminal-muted pl-4">- 회사는 텔레그램 사용자 ID만 일시적으로 참조합니다</p>
</div>
<div>
<p class="text-terminal-amber font-bold mb-2">// 2. 결제 처리</p>
<p class="text-terminal-muted pl-4">- 결제는 외부 결제 대행사를 통해 처리됩니다</p>
<p class="text-terminal-muted pl-4">- 회사는 결제 정보를 직접 수집/저장하지 않습니다</p>
</div>
<div>
<p class="text-terminal-amber font-bold mb-2">// 3. 정적 웹사이트</p>
<p class="text-terminal-muted pl-4">- 쿠키, 트래킹 코드, 분석 도구 <span class="text-primary">미사용</span></p>
<p class="text-terminal-muted pl-4">- 회원가입/로그인 기능 <span class="text-primary">없음</span></p>
</div>
</div>
</section>
<!-- Section 3 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제3조 (서버 운영 관련)</h2>
<div class="space-y-2 text-terminal-text pl-4">
<p class="text-terminal-muted mb-2"># 기술적으로 생성될 수 있는 정보:</p>
<p><span class="text-terminal-cyan">server_logs</span> = 고객 서버 내에만 존재, 고객이 직접 관리</p>
<p><span class="text-terminal-cyan">network_logs</span> = DDoS 방어/보안 목적으로 IP 일시 기록, 자동 삭제</p>
</div>
</section>
<!-- Section 4 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제4조 (제3자 서비스)</h2>
<div class="bg-terminal-bg rounded border border-terminal-border p-4 text-sm">
<p class="text-terminal-muted mb-3"># 적용되는 제3자 개인정보처리방침:</p>
<p><span class="text-primary">→</span> <a href="https://telegram.org/privacy" target="_blank" class="text-terminal-cyan hover:underline">Telegram Privacy Policy</a> <span class="text-terminal-muted">// 봇 서비스 이용 시</span></p>
<p><span class="text-primary">→</span> <a href="https://www.cloudflare.com/privacypolicy/" target="_blank" class="text-terminal-cyan hover:underline">Cloudflare Privacy Policy</a> <span class="text-terminal-muted">// 웹사이트 호스팅</span></p>
</div>
</section>
<!-- Section 5 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제5조 (이용자의 권리)</h2>
<div class="space-y-2 text-terminal-text pl-4">
<p><span class="text-primary">✓</span> 회사는 개인정보를 보유하지 않으므로 별도의 열람/정정/삭제 절차 불필요</p>
<p><span class="text-primary">✓</span> 텔레그램 계정 정보 권리 행사는 텔레그램에 직접 요청</p>
<p><span class="text-primary">✓</span> 서버 데이터는 고객이 직접 관리, 해지 시 완전 삭제</p>
</div>
</section>
<!-- Section 6 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제6조 (문의처)</h2>
<div class="bg-terminal-bg rounded border border-terminal-border p-4 text-sm">
<p><span class="text-terminal-cyan">company</span> = <span class="text-primary">"LIBEHAIM Inc."</span></p>
<p><span class="text-terminal-cyan">ceo</span> = <span class="text-primary">"Taro Tanaka"</span></p>
<p><span class="text-terminal-cyan">address</span> = <span class="text-primary">"#202 K-Flat, 3-1-13 Higashioi, Shinagawa-ku, Tokyo"</span></p>
<p><span class="text-terminal-cyan">support</span> = <a href="https://t.me/AnvilForgeBot" class="text-primary hover:underline">"@AnvilForgeBot"</a></p>
</div>
</section>
<!-- Section 7 -->
<section class="space-y-3">
<h2 class="text-lg font-display font-bold text-terminal-cyan">## 제7조 (방침 변경)</h2>
<div class="text-terminal-text pl-4">
<p>이 개인정보처리방침은 <span class="text-primary">2026년 1월 20일</span>부터 적용됩니다.</p>
<p class="text-terminal-muted">변경 시 서비스 내 공지를 통해 안내드립니다.</p>
</div>
</section>
<!-- Back -->
<div class="pt-6 border-t border-terminal-border">
<a href="/" class="text-primary hover:underline text-sm">$ cd / # 메인으로 돌아가기</a>
</div>
</footer>
</div>
<!-- Vim Status Bar -->
<div class="bg-primary text-background-dark text-xs font-bold py-1 px-4 flex justify-between">
<div class="flex gap-4">
<span class="bg-background-dark/20 px-2 rounded text-white/90">NORMAL</span>
<span>privacy.md</span>
</div>
<div class="flex gap-4">
<span>utf-8</span>
<span>100%</span>
</div>
</div>
</div>
<footer class="mt-6 text-terminal-muted text-xs text-center opacity-50">
© 2026 LIBEHAIM Inc. exit 0
</footer>
</body>
</html>