perladvent / perldotcom

The source code for Perl.com website
https://www.perl.com
77 stars 80 forks source link

Adjust page margins #289

Closed jesusbagpuss closed 3 years ago

jesusbagpuss commented 3 years ago

Media widths below 768px result in no padding on the #content section.entry-content div.container element. The 9.5px value is also the padding applied to <pre> elements, which seems reasonable.

An absolute value between 5px and 15px may be appropriate, or 0.5 to 2%?

The footer content has a left margin defined as 20px, which may be too much for the article content itself.

NB I believe #243 is not iOS specific - I witness the same in Chrome on Android.

briandfoy commented 3 years ago

Thanks. I'll try to deal with this next week.

jesusbagpuss commented 3 years ago

Thanks. I may have some time to take a look at some of the 'good first issue' / 'community help wanted' issues over the next month or so - if there's anything specific that you'd like me to take a look at, let me know!

briandfoy commented 3 years ago

Anything marked with the "UI" label is something I'd rather someone else do :)

briandfoy commented 3 years ago

I've made a new branch briandfoy/243-margins for this, merged your commits, and deployed the site. It should update soon.

After that, we can check the result on various browsers to see if we like it.

briandfoy commented 3 years ago

This is live right now, and it looks good on Safari/iOS 14 and the latest versions of Chrome and Safari on my macOS machine, as well as the latest Firefox on Ubuntu. Remember to clear caches, etc (or use a new private window) to dump previous layouts.

THUMB UP if When you look at this when the screen area is small (phone or narrow window), there is a sliver of a margin on the left and the right.

THUMB DOWN if You see the text right up on left edge of the screen with no margin. Also, tell us which browser/platform you are using.