ELIXIR-Belgium / elixir-toolkit-theme

Flexible Jekyll theme using bootstrap 5 as CSS framework.
https://elixir-belgium.github.io/elixir-toolkit-theme/
MIT License
20 stars 16 forks source link

Remove extra white space with short content #145

Closed nsunami closed 1 year ago

nsunami commented 1 year ago

This PR removes the extra vertical white space when the content is short, by setting the body as a flex box with min-vh-100, then allowing the main content to grow.

Fixes #144

bedroesb commented 1 year ago

@nsunami thanks a lot for your idea! Let me try it out with our current deployments and get back to you!

nsunami commented 1 year ago

Of course!

For the context, this change resolves a bug that I had when embedding the page in an iframe and using the iframeResizer. The extra whitespace caused the iframe height to grow infinitely 😅

Hope this change won't introduce a bug to the codebase! 🤞

bedroesb commented 1 year ago

Looks good to me!

bedroesb commented 1 year ago

@nsunami I was curious and had a look at https://github.com/eur-nl/erim-rdmkit . I notice you introduce the sidebar include, but that is normally part of the theme, if you would use it out of the box and add these lines to the _custom_classes.scss file:

/*-----Sidebar-----*/

//RDM wheel in sidebar
.sidebar_rdm {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 992px) {
    .sidebar_rdm {
        width: 200px;
    }
}

li ul .sidebar_rdm_sub {
    border-color: $light;
    padding: 0.75rem 0.5rem 0.5rem 0.5rem;
    border-radius: 0px 0px $border-radius $border-radius;
    border-style: none solid solid solid;
    border-width: 0.2em;
    margin-top: -0.25rem;
}

It should work!

nsunami commented 1 year ago

@bedroesb Thanks for pointing this out!