واجهة إدارة Dashboard بكود نظيف ومرتب (HTML/CSS)

قمت بتصميم وتطوير لوحة تحكم Dashboard احترافية باستخدام لغتي HTML وCSS فقط، مع التركيز على:

هيكلية الصفحة: استخدمت Flexbox لتقسيم الصفحة إلى قسمين رئيسيين، قائمة جانبية (Sidebar) للتنقل والمحتوى الرئيسي (Content) لعرض البيانات.

تصميم القائمة الجانبية: تم تنظيمها بشكل عمودي مع تدرج واضح للعناصر، إضافة شعار بسيط وأيقونات مع تباعد مناسب، مع تطبيق تأثيرات تفاعلية مثل تغير لون النص عند المرور عليه (hover).

الخطوط والألوان: تم اختيار خط Poppins لسهولة القراءة ومظهر عصري، مع استخدام ألوان هادئة ومحايدة (رمادي وأزرق بنفسجي) لراحة العين.

العناصر التفاعلية: تصميم أزرار بتأثيرات تمرير وسهولة تحديد العنصر النشط (active) مع تمييزه بشكل واضح.

التجاوب والموضع: تم استخدام وحدات قياس نسبية وأبعاد مناسبة لعرض لوحة التحكم بشكل جيد على الشاشات الكبيرة مع التحكم في تموضع العناصر باستخدام position absolute بالنسبة لبعض الأقسام.

جداول البيانات وعرض المحتوى: تصميم جدول بسيط ومنظم يعرض البيانات مع تمييز الصفوف عند المرور عليها، وأزرار وظائف مثل التصدير (export) مع تأثيرات تفاعلية.

تصميم أقسام إضافية: مثل قسم عرض الصور (Screenshots) مع تنسيق جيد للصور والعناصر التوضيحية، وأقسام عرض مواقع إلكترونية مع صور وأيقونات.

تم الالتزام بمبادئ التصميم النظيفة والبسيطة لتسهيل تجربة المستخدم وضمان وضوح المعلومات، مع تنظيم الأكواد وترتيبها لتسهيل أي تعديلات مستقبلية.