Hero with is-fullheight-with-navbar combined with is-spaced navbar

[robbertkl]

A hero with is-fullheight-with-navbar only accounts for a normal fixed navbar, not for a is-spaced navbar.

I've managed to work around it by adding this to my scss:

.is-fullheight-with-spaced-navbar {
  @extend .is-fullheight-with-navbar;
}
@media screen and (min-width: 1024px) {
  .hero.is-fullheight-with-spaced-navbar {
    min-height: calc(100vh - 5.25rem);
  }
}

Perhaps a class like this could be incorporated into bulma?

[maduhaime]

This is my take on the same problem, with the use of scss and variables.

/* 
Hack for missing modifier for fullheight hero with spaced navbar.
By default, .is-spaced has no effect on Navbar padding.  Only from $tablet.
*/
.hero {
  &.is-fullheight-with-spaced-navbar {
    @extend .is-fullheight-with-navbar;

    @include from($tablet) {
      min-height: calc(100vh - ( #{$navbar-height} + ( 2 * #{$navbar-padding-vertical} ) ) );
  }
}

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.