Files
balikci/backend/src/public/landing.html

177 lines
3.9 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Güvenlik Farkındalık Testi</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.container {
background: white;
border-radius: 20px;
box-shadow: 0 20px 60px rgba(0,0,0,0.3);
max-width: 600px;
padding: 60px 40px;
text-align: center;
animation: slideIn 0.5s ease-out;
}
@keyframes slideIn {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.icon {
font-size: 80px;
margin-bottom: 20px;
animation: bounce 1s ease infinite;
}
@keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}
h1 {
color: #2d3748;
font-size: 32px;
margin-bottom: 20px;
}
.highlight {
color: #e53e3e;
font-weight: bold;
}
p {
color: #4a5568;
font-size: 18px;
line-height: 1.8;
margin-bottom: 15px;
}
.warning-box {
background: #fff5f5;
border-left: 4px solid #e53e3e;
padding: 20px;
margin: 30px 0;
text-align: left;
border-radius: 8px;
}
.warning-box h2 {
color: #e53e3e;
font-size: 20px;
margin-bottom: 10px;
}
.tips {
background: #f7fafc;
border-radius: 10px;
padding: 25px;
margin-top: 30px;
text-align: left;
}
.tips h3 {
color: #2d3748;
font-size: 20px;
margin-bottom: 15px;
}
.tips ul {
list-style: none;
padding-left: 0;
}
.tips li {
color: #4a5568;
padding: 10px 0;
padding-left: 30px;
position: relative;
font-size: 16px;
}
.tips li:before {
content: "✓";
position: absolute;
left: 0;
color: #48bb78;
font-weight: bold;
font-size: 20px;
}
.footer {
margin-top: 40px;
padding-top: 20px;
border-top: 1px solid #e2e8f0;
color: #718096;
font-size: 14px;
}
</style>
</head>
<body>
<div class="container">
<div class="icon">🛡️</div>
<h1>Bu Bir <span class="highlight">Güvenlik Farkındalık Testi</span>ydi!</h1>
<p>
Az önce tıkladığınız link, <strong>gerçek bir phishing (oltalama) saldırısı değildi</strong>.
Bu, güvenlik farkındalığınızı test etmek için düzenlenen bir simülasyondu.
</p>
<div class="warning-box">
<h2>⚠️ Önemli Bilgi</h2>
<p>
Gerçek bir saldırı olsaydı, bu tıklama sonucunda:
</p>
<ul style="padding-left: 20px; margin-top: 10px;">
<li>Kişisel bilgileriniz çalınabilirdi</li>
<li>Hesap şifreleriniz ele geçirilebilirdi</li>
<li>Cihazınıza zararlı yazılım bulaşabilirdi</li>
</ul>
</div>
<div class="tips">
<h3>🔐 Kendinizi Nasıl Korursunuz?</h3>
<ul>
<li>E-postaları dikkatlice inceleyin</li>
<li>Gönderen adresini kontrol edin</li>
<li>Şüpheli linklere tıklamayın</li>
<li>İki faktörlü kimlik doğrulama kullanın</li>
<li>Düzenli şifre güncellemesi yapın</li>
<li>Resmi kanallardan doğrulama yapın</li>
</ul>
</div>
<div class="footer">
<p>Bu test, siber güvenlik farkındalığınızı artırmak amacıyla yapılmıştır.</p>
<p><strong>Toplanan bilgiler:</strong> IP adresi, konum, cihaz bilgileri (sadece eğitim amaçlı)</p>
</div>
</div>
</body>
</html>