Add user page with profile picture, number and about. change font to Selawik.
This commit is contained in:
parent
0af3395ad7
commit
cce7b74068
12 changed files with 219 additions and 29 deletions
29
index.html
29
index.html
|
|
@ -16,10 +16,11 @@
|
|||
<body>
|
||||
<div class="app-container no-active-chat">
|
||||
<aside id="desktop-aside">
|
||||
<button id="profile-sidebar-btn" class="icon-btn mif-person mif-2x" data-page="profile-page"></button>
|
||||
<button id="chats-sidebar-btn" class="icon-btn mif-qa mif-2x" data-page="chat-page"></button>
|
||||
<button id="settings-sidebar-btn" class="icon-btn mif-cog mif-2x" data-page="settings-page"></button>
|
||||
</aside>
|
||||
|
||||
|
||||
<!-- Sidebar -->
|
||||
<aside class="sidebar">
|
||||
<header class="sidebar-header">
|
||||
|
|
@ -27,7 +28,7 @@
|
|||
<div class="user-profile">
|
||||
<!-- <div id="pandora-user-icon" class="avatar user-avatar">P</div> -->
|
||||
<div class="user-info">
|
||||
<h3 id="pandora-username">Pandora User</h3>
|
||||
<h3 id="pandora-username" data-content="app-user">Pandora User</h3>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
|
@ -54,13 +55,6 @@
|
|||
<!-- Chats will be dynamically injected here -->
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-footer">
|
||||
<div class="api-status-badge">
|
||||
<span class="pulse-dot"></span>
|
||||
<span id="backend-status-text">Backend connected</span>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div class="extra-page" id="chat-page">
|
||||
|
|
@ -119,6 +113,17 @@
|
|||
</main>
|
||||
</div>
|
||||
|
||||
<section class="extra-page" id="profile-page">
|
||||
<h2 data-content="app-user">Pandora User</h2>
|
||||
<div class="content">
|
||||
<img id="profile-page-picture" data-resource="app-user-image">
|
||||
<div id="profile-page-user-info">
|
||||
<p id="profile-page-user-number" data-content="app-user-number">Pandora User</p>
|
||||
<input id="profile-page-status-input" placeholder="enter your status" data-value="app-user-status">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="extra-page" id="settings-page">
|
||||
<div class="modal-content">
|
||||
<header class="modal-header">
|
||||
|
|
@ -152,6 +157,12 @@
|
|||
<footer class="modal-footer">
|
||||
<button class="btn primary-btn" id="save-settings">Save</button>
|
||||
</footer>
|
||||
<div class="sidebar-footer">
|
||||
<div class="api-status-badge">
|
||||
<span class="pulse-dot"></span>
|
||||
<span id="backend-status-text">Backend connected</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue