184 lines
5.4 KiB
HTML
184 lines
5.4 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="tr">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
<title>GinImage API</title>
|
||
<style>
|
||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||
body {
|
||
font-family: 'Segoe UI', system-ui, sans-serif;
|
||
background: #0f172a;
|
||
color: #e2e8f0;
|
||
min-height: 100vh;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
.container {
|
||
max-width: 860px;
|
||
width: 100%;
|
||
padding: 2rem;
|
||
}
|
||
.header {
|
||
text-align: center;
|
||
margin-bottom: 3rem;
|
||
}
|
||
.badge {
|
||
display: inline-block;
|
||
background: #22c55e22;
|
||
color: #22c55e;
|
||
border: 1px solid #22c55e55;
|
||
border-radius: 999px;
|
||
padding: 0.25rem 0.85rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
letter-spacing: 0.05em;
|
||
text-transform: uppercase;
|
||
margin-bottom: 1rem;
|
||
}
|
||
h1 {
|
||
font-size: 2.8rem;
|
||
font-weight: 800;
|
||
background: linear-gradient(135deg, #38bdf8, #818cf8);
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
margin-bottom: 0.75rem;
|
||
}
|
||
.subtitle {
|
||
color: #94a3b8;
|
||
font-size: 1.05rem;
|
||
}
|
||
.grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||
gap: 1.25rem;
|
||
margin-bottom: 2.5rem;
|
||
}
|
||
.card {
|
||
background: #1e293b;
|
||
border: 1px solid #334155;
|
||
border-radius: 1rem;
|
||
padding: 1.5rem;
|
||
text-decoration: none;
|
||
color: inherit;
|
||
transition: border-color 0.2s, transform 0.2s;
|
||
}
|
||
.card:hover {
|
||
border-color: #38bdf8;
|
||
transform: translateY(-2px);
|
||
}
|
||
.card-icon {
|
||
font-size: 1.75rem;
|
||
margin-bottom: 0.75rem;
|
||
}
|
||
.card h3 {
|
||
font-size: 1rem;
|
||
font-weight: 700;
|
||
margin-bottom: 0.4rem;
|
||
color: #f1f5f9;
|
||
}
|
||
.card p {
|
||
font-size: 0.85rem;
|
||
color: #64748b;
|
||
line-height: 1.5;
|
||
}
|
||
.endpoints {
|
||
background: #1e293b;
|
||
border: 1px solid #334155;
|
||
border-radius: 1rem;
|
||
padding: 1.5rem;
|
||
margin-bottom: 2rem;
|
||
}
|
||
.endpoints h2 {
|
||
font-size: 0.85rem;
|
||
font-weight: 700;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.08em;
|
||
color: #64748b;
|
||
margin-bottom: 1rem;
|
||
}
|
||
.ep-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.6rem;
|
||
}
|
||
.ep {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.75rem;
|
||
font-size: 0.875rem;
|
||
}
|
||
.method {
|
||
font-size: 0.7rem;
|
||
font-weight: 700;
|
||
padding: 0.15rem 0.5rem;
|
||
border-radius: 0.3rem;
|
||
min-width: 48px;
|
||
text-align: center;
|
||
}
|
||
.get { background: #0ea5e922; color: #38bdf8; border: 1px solid #0ea5e955; }
|
||
.post { background: #22c55e22; color: #4ade80; border: 1px solid #22c55e55; }
|
||
.put { background: #f59e0b22; color: #fbbf24; border: 1px solid #f59e0b55; }
|
||
.delete { background: #ef444422; color: #f87171; border: 1px solid #ef444455; }
|
||
.ep-path { color: #cbd5e1; font-family: monospace; }
|
||
.ep-desc { color: #475569; margin-left: auto; font-size: 0.78rem; }
|
||
footer {
|
||
text-align: center;
|
||
color: #334155;
|
||
font-size: 0.8rem;
|
||
margin-top: 1rem;
|
||
}
|
||
footer a { color: #475569; text-decoration: none; }
|
||
footer a:hover { color: #94a3b8; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<div class="header">
|
||
<div class="badge">● running</div>
|
||
<h1>GinImage API</h1>
|
||
<p class="subtitle">Resim işleme, kullanıcı yönetimi ve blog servisi</p>
|
||
</div>
|
||
|
||
<div class="grid">
|
||
<a class="card" href="/swagger/index.html">
|
||
<div class="card-icon">📖</div>
|
||
<h3>Swagger Dokümantasyon</h3>
|
||
<p>Tüm endpoint'leri interaktif olarak keşfet ve test et.</p>
|
||
</a>
|
||
<a class="card" href="/api/v1/blogs">
|
||
<div class="card-icon">📝</div>
|
||
<h3>Blog API</h3>
|
||
<p>Yazılar, kategoriler ve etiketler için REST API.</p>
|
||
</a>
|
||
<a class="card" href="/uploads">
|
||
<div class="card-icon">🖼️</div>
|
||
<h3>Medya</h3>
|
||
<p>Yüklenen ve işlenmiş görsellere erişim.</p>
|
||
</a>
|
||
</div>
|
||
|
||
<div class="endpoints">
|
||
<h2>Temel Endpoint'ler</h2>
|
||
<div class="ep-list">
|
||
<div class="ep"><span class="method post">POST</span><span class="ep-path">/api/v1/auth/register</span><span class="ep-desc">Kayıt ol</span></div>
|
||
<div class="ep"><span class="method post">POST</span><span class="ep-path">/api/v1/auth/login</span><span class="ep-desc">Giriş yap</span></div>
|
||
<div class="ep"><span class="method post">POST</span><span class="ep-path">/api/v1/auth/refresh</span><span class="ep-desc">Token yenile</span></div>
|
||
<div class="ep"><span class="method get">GET</span><span class="ep-path">/api/v1/me</span><span class="ep-desc">Profil bilgisi</span></div>
|
||
<div class="ep"><span class="method put">PUT</span><span class="ep-path">/api/v1/me/profile</span><span class="ep-desc">Profil güncelle</span></div>
|
||
<div class="ep"><span class="method get">GET</span><span class="ep-path">/api/v1/blogs</span><span class="ep-desc">Blog yazıları</span></div>
|
||
</div>
|
||
</div>
|
||
|
||
<footer>
|
||
GinImage API ·
|
||
<a href="/swagger/index.html">Swagger UI</a> ·
|
||
Base URL: <code style="color:#475569">/api/v1</code>
|
||
</footer>
|
||
</div>
|
||
</body>
|
||
</html>
|
||
|