Spaces:
Running
Running
Ctrl+K
import tkinter as tk from tkinter import scrolledtext # إنشاء النافذة الرئيسية root = tk.Tk() root.title("أمن الشبكات وأمن السيبرانية") root.geometry("800x600") root.configure(bg="#f0f0f0") # العنوان الرئيسي title_label = tk.Label( root, text="🔐 أمن الشبكات وأمن السيبرانية", font=("Arial", 20, "bold"), fg="#003366", bg="#f0f0f0" ) title_label.pack(pady=20) # الفصيل faction_label = tk.Label( root, text="الفصيل: فصيل الأمن السيبراني - الدفعة 2024", font=("Arial", 14), fg="#0055aa", bg="#f0f0f0" ) faction_label.pack(pady=10) # إطار لعرض المعلومات frame = tk.Frame(root, bg="#ffffff", padx=10, pady=10, relief="sunken", bd=2) frame.pack(padx=20, pady=10, fill="both", expand=True) # نص المعلومات info_text = """ 🔒 أمن الشبكات (Network Security): ------------------------------- - يركز على حماية البنية التحتية للشبكات من التهديدات. - يشمل استخدام جدران الحماية (Firewalls)، وأنظمة كشف التسلل (IDS)، وأنظمة منع التسلل (IPS). - يُستخدم التشفير (مثل SSL/TLS) لتأمين البيانات أثناء النقل. - يهدف إلى منع الوصول غير المصرح به، والتجسس، وانقطاع الخدمة (مثل هجمات DDoS). 🌐 أمن السيبرانية (Cybersecurity): --------------------------------- - مجال أوسع يشمل حماية جميع الأنظمة الرقمية: الشبكات، الأجهزة، البرمجيات، والبيانات. - يشمل التهديدات مثل: الفيروسات، التصيد الاحتيالي (Phishing)، البرمجيات الخبيثة (Malware)، والهندسة الاجتماعية. - يعتمد على سياسات الأمان، إدارة الهوية، التصحيح المنتظم، والوعي الأمني للمستخدمين. - يتضمن معايير مثل: ISO 27001، NIST، وضوابط الحماية المتعددة الطبقات (Defense in Depth). 🛡️ أهمية الأمان: - حماية البيانات الحساسة (مثل المالية، الشخصية، الحكومية). - ضمان استمرارية العمل (Business Continuity). - الامتثال للقوانين والأنظمة (مثل GDPR، NCA في السعودية). 💡 أمثلة على تدابير الأمان: - التحقق بخطوتين (2FA) - التحديثات الدورية للأنظمة - النسخ الاحتياطي (Backup) - التدريب على الوعي الأمني """ # مربع نصوص قابل للتمرير text_area = scrolledtext.ScrolledText( frame, wrap=tk.WORD, font=("Arial", 12), bg="#f9f9f9", fg="#333333", insertbackground="black" ) text_area.insert(tk.END, info_text) text_area.config(state="disabled") # لجعل النص للقراءة فقط text_area.pack(fill="both", expand=True) # زر للإغلاق exit_button = tk.Button( root, text="إغلاق", font=("Arial", 12), bg="#d9534f", fg="white", command=root.quit ) exit_button.pack(pady=10) # تشغيل الحلقة الرئيسية root.mainloop() - Follow Up Deployment
9503523 verified - 1.52 kB initial commit
- 217 Bytes ابغا زر قفل و افتح <!DOCTYPE html> <html lang="ar" dir="rtl"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>EO Market – واجهة متجر داكنة (أسلوب منصة تداول)</title> <meta name="description" content="متجر إلكتروني عربي بواجهة داكنة تحاكي لقطات منصات التداول: رسم بياني، قائمة أصول منبثقة، سلة، مفضلة، واتساب، PWA – ملف واحد" /> <script src="https://cdn.tailwindcss.com"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> <style> @font-face { font-family:'Tajawal'; font-weight:400; src:url('https://fonts.gstatic.com/ea/tajawal/v6/Tajawal-Regular.woff2') format('woff2'); } html { font-family: Tajawal, system-ui, -apple-system, Segoe UI, Roboto, Noto Sans, Arial; background: #0b0f14; color: #e5e7eb; scroll-behavior: smooth; } .card { background: linear-gradient(180deg, #10151d 0%, #0c1117 100%); border: 1px solid #1f2937; border-radius: 1rem; transition: all 0.3s ease; } .card:hover { transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); } .glass { background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03)); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,.08); } .btn { border-radius: 1rem; padding: 0.7rem 1.2rem; font-weight: 700; transition: all 0.2s ease; } .btn-primary { background: #2563eb; color: #fff; } .btn-primary:hover { background: #1d4ed8; transform: translateY(-1px); } .btn-ghost { border: 1px solid #334155; } .btn-ghost:hover { background: rgba(255,255,255,0.05); } .chip { background: #0b1220; border: 1px solid #1f2937; border-radius: .6rem; padding: .2rem .6rem; font-size: .75rem; transition: all 0.2s ease; } .chip:hover { background: #1f2937; } .line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .drawer { transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1); } .drawer-closed { transform: translateX(110%); } .shadow-grad { box-shadow: 0 10px 40px rgba(0,0,0,.45); } .rail { position: fixed; inset-inline-end: 10px; top: 90px; width: 64px; } .rail .icon { display: flex; align-items: center; justify-content: center; aspect-ratio: 1/1; border-radius: 1rem; border: 1px solid #253244; background: #0d141d; transition: all 0.2s ease; } .rail .icon:hover { background: #1f2937; transform: scale(1.05); } dialog { border: 0; animation: fadeIn 0.3s ease; } @keyframes fadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } } .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; } @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } } .badge { position: absolute; top: -5px; left: -5px; background: #2563eb; color: white; border-radius: 9999px; font-size: 0.75rem; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; } .badge-pink { background: #ec4899; } .spark-line { stroke-linecap: round; stroke-linejoin: round; } .loading-spinner { width: 24px; height: 24px; border: 3px solid rgba(255,255,255,0.3); border-radius: 50%; border-top-color: #2563eb; animation: spin 1s ease-in-out infinite; } @keyframes spin { to { transform: rotate(360deg); } } .tooltip { position: relative; } .tooltip:hover .tooltip-text { visibility: visible; opacity: 1; } .tooltip-text { visibility: hidden; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #1f2937; color: white; text-align: center; padding: 0.5rem; border-radius: 0.5rem; font-size: 0.75rem; white-space: nowrap; margin-bottom: 0.5rem; opacity: 0; transition: all 0.2s ease; z-index: 10; } .tooltip-text::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #1f2937 transparent transparent transparent; } </style> </head> <body class="min-h-screen flex flex-col"> <!-- شريط علوي --> <header class="sticky top-0 z-40 border-b border-slate-800/60 bg-[#0b0f14]/80 backdrop-blur"> <div class="max-w-6xl mx-auto px-4 py-3 flex items-center gap-3"> <a href="#/" class="text-2xl font-extrabold tracking-tight flex items-center"> <span class="bg-blue-600 text-white rounded-lg px-2 mr-1">EO</span> <span class="text-blue-400">Market</span> </a> <nav class="ms-4 hidden md:flex gap-3 text-slate-300"> <a class="hover:text-white transition-colors" href="#/catalog">المنتجات</a> <a class="hover:text-white transition-colors" href="#/offers">العروض</a> <a class="hover:text-white transition-colors" href="#/security">الأمان</a> </nav> <div class="ms-auto flex items-center gap-2"> <div class="hidden md:block relative"> <input id="search" type="search" placeholder="ابحث…" class="w-80 rounded-2xl px-4 py-2 bg-slate-900 border border-slate-700 text-slate-200 placeholder-slate-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all"> <i class="fas fa-search absolute left-3 top-3 text-slate-400"></i> </div> <button id="openPicker" class="btn btn-ghost flex items-center gap-1"> <i class="fas fa-list"></i> <span>قائمة الأصول</span> </button> <button id="favBtn" class="relative p-2 rounded-xl btn-ghost tooltip"> <span class="badge badge-pink" id="favCount">0</span> <i class="fas fa-heart text-pink-500"></i> <span class="tooltip-text">المفضلة</span> </button> <button id="openCart" class="relative p-2 rounded-xl btn-ghost tooltip"> <span class="badge" id="cartCount">0</span> <i class="fas fa-shopping-cart text-blue-400"></i> <span class="tooltip-text">السلة</span> </button> </div> </div> <div class="md:hidden px-4 pb-3"> <div class="relative"> <input id="searchMobile" type="search" placeholder="ابحث…" class="w-full rounded-2xl px-4 py-2 pl-10 bg-slate-900 border border-slate-700 text-slate-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all"> <i class="fas fa-search absolute right-3 top-3 text-slate-400"></i> </div> </div> </header> <!-- منطقة رسم بياني (خلفية فقط للتأثير البصري) + سكة يمين --> <section class="relative select-none border-b border-slate-800/60"> <div class="max-w-6xl mx-auto px-2 py-6"> <div class="relative h-[340px] md:h-[420px] rounded-2xl card overflow-hidden shadow-lg"> <svg viewBox="0 0 1000 400" class="absolute inset-0 w-full h-full"> <defs> <linearGradient id="grad" x1="0" y1="0" x2="0" y2="1"> <stop offset="0%" stop-color="#60a5fa"/> <stop offset="100%" stop-color="#60a5fa" stop-opacity="0"/> </linearGradient> </defs> <g opacity=".2" stroke="#94a3b8"> <line x1="0" y1="80" x2="1000" y2="80"/> <line x1="0" y1="160" x2="1000" y2="160"/> <line x1="0" y1="240" x2="1000" y2="240"/> <line x1="0" y1="320" x2="1000" y2="320"/> </g> <path id="mainline" d="M0 260 C150 210, 220 240, 320 220 S520 220, 640 260 820 240, 1000 270" fill="none" stroke="#60a5fa" stroke-width="3" class="spark-line"/> <path d="M0 400 L0 260 C150 210, 220 240, 320 220 S520 220, 640 260 820 240, 1000 270 L1000 400Z" fill="url(#grad)"/> </svg> <div class="absolute top-4 inset-x-4 flex items-center gap-3"> <div class="glass rounded-xl px-4 py-2 flex items-center gap-2"> <i class="fas fa-chart-line"></i> <span>سجل الآن</span> </div> <div class="glass rounded-xl px-4 py-2 ms-auto flex items-center gap-2"> <i class="fas fa-wallet"></i> <span>الرصيد التجريبي $10000</span> </div> <button class="glass rounded-xl p-2 hover:bg-white/10"> <i class="far fa-bell"></i> </button> </div> <div class="absolute inset-x-0 bottom-3 flex items-center justify-center"> <button id="openPicker2" class="btn btn-primary flex items-center gap-2"> <i class="fas fa-box-open"></i> <span>اختيار المنتج (قائمة الأصول)</span> </button> </div> </div> </div> <!-- سكة يمين تشبه الصور --> <div class="rail hidden md:grid gap-3"> <div class="icon tooltip"> <i class="fas fa-chart-line"></i> <span class="tooltip-text">الرسم البياني</span> </div> <div class="icon tooltip"> <i class="fas fa-book"></i> <span class="tooltip-text">التعليمات</span> </div> <div class="icon tooltip"> <i class="fas fa-file-invoice"></i> <span class="tooltip-text">الفواتير</span> </div> <div class="icon tooltip"> <i class="fas fa-credit-card"></i> <span class="tooltip-text">الدفع</span> </div> <div class="icon tooltip"> <i class="fas fa-comments"></i> <span class="tooltip-text">الدردشة</span> </div> <div class="icon tooltip"> <i class="fas fa-heart"></i> <span class="tooltip-text">المفضلة</span> </div> <div class="icon tooltip"> <i class="fas fa-cog"></i> <span class="tooltip-text">الإعدادات</span> </div> <div class="icon tooltip"> <i class="fas fa-clock"></i> <span class="tooltip-text">التاريخ</span> </div> </div> </section> <!-- كتالوج أسفل الرسم --> <main class="max-w-6xl mx-auto px-4 py-10 grid md:grid-cols-[240px_1fr] gap-6 flex-1" id="products"> <aside id="filters" class="hidden md:block card p-4 h-max sticky top-24"> <h3 class="font-bold mb-3 flex items-center gap-2"> <i class="fas fa-filter"></i> <span>الفئات</span> </h3> <div id="catList" class="space-y-2"></div> <hr class="my-4 border-slate-800"/> <h3 class="font-bold mb-3 flex items-center gap-2"> <i class="fas fa-tag"></i> <span>السعر</span> </h3> <div class="flex items-center gap-2"> <input id="minPrice" type="number" class="w-24 bg-slate-900 border border-slate-700 rounded-xl px-2 py-1 focus:outline-none focus:ring-1 focus:ring-blue-500" placeholder="من"> <span class="text-slate-600">–</span> <input id="maxPrice" type="number" class="w-24 bg-slate-900 border border-slate-700 rounded-xl px-2 py-1 focus:outline-none focus:ring-1 focus:ring-blue-500" placeholder="إلى"> <button id="priceFilter" class="ms-auto btn btn-ghost">تطبيق</button> </div> </aside> <section> <div class="flex items-center justify-between mb-4"> <p class="text-sm text-slate-400"> <i class="fas fa-box-open mr-1"></i> <span id="itemsCount">0</span> منتج </p> <div class="relative"> <select id="sort" class="bg-slate-900 border border-slate-700 rounded-lg px-3 py-1.5 pr-8 appearance-none focus:outline-none focus:ring-1 focus:ring-blue-500"> <option value="popular">الأكثر شيوعًا</option> <option value="price-asc">الأرخص</option> <option value="price-desc">الأغلى</option> <option value="new">الأحدث</option> </select> <i class="fas fa-chevron-down absolute left-2 top-2 text-slate-400 pointer-events-none"></i> </div> </div> <div id="grid" class="grid sm:grid-cols-2 lg:grid-cols-3 gap-4"></div> </section> </main> <!-- نافذة القفل --> <div id="lockModal" class="fixed inset-0 z-50 hidden"> <div class="absolute inset-0 bg-black/50"></div> <div class="card absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-[320px] p-6 text-center"> <h3 class="text-xl font-bold mb-4 flex items-center justify-center gap-2"> <i class="fas fa-lock"></i> <span>السلة مقفلة</span> </h3> <p class="text-slate-300 mb-4">أدخل كلمة المرور لفتح السلة</p> <input type="password" id="passwordInput" placeholder="••••" class="w-full px-4 py-2 bg-slate-900 border border-slate-700 rounded-xl mb-4 focus:outline-none focus:ring-1 focus:ring-blue-500"> <button onclick="unlockCart()" class="btn btn-primary w-full"> <i class="fas fa-unlock mr-1"></i> <span>فتح</span> </button> </div> </div> <!-- درج السلة --> <div id="cartDrawer" class="fixed inset-0 z-50 pointer-events-none"> <div id="backdrop" class="hidden md:block absolute inset-0 bg-black/50 opacity-0 transition-opacity duration-300"></div> <aside class="drawer drawer-closed pointer-events-auto w-full sm:w-[420px] ms-auto h-full card p-4"> <div class="flex items-center justify-between mb-2"> <h3 class="text-lg font-bold flex items-center gap-2"> <i class="fas fa-shopping-cart text-blue-400"></i> <span>السلة</span> </h3> <button id="closeCart" class="btn btn-ghost flex items-center gap-1"> <i class="fas fa-times"></i> <span>إغلاق</span> </button> </div> <div id="cartItems" class="flex-1 overflow-auto divide-y divide-slate-800"></div> <div class="pt-3 space-y-2 border-t border-slate-800 mt-3"> <div class="flex justify-between font-semibold"> <span>الإجمالي</span> <span id="cartTotal">0 ر.س</span> </div> <button id="checkout" class="w-full btn btn-primary flex items-center justify-center gap-2"> <span id="checkoutText">إتمام الطلب</span> <div id="checkoutSpinner" class="loading-spinner hidden"></div> </button> </div> </aside> </div> <!-- نافذة اختيار الأصول (مطابقة للصور) --> <dialog id="picker" class="w-[min(520px,92vw)] bg-[#0b0f14] text-slate-100 rounded-2xl p-0 border border-slate-800 shadow-grad"> <header class="px-4 py-3 flex items-center gap-2 border-b border-slate-800"> <form method="dialog"> <button class="btn btn-ghost"> <i class="fas fa-times"></i> </button> </form> <h3 class="text-lg font-bold flex-1">اختر الأصول</h3> <div class="ms-auto flex gap-2 text-slate-400 text-sm"> <button class="chip">Stocks</button> <button class="chip">Trading</button> </div> </header> <div class="p-4"> <div class="flex items-center gap-2 mb-3"> <div class="flex-1 relative"> <input id="pickSearch" placeholder="ابحث" class="w-full rounded-xl px-4 py-2 pl-10 bg-slate-900 border border-slate-700 placeholder-slate-500 focus:outline-none focus:ring-1 focus:ring-blue-500"> <i class="fas fa-search absolute right-3 top-3 text-slate-400"></i> </div> <select id="pickCat" class="rounded-xl bg-slate-900 border border-slate-700 px-3 py-2 focus:outline-none focus:ring-1 focus:ring-blue-500"> <option value="الكل">الكل</option> <option>إلكترونيات</option> <option>اشتراكات</option> <option>مشروبات</option> <option>إكسسوارات</option> </select> </div> <div id="pickList" class="max-h-[52vh] overflow-auto divide-y divide-slate-800"></div> </div> <footer class="px-4 py-3 bg-blue-600 rounded-b-2xl text-center font-bold cursor-pointer hover:bg-blue-700 transition-colors flex items-center justify-center gap-2" id="pickConfirm"> <i class="fas fa-check"></i> <span>تأكيد</span> </footer> </dialog> <footer class="mt-10 border-t border-slate-800/60"> <div class="max-w-6xl mx-auto px-4 py-8 text-sm text-slate-400 flex flex-col md:flex-row gap-3 md:items-center md:justify-between"> <p class="flex items-center gap-2"> <i class="fas fa-copyright"></i> <span>© <span id="year"></span> EO Market – جميع الحقوق محفوظة</span> </p> <p class="flex items-center gap-2"> <i class="fas fa-mobile-alt"></i> <span>واجهة داكنة + سلة + قائمة أصول + واتساب + PWA</span> </p> </div> </footer> <script> // بيانات المنتجات (تُعرض كأصول في النافذة المنبثقة) const products = [ {id:1,title:'EUR / USD',price:89,category:'اشتراكات',icon:'🇺🇸',profit:83,img:spark('#ef4444')}, {id:2,title:'Smarty',price:349,category:'إلكترونيات',icon:'🟩',profit:82,img:spark('#22c55e')}, {id:3,title:'Gold',price:599,category:'إلكترونيات',icon:'🥇',profit:78,img:spark('#ef4444')}, {id:4,title:'Football Index',price:65,category:'مشروبات',icon:'⚽️',profit:77,img:spark('#22c55e')}, {id:5,title:'AI Index',price:179,category:'إكسسوارات',icon:'🤖',profit:76,img:spark('#22c55e')}, {id:6,title:'NZD / USD',price:420,category:'إلكترونيات',icon:'🇳🇿',profit:74,img:spark('#ef4444')}, {id:7,title:'Bitcoin / USD',price:1200,category:'إلكترونيات',icon:'₿',profit:74,img:spark('#ef4444')} ]; // حالة وتخزين const cart = JSON.parse(localStorage.getItem('dark_cart')||'{}'); const favs = new Set(JSON.parse(localStorage.getItem('dark_favs')||'[]')); // عناصر DOM const grid = document.getElementById('grid'); const itemsCount = document.getElementById('itemsCount'); const search = document.getElementById('search'); const searchMobile = document.getElementById('searchMobile'); const sortSel = document.getElementById('sort'); const catList = document.getElementById('catList'); const minPrice = document.getElementById('minPrice'); const maxPrice = document.getElementById('maxPrice'); const priceFilterBtn = document.getElementById('priceFilter'); const openCartBtn = document.getElementById('openCart'); const cartDrawer = document.getElementById('cartDrawer'); const closeCartBtn = document.getElementById('closeCart'); const cartItems = document.getElementById('cartItems'); const cartTotal = document.getElementById('cartTotal'); const cartCount = document.getElementById('cartCount'); const favBtn = document.getElementById('favBtn'); const favCount = document.getElementById('favCount'); const year = document.getElementById('year'); const checkoutBtn = document.getElementById('checkout'); const checkoutSpinner = document.getElementById('checkoutSpinner'); const checkoutText = document.getElementById('checkoutText'); // نافذة الأصول const picker = document.getElementById('picker'); const pickList = document.getElementById('pickList'); const pickSearch = document.getElementById('pickSearch'); const pickCat = document.getElementById('pickCat'); year.textContent = new Date().getFullYear(); // فئات const cats = [...new Set(products.map(p=>p.category))]; let activeCat = 'الكل'; document.getElementById('catList').innerHTML = ['الكل', ...cats].map(c=> <label class="flex items-center gap-2 cursor-pointer text-slate-300 hover:text-white transition-colors"> <input type="radio" name="cat" value="${c}" ${c==='الكل'?'checked':''} class="accent-blue-500"> <span>${c}</span> </label> ).join(''); catList.addEventListener('change', (e)=>{ activeCat = e.target.value; render(); }); // بحث وترتيب const searchState = {q:'', min:null, max:null, sort:'popular'}; [search, searchMobile].forEach(inp=> inp && inp.addEventListener('input', e=>{ searchState.q = e.target.value.trim(); render(); })); sortSel.addEventListener('change', e=>{ searchState.sort = e.target.value; render(); }); priceFilterBtn.addEventListener('click', ()=>{ searchState.min = minPrice.value ? +minPrice.value : null; searchState.max = maxPrice.value ? +maxPrice.value : null; render(); }); function render(){ let list = products.slice(); if(activeCat !== 'الكل') list = list.filter(p=>p.category===activeCat); if(searchState.q){ const q = searchState.q.toLowerCase(); list = list.filter(p=> p.title.toLowerCase().includes(q)); } if(searchState.min!==null) list = list.filter(p=>p.price>=searchState.min); if(searchState.max!==null) list = list.filter(p=>p.price<=searchState.max); if(searchState.sort==='price-asc') list.sort((a,b)=>a.price-b.price); if(searchState.sort==='price-desc') list.sort((a,b)=>b.price-a.price); if(searchState.sort==='new') list.sort((a,b)=>b.id-a.id); itemsCount.textContent = list.length; grid.innerHTML = list.length ? list.map(card).join('') : <div class="col-span-full py-10 text-center text-slate-400"> <i class="fas fa-box-open text-4xl mb-3"></i> <p>لا توجد منتجات متطابقة</p> </div>; attachCardHandlers(); updateBadges(); } function card(p){ const faved = favs.has(p.id); return <article class="card p-3 flex flex-col hover:border-blue-500/30 transition-colors"> <button class="group relative" data-open="${p.id}"> <img src="${p.img}" alt="${p.title}" class="w-full aspect-square object-cover rounded-xl border border-slate-800 group-hover:border-blue-500/50 transition-colors" /> <div class="absolute top-2 left-2 bg-blue-500/90 text-white text-xs px-2 py-1 rounded-lg"> ${p.profit}% </div> </button> <div class="mt-3 flex-1"> <h3 class="font-bold leading-snug line-clamp-2">${p.title}</h3> <p class="text-blue-400 font-semibold mt-1">${price(p.price)}</p> <p class="text-xs text-slate-400 mt-1 flex items-center gap-1"> <i class="fas fa-tag"></i> <span>${p.category}</span> </p> </div> <div class="flex items-center gap-2 mt-3"> <button class="flex-1 btn btn-primary hover:shadow-lg" data-add="${p.id}"> <i class="fas fa-cart-plus mr-1"></i> <span>أضف للسلة</span> </button> <button class="btn btn-ghost ${faved?'bg-pink-900/30 border-pink-700':''}" title="مفضلة" data-fav="${p.id}"> <i class="fas fa-heart ${faved?'text-pink-500':''}"></i> </button> </div> </article>; } function attachCardHandlers(){ grid.querySelectorAll('[data-add]').forEach(btn=> btn.addEventListener('click', ()=> { addToCart(+btn.dataset.add); btn.innerHTML = <i class="fas fa-check mr-1"></i><span>تمت الإضافة</span>; btn.classList.add('bg-green-600', 'hover:bg-green-700'); setTimeout(()=>{ btn.innerHTML = <i class="fas fa-cart-plus mr-1"></i><span>أضف للسلة</span>; btn.classList.remove('bg-green-600', 'hover:bg-green-700'); }, 1500); }) ); grid.querySelectorAll('[data-fav]').forEach(btn=> btn.addEventListener('click', ()=> toggleFav(+btn.dataset.fav)) ); } // سلة function addToCart(id, qty=1){ cart[id] = (cart[id]||0)+qty; persist(); updateBadges(); openCart(); renderCart(); } function removeFromCart(id){ delete cart[id]; persist(); renderCart(); updateBadges(); } function changeQty(id,q){ if(q<=0){ removeFromCart(id); return; } cart[id]=q; persist(); renderCart(); updateBadges(); } function renderCart(){ const items = Object.entries(cart).map(([id,qty])=>({ ...products.find(p=>p.id==id), qty:+qty })); cartItems.innerHTML = items.length? items.map(it=> <div class="py-3 flex items-center gap-3"> <img src="${it.img}" class="w-16 h-16 rounded-xl border border-slate-800 object-cover" alt="${it.title}"> <div class="flex-1"> <p class="font-semibold">${it.title}</p> <p class="text-sm text-slate-400">${price(it.price)} × ${it.qty}</p> </div> <div class="flex items-center gap-2"> <button class="px-2 py-1 btn-ghost rounded-lg hover:bg-red-900/30" onclick="changeQty(${it.id}, ${it.qty-1})"> <i class="fas fa-minus"></i> </button> <span class="w-6 text-center">${it.qty}</span> <button class="px-2 py-1 btn-ghost rounded-lg hover:bg-green-900/30" onclick="changeQty(${it.id}, ${it.qty+1})"> <i class="fas fa-plus"></i> </button> <button class="p-2 text-red-400 hover:text-red-300" title="حذف" onclick="removeFromCart(${it.id})"> <i class="fas fa-trash"></i> </button> </div> </div>).join('') : <div class="py-10 text-center text-slate-400"> <i class="fas fa-shopping-cart text-4xl mb-3"></i> <p>السلة فارغة</p> </div>; const total = items.reduce((s,i)=> s + i.pricei.qty, 0); cartTotal.textContent = price(total); } function updateBadges(){ cartCount.textContent = Object.values(cart).reduce((s,v)=>s+v,0); favCount.textContent = favs.size; } function openCart(){ renderCart(); cartDrawer.querySelector('.drawer').classList.remove('drawer-closed'); document.getElementById('backdrop').classList.remove('hidden'); setTimeout(() => { document.getElementById('backdrop').style.opacity = '1'; }, 10); } function closeCart(){ cartDrawer.querySelector('.drawer').classList.add('drawer-closed'); document.getElementById('backdrop').style.opacity = '0'; setTimeout(() => { document.getElementById('backdrop').classList.add('hidden'); }, 300); } const correctPassword = "1234"; // Change this to your desired password document.getElementById('openCart').addEventListener('click', ()=>{ document.getElementById('lockModal').classList.remove('hidden'); }); function unlockCart() { const pass = document.getElementById('passwordInput').value; if (pass === correctPassword) { document.getElementById('lockModal').classList.add('hidden'); renderCart(); openCart(); } else { alert("❌ كلمة المرور غير صحيحة"); } } document.getElementById('backdrop').addEventListener('click', closeCart); document.getElementById('closeCart').addEventListener('click', closeCart); // مفضلة function toggleFav(id){ if(favs.has(id)) favs.delete(id); else favs.add(id); persist(); render(); updateBadges(); } favBtn.addEventListener('click', ()=>{ activeCat='الكل'; searchState.q=''; const favList = products.filter(p=>favs.has(p.id)); grid.innerHTML = favList.length? favList.map(card).join('') : <div class="col-span-full py-10 text-center text-slate-400"> <i class="fas fa-heart text-4xl mb-3"></i> <p>لا توجد عناصر في المفضلة</p> </div>; itemsCount.textContent = favList.length; attachCardHandlers(); updateBadges(); }); // واتساب document.getElementById('checkout').addEventListener('click', ()=>{ const items = Object.entries(cart).map(([id,qty])=>({ ...products.find(p=>p.id==id), qty:+qty })); if(!items.length){ alert('السلة فارغة'); return; } checkoutText.classList.add('hidden'); checkoutSpinner.classList.remove('hidden'); setTimeout(() => { const total = items.reduce((s,i)=> s + i.pricei.qty, 0); const lines = items.map(i=>• ${i.title} × ${i.qty} = ${price(i.price*i.qty)}).join('%0A'); const msg = طلب جديد:%0A${lines}%0A—%0Aالإجمالي: ${price(total)}%0Aالاسم: %0Aالعنوان:; const phone = '966500000000'; // عدّل لرقمك بدون + window.open(https://wa.me/${phone}?text=${msg}, '_blank'); checkoutText.classList.remove('hidden'); checkoutSpinner.classList.add('hidden'); }, 1500); }); // نافذة الأصول – فتح/فلترة/تأكيد document.getElementById('openPicker').addEventListener('click', ()=> openPicker()); document.getElementById('openPicker2').addEventListener('click', ()=> openPicker()); function openPicker(){ buildPickList(); picker.showModal(); } pickSearch.addEventListener('input', buildPickList); pickCat.addEventListener('change', buildPickList); let selected = new Set(); function buildPickList(){ const q = pickSearch.value?.toLowerCase()||''; const c = pickCat.value; const list = products.filter(p=> (c==='الكل'||p.category===c) && p.title.toLowerCase().includes(q)); pickList.innerHTML = list.map(p=> <label class="flex items-center gap-3 py-3 px-2 hover:bg-white/5 rounded-xl cursor-pointer transition-colors"> <input type="checkbox" ${selected.has(p.id)?'checked':''} data-id="${p.id}" class="accent-blue-500"> <img src="${p.img}" class="w-16 h-10 rounded-md border border-slate-700" alt="spark"> <div class="flex-1 min-w-0"> <div class="font-semibold truncate">${p.title}</div> <div class="text-xs text-slate-400 flex items-center gap-1"> <i class="fas fa-tag"></i> <span>${p.category}</span> </div> </div> <div class="text-2xl">${p.icon}</div> </label>).join(''); pickList.querySelectorAll('input[type=checkbox]').forEach(cb=> cb.addEventListener('change', e=>{ const id=+e.target.dataset.id; if(e.target.checked) selected.add(id); else selected.delete(id); }) ); } document.getElementById('pickConfirm').addEventListener('click', ()=>{ if(!selected.size){ picker.close(); return; } selected.forEach(id=> addToCart(id)); selected.clear(); picker.close(); }); function persist(){ localStorage.setItem('dark_cart', JSON.stringify(cart)); localStorage.setItem('dark_favs', JSON.stringify([...favs])); } // أدوات function price(n){ return new Intl.NumberFormat('ar-SA',{style:'currency',currency:'SAR'}).format(n); } function ph(color,text='معاينة'){ const svg = <svg xmlns='http://www.w3.org/2000/svg' width='640' height='640'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'><stop stop-color='${color}' offset='0'/><stop stop-color='#0b0f14' offset='1'/></linearGradient></defs><rect width='100%' height='100%' fill='url(#g)'/><text x='50%' y='50%' dominant-baseline='middle' text-anchor='middle' font-family='Tajawal,Arial' font-size='36' fill='#e5e7eb'>${text}</text></svg>; return 'data:image/svg+xml;base64,'+btoa(unescape(encodeURIComponent(svg))); } function spark(color='#22c55e'){ const svg = <svg xmlns='http://www.w3.org/2000/svg' width='160' height='60'><defs><linearGradient id='g' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='${color}'/><stop offset='1' stop-color='${color}' stop-opacity='0'/></linearGradient></defs><rect width='100%' height='100%' fill='#0f1622'/><path d='M5 40 C30 30,50 35,70 28 S120 25,150 40' stroke='${color}' stroke-width='3' fill='none' class="spark-line"/><path d='M5 60 L5 40 C30 30,50 35,70 28 S120 25,150 40 L150 60Z' fill='url(#g)'/></svg>; return 'data:image/svg+xml;base64,'+btoa(unescape(encodeURIComponent(svg))); } render(); // PWA مبسّط if('serviceWorker' in navigator){ const swCode = self.addEventListener('install',e=>{e.waitUntil(caches.open('darkstore-v2').then(c=>c.addAll(['./'])))});self.addEventListener('fetch',e=>{e.respondWith(caches.match(e.request).then(r=>r||fetch(e.request)))}); const blob = new Blob([swCode],{type:'text/javascript'}); const swUrl = URL.createObjectURL(blob); navigator.serviceWorker.register(swUrl); } </script> </body> </html> - Initial Deployment
- 9.19 kB import tkinter as tk from tkinter import scrolledtext # إنشاء النافذة الرئيسية root = tk.Tk() root.title("أمن الشبكات وأمن السيبرانية") root.geometry("800x600") root.configure(bg="#f0f0f0") # العنوان الرئيسي title_label = tk.Label( root, text="🔐 أمن الشبكات وأمن السيبرانية", font=("Arial", 20, "bold"), fg="#003366", bg="#f0f0f0" ) title_label.pack(pady=20) # الفصيل faction_label = tk.Label( root, text="الفصيل: فصيل الأمن السيبراني - الدفعة 2024", font=("Arial", 14), fg="#0055aa", bg="#f0f0f0" ) faction_label.pack(pady=10) # إطار لعرض المعلومات frame = tk.Frame(root, bg="#ffffff", padx=10, pady=10, relief="sunken", bd=2) frame.pack(padx=20, pady=10, fill="both", expand=True) # نص المعلومات info_text = """ 🔒 أمن الشبكات (Network Security): ------------------------------- - يركز على حماية البنية التحتية للشبكات من التهديدات. - يشمل استخدام جدران الحماية (Firewalls)، وأنظمة كشف التسلل (IDS)، وأنظمة منع التسلل (IPS). - يُستخدم التشفير (مثل SSL/TLS) لتأمين البيانات أثناء النقل. - يهدف إلى منع الوصول غير المصرح به، والتجسس، وانقطاع الخدمة (مثل هجمات DDoS). 🌐 أمن السيبرانية (Cybersecurity): --------------------------------- - مجال أوسع يشمل حماية جميع الأنظمة الرقمية: الشبكات، الأجهزة، البرمجيات، والبيانات. - يشمل التهديدات مثل: الفيروسات، التصيد الاحتيالي (Phishing)، البرمجيات الخبيثة (Malware)، والهندسة الاجتماعية. - يعتمد على سياسات الأمان، إدارة الهوية، التصحيح المنتظم، والوعي الأمني للمستخدمين. - يتضمن معايير مثل: ISO 27001، NIST، وضوابط الحماية المتعددة الطبقات (Defense in Depth). 🛡️ أهمية الأمان: - حماية البيانات الحساسة (مثل المالية، الشخصية، الحكومية). - ضمان استمرارية العمل (Business Continuity). - الامتثال للقوانين والأنظمة (مثل GDPR، NCA في السعودية). 💡 أمثلة على تدابير الأمان: - التحقق بخطوتين (2FA) - التحديثات الدورية للأنظمة - النسخ الاحتياطي (Backup) - التدريب على الوعي الأمني """ # مربع نصوص قابل للتمرير text_area = scrolledtext.ScrolledText( frame, wrap=tk.WORD, font=("Arial", 12), bg="#f9f9f9", fg="#333333", insertbackground="black" ) text_area.insert(tk.END, info_text) text_area.config(state="disabled") # لجعل النص للقراءة فقط text_area.pack(fill="both", expand=True) # زر للإغلاق exit_button = tk.Button( root, text="إغلاق", font=("Arial", 12), bg="#d9534f", fg="white", command=root.quit ) exit_button.pack(pady=10) # تشغيل الحلقة الرئيسية root.mainloop() - Follow Up Deployment
- 388 Bytes initial commit