herrkessler

@mixin for-phone-only {
  @media (max-width: 599px) { @content; }
}
@mixin for-tablet-portrait-up {
  @media (min-width: 600px) { @content; }
}
@mixin for-tablet-landscape-up {
  @media (min-width: 900px) { @content; }
}
@mixin for-desktop-up {

herrkessler

/**
 * A collection of helper prototype for everyday DOM traversal, manipulation,
 * and event binding. Sort of a minimalist jQuery, mainly for demonstration 
 * purposes. MIT @ m3g4p0p
 */
window.$ = (function (undefined) {

  /**
   * Duration constants
   * @type {Object}

herrkessler

mixin picture(path, name, type)
  picture
    each val in type
      source(srcset=path + "/" + name + "." + val type="image/" + val)
    img(src=path + "/" + name + ".jpg" alt=name)
	
+picture('path/to', 'image', ['jpg','webp'])

// Compiles to
//------------------------

herrkessler

'use strict';

var postcss = require('gulp-postcss');
var gulp = require('gulp');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');
var sass = require('gulp-sass');
var include = require('gulp-include');
var concat = require('gulp-concat');
var browserSync = require('browser-sync').create();

herrkessler

// 🔥 Node 7.6 has async/await! Here is a quick run down on how async/await works

const axios = require('axios'); // promised based requests - like fetch()

function getCoffee() {
  return new Promise(resolve => {
    setTimeout(() => resolve('☕'), 2000); // it takes 2 seconds to make coffee
  });
}

herrkessler

const axios = require('axios');

const locations = ['London', 'San Francisco', 'Tokyo', 'Berlin'];
const apiURL = 'http://api.openweathermap.org/data/2.5/weather';
const token = 'xxxxx';

const logPosts = async () => {
  try {
    let allLocations = locations.map(town => axios(`${apiURL}?q=${town}&APPID=${token}`));
    let weather = await Promise.all(allLocations);

herrkessler

async function supportsWebp() {
  if (!self.createImageBitmap) return false;
  
  const webpData = 'data:image/webp;base64,UklGRh4AAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=';
  const blob = await fetch(webpData).then(r => r.blob());
  return createImageBitmap(blob).then(() => true, () => false);
}

addEventListener('install', event => {
  event.waitUntil(async function() {

herrkessler

$font-family-sans-serif: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif !default

herrkessler

<?php
// DEFINE our cipher
define('AES_256_CBC', 'aes-256-cbc');

// Generate a 256-bit encryption key
// This should be stored somewhere instead of recreating it each time
$encryption_key = openssl_random_pseudo_bytes(32);

// Generate an initialization vector
// This *MUST* be available for decryption as well

herrkessler

const Sequelize = require('sequelize'),
  epilogue = require('epilogue'),
  restify = require('restify'),
  passwordHash = require('password-hash');

// Define your models
const database = new Sequelize('whateverDatabase', 'rootUser', 'rootPassword', {
  host: 'localhost',
  dialect: 'postgres',
});