FrankFonts

<ng-container *ngTemplateOutlet="navigation; context: {classes: 'desktop', label: 'desktop'}"></ng-container>

<ng-container *ngTemplateOutlet="navigation; context: {classes: 'mobile', label: 'mobile'}"></ng-container>

<ng-template #navigation let-classes="classes" let-label="label">
    <div [ngClass]="classes">
        {{ label }}
    </div>
</ng-template>

FrankFonts

"use strict";

window.addEventListener("load", function () {
  var tabLinks = document.querySelectorAll(".search-results__tab-link");
  var tabs = document.querySelectorAll(".search-results__tab");

  tabLinks.forEach(function (element) {
    element.addEventListener("click", function (event) {
      activateTab(event.target.dataset.tabId);
    });

FrankFonts

let tabs = document.querySelector('.tab__links');
let tabsPaddingLeft = parseInt(window.getComputedStyle(tabs, null).getPropertyValue('padding-left'));

FrankFonts

// get the FIRST url parameter
// between the start of query string (? excluded)
// and the first separator  (& excluded)


"use strict";

window.onload = () => {

    // Optional Chaining and Nullish Coalescing

FrankFonts

// vanilla JS solution

window.onload = function(){
    CODE HERE;
};

// vanilla JS solution, equivalent to the code above

window.addEventListener("load", function() {
    CODE HERE;

FrankFonts

// The function camelise(str) changes dash-separated words 
// like “my-short-string” into camel-cased “myShortString”.
// Removes all dashes, each word after dash becomes uppercased.

function camelize(str) {
  return str.split('-').reduce((a, b) => {
    return a + b[0].toUpperCase()+b.slice(1);
  });  
}

FrankFonts

**.class**	.intro	
/* Selects all elements with class="intro" */

**.class1.class2**	.name1.name2	
/* Selects all elements with both name1 and name2 set within its class attribute */

**.class1 .class2**	.name1 .name2	
/* Selects all elements with name2 that is a descendant of an element with name1 */

**#id**	#firstname	

FrankFonts

let width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

let height = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

FrankFonts

<table>
  <!-- We may add a caption to our table -->
  <caption>Caption may come here</caption>
  
  <!-- Styling with <col> -->
  <colgroup>
    <col>
    <col>
    <col style="background-color: yellow">
  </colgroup>

FrankFonts

aList = [0, 1, 2, 3]

temp = []
j = len(aList)-1

for i in range(j, -1, -1):
    temp.append(aList[i])
    
aList = temp