Skip to content

Instantly share code, notes, and snippets.

View xiaohutai's full-sized avatar

Xiao-Hu Tai xiaohutai

47 followers · 38 following
  • The Netherlands
View GitHub Profile
@xiaohutai
xiaohutai / accessibility-checklists.md
Created November 21, 2019 12:09
@xiaohutai
xiaohutai / 404.html
Created September 26, 2019 14:00 — forked from amcgregor/404.html
My own HTML5 boilerplate sans most of the code. Because there's too much Romulus-be-damned boilerplate, and people fail to realize almost none of it is in any way needed. For more details than you probably wanted, ref: https://tomhodgins.hashnode.dev/code-that-you-just-never-ever-need-to-write-cjpblnfff00km0ys149kbttbg
<!DOCTYPE html>
<html lang="en">
<title>Page Not Found</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<h1>Page Not Found</h1>
<p>Sorry, but the page you were trying to view does not exist.</p>
@xiaohutai
xiaohutai / README.md
Created September 20, 2019 11:42 — forked from addyosmani/README.md
108 byte CSS Layout Debugger

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@xiaohutai
xiaohutai / README.md
Created September 20, 2019 11:42 — forked from addyosmani/README.md
108 byte CSS Layout Debugger

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@xiaohutai
xiaohutai / debug.css
Created September 6, 2019 12:25
* { background-color: rgba(255,0,0,.2); }
* * { background-color: rgba(0,255,0,.2); }
* * * { background-color: rgba(0,0,255,.2); }
* * * * { background-color: rgba(255,0,255,.2); }
* * * * * { background-color: rgba(0,255,255,.2); }
* * * * * * { background-color: rgba(255,255,0,.2); }
@xiaohutai
xiaohutai / decagon-clip-path.css
Last active April 5, 2019 12:46
Decagon clip-path
.decagon {
clip-path: polygon(
34.54915% 2.44717%,
65.45085% 2.44717%,
90.45085% 20.61074%,
100% 50%,
90.45085% 79.38926%,
65.45085% 97.55283%,
34.54915% 97.55283%,
9.54915% 79.38926%,
@xiaohutai
xiaohutai / inspiration-tools.md
Last active March 3, 2019 23:06
Tools
@xiaohutai
xiaohutai / meta.meta
Created February 22, 2019 12:47
meta
M E T A T E M E T A T E M E T A
E T E T E T
T E T E T E
A T E M E T A T E M E T A T E M
E T
T E
M E T A T E M
E T
T E
A T E M E T A
@xiaohutai
xiaohutai / minimal-analytics-snippet.js
Created December 17, 2018 16:08 — forked from DavidKuennen/minimal-analytics-snippet.js
Minimal Analytics Snippet
(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 = () => {
@xiaohutai
xiaohutai / print.css
Created November 27, 2018 09:07
@media print {
body {
width: 21cm;
height: 29,7cm;
}
}