Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Design: Reduce community head stat box size #447

Open
sevonj opened this issue Sep 17, 2024 · 8 comments
Open

Design: Reduce community head stat box size #447

sevonj opened this issue Sep 17, 2024 · 8 comments

Comments

@sevonj
Copy link
Contributor

sevonj commented Sep 17, 2024

Is your feature request related to a problem? Please describe.
So, 360px width is just a tiny bit too little to make the stats fit in a 2x2 grid. In 368px they do.

Describe the solution you'd like
Reduce margin or size or something to make 2 stat blocks fit horizontally on a 360px wide screen.

Describe alternatives you've considered
-

Additional context

368px 360px
image image
@sevonj sevonj changed the title Design: Reduce community head stat box Design: Reduce community head stat box size Sep 17, 2024
@jansteffen
Copy link

I think that this whole box is honestly unnescessary and even on desktop it takes up too much space:
image

That's literally half the page height, even on a 1440p monitor. Just to present some info that's already being presented in the sidebar. Sure, it looks fancy with the blur effect, but in terms of navigation and useability I honestly think it's a regression.

@sevonj
Copy link
Contributor Author

sevonj commented Sep 23, 2024

but in terms of navigation and useability I honestly think it's a regression.

I disagree, I think the the header is a better place to show the info than the sidebar, which is inaccessible on narrow screens.

Some vertical compacting on desktop too would help though.

@Xyphyn
Copy link
Owner

Xyphyn commented Sep 23, 2024

This info has to be accessible somewhere but I don't know where I'd put it on mobile

@jansteffen
Copy link

My suggestion would be to make in an expandable that is collapsed by default. When collapsed it only shows the banner image, community logo and name.

@BrikoX
Copy link

BrikoX commented Oct 1, 2024

Adding community description below the name takes up valuable space for no reason and Markdown parsing from links to lists being rendered breaks the visual flow.

Full banner size, with description takes up more than half the page on 1080p desktop. It literally leaves enough space to see a single post.
image

Reduced banner size, with no description still takes up 1/3 of the page on 1080p desktop. At least you can see 3 posts now.
image


This info has to be accessible somewhere but I don't know where I'd put it on mobile

@Xyphyn since iOS finally added proper gesture support on PWA, you make the sidebar accessible that way. It's also already what most mobile user are used to.

@Xyphyn
Copy link
Owner

Xyphyn commented Oct 1, 2024

The gestures conflict with Android though. I'll work on the header later today, im really stressed with hwk.

@sevonj
Copy link
Contributor Author

sevonj commented Oct 1, 2024

image
I think closing this gap by reducing height would definitely help. It should be an easy change, except what is with mask-image affecting the other content too?

image
Maybe subscribe and actions buttons could be somehow relocated to the free space in the banner which would eliminate one row. This seems like annoying to get right on all devices though, it would have to wrap below on portrait mobile.

@Xyphyn
Copy link
Owner

Xyphyn commented Oct 1, 2024

Your cropped screenshot just gave me an idea for a more compact design hold up

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants