-
Notifications
You must be signed in to change notification settings - Fork 0
/
profile.html
152 lines (144 loc) · 9.25 KB
/
profile.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
<!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>Your Profile</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 class="min-h-screen flex flex-col">
<!-- Start Navbar -->
<div id="navbar"></div>
<!-- End Navbar -->
<!-- Start Section -->
<div class="container mx-auto">
<div class="flex items-center gap-10 mt-10 sm:mr-20 mr-5 ">
<!-- Sidebar -->
<div class="left-0 top-0 h-full">
<div class="flex gap-5 p-3">
<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] text-[#858585]">+966 54 131 0701</p>
<a href="/verification.html">
<p class="font-normal text-[14px] text-[#C10D10] cursor-pointer">توثيق الحساب</p>
</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" class="w-6 h-6">
<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" class="w-6 h-6">
<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" class="w-6 h-6">
<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" class="w-6 h-6">
<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" class="w-6 h-6">
<p class="font-medium text-[16px] text-[#2B2F4E] ">Privacy Policy</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" class="w-6 h-6">
<p class="font-medium text-[16px] text-[#2B2F4E] ">Terms</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" class="w-6 h-6">
<p class="font-medium text-[16px] text-[#2B2F4E] ">About us</p>
</a>
<hr class="mr-3">
<a href="" class="flex gap-2 items-center p-3">
<img src="./images/logOut.svg" alt="log out" class="w-6 h-6">
<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" class="w-6 h-6">
<p class="font-medium text-[16px] text-[#2B2F4E]"> حذف الحساب <span class="text-[#C10D10]">( تفقد كل بياناتك! )</span></p>
</a>
</div>
</div>
</div>
</div>
<!-- End Section -->
<!-- Start Icon -->
<div id="icons" class="mt-auto p-4">
</div>
<!-- End Icon -->
<!-- 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>