81 lines
3.1 KiB
HTML
81 lines
3.1 KiB
HTML
{% load static %}
|
|
<!DOCTYPE html>
|
|
<html lang="de" class="dark:bg-gray-900 h-full">
|
|
<head>
|
|
<link rel="icon" type="image/png" href="{% static 'icons/favicon.png' %}">
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="stylesheet" href="{% static 'css/t-style.css' %}">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/@tsparticles/confetti@3.0.3/tsparticles.confetti.bundle.min.js"></script>
|
|
<title>qivip</title>
|
|
</head>
|
|
<body class="min-h-screen relative">
|
|
<div class="pb-64">
|
|
{% include 'partials/_nav.html' %}
|
|
{% block content%}{% endblock %}
|
|
{% block faqs%}{% endblock %}
|
|
</div>
|
|
{% include 'partials/_footer.html' %}
|
|
|
|
<!-- Toast Container -->
|
|
<div id="toast-container" class="fixed top-4 right-4 z-50"></div>
|
|
|
|
<!-- Django Messages to Toast -->
|
|
{% if messages %}
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
{% for message in messages %}
|
|
// Use the existing toast.create function
|
|
toast.create("{{ message }}", "{{ message.tags }}");
|
|
{% endfor %}
|
|
});
|
|
</script>
|
|
{% endif %}
|
|
|
|
<script>
|
|
// WebSocket Utility
|
|
const wsUtil = {
|
|
handleClose: function(e) {
|
|
if (e.code === 1000 || e.code === 1001) {
|
|
console.log('Socket closed normally');
|
|
} else {
|
|
console.error('Socket closed unexpectedly', e.code);
|
|
}
|
|
}
|
|
};
|
|
|
|
// Toast Notification System
|
|
const toast = {
|
|
create: function(message, type = 'info', duration = 3000) {
|
|
const toast = document.createElement('div');
|
|
toast.className = `mb-4 p-4 rounded-lg shadow-lg transform transition-all duration-300 ease-in-out
|
|
${type === 'success' ? 'bg-green-100 border-l-4 border-green-500 text-green-700' :
|
|
type === 'error' ? 'bg-red-100 border-l-4 border-red-500 text-red-700' :
|
|
type === 'warning' ? 'bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700' :
|
|
'bg-blue-100 border-l-4 border-blue-500 text-blue-700'}`;
|
|
toast.innerHTML = message;
|
|
|
|
const container = document.getElementById('toast-container');
|
|
container.appendChild(toast);
|
|
|
|
// Animate in
|
|
setTimeout(() => toast.classList.add('translate-x-0', 'opacity-100'), 100);
|
|
toast.classList.add('-translate-x-4', 'opacity-0');
|
|
|
|
// Remove after duration
|
|
setTimeout(() => {
|
|
toast.classList.add('-translate-x-4', 'opacity-0');
|
|
setTimeout(() => toast.remove(), 300);
|
|
}, duration);
|
|
}
|
|
};
|
|
|
|
</script>
|
|
{% block extra_js %}{% endblock %}
|
|
<style>html {
|
|
overflow-y: scroll;
|
|
}</style>
|
|
|
|
</body>
|
|
</html> |