Responsive components - Githubissues

btzr-io / jelly-beats

A decentralized music and podcasts streaming platform

GNU General Public License v3.0

72 stars 32 forks source link

Responsive components #194

Open btzr-io opened 5 years ago

btzr-io commented 5 years ago

The current design don't works on all the screens.

Make any current component or layout responsive.
One pull request peer component.
Tidy up css or remove unnecessary selectors.
Add a preview screenshot or a gif that shows the responsive behavior on the pull request. (Recommended but isn't necessary)

toddmagnusson commented 5 years ago

Hi Baltazar,

Do you have any design concepts on what you'd like the mobile, tablet or desktop to eventually look like?

Does the sidebar flip to vertical top or bottom after say 640px?
Was the abandonment of the image element in favor of background-image mostly to avoid the square sizing issue (I believe that can be fixed with aspect-ratio padding and use of object-fit/object-position)

btzr-io commented 5 years ago

@toddmagnusson Hi, no I don't have any designs yet.

This is a desktop application so I don't think the layout needs to change.

Does the sidebar flip to vertical top or bottom after say 640px?

No, we already have a vertical-top component, if the window width gets really small we can just show the icons of the buttons, but as I said this is a desktop app so we can set a limit for the window width.

Was the abandonment of the image element in favor of background-image mostly to avoid the square sizing issue

Yes, we can't ensure that all images will have a square dimensions so I think the background-image solution is the mos optimal thing to do.

micaelsbno commented 5 years ago

I've done some work on the card component and tried to make a pull request but getting this weird error message:

'Pull request creation failed. Validation failed: A pull request already exists for micaelsbno:master.'

Any ideas?

toddmagnusson commented 5 years ago

I'll take this issue, starting with the card component.

btzr-io commented 5 years ago

@micaelsbno Hi, I don't know it was probably a bug on the github side, anyway looks like is working now :+1:

btzr-io commented 5 years ago

@micaelsbno https://blog.github.com/2018-10-21-october21-incident-report/

btzr-io commented 5 years ago

@toddmagnusson There was a recent pull request merged for the card component, make sure to check it out, it probably needs more improvements so feel free to open a pull request, happy hacktober fest :tada: