changed followers tab to 24 per page (#1855)

* changed followers tab to 24 per page

* Update followers.js

fixed noFollowers message not spanning
This commit is contained in:
t1enne 2022-04-22 22:03:06 +02:00 committed by GitHub
parent 7935bcf5f3
commit 635e872be3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 4 deletions

View file

@ -24,7 +24,7 @@ export default class FollowerList extends Component {
async getFollowers() { async getFollowers() {
const { currentPage } = this.state; const { currentPage } = this.state;
const limit = 16; const limit = 24;
const offset = currentPage * limit; const offset = currentPage * limit;
const u = `${URL_FOLLOWERS}?offset=${offset}&limit=${limit}`; const u = `${URL_FOLLOWERS}?offset=${offset}&limit=${limit}`;
const response = await fetch(u); const response = await fetch(u);
@ -47,7 +47,7 @@ export default class FollowerList extends Component {
return null; return null;
} }
const noFollowersInfo = html`<div> const noFollowersInfo = html`<div class="col-span-4">
<p class="mb-5 text-2xl">Be the first to follow this live stream.</p> <p class="mb-5 text-2xl">Be the first to follow this live stream.</p>
<p class="text-md"> <p class="text-md">
By following this stream you'll get updates when it goes live, receive By following this stream you'll get updates when it goes live, receive
@ -81,7 +81,7 @@ export default class FollowerList extends Component {
return html` return html`
<div> <div>
<div class="flex flex-wrap"> <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">
${followers.length === 0 && noFollowersInfo} ${followers.length === 0 && noFollowersInfo}
${followers.map((follower) => { ${followers.map((follower) => {
return html` <${SingleFollower} user=${follower} /> `; return html` <${SingleFollower} user=${follower} /> `;

View file

@ -558,7 +558,7 @@ header {
} }
.following-list-follower { .following-list-follower {
width: 280px; width: auto;
} }
#follow-loading-spinner-container { #follow-loading-spinner-container {