Skip to content

Commit

Permalink
Delete Accunt popup
Browse files Browse the repository at this point in the history
  • Loading branch information
asmaamostafa74 committed Oct 2, 2024
1 parent 91e2170 commit d40389a
Show file tree
Hide file tree
Showing 5 changed files with 131 additions and 68 deletions.
41 changes: 24 additions & 17 deletions blocked.html
Original file line number Diff line number Diff line change
Expand Up @@ -71,9 +71,9 @@ <h2 class="font-medium text-2xl text-[#2B2F4E]">أسماء مصطفي</h2>
<p class="font-medium text-[16px] text-[#2B2F4E] ">تسجيل الخروج</p>
</a>
<hr class="mr-3">
<a href="" class="flex gap-2 items-center p-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>
<p class="font-medium text-[16px] text-[#2B2F4E]"> حذف الحساب <span class="text-[#C10D10]">( تفقد كل بياناتك! )</span></p>
</a>
</div>
</div>
Expand Down Expand Up @@ -166,18 +166,25 @@ <h1 class="font-medium text-2xl">لا يوجد محظورين</h1>
<!-- End Footer -->

<!-- Warning POP UP -->
<div id="popup" 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-[700px] p-2">
<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>
<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">
Expand All @@ -187,17 +194,17 @@ <h2 class="text-center text-[#C10D10] text-[28px] font-medium">انتبه</h2>
حذف الحساب
</button>
</div>
</div>
</div>

<script>
function showPopup() {
document.getElementById("popup").classList.remove("hidden");
}

function hidePopup() {
document.getElementById("popup").classList.add("hidden");
}
</script>
</div>

<script>
function showPopup() {
document.getElementById("popup2").classList.remove("hidden");
}

function hidePopup() {
document.getElementById("popup2").classList.add("hidden");
}
</script>
</body>
</html>
6 changes: 3 additions & 3 deletions details.html
Original file line number Diff line number Diff line change
Expand Up @@ -46,13 +46,13 @@
<swiper-container class="mySwiper"
thumbs-swiper=".mySwiper2" space-between="10" navigation="true">
<swiper-slide class="flex justify-center pr-12 pl-12">
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px]" />
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px] object-cover" />
</swiper-slide>
<swiper-slide class="flex justify-center pr-12 pl-12">
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px]" />
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px] object-cover" />
</swiper-slide>
<swiper-slide class="flex justify-center pr-12 pl-12">
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px]" />
<img src="./images/photo.png" class="w-[828px] sm:h-[620px] h-[200px] rounded-[10px] object-cover" />
</swiper-slide>
</swiper-container>

Expand Down
51 changes: 29 additions & 22 deletions editProfile.html
Original file line number Diff line number Diff line change
Expand Up @@ -128,37 +128,44 @@ <h1 class="text-2xl font-bold">⚙️ تعديل حسابي</h1>
<!-- End Footer -->

<!-- Warning POP UP -->
<div id="popup" 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-[700px] p-2">
<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">
حذف الحساب
<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>

<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("popup").classList.remove("hidden");
document.getElementById("popup2").classList.remove("hidden");
}

function hidePopup() {
document.getElementById("popup").classList.add("hidden");
document.getElementById("popup2").classList.add("hidden");
}
</script>

Expand Down
46 changes: 44 additions & 2 deletions profile.html
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,9 @@ <h2 class="font-medium text-2xl text-[#2B2F4E]">أسماء مصطفي</h2>
<p class="font-medium text-[16px] text-[#2B2F4E] ">تسجيل الخروج</p>
</a>
<hr class="mr-3">
<a href="" class="flex gap-2 items-center p-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>
<p class="font-medium text-[16px] text-[#2B2F4E]"> حذف الحساب <span class="text-[#C10D10]">( تفقد كل بياناتك! )</span></p>
</a>
</div>
</div>
Expand All @@ -91,5 +91,47 @@ <h2 class="font-medium text-2xl text-[#2B2F4E]">أسماء مصطفي</h2>
<!-- 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>
Loading

0 comments on commit d40389a

Please sign in to comment.