Skip to content

Instantly share code, notes, and snippets.

View atelierbram's full-sized avatar

Bram de Haan atelierbram

View GitHub Profile
@atelierbram
atelierbram / index.html
Created February 17, 2021 20:40 — forked from prof3ssorSt3v3/index.html
Code for youtube video on popstate, hashchange, and history.state
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>History popstate and hashchange Events</title>
<link rel="stylesheet" href="./main.css" />
</head>
<body>
@atelierbram
atelierbram / encoding-video.md
Created October 17, 2019 18:27 — forked from Vestride/encoding-video.md
Encoding video for the web

Encoding Video

Installing

Install FFmpeg with homebrew. You'll need to install it with a couple flags for webm and the AAC audio codec.

brew install ffmpeg --with-libvpx --with-libvorbis --with-fdk-aac --with-opus
@atelierbram
atelierbram / index.html
Last active August 13, 2018 13:33 — forked from paulrobertlloyd/index.html
Andy Dennis’ function introduction
<html>
<body>
<a class="that" href="yippee.html">That link</a>
<script>
var foo = function () {
var $ = document.querySelector.bind(document)
var el = {
thatLink: $('a.that')
}
function addListeners () {
@atelierbram
atelierbram / easing.css
Created August 12, 2018 08:41 — forked from bendc/easing.css
Easing CSS variables
:root {
--ease-in-quad: cubic-bezier(.55, .085, .68, .53);
--ease-in-cubic: cubic-bezier(.550, .055, .675, .19);
--ease-in-quart: cubic-bezier(.895, .03, .685, .22);
--ease-in-quint: cubic-bezier(.755, .05, .855, .06);
--ease-in-expo: cubic-bezier(.95, .05, .795, .035);
--ease-in-circ: cubic-bezier(.6, .04, .98, .335);
--ease-out-quad: cubic-bezier(.25, .46, .45, .94);
--ease-out-cubic: cubic-bezier(.215, .61, .355, 1);
@atelierbram
atelierbram / netrw quick reference.md
Created January 16, 2017 11:49 — forked from t-mart/netrw quick reference.md
A quick reference for Vim's built-in netrw file selector.
Map Action
<F1> Causes Netrw to issue help
<cr> Netrw will enter the directory or read the file
<del> Netrw will attempt to remove the file/directory
- Makes Netrw go up one directory
a Toggles between normal display, hiding (suppress display of files matching g:netrw_list_hide) showing (display only files which match g:netrw_list_hide)
c Make browsing directory the current directory
C Setting the editing window
d Make a directory
@atelierbram
atelierbram / stylesheet-injector.js
Created January 16, 2017 11:08 — forked from necolas/stylesheet-injector.js
Create and append style sheets to document <head> using JavaScript
(function() {
var css = [
'/css/default.css',
'/css/section.css',
'/css/custom.css'
],
i = 0,
link = document.createElement('link'),
head = document.getElementsByTagName('head')[0],
tmp;
@atelierbram
atelierbram / .gitignore
Created December 31, 2016 12:56 — forked from salcode/.gitignore
WordPress .gitignore - this is my preferred gitignore file when working with WordPress. It ignores almost all files by default.
# -----------------------------------------------------------------
# .gitignore for WordPress @salcode
# ver 20160309
#
# From the root of your project run
# curl -O https://gist.githubusercontent.com/salcode/b515f520d3f8207ecd04/raw/.gitignore
# to download this file
#
# By default all files are ignored. You'll need to whitelist
# any mu-plugins, plugins, or themes you want to include in the repo.
@atelierbram
atelierbram / single-id-template.php
Created January 31, 2016 16:00 — forked from maor/single-id-template.php
Add this to your functions.php or functionality plugin
<?php
function my_single_template_by_post_id( $located_template ) {
return locate_template( array( sprintf( "single-%d.php", absint( get_the_ID() ) ), $located_template ) );
}
add_filter( 'single_template', 'my_single_template_by_post_id' );
@atelierbram
atelierbram / matchMedia.js
Last active September 10, 2015 10:02 — forked from robnyman/matchMedia.js
matchMedia demo
(function () {
var matchMediaSupported = document.querySelector("#matchmedia-supported"),
width600 = document.querySelector("#width-600"),
height500 = document.querySelector("#height-500"),
portraitOrientation = document.querySelector("#portrait-orientation"),
width600Check,
height500Check,
portraitOrientationCheck;
if (window.matchMedia) {
@atelierbram
atelierbram / reset.css
Last active October 20, 2023 06:42 — forked from iegik/reset.css
CSS Typography reset
html, body, div, span, applet, object, iframe, table, caption,
tbody, tfoot, thead, tr, th, td, del, dfn, em, font, img, ins,
kbd, q, s, samp, small, strike, strong, sub, sup, tt, var,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
vertical-align: baseline;
font-family: inherit;
font-weight: inherit;
font-style: inherit;