|
|
<!DOCTYPE html> |
|
|
<html lang="tr"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Kelime Adası - Analiz Ekranı</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script> |
|
|
<style> |
|
|
.progress-ring__circle { |
|
|
transition: stroke-dashoffset 0.5s; |
|
|
transform: rotate(-90deg); |
|
|
transform-origin: 50% 50%; |
|
|
} |
|
|
|
|
|
.tab-active { |
|
|
border-bottom: 3px solid #6366f1; |
|
|
color: #6366f1; |
|
|
font-weight: 600; |
|
|
} |
|
|
|
|
|
.metric-card:hover { |
|
|
transform: translateY(-3px); |
|
|
box-shadow: 0 10px 25px rgba(0,0,0,0.1); |
|
|
} |
|
|
|
|
|
.word-difficulty-bar { |
|
|
transition: width 0.5s ease-in-out; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50 font-sans"> |
|
|
|
|
|
<header class="bg-indigo-700 text-white py-6"> |
|
|
<div class="container mx-auto px-6 flex justify-between items-center"> |
|
|
<div class="flex items-center"> |
|
|
<i class="fas fa-island-tropical text-3xl mr-3"></i> |
|
|
<h1 class="text-2xl font-bold">Kelime Adası</h1> |
|
|
</div> |
|
|
<nav class="hidden md:flex space-x-6"> |
|
|
<a href="#" class="hover:text-indigo-200 transition">Ana Sayfa</a> |
|
|
<a href="#" class="hover:text-indigo-200 transition">Pratik Yap</a> |
|
|
<a href="#" class="hover:text-indigo-200 transition">Analiz</a> |
|
|
<a href="#" class="hover:text-indigo-200 transition">Ada Düzenle</a> |
|
|
</nav> |
|
|
<div class="flex items-center space-x-4"> |
|
|
<div class="w-8 h-8 rounded-full bg-indigo-500 flex items-center justify-center"> |
|
|
<i class="fas fa-user text-sm"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</header> |
|
|
|
|
|
|
|
|
<section class="py-8"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="flex justify-between items-center mb-8"> |
|
|
<h2 class="text-3xl font-bold text-gray-800">Öğrenme Analizleri</h2> |
|
|
<div class="flex items-center space-x-2"> |
|
|
<span class="text-sm text-gray-600">Son güncelleme: 10 dakika önce</span> |
|
|
<button class="bg-indigo-100 text-indigo-700 p-2 rounded-full"> |
|
|
<i class="fas fa-sync-alt"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-lg shadow-sm mb-8"> |
|
|
<div class="flex border-b"> |
|
|
<button class="tab-active px-6 py-3 text-sm font-medium">Haftalık</button> |
|
|
<button class="px-6 py-3 text-sm font-medium text-gray-500 hover:text-indigo-600">Aylık</button> |
|
|
<button class="px-6 py-3 text-sm font-medium text-gray-500 hover:text-indigo-600">3 Aylık</button> |
|
|
<button class="px-6 py-3 text-sm font-medium text-gray-500 hover:text-indigo-600">Tüm Zamanlar</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8"> |
|
|
|
|
|
<div class="metric-card bg-white p-6 rounded-xl shadow-sm transition cursor-pointer"> |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<p class="text-gray-500 text-sm">Toplam Kelime</p> |
|
|
<h3 class="text-3xl font-bold text-gray-800 mt-1">1,245</h3> |
|
|
<p class="text-green-500 text-sm mt-2 flex items-center"> |
|
|
<i class="fas fa-arrow-up mr-1"></i> 12% geçen haftaya göre |
|
|
</p> |
|
|
</div> |
|
|
<div class="w-12 h-12 rounded-full bg-blue-100 flex items-center justify-center text-blue-600"> |
|
|
<i class="fas fa-book-open text-xl"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="metric-card bg-white p-6 rounded-xl shadow-sm transition cursor-pointer"> |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<p class="text-gray-500 text-sm">Pratik Süresi</p> |
|
|
<h3 class="text-3xl font-bold text-gray-800 mt-1">8.5</h3> |
|
|
<p class="text-gray-500 text-sm mt-2">saat bu hafta</p> |
|
|
</div> |
|
|
<div class="w-12 h-12 rounded-full bg-purple-100 flex items-center justify-center text-purple-600"> |
|
|
<i class="fas fa-clock text-xl"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="metric-card bg-white p-6 rounded-xl shadow-sm transition cursor-pointer"> |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<p class="text-gray-500 text-sm">Başarı Oranı</p> |
|
|
<h3 class="text-3xl font-bold text-gray-800 mt-1">87%</h3> |
|
|
<p class="text-green-500 text-sm mt-2 flex items-center"> |
|
|
<i class="fas fa-arrow-up mr-1"></i> 5% geçen haftaya göre |
|
|
</p> |
|
|
</div> |
|
|
<div class="w-12 h-12 rounded-full bg-green-100 flex items-center justify-center text-green-600"> |
|
|
<i class="fas fa-trophy text-xl"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="metric-card bg-white p-6 rounded-xl shadow-sm transition cursor-pointer"> |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<p class="text-gray-500 text-sm">Günlük Giriş Serisi</p> |
|
|
<h3 class="text-3xl font-bold text-gray-800 mt-1">14</h3> |
|
|
<p class="text-gray-500 text-sm mt-2">En uzun: 21 gün</p> |
|
|
</div> |
|
|
<div class="w-12 h-12 rounded-full bg-yellow-100 flex items-center justify-center text-yellow-600"> |
|
|
<i class="fas fa-fire text-xl"></i> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mb-8"> |
|
|
|
|
|
<div class="bg-white p-6 rounded-xl shadow-sm"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h3 class="text-lg font-semibold text-gray-800">Zaman İçinde Öğrenilen Kelimeler</h3> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="px-3 py-1 text-xs bg-indigo-600 text-white rounded-full">Kelime</button> |
|
|
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-600 rounded-full">XP</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-64"> |
|
|
<canvas id="wordsLearnedChart"></canvas> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white p-6 rounded-xl shadow-sm"> |
|
|
<div class="flex justify-between items-center mb-6"> |
|
|
<h3 class="text-lg font-semibold text-gray-800">Pratik Aktivitesi</h3> |
|
|
<div class="flex space-x-2"> |
|
|
<button class="px-3 py-1 text-xs bg-indigo-600 text-white rounded-full">Süre</button> |
|
|
<button class="px-3 py-1 text-xs bg-gray-100 text-gray-600 rounded-full">Seans</button> |
|
|
</div> |
|
|
</div> |
|
|
<div class="h-64"> |
|
|
<canvas id="practiceActivityChart"></canvas> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-xl shadow-sm overflow-hidden mb-8"> |
|
|
<div class="p-6 border-b"> |
|
|
<h3 class="text-lg font-semibold text-gray-800">Performans Analizi</h3> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8 p-6"> |
|
|
|
|
|
<div> |
|
|
<h4 class="font-medium text-gray-700 mb-4">Pratik Türüne Göre Başarı Oranı</h4> |
|
|
<div class="space-y-4"> |
|
|
<div> |
|
|
<div class="flex justify-between mb-1"> |
|
|
<span class="text-sm font-medium">Yazma Pratiği</span> |
|
|
<span class="text-sm text-gray-500">85%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-2"> |
|
|
<div class="bg-blue-600 h-2 rounded-full" style="width: 85%"></div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="flex justify-between mb-1"> |
|
|
<span class="text-sm font-medium">Çoktan Seçmeli</span> |
|
|
<span class="text-sm text-gray-500">92%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-2"> |
|
|
<div class="bg-green-600 h-2 rounded-full" style="width: 92%"></div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="flex justify-between mb-1"> |
|
|
<span class="text-sm font-medium">Dinleme Pratiği</span> |
|
|
<span class="text-sm text-gray-500">78%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-2"> |
|
|
<div class="bg-purple-600 h-2 rounded-full" style="width: 78%"></div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="flex justify-between mb-1"> |
|
|
<span class="text-sm font-medium">Cümle Kurma</span> |
|
|
<span class="text-sm text-gray-500">81%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-2"> |
|
|
<div class="bg-yellow-600 h-2 rounded-full" style="width: 81%"></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div> |
|
|
<h4 class="font-medium text-gray-700 mb-4">Zorluk Derecesine Göre Kelimeler</h4> |
|
|
<div class="space-y-3"> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-sm font-medium w-32 truncate">Comprehensive</span> |
|
|
<div class="flex-1 mx-2"> |
|
|
<div class="word-difficulty-bar bg-red-500 h-2 rounded-full" style="width: 90%"></div> |
|
|
</div> |
|
|
<span class="text-sm text-gray-500">45%</span> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-sm font-medium w-32 truncate">Ambiguous</span> |
|
|
<div class="flex-1 mx-2"> |
|
|
<div class="word-difficulty-bar bg-orange-500 h-2 rounded-full" style="width: 70%"></div> |
|
|
</div> |
|
|
<span class="text-sm text-gray-500">60%</span> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-sm font-medium w-32 truncate">Pragmatic</span> |
|
|
<div class="flex-1 mx-2"> |
|
|
<div class="word-difficulty-bar bg-yellow-500 h-2 rounded-full" style="width: 50%"></div> |
|
|
</div> |
|
|
<span class="text-sm text-gray-500">75%</span> |
|
|
</div> |
|
|
<div class="flex items-center"> |
|
|
<span class="text-sm font-medium w-32 truncate">Explicit</span> |
|
|
<div class="flex-1 mx-2"> |
|
|
<div class="word-difficulty-bar bg-green-500 h-2 rounded-full" style="width: 30%"></div> |
|
|
</div> |
|
|
<span class="text-sm text-gray-500">92%</span> |
|
|
</div> |
|
|
</div> |
|
|
<button class="mt-4 text-indigo-600 text-sm font-medium flex items-center"> |
|
|
Tüm zor kelimeleri gör <i class="fas fa-chevron-right ml-1 text-xs"></i> |
|
|
</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-xl shadow-sm overflow-hidden mb-8"> |
|
|
<div class="p-6 border-b"> |
|
|
<h3 class="text-lg font-semibold text-gray-800">SRS (Spaced Repetition) İstatistikleri</h3> |
|
|
</div> |
|
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 p-6"> |
|
|
<div class="text-center"> |
|
|
<div class="text-4xl font-bold text-indigo-600 mb-2">3.2</div> |
|
|
<p class="text-gray-600">Ortalama Tekrar Aralığı (gün)</p> |
|
|
</div> |
|
|
<div class="text-center"> |
|
|
<div class="text-4xl font-bold text-indigo-600 mb-2">2.5</div> |
|
|
<p class="text-gray-600">Ortalama EF (Easiness Factor)</p> |
|
|
</div> |
|
|
<div class="text-center"> |
|
|
<div class="text-4xl font-bold text-indigo-600 mb-2">87%</div> |
|
|
<p class="text-gray-600">Hatırlama Oranı</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div class="bg-white rounded-xl shadow-sm overflow-hidden"> |
|
|
<div class="p-6 border-b"> |
|
|
<div class="flex justify-between items-center"> |
|
|
<h3 class="text-lg font-semibold text-gray-800">Hedef Takibi</h3> |
|
|
<button class="text-indigo-600 font-medium">Hedef Belirle</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="p-6"> |
|
|
<div class="mb-6"> |
|
|
<div class="flex justify-between mb-2"> |
|
|
<span class="font-medium">Günlük Kelime Hedefi</span> |
|
|
<span class="text-sm text-gray-600">15/20 kelime</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-3"> |
|
|
<div class="bg-green-500 h-3 rounded-full" style="width: 75%"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="mb-6"> |
|
|
<div class="flex justify-between mb-2"> |
|
|
<span class="font-medium">Haftalık Pratik Süresi</span> |
|
|
<span class="text-sm text-gray-600">8.5/10 saat</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-3"> |
|
|
<div class="bg-blue-500 h-3 rounded-full" style="width: 85%"></div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div> |
|
|
<div class="flex justify-between mb-2"> |
|
|
<span class="font-medium">Aylık Seviye Hedefi</span> |
|
|
<span class="text-sm text-gray-600">Seviye 6'ya 320/500 XP</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-3"> |
|
|
<div class="bg-purple-500 h-3 rounded-full" style="width: 64%"></div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="py-12 bg-indigo-50"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="bg-white rounded-xl shadow-sm overflow-hidden max-w-4xl mx-auto"> |
|
|
<div class="md:flex"> |
|
|
<div class="md:w-1/2 bg-indigo-600 p-8 text-white"> |
|
|
<h3 class="text-2xl font-bold mb-4">Premium Analiz Özellikleri</h3> |
|
|
<p class="mb-6">Detaylı raporlar, karşılaştırmalar ve kişiselleştirilmiş önerilerle öğrenme deneyiminizi bir üst seviyeye taşıyın.</p> |
|
|
<ul class="space-y-3 mb-6"> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-check-circle mr-2"></i> Zor kelimeler için özel tekrar modu |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-check-circle mr-2"></i> Diğer kullanıcılarla karşılaştırma |
|
|
</li> |
|
|
<li class="flex items-center"> |
|
|
<i class="fas fa-check-circle mr-2"></i> Haftalık performans raporları |
|
|
</li> |
|
|
</ul> |
|
|
</div> |
|
|
<div class="md:w-1/2 p-8"> |
|
|
<div class="text-center mb-6"> |
|
|
<span class="text-sm text-gray-500 line-through">₺39,90/ay</span> |
|
|
<div class="text-3xl font-bold text-gray-800">₺29,90<span class="text-lg text-gray-500">/ay</span></div> |
|
|
<p class="text-sm text-gray-600">Veya yıllık ₺299 (₺24,92/ay)</p> |
|
|
</div> |
|
|
<button class="w-full bg-indigo-600 text-white py-3 rounded-lg font-bold hover:bg-indigo-700 transition mb-4"> |
|
|
Premium'a Yükselt |
|
|
</button> |
|
|
<p class="text-xs text-gray-500 text-center">7 günlük ücretsiz deneme. İstediğiniz zaman iptal edin.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<footer class="bg-gray-800 text-white py-12"> |
|
|
<div class="container mx-auto px-6"> |
|
|
<div class="grid grid-cols-1 md:grid-cols-4 gap-8"> |
|
|
<div> |
|
|
<div class="flex items-center mb-4"> |
|
|
<i class="fas fa-island-tropical text-2xl mr-2"></i> |
|
|
<span class="text-xl font-bold">Kelime Adası</span> |
|
|
</div> |
|
|
<p class="text-gray-400">İngilizce kelime öğrenmeyi eğlenceli ve etkili hale getiren benzersiz bir uygulama.</p> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="text-lg font-semibold mb-4">Bağlantılar</h4> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Ana Sayfa</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Özellikler</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Premium</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">SSS</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="text-lg font-semibold mb-4">Yasal</h4> |
|
|
<ul class="space-y-2"> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Gizlilik Politikası</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Kullanım Koşulları</a></li> |
|
|
<li><a href="#" class="text-gray-400 hover:text-white transition">Çerez Politikası</a></li> |
|
|
</ul> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="text-lg font-semibold mb-4">Bize Ulaşın</h4> |
|
|
<div class="flex space-x-4 mb-4"> |
|
|
<a href="#" class="w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center hover:bg-indigo-600 transition"> |
|
|
<i class="fab fa-instagram"></i> |
|
|
</a> |
|
|
<a href="#" class="w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center hover:bg-blue-600 transition"> |
|
|
<i class="fab fa-twitter"></i> |
|
|
</a> |
|
|
<a href="#" class="w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center hover:bg-red-600 transition"> |
|
|
<i class="fab fa-youtube"></i> |
|
|
</a> |
|
|
</div> |
|
|
<p class="text-gray-400">[email protected]</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400"> |
|
|
<p>© 2023 Kelime Adası. Tüm hakları saklıdır.</p> |
|
|
</div> |
|
|
</div> |
|
|
</footer> |
|
|
|
|
|
<script> |
|
|
|
|
|
const wordsLearnedCtx = document.getElementById('wordsLearnedChart').getContext('2d'); |
|
|
const wordsLearnedChart = new Chart(wordsLearnedCtx, { |
|
|
type: 'line', |
|
|
data: { |
|
|
labels: ['Pzt', 'Sal', 'Çar', 'Per', 'Cum', 'Cmt', 'Paz'], |
|
|
datasets: [{ |
|
|
label: 'Öğrenilen Kelimeler', |
|
|
data: [12, 19, 15, 20, 14, 8, 10], |
|
|
backgroundColor: 'rgba(99, 102, 241, 0.1)', |
|
|
borderColor: 'rgba(99, 102, 241, 1)', |
|
|
borderWidth: 2, |
|
|
tension: 0.3, |
|
|
fill: true |
|
|
}] |
|
|
}, |
|
|
options: { |
|
|
responsive: true, |
|
|
plugins: { |
|
|
legend: { |
|
|
display: false |
|
|
} |
|
|
}, |
|
|
scales: { |
|
|
y: { |
|
|
beginAtZero: true, |
|
|
grid: { |
|
|
drawBorder: false |
|
|
} |
|
|
}, |
|
|
x: { |
|
|
grid: { |
|
|
display: false |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
const practiceActivityCtx = document.getElementById('practiceActivityChart').getContext('2d'); |
|
|
const practiceActivityChart = new Chart(practiceActivityCtx, { |
|
|
type: 'bar', |
|
|
data: { |
|
|
labels: ['Pzt', 'Sal', 'Çar', 'Per', 'Cum', 'Cmt', 'Paz'], |
|
|
datasets: [{ |
|
|
label: 'Pratik Süresi (dk)', |
|
|
data: [45, 60, 50, 70, 55, 30, 40], |
|
|
backgroundColor: 'rgba(129, 140, 248, 0.7)', |
|
|
borderColor: 'rgba(99, 102, 241, 1)', |
|
|
borderWidth: 1 |
|
|
}] |
|
|
}, |
|
|
options: { |
|
|
responsive: true, |
|
|
plugins: { |
|
|
legend: { |
|
|
display: false |
|
|
} |
|
|
}, |
|
|
scales: { |
|
|
y: { |
|
|
beginAtZero: true, |
|
|
grid: { |
|
|
drawBorder: false |
|
|
} |
|
|
}, |
|
|
x: { |
|
|
grid: { |
|
|
display: false |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
const tabs = document.querySelectorAll('.bg-white.rounded-lg.shadow-sm button'); |
|
|
tabs.forEach(tab => { |
|
|
tab.addEventListener('click', () => { |
|
|
tabs.forEach(t => t.classList.remove('tab-active')); |
|
|
tab.classList.add('tab-active'); |
|
|
|
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=YUSAKRU/asd" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |
