Landing page displays improperly on 768p screen (#933) · Issues · funkwhale / funkwhale

Landing page displays improperly on 768p screen

What?

The 4 columns in the landing page are so narrow on a 768p screen, the UI elements overlap each other.

What is expected?

Something that looks a little nicer than that.

Suggested fix

Change the @media query for the 2-column layout to be larger.

Funkwhale version(s) affected: 0.20

<!--
Hi there! You are reporting a bug on this project, and we want to thank you!

If it's the first time you post here, please take a moment to read our Code of Conduct
(https://funkwhale.audio/code-of-conduct/) and ensure your issue respect our guidelines.

To ensure your bug report is as useful as possible, please try to stick
to the following structure. You can leave the parts text between `<!- ->`
markers untouched, they won't be displayed in your final message.

Please do not edit the following line, it's used for automatic classification
-->

## What?

<!--
Describe the steps to reproduce the issue, like:

1. Visit the page at /artists/
2. Type that
3. Submit
-->
The 4 columns in the landing page are so narrow on a 768p screen, the UI elements overlap each other.

![Demonstration image](https://matrix.org/_matrix/media/r0/download/matrix.org/cDRhYEaCJaHlrAVIHOmzZhmW)

## What is expected?

Something that looks a little nicer than that.

## Suggested fix
Change the @media query for the 2-column layout to be larger.

**Funkwhale version(s) affected**: 0.20

<!--
If relevant, share additional context here like:

- Browser type and version (for front-end bugs)
- Instance configuration (Docker/non-docker, nginx/apache as proxy, etc.)
- Error messages, screenshots and logs
-->

Edited Oct 04, 2019 by parnikkapore

Discussion
Designs

The one place for your designs

To enable design management, you'll need to meet the requirements. If you need help, reach out to our support team for assistance.