paceaux

/**
 * property order
 */
html{
background: #f06;
background: linear-gradient(45deg, #f06, yellow);
min-height: 100%;
}
p {
background: rgba(100,100,100,.2);

paceaux

      supportsVh = function () {
        var detector = document.createElement('div'),
            winHeight = parseInt(window.innerHeight / 10, 10),
            testHeight;

        detector.style.height = '10vh'; // set an arbitrarily chosen height
        document.getElementsByTagName('body')[0].appendChild(detector); // add the element
        testHeight = parseInt(window.getComputedStyle(detector, null).height, 10); //get the computed style of the element

        document.getElementsByTagName('body')[0].removeChild(detector); // now remove the element

paceaux

                        <select class="fieldset__field__select " id="js-state" name="state" title="Select your state"  >
                    <option>State</option>
                    <option value="AL">AL</option>
                    <option value="AK">AK</option>
                    <option value="AZ">AZ</option>
                    <option value="AR">AR</option>
                    <option value="CA">CA</option>
                    <option value="CO">CO</option>
                    <option value="CT">CT</option>
                    <option value="DE">DE</option>

paceaux

[class*="flex"]
    display:flex
    &[class*="col"]
      flex-direction: column;

    &[class*="row"] 
      flex-direction: row;

    for prop in space-between space-around center flex-start flex-end        
        &[class*=\"justify--{prop}\"]

paceaux

var uiFrame = function (viewName) {
    var frameIndex = 0, tridionView;
    while (windowFrame = window.top.frames[frameIndex++])
    {
        if ( (tridionView = windowFrame.$display && windowFrame.$display.getView() ) && tridionView.getId() === viewName)
        {
            return tridionView;
        }
    }
    console.log(tridionView);

paceaux

DOMTokenList.prototype.removeByPartial = function (className) {
  for (var i = 0; i< this.length; i++) {
    if (this[i].indexOf(className) !== -1) {
      this.remove(this[i]);
    }
  }
};

paceaux

/**
 * Flexboxing lists
 */

ul{
	display:flex;
	flex-direction: column;
	margin: 0;
	padding: 0;
	height: 100vh;

paceaux

var AnguillaMediator = function() {
    this._getAnguillaFrame = function() {
        if (navHappy.isNavigating) {
            return window.top.frames[1];

        } else {
            return window.top;
        }
    };
    this.aFrame = this._getAnguillaFrame();

paceaux

String.prototype.replaceAt = function () {
    var rlen = arguments[2] == null ? 1 : arguments[2];
    return this.substring(0, arguments[0]) + arguments[1] + this.substring(arguments[0] + rlen);
};
var currentItem = SDL.Client.UI.ApplicationHost.ViewModels.Navigation.currentNavigationItem();
var navHappy = {
    init: function () {
        this.newSrc = this.getNewSrc();
    },
    getCurrentItem: function () {

paceaux

//wrap it all in an anonymous function 
//This keeps our code safe from other JavaScript,and we don't polute the global namespace
(function() {
    //create the encapsulating variable
    var taForm;

    //add a namespacing function so that we can inject modules to it
    taForm = {
        namespace: function(ns_string) {
            var parts = ns_string.split('.'),