- version : 0.5
- description : making a template.html and use it in index.html .
هذا الالتزام موجود في:
49
templates/template.html
Normal file
49
templates/template.html
Normal file
@@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ar" dir="rtl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
{# A block for specific page titles #}
|
||||
<title>{% block title %}نظام إدارة الطلاب{% endblock %}</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body { font-family: 'Cairo', sans-serif; }
|
||||
/* Style for disabled buttons to provide visual feedback */
|
||||
button:disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: 0.6;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body class="bg-gray-50 text-gray-800">
|
||||
|
||||
<div class="container mx-auto p-4 sm:p-6 lg:p-8 max-w-6xl">
|
||||
|
||||
{# Section for displaying Flask flashed messages #}
|
||||
<div class="mb-6 space-y-3" aria-live="polite" aria-atomic="true">
|
||||
{% with messages = get_flashed_messages(with_categories=true) %}
|
||||
{% if messages %}
|
||||
{% for category, message in messages %}
|
||||
{# Dynamically set background and text colors based on message category #}
|
||||
{% set bg_color = 'bg-blue-100 border-blue-500 text-blue-700' %}
|
||||
{% if category == 'success' %}{% set bg_color = 'bg-green-100 border-green-500 text-green-700' %}{% endif %}
|
||||
{% if category == 'danger' %}{% set bg_color = 'bg-red-100 border-red-500 text-red-700' %}{% endif %}
|
||||
{% if category == 'warning' %}{% set bg_color = 'bg-yellow-100 border-yellow-500 text-yellow-700' %}{% endif %}
|
||||
<div class="{{ bg_color }} border-r-4 border-l-0 p-4 rounded-md shadow" role="alert">
|
||||
<p class="font-bold">{{ message }}</p>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
</div>
|
||||
|
||||
{# This block will be filled by child templates #}
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
المرجع في مشكلة جديدة
حظر مستخدم