mdBook icon indicating copy to clipboard operation
mdBook copied to clipboard

Add `padding-bottom: 50vh` for <main>

Open Ddystopia opened this issue 2 years ago • 1 comments

Hello, This PR introduces a simple tweak: adding extra padding to the bottom of the content area in mdBook.

Here's why it might be a good idea:

  • More Comfortable Reading: This change lets users scroll the text up to the center of their screen. It's often easier to read from the middle of the screen and can help reduce eye-strain during long reads.

  • Familiar Feel: This 'scroll-past-end' feature is common in popular code editors like VSCode and Atom. It might make mdBook feel a bit more like home for those folks.

This change doesn't break anything and can easily be overridden by custom stylesheets if needed.

Of course, we know changes like these can be a matter of personal preference. So, this PR is completely open for discussion. If you think it's not a great fit for the project, no worries at all if the PR gets closed.

Looking forward to hearing your thoughts!

Ddystopia avatar Jun 29 '23 11:06 Ddystopia

@rustbot label +A-style

Ddystopia avatar Jun 29 '23 11:06 Ddystopia

It seems like a good idea, but i think it's better to restore the previous printing style.

.content {
    ...
    padding: 0 5px 50vh 5px;
}

@media print {
    .content {
        padding: 0 5px 50px 5px;
    }
}

GiorgioReale avatar Jul 19 '23 12:07 GiorgioReale

It seems like a good idea, but i think it's better to restore the previous printing style.

.content {
    ...
    padding: 0 5px 50vh 5px;
}

@media print {
    .content {
        padding: 0 5px 50px 5px;
    }
}

in file src/theme/css/print.css there is a style

#content {
    max-width: none;
    margin: 0;
    padding: 0;
}

Id has more priority then class, so padding would already be zero.

Ddystopia avatar Jul 19 '23 17:07 Ddystopia

@Ddystopia 😅 Oops, sorry. I didn't see the ID #content, i only checked the class .content.

GiorgioReale avatar Jul 19 '23 19:07 GiorgioReale