ember-learn / guidemaker-ember-template

Guidemaker template for Ember Guides websites
https://guidemaker-ember-template.netlify.app/release
MIT License
5 stars 21 forks source link

chore: add some spacing between article and footer #161

Closed IgnaceMaes closed 1 year ago

IgnaceMaes commented 1 year ago

Tiny PR to add some spacing between the article and the footer, and increase margin of pagination wrapper.

Before After
image image
netlify[bot] commented 1 year ago

Deploy Preview for guidemaker-ember-template ready!

Name Link
Latest commit 2e659993fa8329c95df9e354f7fd7a1d8ce053ce
Latest deploy log https://app.netlify.com/sites/guidemaker-ember-template/deploys/64cbe48b35200a00085e796b
Deploy Preview https://deploy-preview-161--guidemaker-ember-template.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

IgnaceMaes commented 1 year ago

Seems like that large margin on mobile is actually a sideeffect of the "On this page" section. It's hidden on mobile, but as the element is still in the DOM it shows the grid gap.

image

I've made some changes to reduce the margins as they were before on mobile. But solving the actual issue above is probably something to be tackled separately?

EDIT: The fix was actually quite straight forward: moved the display: none to the root element in the grid so it doesn't trigger the gap.