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

This reverts commit 268163c4cd.
8.3.x
xjm 2017-01-16 17:13:56 -06:00
parent 268163c4cd
commit 68e01df0a1
3 changed files with 0 additions and 55 deletions

View File

@ -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;
}
}

View File

@ -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);

View File

@ -69,38 +69,4 @@ class OffCanvasTest extends OutsideInJavascriptTestBase {
}
}
/**
* 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.');
}
}
}