Skip to content

Commit

Permalink
done
Browse files Browse the repository at this point in the history
  • Loading branch information
@Subhajit-2023-44
Subhajit-2023-44 committed Nov 8, 2024
1 parent 3bfa9f9 commit c4969ec
Show file tree
Hide file tree
Showing 4 changed files with 454 additions and 57 deletions.
30 changes: 26 additions & 4 deletions templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -384,12 +384,34 @@ <h2>Buy Stock</h2>


<div class="side-icons">
<!-- Profile Icon -->


<!-- Profile Icon -->

<a href="./profile.html" class="profile-link" style="display: flex; align-items: center; text-decoration: none;">
<img src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Icon" style="width: 50px; height: 50px; border-radius: 50%; margin-top: -17px;">
</a>
<a href="./profile.html" class="profile-link" style="display: flex; align-items: center; text-decoration: none;">
<img id="homeProfileImage" src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg"
alt="Profile Icon"
style="width: 50px; height: 50px; border-radius: 50%; margin-top: -17px;">
</a>
</li>

<script>

document.addEventListener("DOMContentLoaded", function() {
// Retrieve the saved avatar from localStorage
const savedAvatar = localStorage.getItem("selectedAvatar");

// If an avatar is saved, update the profile image
if (savedAvatar) {
const homeProfileImage = document.getElementById("homeProfileImage");
if (homeProfileImage) {
homeProfileImage.src = savedAvatar;
}
}
});

</script>


<style>
/* Override the existing hover styles */
Expand Down
81 changes: 56 additions & 25 deletions templates/profile.html
View file
Original file line number Diff line number Diff line change
@@ -1,97 +1,128 @@

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
<link rel="stylesheet" href="testp.css"> <!-- Link to your CSS file -->

<script src="testp.js" defer></script>

<title>Profile Page</title>

</head>

<body>

<div class="profile-container">

<div class="content-section">
<h2>Your Profile</h2>
<h2>Your Profile</h2>
<a href="index.html">
<i class="fas fa-home"></i>
</a>
<div class="profile-card">
<div class="profile-header">
<img src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Image" class="profile-image">
<!-- Profile image will be set dynamically -->
<img id="profileImage" src="https://i.postimg.cc/NFFmtc9K/xnz-Mst5-V-400x400.jpg" alt="Profile Image" class="profile-image">

<div class="profile-info">
<h3 class="profile-name">Skylar Reed</h3>
<p class="profile-email">Email: [email protected]</p>
<p class="profile-phone">Phone: +987 654 3210</p>
<p class="profile-bio">Joined: October 31, 2024</p>
<p class="profile-bio">About Me: Hello!🙋🏻‍♂️ Feel free to reach out to me at [email protected] 😎</p>
<p id="last-active">Last active: 31/10/2024, 11:12 PM</p>

<!-- Profile info will be set dynamically -->
<h3 id="profileName" class="profile-name">Skylar Reed</h3>
<p id="profileEmail" class="profile-email">Email: [email protected]</p>
<p id="profilePhone" class="profile-phone">Phone: +987 654 3210</p>
<p id="profileBio" class="profile-bio">About Me: Hello!🙋🏻‍♂️ Feel free to reach out to me at [email protected] 😎</p>
<p id="aboutMe" class="profile-bio">Joined: October 31, 2024</p>
<p id="last-active" class="profile-bio">Last active: </p>
</div>

</div>
<a href="profileedit.html">
<button class="edit-profile-btn edit_profiled">Edit Profile</button>
</a>
</div>
</div>

<!-- Account Details and other sections remain the same -->
<div class="content-section">

<h2>Account Details</h2>
<div class="profile-details">
<div class="profile-detail-card" id="profileCard">
<h3>Address</h3>
<p id="addressText" contenteditable="false">789 Pine Lane, Austin, TX 73301</p>
<a href="#"><button class="edit-profile-btn">Edit</button></a>
<h3>Friends List</h3>
<p id="addressText" contenteditable="false">27 friends online</p>
<a href="#"><button class="edit-profile-btn">View</button></a>
</div>

<div class="profile-detail-card">
<h3>Change Password</h3>
<p>*********63</p>
<button class="edit-profile-btn">Change</button></a>
<p>*****63</p>
<button class="edit-profile-btn">Change</button>
</div>

<div class="profile-detail-card">
<h3>Privacy Settings</h3>
<p>Visibility Status: Public</p>
<a href="#">
<button class="edit-profile-btn">Edit</button></a>
<button class="edit-profile-btn">Edit</button>
</a>
</div>

<div class="profile-detail-card">
<h3>Recent Activity</h3>
<p>Updated profile information</p>
<a href="#">
<button class="edit-profile-btn">View</button></a>
<button class="edit-profile-btn">View</button>
</a>
</div>

</div>

</div>

<section class="content-section">

<h2>Notifications</h2>
<div class="card">
<p>Your profile has been updated successfully!</p>

<button class="edit-profile-btn">View Notification</button>
</div>
<div class="card">
<p>Joshef Roy has sent you a friend request. Accept or decline?</p>

<button class="edit-profile-btn">View Notification</button>
</div>

</section>

</div>

<script>

document.addEventListener("DOMContentLoaded", function() {
// Load saved profile information from localStorage
const savedName = localStorage.getItem("profileName");
const savedEmail = localStorage.getItem("profileEmail");
const savedPhone = localStorage.getItem("profilePhone");
const savedBio = localStorage.getItem("profileBio");
const savedAvatar = localStorage.getItem("selectedAvatar");

// Update profile information if it exists in localStorage
if (savedName) {
document.getElementById("profileName").textContent = savedName;
}
if (savedEmail) {
document.getElementById("profileEmail").textContent = `Email: ${savedEmail}`;
}
if (savedPhone) {
document.getElementById("profilePhone").textContent = `Phone: ${savedPhone}`;
}
if (savedBio) {
document.getElementById("profileBio").textContent = `About Me: ${savedBio}`;
}

if (savedAvatar) {
document.getElementById("profileImage").src = savedAvatar;
}
});
</script>


</body>

</html>
Loading

0 comments on commit c4969ec

Please sign in to comment.