| <!DOCTYPE html> |
| <html lang="ar" dir="rtl"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>طلبات الخدمات | ServicePulse Hub</title> |
| <link rel="stylesheet" href="style.css"> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <script> |
| tailwind.config = { |
| theme: { |
| fontFamily: { |
| sans: ['Cairo', 'sans-serif'], |
| }, |
| extend: { |
| colors: { |
| primary: { |
| 500: '#F36B26', |
| 600: '#DA5C1F', |
| } |
| } |
| } |
| } |
| } |
| </script> |
| <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700&display=swap" rel="stylesheet"> |
| </head> |
| <body class="bg-gray-50 font-sans"> |
| <custom-header></custom-header> |
| |
| <main class="container mx-auto px-4 py-6"> |
| <div class="flex justify-between items-center mb-6"> |
| <h1 class="text-2xl font-bold text-gray-800">طلبات الخدمات</h1> |
| <div class="flex space-x-2 space-x-reverse"> |
| <div class="relative"> |
| <input type="text" placeholder="ابحث..." class="pr-10 pl-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent"> |
| <i data-feather="search" class="absolute right-3 top-2.5 text-gray-400"></i> |
| </div> |
| <custom-filter-chips></custom-filter-chips> |
| </div> |
| </div> |
|
|
| <div class="bg-white rounded-xl shadow-sm overflow-hidden"> |
| <custom-service-table></custom-service-table> |
| </div> |
| </main> |
|
|
| <script src="components/header.js"></script> |
| <script src="components/filter-chips.js"></script> |
| <script src="components/service-table.js"></script> |
| <script src="components/toast-notification.js"></script> |
| <script src="script.js"></script> |
| <toast-notification></toast-notification> |
| <script> |
| feather.replace(); |
| </script> |
| <script src="https://huggingface.co/deepsite/deepsite-badge.js"></script> |
| </body> |
| </html> |