css for code blocks

//html code for blocks

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</div>

</div>

</li>

</ul>

</div>

//css code for blocks

.au-card {

display: block;

width: 100%;

border-radius: 4px;

border: 1px solid red;

font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

position: relative;

background: #fff;

overflow: hidden

}

.au-card.au-card--shadow {

border-radius: 4px;

box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3)

}

.au-card.au-card--shadow:hover {

box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3)

}

.au-card.au-card--clickable:focus-within {

outline: 3px solid #9263DE;

outline-offset: 2px

}

.au-card.au-card--clickable .au-card--clickable__link:after {

content: '';

position: absolute;

top: 0;

right: 0;

bottom: 0;

left: 0

}

.au-card.au-card--clickable .au-card--clickable__link:focus {

outline: none

}

.lt-ie9 .au-card.au-card--clickable .au-card--clickable__link:focus {

outline: 3px solid #9263DE;

outline-offset: 2px

}

.au-card *+.au-card__divider,

.au-card *+.au-card__body,

.au-card *+.au-card__footer {

margin-top: 16px;

margin-top: 1rem

}

.au-card .au-card__divider {

border: #d3d3d3 0.5px solid;

margin-bottom: 0

}

.au-card .au-card__title {

margin: 0 0 16px 0;

margin: 0 0 1rem 0

}

.au-card .au-card__header {

font-weight: bold;

margin: 0;

border-bottom: solid 1px #d3d3d3;

border-top-left-radius: 3px;

border-top-right-radius: 3px;

padding: 16px;

padding: 1rem

}

.au-card .au-card__footer {

padding: 16px;

padding: 1rem;

margin: 0;

border-top: solid 1px #d3d3d3;

border-bottom-left-radius: 3px;

border-bottom-right-radius: 3px

}

.au-card .au-card__inner {

padding: 16px;

padding: 1rem

}

.lt-ie9 .au-card {

border: solid 1px gray

}

.au-card.au-card--centred,

.au-card .au-card--centred {

text-align: center

}

a.au-card {

color: #313131;

cursor: pointer;

text-decoration: none

}

a.au-card .au-card__title {

color: #00698f;

text-decoration: underline;

text-decoration-skip-ink: auto

}

a.au-card:hover .au-card__title {

text-decoration: none;

color: #313131

}

a.au-card:focus {

outline: 3px solid #9263DE;

outline-offset: 2px

}

a.au-card.au-card--shadow:focus {

border-radius: 0

}

a.au-card.au-card--shadow:hover {

box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3)

}

.au-card-list {

list-style: none;

padding: 0

}

.au-card-list:before,

.au-card-list:after {

content: " ";

display: table

}

.au-card-list:after {

clear: both

}

.au-card-list:before {

display: none

}

.au-card-list li {

list-style: none;

padding: 0;

margin-top: 24px;

margin-top: 1.5rem

}

.au-card-list.au-card-list--matchheight {

display: flex;

flex-wrap: wrap

}

.au-card-list.au-card-list--matchheight li {

/* display: flex */

}

.au-card-list.au-card-list--matchheight .au-card {

display: block;

height: 100%; /* <- This has been added. */

/* flex-direction: column */

}

/*! @gov.au/grid-12 v2.1.0 */.au-grid .container{box-sizing:border-box}@media (min-width: 768px){.au-grid .container{width:744px}}@media (min-width: 992px){.au-grid .container{width:968px}}@media (min-width: 1200px){.au-grid .container{width:1176px}}.au-grid .container,.au-grid .container-fluid{box-sizing:border-box;margin-right:auto;margin-left:auto;padding-left:12px;padding-right:12px}.au-grid .container:before,.au-grid .container:after,.au-grid .container-fluid:before,.au-grid .container-fluid:after{content:" ";display:table}.au-grid .container:after,.au-grid .container-fluid:after{clear:both}.au-grid .row{margin-left:-12px;margin-right:-12px}.au-grid .row:before,.au-grid .row:after{content:" ";display:table}.au-grid .row:after{clear:both}.au-grid .col-xs-1,.au-grid .col-sm-1,.au-grid .col-md-1,.au-grid .col-lg-1,.au-grid .col-xs-2,.au-grid .col-sm-2,.au-grid .col-md-2,.au-grid .col-lg-2,.au-grid .col-xs-3,.au-grid .col-sm-3,.au-grid .col-md-3,.au-grid .col-lg-3,.au-grid .col-xs-4,.au-grid .col-sm-4,.au-grid .col-md-4,.au-grid .col-lg-4,.au-grid .col-xs-5,.au-grid .col-sm-5,.au-grid .col-md-5,.au-grid .col-lg-5,.au-grid .col-xs-6,.au-grid .col-sm-6,.au-grid .col-md-6,.au-grid .col-lg-6,.au-grid .col-xs-7,.au-grid .col-sm-7,.au-grid .col-md-7,.au-grid .col-lg-7,.au-grid .col-xs-8,.au-grid .col-sm-8,.au-grid .col-md-8,.au-grid .col-lg-8,.au-grid .col-xs-9,.au-grid .col-sm-9,.au-grid .col-md-9,.au-grid .col-lg-9,.au-grid .col-xs-10,.au-grid .col-sm-10,.au-grid .col-md-10,.au-grid .col-lg-10,.au-grid .col-xs-11,.au-grid .col-sm-11,.au-grid .col-md-11,.au-grid .col-lg-11,.au-grid .col-xs-12,.au-grid .col-sm-12,.au-grid .col-md-12,.au-grid .col-lg-12{box-sizing:border-box;position:relative;min-height:1px;padding-left:12px;padding-right:12px}.au-grid .col-xs-1,.au-grid .col-xs-2,.au-grid .col-xs-3,.au-grid .col-xs-4,.au-grid .col-xs-5,.au-grid .col-xs-6,.au-grid .col-xs-7,.au-grid .col-xs-8,.au-grid .col-xs-9,.au-grid .col-xs-10,.au-grid .col-xs-11,.au-grid .col-xs-12{float:left}.au-grid .col-xs-1{width:8.33333%}.au-grid .col-xs-2{width:16.66667%}.au-grid .col-xs-3{width:25%}.au-grid .col-xs-4{width:33.33333%}.au-grid .col-xs-5{width:41.66667%}.au-grid .col-xs-6{width:50%}.au-grid .col-xs-7{width:58.33333%}.au-grid .col-xs-8{width:66.66667%}.au-grid .col-xs-9{width:75%}.au-grid .col-xs-10{width:83.33333%}.au-grid .col-xs-11{width:91.66667%}.au-grid .col-xs-12{width:100%}.au-grid .col-xs-pull-0{right:auto}.au-grid .col-xs-pull-1{right:8.33333%}.au-grid .col-xs-pull-2{right:16.66667%}.au-grid .col-xs-pull-3{right:25%}.au-grid .col-xs-pull-4{right:33.33333%}.au-grid .col-xs-pull-5{right:41.66667%}.au-grid .col-xs-pull-6{right:50%}.au-grid .col-xs-pull-7{right:58.33333%}.au-grid .col-xs-pull-8{right:66.66667%}.au-grid .col-xs-pull-9{right:75%}.au-grid .col-xs-pull-10{right:83.33333%}.au-grid .col-xs-pull-11{right:91.66667%}.au-grid .col-xs-pull-12{right:100%}.au-grid .col-xs-push-0{left:auto}.au-grid .col-xs-push-1{left:8.33333%}.au-grid .col-xs-push-2{left:16.66667%}.au-grid .col-xs-push-3{left:25%}.au-grid .col-xs-push-4{left:33.33333%}.au-grid .col-xs-push-5{left:41.66667%}.au-grid .col-xs-push-6{left:50%}.au-grid .col-xs-push-7{left:58.33333%}.au-grid .col-xs-push-8{left:66.66667%}.au-grid .col-xs-push-9{left:75%}.au-grid .col-xs-push-10{left:83.33333%}.au-grid .col-xs-push-11{left:91.66667%}.au-grid .col-xs-push-12{left:100%}.au-grid .col-xs-offset-0{margin-left:0%}.au-grid .col-xs-offset-1{margin-left:8.33333%}.au-grid .col-xs-offset-2{margin-left:16.66667%}.au-grid .col-xs-offset-3{margin-left:25%}.au-grid .col-xs-offset-4{margin-left:33.33333%}.au-grid .col-xs-offset-5{margin-left:41.66667%}.au-grid .col-xs-offset-6{margin-left:50%}.au-grid .col-xs-offset-7{margin-left:58.33333%}.au-grid .col-xs-offset-8{margin-left:66.66667%}.au-grid .col-xs-offset-9{margin-left:75%}.au-grid .col-xs-offset-10{margin-left:83.33333%}.au-grid .col-xs-offset-11{margin-left:91.66667%}.au-grid .col-xs-offset-12{margin-left:100%}@media (min-width: 768px){.au-grid .col-sm-1,.au-grid .col-sm-2,.au-grid .col-sm-3,.au-grid .col-sm-4,.au-grid .col-sm-5,.au-grid .col-sm-6,.au-grid .col-sm-7,.au-grid .col-sm-8,.au-grid .col-sm-9,.au-grid .col-sm-10,.au-grid .col-sm-11,.au-grid .col-sm-12{float:left}.au-grid .col-sm-1{width:8.33333%}.au-grid .col-sm-2{width:16.66667%}.au-grid .col-sm-3{width:25%}.au-grid .col-sm-4{width:33.33333%}.au-grid .col-sm-5{width:41.66667%}.au-grid .col-sm-6{width:50%}.au-grid .col-sm-7{width:58.33333%}.au-grid .col-sm-8{width:66.66667%}.au-grid .col-sm-9{width:75%}.au-grid .col-sm-10{width:83.33333%}.au-grid .col-sm-11{width:91.66667%}.au-grid .col-sm-12{width:100%}.au-grid .col-sm-pull-0{right:auto}.au-grid .col-sm-pull-1{right:8.33333%}.au-grid .col-sm-pull-2{right:16.66667%}.au-grid .col-sm-pull-3{right:25%}.au-grid .col-sm-pull-4{right:33.33333%}.au-grid .col-sm-pull-5{right:41.66667%}.au-grid .col-sm-pull-6{right:50%}.au-grid .col-sm-pull-7{right:58.33333%}.au-grid .col-sm-pull-8{right:66.66667%}.au-grid .col-sm-pull-9{right:75%}.au-grid .col-sm-pull-10{right:83.33333%}.au-grid .col-sm-pull-11{right:91.66667%}.au-grid .col-sm-pull-12{right:100%}.au-grid .col-sm-push-0{left:auto}.au-grid .col-sm-push-1{left:8.33333%}.au-grid .col-sm-push-2{left:16.66667%}.au-grid .col-sm-push-3{left:25%}.au-grid .col-sm-push-4{left:33.33333%}.au-grid .col-sm-push-5{left:41.66667%}.au-grid .col-sm-push-6{left:50%}.au-grid .col-sm-push-7{left:58.33333%}.au-grid .col-sm-push-8{left:66.66667%}.au-grid .col-sm-push-9{left:75%}.au-grid .col-sm-push-10{left:83.33333%}.au-grid .col-sm-push-11{left:91.66667%}.au-grid .col-sm-push-12{left:100%}.au-grid .col-sm-offset-0{margin-left:0%}.au-grid .col-sm-offset-1{margin-left:8.33333%}.au-grid .col-sm-offset-2{margin-left:16.66667%}.au-grid .col-sm-offset-3{margin-left:25%}.au-grid .col-sm-offset-4{margin-left:33.33333%}.au-grid .col-sm-offset-5{margin-left:41.66667%}.au-grid .col-sm-offset-6{margin-left:50%}.au-grid .col-sm-offset-7{margin-left:58.33333%}.au-grid .col-sm-offset-8{margin-left:66.66667%}.au-grid .col-sm-offset-9{margin-left:75%}.au-grid .col-sm-offset-10{margin-left:83.33333%}.au-grid .col-sm-offset-11{margin-left:91.66667%}.au-grid .col-sm-offset-12{margin-left:100%}}@media (min-width: 992px){.au-grid .col-md-1,.au-grid .col-md-2,.au-grid .col-md-3,.au-grid .col-md-4,.au-grid .col-md-5,.au-grid .col-md-6,.au-grid .col-md-7,.au-grid .col-md-8,.au-grid .col-md-9,.au-grid .col-md-10,.au-grid .col-md-11,.au-grid .col-md-12{float:left}.au-grid .col-md-1{width:8.33333%}.au-grid .col-md-2{width:16.66667%}.au-grid .col-md-3{width:25%}.au-grid .col-md-4{width:33.33333%}.au-grid .col-md-5{width:41.66667%}.au-grid .col-md-6{width:50%}.au-grid .col-md-7{width:58.33333%}.au-grid .col-md-8{width:66.66667%}.au-grid .col-md-9{width:75%}.au-grid .col-md-10{width:83.33333%}.au-grid .col-md-11{width:91.66667%}.au-grid .col-md-12{width:100%}.au-grid .col-md-pull-0{right:auto}.au-grid .col-md-pull-1{right:8.33333%}.au-grid .col-md-pull-2{right:16.66667%}.au-grid .col-md-pull-3{right:25%}.au-grid .col-md-pull-4{right:33.33333%}.au-grid .col-md-pull-5{right:41.66667%}.au-grid .col-md-pull-6{right:50%}.au-grid .col-md-pull-7{right:58.33333%}.au-grid .col-md-pull-8{right:66.66667%}.au-grid .col-md-pull-9{right:75%}.au-grid .col-md-pull-10{right:83.33333%}.au-grid .col-md-pull-11{right:91.66667%}.au-grid .col-md-pull-12{right:100%}.au-grid .col-md-push-0{left:auto}.au-grid .col-md-push-1{left:8.33333%}.au-grid .col-md-push-2{left:16.66667%}.au-grid .col-md-push-3{left:25%}.au-grid .col-md-push-4{left:33.33333%}.au-grid .col-md-push-5{left:41.66667%}.au-grid .col-md-push-6{left:50%}.au-grid .col-md-push-7{left:58.33333%}.au-grid .col-md-push-8{left:66.66667%}.au-grid .col-md-push-9{left:75%}.au-grid .col-md-push-10{left:83.33333%}.au-grid .col-md-push-11{left:91.66667%}.au-grid .col-md-push-12{left:100%}.au-grid .col-md-offset-0{margin-left:0%}.au-grid .col-md-offset-1{margin-left:8.33333%}.au-grid .col-md-offset-2{margin-left:16.66667%}.au-grid .col-md-offset-3{margin-left:25%}.au-grid .col-md-offset-4{margin-left:33.33333%}.au-grid .col-md-offset-5{margin-left:41.66667%}.au-grid .col-md-offset-6{margin-left:50%}.au-grid .col-md-offset-7{margin-left:58.33333%}.au-grid .col-md-offset-8{margin-left:66.66667%}.au-grid .col-md-offset-9{margin-left:75%}.au-grid .col-md-offset-10{margin-left:83.33333%}.au-grid .col-md-offset-11{margin-left:91.66667%}.au-grid .col-md-offset-12{margin-left:100%}}@media (min-width: 1200px){.au-grid .col-lg-1,.au-grid .col-lg-2,.au-grid .col-lg-3,.au-grid .col-lg-4,.au-grid .col-lg-5,.au-grid .col-lg-6,.au-grid .col-lg-7,.au-grid .col-lg-8,.au-grid .col-lg-9,.au-grid .col-lg-10,.au-grid .col-lg-11,.au-grid .col-lg-12{float:left}.au-grid .col-lg-1{width:8.33333%}.au-grid .col-lg-2{width:16.66667%}.au-grid .col-lg-3{width:25%}.au-grid .col-lg-4{width:33.33333%}.au-grid .col-lg-5{width:41.66667%}.au-grid .col-lg-6{width:50%}.au-grid .col-lg-7{width:58.33333%}.au-grid .col-lg-8{width:66.66667%}.au-grid .col-lg-9{width:75%}.au-grid .col-lg-10{width:83.33333%}.au-grid .col-lg-11{width:91.66667%}.au-grid .col-lg-12{width:100%}.au-grid .col-lg-pull-0{right:auto}.au-grid .col-lg-pull-1{right:8.33333%}.au-grid .col-lg-pull-2{right:16.66667%}.au-grid .col-lg-pull-3{right:25%}.au-grid .col-lg-pull-4{right:33.33333%}.au-grid .col-lg-pull-5{right:41.66667%}.au-grid .col-lg-pull-6{right:50%}.au-grid .col-lg-pull-7{right:58.33333%}.au-grid .col-lg-pull-8{right:66.66667%}.au-grid .col-lg-pull-9{right:75%}.au-grid .col-lg-pull-10{right:83.33333%}.au-grid .col-lg-pull-11{right:91.66667%}.au-grid .col-lg-pull-12{right:100%}.au-grid .col-lg-push-0{left:auto}.au-grid .col-lg-push-1{left:8.33333%}.au-grid .col-lg-push-2{left:16.66667%}.au-grid .col-lg-push-3{left:25%}.au-grid .col-lg-push-4{left:33.33333%}.au-grid .col-lg-push-5{left:41.66667%}.au-grid .col-lg-push-6{left:50%}.au-grid .col-lg-push-7{left:58.33333%}.au-grid .col-lg-push-8{left:66.66667%}.au-grid .col-lg-push-9{left:75%}.au-grid .col-lg-push-10{left:83.33333%}.au-grid .col-lg-push-11{left:91.66667%}.au-grid .col-lg-push-12{left:100%}.au-grid .col-lg-offset-0{margin-left:0%}.au-grid .col-lg-offset-1{margin-left:8.33333%}.au-grid .col-lg-offset-2{margin-left:16.66667%}.au-grid .col-lg-offset-3{margin-left:25%}.au-grid .col-lg-offset-4{margin-left:33.33333%}.au-grid .col-lg-offset-5{margin-left:41.66667%}.au-grid .col-lg-offset-6{margin-left:50%}.au-grid .col-lg-offset-7{margin-left:58.33333%}.au-grid .col-lg-offset-8{margin-left:66.66667%}.au-grid .col-lg-offset-9{margin-left:75%}.au-grid .col-lg-offset-10{margin-left:83.33333%}.au-grid .col-lg-offset-11{margin-left:91.66667%}.au-grid .col-lg-offset-12{margin-left:100%}}

//Javascript code for blocks

;(function(window, document) {

/*jshint evil:true */

/** version */

var version = '3.7.3';

/** Preset options */

var options = window.html5 || {};

/** Used to skip problem elements */

/** Not all elements can be cloned in IE **/

var saveClones = /^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i;

/** Detect whether the browser supports default html5 styles */

var supportsHtml5Styles;

/** Name of the expando, to work with multiple documents or to re-shiv one document */

var expando = '_html5shiv';

/** The id for the the documents expando */

var expanID = 0;

/** Cached data for each document */

var expandoData = {};

/** Detect whether the browser supports unknown elements */

var supportsUnknownElements;

(function() {

try {

var a = document.createElement('a');

a.innerHTML = '<xyz></xyz>';

//if the hidden property is implemented we can assume, that the browser supports basic HTML5 Styles

supportsHtml5Styles = ('hidden' in a);

supportsUnknownElements = a.childNodes.length == 1 || (function() {

// assign a false positive if unable to shiv

(document.createElement)('a');

var frag = document.createDocumentFragment();

return (

typeof frag.cloneNode == 'undefined' ||

typeof frag.createDocumentFragment == 'undefined' ||

typeof frag.createElement == 'undefined'

);

}());

} catch(e) {

// assign a false positive if detection fails => unable to shiv

supportsHtml5Styles = true;

supportsUnknownElements = true;

}

}());

/*--------------------------------------------------------------------------*/

/**

* Creates a style sheet with the given CSS text and adds it to the document.

* @private

* @param {Document} ownerDocument The document.

* @param {String} cssText The CSS text.

* @returns {StyleSheet} The style element.

function addStyleSheet(ownerDocument, cssText) {

var p = ownerDocument.createElement('p'),

parent = ownerDocument.getElementsByTagName('head')[0] || ownerDocument.documentElement;

p.innerHTML = 'x<style>' + cssText + '</style>';

return parent.insertBefore(p.lastChild, parent.firstChild);

}

/**

* Returns the value of `html5.elements` as an array.

* @private

* @returns {Array} An array of shived element node names.

function getElements() {

var elements = html5.elements;

return typeof elements == 'string' ? elements.split(' ') : elements;

}

/**

* Extends the built-in list of html5 elements

* @memberOf html5

* @param {String|Array} newElements whitespace separated list or array of new element names to shiv

* @param {Document} ownerDocument The context document.

function addElements(newElements, ownerDocument) {

var elements = html5.elements;

if(typeof elements != 'string'){

elements = elements.join(' ');

}

if(typeof newElements != 'string'){

newElements = newElements.join(' ');

}

html5.elements = elements +' '+ newElements;

shivDocument(ownerDocument);

}

/**

* Returns the data associated to the given document

* @private

* @param {Document} ownerDocument The document.

* @returns {Object} An object of data.

function getExpandoData(ownerDocument) {

var data = expandoData[ownerDocument[expando]];

if (!data) {

data = {};

expanID++;

ownerDocument[expando] = expanID;

expandoData[expanID] = data;

}

return data;

}

/**

* returns a shived element for the given nodeName and document

* @memberOf html5

* @param {String} nodeName name of the element

* @param {Document|DocumentFragment} ownerDocument The context document.

* @returns {Object} The shived element.

function createElement(nodeName, ownerDocument, data){

if (!ownerDocument) {

ownerDocument = document;

}

if(supportsUnknownElements){

return ownerDocument.createElement(nodeName);

}

if (!data) {

data = getExpandoData(ownerDocument);

}

var node;

if (data.cache[nodeName]) {

node = data.cache[nodeName].cloneNode();

} else if (saveClones.test(nodeName)) {

node = (data.cache[nodeName] = data.createElem(nodeName)).cloneNode();

} else {

node = data.createElem(nodeName);

}

// Avoid adding some elements to fragments in IE < 9 because

// * Attributes like `name` or `type` cannot be set/changed once an element

// is inserted into a document/fragment

// * Link elements with `src` attributes that are inaccessible, as with

// a 403 response, will cause the tab/window to crash

// * Script elements appended to fragments will execute when their `src`

// or `text` property is set

return node.canHaveChildren && !reSkip.test(nodeName) && !node.tagUrn ? data.frag.appendChild(node) : node;

}

/**

* returns a shived DocumentFragment for the given document

* @memberOf html5

* @param {Document} ownerDocument The context document.

* @returns {Object} The shived DocumentFragment.

function createDocumentFragment(ownerDocument, data){

if (!ownerDocument) {

ownerDocument = document;

}

if(supportsUnknownElements){

return ownerDocument.createDocumentFragment();

}

data = data || getExpandoData(ownerDocument);

var clone = data.frag.cloneNode(),

i = 0,

elems = getElements(),

l = elems.length;

for(;i<l;i++){

clone.createElement(elems[i]);

}

return clone;

}

/**

* Shivs the `createElement` and `createDocumentFragment` methods of the document.

* @private

* @param {Document|DocumentFragment} ownerDocument The document.

* @param {Object} data of the document.

function shivMethods(ownerDocument, data) {

if (!data.cache) {

data.cache = {};

data.createElem = ownerDocument.createElement;

data.createFrag = ownerDocument.createDocumentFragment;

data.frag = data.createFrag();

}

ownerDocument.createElement = function(nodeName) {

//abort shiv

if (!html5.shivMethods) {

return data.createElem(nodeName);

}

return createElement(nodeName, ownerDocument, data);

};

ownerDocument.createDocumentFragment = Function('h,f', 'return function(){' +

'var n=f.cloneNode(),c=n.createElement;' +

'h.shivMethods&&(' +

// unroll the `createElement` calls

getElements().join().replace(/[\w\-:]+/g, function(nodeName) {

data.createElem(nodeName);

data.frag.createElement(nodeName);

return 'c("' + nodeName + '")';

}) +

');return n}'

)(html5, data.frag);

}

/*--------------------------------------------------------------------------*/

/**

* Shivs the given document.

* @memberOf html5

* @param {Document} ownerDocument The document to shiv.

* @returns {Document} The shived document.

function shivDocument(ownerDocument) {

if (!ownerDocument) {

ownerDocument = document;

}

var data = getExpandoData(ownerDocument);

if (html5.shivCSS && !supportsHtml5Styles && !data.hasCSS) {

data.hasCSS = !!addStyleSheet(ownerDocument,

// corrects block display not defined in IE6/7/8/9

'article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}' +

// adds styling not present in IE6/7/8/9

'mark{background:#FF0;color:#000}' +

// hides non-rendered elements

'template{display:none}'

);

}

if (!supportsUnknownElements) {

shivMethods(ownerDocument, data);

}

return ownerDocument;

}

/*--------------------------------------------------------------------------*/

/**

* The `html5` object is exposed so that more elements can be shived and

* existing shiving can be detected on iframes.

* @type Object

* @example

* // options can be changed before the script is included

* html5 = { 'elements': 'mark section', 'shivCSS': false, 'shivMethods': false };

var html5 = {

/**

* An array or space separated string of node names of the elements to shiv.

* @memberOf html5

* @type Array|String

'elements': options.elements || 'abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output picture progress section summary template time video',

/**

* current version of html5shiv

'version': version,

/**

* A flag to indicate that the HTML5 style sheet should be inserted.

* @memberOf html5

* @type Boolean

'shivCSS': (options.shivCSS !== false),

/**

* Is equal to true if a browser supports creating unknown/HTML5 elements

* @memberOf html5

* @type boolean

'supportsUnknownElements': supportsUnknownElements,

/**

* A flag to indicate that the document's `createElement` and `createDocumentFragment`

* methods should be overwritten.

* @memberOf html5

* @type Boolean

'shivMethods': (options.shivMethods !== false),

/**

* A string to describe the type of `html5` object ("default" or "default print").

* @memberOf html5

* @type String

'type': 'default',

// shivs the document according to the specified `html5` object options

'shivDocument': shivDocument,

//creates a shived element

createElement: createElement,

//creates a shived documentFragment

createDocumentFragment: createDocumentFragment,

//extends list of elements

addElements: addElements

};

/*--------------------------------------------------------------------------*/

// expose html5

window.html5 = html5;

// shiv the document

shivDocument(document);

if(typeof module == 'object' && module.exports){

module.exports = html5;

}

}(typeof window !== "undefined" ? window : this, document));

/* Respond.js: min/max-width media query polyfill. (c) Scott Jehl. MIT Lic. j.mp/respondjs */

(function( w ){

"use strict";

//exposed namespace

var respond = {};

w.respond = respond;

//define update even in native-mq-supporting browsers, to avoid errors

respond.update = function(){};

//define ajax obj

var requestQueue = [],

xmlHttp = (function() {

var xmlhttpmethod = false;

try {

xmlhttpmethod = new w.XMLHttpRequest();

}

catch( e ){

xmlhttpmethod = new w.ActiveXObject( "Microsoft.XMLHTTP" );

}

return function(){

return xmlhttpmethod;

};

})(),

//tweaked Ajax functions from Quirksmode

ajax = function( url, callback ) {

var req = xmlHttp();

if (!req){

return;

}

req.open( "GET", url, true );

req.onreadystatechange = function () {

if ( req.readyState !== 4 || req.status !== 200 && req.status !== 304 ){

return;

}

callback( req.responseText );

};

if ( req.readyState === 4 ){

return;

}

req.send( null );

isUnsupportedMediaQuery = function( query ) {

return query.replace( respond.regex.minmaxwh, '' ).match( respond.regex.other );

};

//expose for testing

respond.ajax = ajax;

respond.queue = requestQueue;

respond.unsupportedmq = isUnsupportedMediaQuery;

respond.regex = {

media: /@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,

keyframes: /@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,

comments: /\/\*[^*]*\*+([^/][^*]*\*+)*\//gi,

urls: /(url$)['"]?([^\/$'"][^:\)'"]+)['"]?(\))/g,

findStyles: /@media *([^\{]+)\{([\S\s]+?)$/,

only: /(only\s+)?([a-zA-Z]+)\s?/,

minw: /$\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*$/,

maxw: /$\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*$/,

minmaxwh: /$\s*m(in|ax)\-(height|width)\s*:\s*(\s*[0-9\.]+)(px|em)\s*$/gi,

other: /$[^$]*\)/g

};

//expose media query support flag for external use

respond.mediaQueriesSupported = w.matchMedia && w.matchMedia( "only all" ) !== null && w.matchMedia( "only all" ).matches;

//if media queries are supported, exit here

if( respond.mediaQueriesSupported ){

return;

}

//define vars

var doc = w.document,

docElem = doc.documentElement,

mediastyles = [],

rules = [],

appendedEls = [],

parsedSheets = {},

resizeThrottle = 30,

head = doc.getElementsByTagName( "head" )[0] || docElem,

base = doc.getElementsByTagName( "base" )[0],

links = head.getElementsByTagName( "link" ),

lastCall,

resizeDefer,

//cached container for 1em value, populated the first time it's needed

eminpx,

// returns the value of 1em in pixels

getEmValue = function() {

var ret,

div = doc.createElement('div'),

body = doc.body,

originalHTMLFontSize = docElem.style.fontSize,

originalBodyFontSize = body && body.style.fontSize,

fakeUsed = false;

div.style.cssText = "position:absolute;font-size:1em;width:1em";

if( !body ){

body = fakeUsed = doc.createElement( "body" );

body.style.background = "none";

}

// 1em in a media query is the value of the default font size of the browser

// reset docElem and body to ensure the correct value is returned

docElem.style.fontSize = "100%";

body.style.fontSize = "100%";

body.appendChild( div );

if( fakeUsed ){

docElem.insertBefore( body, docElem.firstChild );

}

ret = div.offsetWidth;

if( fakeUsed ){

docElem.removeChild( body );

}

else {

body.removeChild( div );

}

// restore the original values

docElem.style.fontSize = originalHTMLFontSize;

if( originalBodyFontSize ) {

body.style.fontSize = originalBodyFontSize;

}

//also update eminpx before returning

ret = eminpx = parseFloat(ret);

return ret;

//enable/disable styles

applyMedia = function( fromResize ){

var name = "clientWidth",

docElemProp = docElem[ name ],

currWidth = doc.compatMode === "CSS1Compat" && docElemProp || doc.body[ name ] || docElemProp,

styleBlocks = {},

lastLink = links[ links.length-1 ],

now = (new Date()).getTime();

//throttle resize calls

if( fromResize && lastCall && now - lastCall < resizeThrottle ){

w.clearTimeout( resizeDefer );

resizeDefer = w.setTimeout( applyMedia, resizeThrottle );

return;

}

else {

lastCall = now;

}

for( var i in mediastyles ){

if( mediastyles.hasOwnProperty( i ) ){

var thisstyle = mediastyles[ i ],

min = thisstyle.minw,

max = thisstyle.maxw,

minnull = min === null,

maxnull = max === null,

em = "em";

if( !!min ){

min = parseFloat( min ) * ( min.indexOf( em ) > -1 ? ( eminpx || getEmValue() ) : 1 );

}

if( !!max ){

max = parseFloat( max ) * ( max.indexOf( em ) > -1 ? ( eminpx || getEmValue() ) : 1 );

}

// if there's no media query at all (the () part), or min or max is not null, and if either is present, they're true

if( !thisstyle.hasquery || ( !minnull || !maxnull ) && ( minnull || currWidth >= min ) && ( maxnull || currWidth <= max ) ){

if( !styleBlocks[ thisstyle.media ] ){

styleBlocks[ thisstyle.media ] = [];

}

styleBlocks[ thisstyle.media ].push( rules[ thisstyle.rules ] );

}

//remove any existing respond style element(s)

for( var j in appendedEls ){

if( appendedEls.hasOwnProperty( j ) ){

if( appendedEls[ j ] && appendedEls[ j ].parentNode === head ){

head.removeChild( appendedEls[ j ] );

}

appendedEls.length = 0;

//inject active styles, grouped by media type

for( var k in styleBlocks ){

if( styleBlocks.hasOwnProperty( k ) ){

var ss = doc.createElement( "style" ),

css = styleBlocks[ k ].join( "\n" );

ss.type = "text/css";

ss.media = k;

//originally, ss was appended to a documentFragment and sheets were appended in bulk.

//this caused crashes in IE in a number of circumstances, such as when the HTML element had a bg image set, so appending beforehand seems best. Thanks to @dvelyk for the initial research on this one!

head.insertBefore( ss, lastLink.nextSibling );

if ( ss.styleSheet ){

ss.styleSheet.cssText = css;

}

else {

ss.appendChild( doc.createTextNode( css ) );

}

//push to appendedEls to track for later removal

appendedEls.push( ss );

}

//find media blocks in css text, convert to style blocks

translate = function( styles, href, media ){

var qs = styles.replace( respond.regex.comments, '' )

.replace( respond.regex.keyframes, '' )

.match( respond.regex.media ),

ql = qs && qs.length || 0;

//try to get CSS path

href = href.substring( 0, href.lastIndexOf( "/" ) );

var repUrls = function( css ){

return css.replace( respond.regex.urls, "$1" + href + "$2$3" );

useMedia = !ql && media;

//if path exists, tack on trailing slash

if( href.length ){ href += "/"; }

//if no internal queries exist, but media attr does, use that

//note: this currently lacks support for situations where a media attr is specified on a link AND

//its associated stylesheet has internal CSS media queries.

//In those cases, the media attribute will currently be ignored.

if( useMedia ){

ql = 1;

}

for( var i = 0; i < ql; i++ ){

var fullq, thisq, eachq, eql;

//media attr

if( useMedia ){

fullq = media;

rules.push( repUrls( styles ) );

}

//parse for styles

else{

fullq = qs[ i ].match( respond.regex.findStyles ) && RegExp.$1;

rules.push( RegExp.$2 && repUrls( RegExp.$2 ) );

}

eachq = fullq.split( "," );

eql = eachq.length;

for( var j = 0; j < eql; j++ ){

thisq = eachq[ j ];

if( isUnsupportedMediaQuery( thisq ) ) {

continue;

}

mediastyles.push( {

media : thisq.split( "(" )[ 0 ].match( respond.regex.only ) && RegExp.$2 || "all",

rules : rules.length - 1,

hasquery : thisq.indexOf("(") > -1,

minw : thisq.match( respond.regex.minw ) && parseFloat( RegExp.$1 ) + ( RegExp.$2 || "" ),

maxw : thisq.match( respond.regex.maxw ) && parseFloat( RegExp.$1 ) + ( RegExp.$2 || "" )

} );

}

applyMedia();

//recurse through request queue, get css text

makeRequests = function(){

if( requestQueue.length ){

var thisRequest = requestQueue.shift();

ajax( thisRequest.href, function( styles ){

translate( styles, thisRequest.href, thisRequest.media );

parsedSheets[ thisRequest.href ] = true;

// by wrapping recursive function call in setTimeout

// we prevent "Stack overflow" error in IE7

w.setTimeout(function(){ makeRequests(); },0);

} );

}

//loop stylesheets, send text content to translate

ripCSS = function(){

for( var i = 0; i < links.length; i++ ){

var sheet = links[ i ],

href = sheet.href,

media = sheet.media,

isCSS = sheet.rel && sheet.rel.toLowerCase() === "stylesheet";

//only links plz and prevent re-parsing

if( !!href && isCSS && !parsedSheets[ href ] ){

// selectivizr exposes css through the rawCssText expando

if (sheet.styleSheet && sheet.styleSheet.rawCssText) {

translate( sheet.styleSheet.rawCssText, href, media );

parsedSheets[ href ] = true;

} else {

if( (!/^([a-zA-Z:]*\/\/)/.test( href ) && !base) ||

href.replace( RegExp.$1, "" ).split( "/" )[0] === w.location.host ){

// IE7 doesn't handle urls that start with '//' for ajax request

// manually add in the protocol

if ( href.substring(0,2) === "//" ) { href = w.location.protocol + href; }

requestQueue.push( {

href: href,

media: media

} );

}

makeRequests();

};

//translate CSS

ripCSS();

//expose update for re-running respond later on

respond.update = ripCSS;

//expose getEmValue

respond.getEmValue = getEmValue;

//adjust on resize

function callMedia(){

applyMedia( true );

}

if( w.addEventListener ){

w.addEventListener( "resize", callMedia, false );

}

else if( w.attachEvent ){

w.attachEvent( "onresize", callMedia );

}

})(this);

Search This Blog

Source Code

Read in your Language

css for code blocks

css for code blocks

Comments

Post a Comment

Last 7 Days

How do I bold a < table > data in HTML?

what is the css code for transparent background

How to use < iframe > tag with referrerpolicy Attribute in HTML ? with example

How to use referrerpolicy Attribute value ( strict-origin-when-cross-origin ) with < iframe > tag in HTML ? with example