When making this website, i wanted a simple, reasonable way to make it look good on most displays. Not counting any minimization techniques, the following 58 bytes worked well for me:
main {
max-width: 38rem;
padding: 2rem;
margin: auto;
}
/* | |
Copy this into the console of any web page that is interactive and doesn't | |
do hard reloads. You will hear your DOM changes as different pitches of | |
audio. | |
I have found this interesting for debugging, but also fun to hear web pages | |
render like UIs do in movies. | |
*/ | |
const audioCtx = new (window.AudioContext || window.webkitAudioContext)() |
(function (context, trackingId, options) { | |
const history = context.history; | |
const doc = document; | |
const nav = navigator || {}; | |
const storage = localStorage; | |
const encode = encodeURIComponent; | |
const pushState = history.pushState; | |
const typeException = 'exception'; | |
const generateId = () => Math.random().toString(36); | |
const getId = () => { |
## Sublime Text 3 Serial key build is 3103 | |
—– BEGIN LICENSE —– | |
Michael Barnes | |
Single User License | |
EA7E-821385 | |
8A353C41 872A0D5C DF9B2950 AFF6F667 | |
C458EA6D 8EA3C286 98D1D650 131A97AB | |
AA919AEC EF20E143 B361B1E7 4C8B7F04 | |
B085E65E 2F5F5360 8489D422 FB8FC1AA |
import React from "react" | |
import { Route, Switch } from "react-router-dom" | |
const AppRoute = ({ component: Component, layout: Layout, ...rest }) => ( | |
<Route {...rest} render={props => ( | |
<Layout> | |
<Component {...props} /> | |
</Layout> | |
)} /> | |
) |
function waitForElement(selector) { | |
return new Promise(function(resolve, reject) { | |
var element = document.querySelector(selector); | |
if(element) { | |
resolve(element); | |
return; | |
} | |
var observer = new MutationObserver(function(mutations) { |
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication | |
// http://creativecommons.org/publicdomain/zero/1.0/ | |
(function (win, doc) { | |
'use strict'; | |
if (!win.XMLHttpRequest || !win.FormData || !win.addEventListener || !doc.querySelectorAll) { | |
// doesn't cut the mustard. | |
return; | |
} | |
function hijaxForm (formElement) { | |
var progressBar; |
// connect() is a function that injects Redux-related props into your component. | |
// You can inject data and callbacks that change that data by dispatching actions. | |
function connect(mapStateToProps, mapDispatchToProps) { | |
// It lets us inject component as the last step so people can use it as a decorator. | |
// Generally you don't need to worry about it. | |
return function (WrappedComponent) { | |
// It returns a component | |
return class extends React.Component { | |
render() { | |
return ( |
The issue:
..mobile browsers will wait approximately 300ms from the time that you tap the button to fire the click event. The reason for this is that the browser is waiting to see if you are actually performing a double tap.
(from a new defunct https://developers.google.com/mobile/articles/fast_buttons article)
touch-action
CSS property can be used to disable this behaviour.
touch-action: manipulation
The user agent may consider touches that begin on the element only for the purposes of scrolling and continuous zooming. Any additional behaviors supported by auto are out of scope for this specification.
/*! | |
* Copyright 2015 Google Inc. All rights reserved. | |
* | |
* Licensed under the Apache License, Version 2.0 (the "License"); | |
* you may not use this file except in compliance with the License. | |
* You may obtain a copy of the License at | |
* | |
* http://www.apache.org/licenses/LICENSE-2.0 | |
* | |
* Unless required by applicable law or agreed to in writing, software |