Skip to content

Instantly share code, notes, and snippets.

View xiaody's full-sized avatar
🍼
I may be slow to respond.

xiaody xiaody

🍼
I may be slow to respond.
View GitHub Profile
@xiaody
xiaody / NonPassiveTouchTarget.js
Created June 8, 2018 05:43
For any React.js user looking for a workaround to force non-passive touchmove listeners on iOS 11.3+, here is a component snippet that I'm using.
/*
* For nasty iOS Safari.
* Since iOS Safari 11.3+, all touchmove listeners are passive by default.
* Yet it doesn't fully support CSS touch-action like Chrome does.
* So here is a component to workaround.
*
* What is more weird is that **sometimes** even a non-passive listener cannot
* preventDefault. You have to nest this component inside another instance
* of it like:
* <NonPassiveTouchTarget>
@xiaody
xiaody / dabblet.css
Created February 20, 2017 11:48 — forked from anonymous/dabblet.css
flex absolute
/* flex absolute */
* {box-sizing: border-box;}
#root {
border: 1px solid black;
}
#parent {
display: flex;
@xiaody
xiaody / dabblet.css
Created January 19, 2016 15:19
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
.keypad {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
align-content: center;
@xiaody
xiaody / dabblet.css
Created January 17, 2016 12:10
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
.keypad {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
align-content: center;
@xiaody
xiaody / dabblet.html
Created January 1, 2016 04:24
Untitled
<?xml version="1.0" encoding="UTF-8" standalone="no"?><svg height="400" width="400" viewBox="0 0 400 400" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g filter="url(#goo)"> <circle class="dark" cx="200" cy="200" r="125" /> <circle class="green" cx="200" cy="200" r="125" /> </g> <defs> <filter id="goo"> <feGaussianBlur in="SourceGraphic" stdDeviation="15" result="blur" /> <feColorMatrix in="blur" mode="matrix" values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 26 -10" result="goo" /> </filter> </defs> <style> /* <![CDATA[ */ circle.dark, circle.green { fill: transparent; stroke-dashoffset: 1000; stroke-width: 40; stroke-dasharray: 1060; transform-origin: 50% 50%; } circle.dark { stroke: #686968; animation: spin1 .8s ease-in-out forwards infinite; } circle.green { stroke: #36c56d; animation: spin2 .8s ease-in-out forwards infinite; } @keyframes spin1 { 0% {
@xiaody
xiaody / ss-redir 透明代理.md
Created November 21, 2015 09:20 — forked from wen-long/ss-redir 透明代理.md
ss-redir 透明代理.md

##ss-redir 的 iptables 配置(透明代理)

透明代理指对客户端透明,客户端不需要进行任何设置就使用了网管设置的代理规则

创建 /etc/ss-redir.json 本地监听 7777 运行ss-redir -v -c /etc/ss-redir.json

iptables -t nat -N SHADOWSOCKS
# 在 nat 表中创建新链
iptables -t nat -A SHADOWSOCKS -p tcp --dport 23596 -j RETURN
# 23596 是 ss 代理服务器的端口,即远程 shadowsocks 服务器提供服务的端口,如果你有多个 ip 可用,但端口一致,就设置这个
@xiaody
xiaody / SassMeister-input.scss
Last active August 29, 2015 14:11
Generated by SassMeister.com.
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----
$z-layers: (
"goku": 901,
"shoryuken": 800,
"modal": (
"base": 500,
@xiaody
xiaody / SassMeister-input.scss
Created December 14, 2014 09:47
Generated by SassMeister.com.
// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// ----
// abstract btn class
@import 'compass/css3';
%btn {
$radius-default: 2px !default;
@xiaody
xiaody / dabblet.css
Created July 26, 2014 05:39
The first commented line is your dabblet’s title
/**
* The first commented line is your dabblet’s title
*/
body {
display:flex;
margin:0;
padding:0;
height:100vh;
align-items:center;
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="this" />
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<a id=asdf>shishi</a>
</body>