Add friends list to profile

This commit is contained in:
Rogerio Chaves 2020-04-24 09:26:24 +02:00
parent ae27ee5445
commit 51ce88bf87
No known key found for this signature in database
GPG Key ID: E6AF5440509B1D94
3 changed files with 28 additions and 4 deletions

View File

@ -176,3 +176,23 @@ messages.forEach((message) => {
}); });
}); });
}); });
/**
* Tabs
*/
const tabButtons = document.querySelectorAll(".js-tab-button");
tabButtons.forEach((tab, index) => {
tab.addEventListener("click", () => {
const tabItems = document.querySelectorAll(".js-tab-item");
tabItems.forEach((item) => {
item.style.display = "none";
});
tabItems[index].style.display = "block";
tabButtons.forEach((tab) => {
tab.classList.remove("tab-selected");
});
tab.classList.add("tab-selected");
});
});

View File

@ -138,6 +138,7 @@ nav a.selected {
border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
margin-bottom: -1px; margin-bottom: -1px;
height: 32px; height: 32px;
padding: 0 20px;
} }
.tab-title.tab-selected { .tab-title.tab-selected {

View File

@ -7,7 +7,7 @@
<% if (friendshipStatus == "request_received") { %> <% if (friendshipStatus == "request_received") { %>
<p><%= profile.name %> sent you a friendship request</p> <p><%= profile.name %> sent you a friendship request</p>
<% } else if (true || friendshipStatus == "request_rejected") { %> <% } else if (friendshipStatus == "request_rejected") { %>
<p>You rejected <%= profile.name %> friendship request</p> <p>You rejected <%= profile.name %> friendship request</p>
<% } %> <% } %>
@ -23,15 +23,15 @@
</div> </div>
<div class="tabs" style="margin-top: 20px; padding: 0 10px;"> <div class="tabs" style="margin-top: 20px; padding: 0 10px;">
<button class="tab-title tab-selected"> <button class="tab-title tab-selected js-tab-button">
Wall Wall
</button> </button>
<button class="tab-title"> <button class="tab-title js-tab-button">
Friends Friends
</button> </button>
</div> </div>
<div class="tab-content"> <div class="tab-content">
<div class="tab-item"> <div class="tab-item js-tab-item">
<% if (posts.length > 0) { %> <% if (posts.length > 0) { %>
<form action="/publish" method="POST" style="padding: 0px 8px 5px 8px;"> <form action="/publish" method="POST" style="padding: 0px 8px 5px 8px;">
<textarea name="message" class="compose-post js-compose-post" placeholder="Write something to <%= profile.name %>..."></textarea> <textarea name="message" class="compose-post js-compose-post" placeholder="Write something to <%= profile.name %>..."></textarea>
@ -48,4 +48,7 @@
</div> </div>
<% } %> <% } %>
</div> </div>
<div class="tab-item js-tab-item" style="display: none; padding: 10px">
<%- include('_friends', { friends: friends.friends }) %>
</div>
</div> </div>