Phil Wolstenholme philwolstenholme

`Details` and `summary` elements in Drupal 8

Issue where idea was developed - https://www.drupal.org/node/1168246
Issue where we are trying to look for an alternative polyfill - https://www.drupal.org/node/1839158

	@media (orientation: landscape) {
	// 1.77 represents the 16/9 aspect ratio.
	// 95vh / 1.77 gives us the max height our video can be to guarantee
	// its width won't be too large to fit on some awkward viewport dimensions.
	// 95vh / 1.77 = 53.672316384, and 53.672316384 * 1.77 = 95.
	// This is <100, so this stops our video ever being too wide to fit on the screen.
	width: calc((95vh / 1.77) * 1.77);
	height: calc(95vh / 1.77);
	}

	<?php

	/**
	* Implements hook_views_post_render().
	*/
	function MODULE_NAME_views_post_render($view) {
	if ($view->id() !== 'VIEW_ID' && $view->getDisplay()->getPluginId() !== 'page') {
	return;
	}

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=Edge">
	<title>Countdown</title>
	<meta name="author" content="">
	<meta name="description" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<script src="//code.jquery.com/jquery.js"></script>

	/*
	Credit to https://github.com/bsuresh, I'm just saving this as a gist for my own reference
	*/

	/* Content to extend beyond the boundaries of our container and span
	to full width of viewport */
	.u-breakout {
	margin-left: calc(-50vw + 50%);
	margin-right: calc(-50vw + 50%);
	clear: both;

	<div class="container">
	<div class="box">Kinda works</div>
	</div>
	<div class="container">
	<div class="box">Shame the gutter is applied with padding rather than a margin though</div>
	</div>