Dzeisonov's picture
Upload App
d56fb76
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>Hasil Analisis</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
body { background-color: #f8f9fa; display: flex; align-items: center; min-height: 100vh;}
.card { border-radius: 20px; border: none; box-shadow: 0 10px 30px rgba(0,0,0,0.08); }
.badge-status { font-size: 1.2rem; padding: 10px 25px; border-radius: 50px; }
.bg-toxic { background-color: #e74c3c; color: white; }
.bg-safe { background-color: #27ae60; color: white; }
</style>
</head>
<body>
<div class="container">
<div class="row justify-content-center">
<div class="col-md-7">
<div class="card p-5 text-center">
<h6 class="text-muted text-uppercase ls-2">Teks Asli</h6>
<p class="lead fst-italic mb-4">"{{ data.original_text }}"</p>
<hr>
<h6 class="text-muted text-uppercase mt-4">Hasil Prediksi</h6>
<p class="small text-muted mb-3">Model: {{ model_name }}</p>
<div>
{% if data.label == 'Toxic' %}
<span class="badge badge-status bg-toxic">☣️ TOXIC</span>
<div class="alert alert-danger mt-4 border-0 bg-danger bg-opacity-10 text-danger">
<strong>Peringatan!</strong> Kalimat ini mengandung unsur negatif/kasar.
</div>
{% else %}
<span class="badge badge-status bg-safe">✅ NON-TOXIC</span>
<div class="alert alert-success mt-4 border-0 bg-success bg-opacity-10 text-success">
<strong>Aman.</strong> Kalimat ini bersih.
</div>
{% endif %}
</div>
<p class="mt-2 text-muted small">Confidence: <strong>{{ data.score }}</strong></p>
<a href="{{ url_for('ulang') }}" class="btn btn-outline-dark mt-4 px-5 rounded-pill">Cek Lagi</a>
</div>
</div>
</div>
</div>
</body>
</html>