Commit e5d63d3e authored by Mike Herchel's avatar Mike Herchel Committed by Lauri Timmanee
Browse files

fix: #3531516 Admin toolbar height is not 100% since upgrading to Drupal 11.2 

By: f0ns
By: pierregermain
By: sandip
By: neptune-dc
By: catch
By: godotislate
By: finnsky
By: svendecabooter
By: benjifisher
By: grimreaper
By: rkoller
By: mherchel
By: nod_
(cherry picked from commit b5c2558a)
parent 1b8f8193

core/misc/dialog/off-canvas/css/wrapper.css

+21 −0
Original line number Diff line number Diff line
@@ -22,6 +22,27 @@ 
  border-inline-start: solid var(--off-canvas-wrapper-border-width) var(--off-canvas-wrapper-border-color);

  box-shadow: var(--off-canvas-wrapper-box-shadow);



  /*

   * When the off-canvas appears at the top or bottom of the page (Workspaces

   * does this), it should not obscure the Navigation module's toolbar.

   *

   * Note that we have to use `!important` below to override the dialog JS's

   * inline CSS.

   *

   * @todo

   * We *may* able to remove this code once the https://www.drupal.org/i/3096017

   * is fixed.

   */

  [data-admin-toolbar] &:is([data-offset-top], [data-offset-bottom]) {

    left: var(--drupal-displace-offset-left, 0) !important;

    width: calc(100% - var(--drupal-displace-offset-left, 0px)) !important;



    &:dir(rtl) {

      right: var(--drupal-displace-offset-right, 0) !important;

      width: calc(100% - var(--drupal-displace-offset-right, 0px)) !important;

    }

  }



  /*

   * Force the off-canvas dialog to be 100% width at the same breakpoint the

   * dialog system uses to expand dialog widths.

core/misc/dialog/off-canvas/css/wrapper.pcss.css

+21 −0
Original line number Diff line number Diff line
@@ -16,6 +16,27 @@ 
  border-inline-start: solid var(--off-canvas-wrapper-border-width) var(--off-canvas-wrapper-border-color);

  box-shadow: var(--off-canvas-wrapper-box-shadow);



  /*

   * When the off-canvas appears at the top or bottom of the page (Workspaces

   * does this), it should not obscure the Navigation module's toolbar.

   *

   * Note that we have to use `!important` below to override the dialog JS's

   * inline CSS.

   *

   * @todo

   * We *may* able to remove this code once the https://www.drupal.org/i/3096017

   * is fixed.

   */

  [data-admin-toolbar] &:is([data-offset-top], [data-offset-bottom]) {

    left: var(--drupal-displace-offset-left, 0) !important;

    width: calc(100% - var(--drupal-displace-offset-left, 0px)) !important;



    &:dir(rtl) {

      right: var(--drupal-displace-offset-right, 0) !important;

      width: calc(100% - var(--drupal-displace-offset-right, 0px)) !important;

    }

  }



  /*

   * Force the off-canvas dialog to be 100% width at the same breakpoint the

   * dialog system uses to expand dialog widths.

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

+0 −1
Original line number Diff line number Diff line
@@ -98,7 +98,6 @@ body { 
    }



    @media (min-width: 64rem) {

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

      transform: none;

      inset-block-start: 0;

    }

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

+0 −1
Original line number Diff line number Diff line
@@ -98,7 +98,6 @@ body { 
    }



    @media (--admin-toolbar-desktop) {

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

      transform: none;

      inset-block-start: 0;

    }