File size: 2,667 Bytes
727a40a | 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 | <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>User Profile - Chat App</title>
<link rel="stylesheet" href="./css/color.css">
<link rel="stylesheet" href="./css/base.css">
<link rel="stylesheet" href="./css/profile.css">
<script src="./js/base.js" defer></script>
<script src="./js/profile.js" defer></script>
</head>
<body>
<div class="main_box">
<div class="profile_box">
<div class="header">
<button onclick="goBack()">
<img src="./img/icon/icons8-left-arrow-60.png" alt="Back">
</button>
<h1>Profile</h1>
<div class="menu">
<button onclick="toggleMenu()">
<img src="./img/icon/icons8-menu-vertical-50.png" alt="Menu">
</button>
<div class="dropdown-content" id="dropdown">
<a href="/edit-profile">Edit Profile</a>
<a href="/settings">Settings</a>
<a href="/logout">Logout</a>
<a href="#" class="dark-mode-toggle">Light Mode</a>
</div>
</div>
</div>
<!-- Profile Section -->
<div class="profile-container">
<img class="profile-image" src="./img/avatar/icons8-user-male-120.png" alt="Profile Image">
<div class="username">john_doe123</div>
<div class="user-status">
<span class="status-online">Online</span>
</div>
<div class="bio">
"Hey there! I'm John, a chat enthusiast. Always online and ready to chat!"
</div>
<!-- Profile Stats Section -->
<div class="profile-stats">
<div>
<strong>120</strong><br> Friends
</div>
<!-- <div>
<strong>50</strong><br> Messages
</div> -->
<div>
<strong>25</strong><br> Groups
</div>
</div>
<div class="user-details">
<p><span>Name:</span> John Doe</p>
<p><span>Email:</span> john.doe@example.com</p>
<p><span>Phone:</span> +123 456 7890</p>
<p><span>Location:</span> San Francisco, USA</p>
</div>
</div>
</div>
</div>
</body>
</html> |