-
Notifications
You must be signed in to change notification settings - Fork 0
/
blocked.html
210 lines (196 loc) · 13.7 KB
/
blocked.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="2G9">
<link href="./output.css" rel="stylesheet">
<title>Block List</title>
<link rel="icon" type="image/png" href="./images/logo.png">
<!-- Icons -->
<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>
<!-- Fonts -->
<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=Noto+Kufi+Arabic:[email protected]&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<script src="./js/script.js"></script>
</head>
<style>
body {
font-family: "Noto Kufi Arabic", sans-serif;
}
</style>
<body >
<!-- Start Navbar -->
<div id="navbar"></div>
<!-- End Navbar -->
<!-- Start Section -->
<div class="container mx-auto flex gap-10">
<div class="flex gap-10 mt-10 lg:mr-44">
<!-- Sidebar -->
<div class="md:block hidden left-0 top-0 h-full">
<div class="flex gap-5">
<div class="relative">
<img src="./images/Shape.webp" class="w-[61.7px] h-[61.7px] border-2 border-[#C10D10] p-1 rounded-full" alt="profile">
<img src="./images/check.svg" class="absolute left-0 top-[55%]" alt="check">
</div>
<div>
<h2 class="font-medium text-2xl text-[#2B2F4E]">أسماء مصطفي</h2>
<p class="font-medium text-[16px[#858585]#85858[16px]">010112131415</p>
<a href="./verification.html" class="font-normal text-[14px] text-[#C10D10]">توثيق الحساب</a>
<p class="hidden font-normal text-[14px] text-[#48D556]">حساب موثق</p>
</div>
</div>
<div>
<a href="./editProfile.html" class="flex gap-2 items-center p-3">
<img src="./images/setting.svg" alt="Setting">
<p class="font-medium text-[16px] text-[#2B2F4E]">تعديل حسابي</p>
</a>
<hr class="mr-3">
<a href="./userAds.html" class="flex gap-2 items-center p-3">
<img src="./images/IconAdd.svg" alt="Adds">
<p class="font-medium text-[16px] text-[#2B2F4E] ">باقة إعلاناتك</p>
</a>
<hr class="mr-3">
<a href="" class="flex gap-2 items-center p-3">
<img src="./images/phone.svg" alt="Phone">
<p class="font-medium text-[16px] text-[#2B2F4E] ">تواصل معنا</p>
</a>
<hr class="mr-3">
<a href="./blocked.html" class="flex gap-2 items-center p-3">
<img src="./images/block.svg" alt="block">
<p class="font-medium text-[16px] text-[#C10D10]">المحظورين</p>
</a>
<hr class="border-[#C10D10] mr-3">
<a href="" class="flex gap-2 items-center p-3">
<img src="./images/logOut.svg" alt="log out">
<p class="font-medium text-[16px] text-[#2B2F4E] ">تسجيل الخروج</p>
</a>
<hr class="mr-3">
<a href="#" class="flex gap-2 items-center p-3" onclick="showPopup(); event.preventDefault();">
<img src="./images/deleteAcc.svg" alt="delete account">
<p class="font-medium text-[16px] text-[#2B2F4E]"> حذف الحساب <span class="text-[#C10D10]">( تفقد كل بياناتك! )</span></p>
</a>
</div>
</div>
<!-- Main Content -->
<div class=" flex flex-col gap-5 ">
<h1 class="text-4xl text-[#C10D10] font-bold">المحظورين </h1>
<!-- <div class="space-y-4">
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/Shape.webp" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">وليد السوطي</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/Shape.webp" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">علي السوطي</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/image.png" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">فيتشر كاز</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/Shape.webp" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">إبراهيم السوطي</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/Shape.webp" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">السوطي عبدالعال</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
<div class="flex items-center justify-between bg-white pb-2">
<div class="flex items-center gap-3">
<img class="w-12 h-12 rounded-full border-2 border-[#C10D10]" src="./images/Shape.webp" alt="User Photo">
<div>
<h3 class="font-semibold text-lg">علي السوطي</h3>
<p class="text-[#858585] text-[16px]">010112131415</p>
</div>
</div>
<button class="text-red-600 border border-red-600 py-1 px-4 rounded-md font-medium">إلغاء الحظر</button>
</div>
</div> -->
<div class="flex flex-col items-center gap-10 mt-5">
<img src="./images/blockedList.webp" alt="Block">
<h1 class="font-medium text-2xl">لا يوجد محظورين</h1>
</div>
</div>
</div>
</div>
<!-- End Section -->
<!-- Start Icons -->
<div id="icons"></div>
<!-- End Icons -->
<!-- Start Footer -->
<div id="footer" class="md:block hidden"></div>
<!-- End Footer -->
<!-- Warning POP UP -->
<div id="popup2" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
<div class="bg-white rounded-lg shadow-lg w-[367px] max-w-md h-[630px] p-2 relative">
<!-- Close button -->
<button onclick="hidePopup()" class="absolute top-2 right-2 text-[#C10D10] hover:text-red-600 focus:outline-none">
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg>
</button>
<div class="flex justify-center">
<img src="./images/warningImage.svg" alt="Warning" class="w-[140px] h-[140px]">
</div>
<h2 class="text-center text-[#C10D10] text-[28px] font-medium">انتبه</h2>
<p class="text-[#2B2F4E] font-medium text-[16px] mb-4">هل انت متاكد من حذف حسابك نهائي !!</p>
<span class="text-[#FC0000] text-center leading-relaxed">
سوف تفقد بياناتك بشكل نهائي من خلال حذف حسابك أن
</span>
<span class="text-[14px] font-normal text-[#2B2F4E]">
يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى، حيث يمكنك أن تولد مثل هذا النص هذا النص هو مثال لنص يمكن أن يستبدل في نفس المساحة، لقد تم توليد هذا النص من مولد النص العربى
</span>
<div class="flex justify-between mt-2">
<button class="bg-[#C10D10] text-white px-6 py-2 w-[155px] h-[58px] rounded-2xl">
لا
</button>
<button class="bg-white text-[#C10D10] border border-[#C10D10] px-6 py-2 w-[155px] h-[58px] rounded-2xl">
حذف الحساب
</button>
</div>
</div>
</div>
<script>
function showPopup() {
document.getElementById("popup2").classList.remove("hidden");
}
function hidePopup() {
document.getElementById("popup2").classList.add("hidden");
}
</script>
</body>
</html>