Verified Commit 6bdfd060 authored by Théodore Biadala's avatar Théodore Biadala
Browse files

Issue #3526266 by mherchel, finnsky, andy-blum: Navigation top bar should utilize Drupal.displace()

parent 3b308073

core/modules/navigation/css/components/admin-toolbar.css

+1 −1
Original line number Diff line number Diff line
@@ -94,7 +94,7 @@ body { 
  .admin-toolbar {

    block-size: calc(100vh - var(--drupal-displace-offset-top, 0px));

    transform: none;

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

    inset-block-start: 0;

  }

}

@media only screen and (max-height: 18.75rem) {

core/modules/navigation/css/components/admin-toolbar.pcss.css

+1 −1
Original line number Diff line number Diff line
@@ -95,7 +95,7 @@ body { 
  @media (--admin-toolbar-desktop) {

    block-size: calc(100vh - var(--drupal-displace-offset-top, 0px));

    transform: none;

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

    inset-block-start: 0;

  }



  @media only screen and (max-height: 300px) {

core/modules/navigation/css/components/top-bar.css

+1 −1
Original line number Diff line number Diff line
@@ -22,7 +22,7 @@ 
  .top-bar {

    block-size: var(--admin-toolbar-top-bar-height);

    position: fixed;

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

    inset-block-start: 0;

    inset-inline-start: 0;

    width: 100vw;

    padding-block: var(--admin-toolbar-space-12);

core/modules/navigation/css/components/top-bar.pcss.css

+1 −1
Original line number Diff line number Diff line
@@ -18,7 +18,7 @@ 
  @media (--admin-toolbar-desktop) {

    block-size: var(--admin-toolbar-top-bar-height);

    position: fixed;

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

    inset-block-start: 0;

    inset-inline-start: 0;

    width: 100vw;

    padding-block: var(--admin-toolbar-space-12);

core/modules/navigation/templates/top-bar.html.twig

+15 −13
Original line number Diff line number Diff line
@@ -13,7 +13,8 @@ 
 */

#}

{% set attributes = create_attribute() %}

<aside {{ attributes.addClass('top-bar').setAttribute('data-drupal-admin-styles', '').setAttribute('aria-labelledby', 'top-bar__title') }}>

{% if tools or context|render or actions|render %}

  <aside {{ attributes.addClass('top-bar').setAttribute('data-drupal-admin-styles', '').setAttribute('aria-labelledby', 'top-bar__title').setAttribute('data-offset-top', true) }}>

    <h3 id="top-bar__title" class="visually-hidden">{{ 'Administrative top bar'|t }}</h3>

    <div class="top-bar__content">

      <div class="top-bar__tools">
@@ -27,3 +28,4 @@ 
      </div>

    </div>

  </aside>

{% endif %}