scratchfoundation / scratch-www

Standalone web client for Scratch
https://scratch.mit.edu
BSD 3-Clause "New" or "Revised" License
1.59k stars 839 forks source link

Responsive clean up: Footer #2321

Open kaaaaathy opened 5 years ago

kaaaaathy commented 5 years ago

Related: https://github.com/LLK/scratch-www/issues/2320

It would be great to consider how the footer info might wrap/stack so that you can still see all the links on a mobile device.

Right now, it starts to break around 690px.

responsive

towerofnix commented 5 years ago

Note that there being no horizontal padding at low widths sort of looks, well, unprofessional; especially when there is obviously more than enough space between the two columns of links, some of which could be sacrificed for horizontal padding.

kaaaaathy commented 5 years ago

Proposed Changes

Here's an audit of our existing styles & breakpoints. Some of them are looking OK as is (1200px, 730px), and most of the others should be restyled.

From 480px onwards, we can wrap the list blocks so that there is only one column. Font size and line height also increases so it's easier to click on touchscreens.

Note that these breakpoints are approx, might be different in the CSS.


1200

890

730

480 alt

320