Revert "Issue #2793849 by tedbow, drpal, alexpott, tim.plunkett, phenaproxima,...

Revert "Issue #2793849 by tedbow, drpal, alexpott, tim.plunkett, phenaproxima, Wim Leers: Handle offcanvas differently at lower widths"

This reverts commit 268163c4.

core/modules/outside_in/css/outside_in.module.css

@@ -22,14 +22,3 @@
   pointer-events: inherit;
 }
 
-/* Force the tray to be 100% width at the same breakpoint the dialog system uses to expand dialog widths. */
-@media all and (max-width: 48em) { /* 768px */
-  .ui-dialog.ui-dialog-offcanvas {
-    width: 100% !important;
-  }
-  /* When tray is at 100% width stop the body from scrolling */
-  .js-tray-open {
-    height: 100%;
-    overflow-y: hidden;
-  }
-}

core/modules/outside_in/js/offcanvas.js

@@ -11,10 +11,6 @@
 
   'use strict';
 
-  // The minimum width to use body displace needs to match the width at which the tray will be %100 width.
-  // @see outside_in.module.css
-  var minDisplaceWidth = 768;
-
   /**
    * The edge of the screen that the dialog should appear on.
    *
@@ -85,9 +81,6 @@
    *   The event triggered.
    */
   function bodyPadding(event) {
-    if ($('body').outerWidth() < minDisplaceWidth) {
-      return;
-    }
     var $element = event.data.$element;
     var $widget = $element.dialog('widget');
 
@@ -109,7 +102,6 @@
         $element
           .on('dialogresize.offcanvas', eventData, debounce(bodyPadding, 100))
           .on('dialogContentResize.offcanvas', eventData, handleDialogResize)
-          .on('dialogContentResize.offcanvas', eventData, debounce(bodyPadding, 100))
           .trigger('dialogresize.offcanvas');
 
         $element.dialog('widget').attr('data-offset-' + edge, '');
@@ -121,7 +113,6 @@
     },
     'dialog:beforecreate': function (event, dialog, $element, settings) {
       if ($element.is('#drupal-offcanvas')) {
-        $('body').addClass('js-tray-open');
         // @see http://api.jqueryui.com/position/
         settings.position = {
           my: 'left top',
@@ -136,7 +127,6 @@
     },
     'dialog:beforeclose': function (event, dialog, $element) {
       if ($element.is('#drupal-offcanvas')) {
-        $('body').removeClass('js-tray-open');
         $(document).off('.offcanvas');
         $(window).off('.offcanvas');
         $mainCanvasWrapper.css('padding-' + edge, 0);

core/modules/outside_in/tests/src/FunctionalJavascript/OffCanvasTest.php

@@ -69,38 +69,4 @@ public function testOffCanvasLinks() {
     }
   }
 
-  /**
-   * Tests the body displacement behaves differently at a narrow width.
-   */
-  public function testNarrowWidth() {
-    $themes = ['stark', 'bartik'];
-    $narrow_width_breakpoint = 768;
-    $offset = 20;
-    $height = 800;
-    $page = $this->getSession()->getPage();
-    $web_assert = $this->assertSession();
-
-    // Test the same functionality on multiple themes.
-    foreach ($themes as $theme) {
-      $this->enableTheme($theme);
-      // Testing at the wider width.
-      $this->getSession()->resizeWindow($narrow_width_breakpoint + $offset, $height);
-      $this->drupalGet('/offcanvas-test-links');
-      $this->assertFalse($page->find('css', '#main-canvas-wrapper')->hasAttribute('style'), 'Body not padded on wide page load.');
-      $page->clickLink("Click Me 1!");
-      $this->waitForOffCanvasToOpen();
-      // Check that the main canvas is padded when page is not narrow width and
-      // tray is open.
-      $web_assert->elementAttributeContains('css', '#main-canvas-wrapper', 'style', 'padding-right');
-
-      // Testing at the narrower width.
-      $this->getSession()->resizeWindow($narrow_width_breakpoint - $offset, $height);
-      $this->drupalGet('/offcanvas-test-links');
-      $this->assertFalse($page->find('css', '#main-canvas-wrapper')->hasAttribute('style'), 'Body not padded on narrow page load.');
-      $page->clickLink("Click Me 1!");
-      $this->waitForOffCanvasToOpen();
-      $this->assertFalse($page->find('css', '#main-canvas-wrapper')->hasAttribute('style'), 'Body not padded on narrow page with tray open.');
-    }
-  }
-
 }