Unverified Commit 2c9ac655 authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3277809 by baddysonja, mherchel: Use Drupal.displace()'s new CSS... 

Issue #3277809 by baddysonja, mherchel: Use Drupal.displace()'s new CSS variables to place Olivero's fixed header
parent 04c1b7fd

core/themes/olivero/css/components/site-header.css

+1 −14
Original line number Diff line number Diff line
@@ -66,22 +66,9 @@ 
    body:not(.is-always-mobile-nav) .site-header__fixable.is-fixed {

      position: fixed;

      z-index: 102; /* Appear above body content that is position: relative */

      top: calc(var(--sp4)*-1);

      top: calc(var(--drupal-displace-offset-top, 0px) - var(--sp4));

      max-width: var(--max-bg-color);

    }

  body:not(.is-always-mobile-nav) {



    /* Toolbar is fixed, and tray is either vertical or closed and horizontal. */

  }

      body:not(.is-always-mobile-nav).toolbar-vertical.toolbar-fixed .site-header__fixable.is-fixed, body:not(.is-always-mobile-nav).toolbar-horizontal.toolbar-fixed .site-header__fixable.is-fixed {

        top: calc(var(--toolbar-height) - var(--sp4));

      }

  body:not(.is-always-mobile-nav) {

    /* Toolbar is fixed, and tray is open and horizontal. */

  }

    body:not(.is-always-mobile-nav).toolbar-horizontal.toolbar-fixed.toolbar-tray-open .site-header__fixable.is-fixed {

      top: calc(var(--toolbar-tray-height) + var(--toolbar-height) - var(--sp4));

    }

}



.site-header__inner {

core/themes/olivero/css/components/site-header.pcss.css

+1 −13
Original line number Diff line number Diff line
@@ -48,21 +48,9 @@ 
    & .site-header__fixable.is-fixed {

      position: fixed;

      z-index: 102; /* Appear above body content that is position: relative */

      inset-block-start: calc(-1 * var(--sp4));

      inset-block-start: calc(var(--drupal-displace-offset-top, 0px) - var(--sp4));

      max-width: var(--max-bg-color);

    }



    /* Toolbar is fixed, and tray is either vertical or closed and horizontal. */

    &.toolbar-vertical.toolbar-fixed,

    &.toolbar-horizontal.toolbar-fixed {

      & .site-header__fixable.is-fixed {

        inset-block-start: calc(var(--toolbar-height) - var(--sp4));

      }

    }

    /* Toolbar is fixed, and tray is open and horizontal. */

    &.toolbar-horizontal.toolbar-fixed.toolbar-tray-open .site-header__fixable.is-fixed {

      inset-block-start: calc(var(--toolbar-tray-height) + var(--toolbar-height) - var(--sp4));

    }

  }

}