Skip to content

Instantly share code, notes, and snippets.

View SFantasy's full-sized avatar
🌝
ENJOY~

Fantasy SFantasy

🌝
ENJOY~
View GitHub Profile
@SFantasy
SFantasy / json
Created September 19, 2022 11:09
My Keychron Q8 Alice keyboard mapping config file
{
"name": "Keychron Q8",
"vendorId": "0x3434",
"productId": "0x0180",
"lighting": {
"extends": "qmk_rgblight",
"underglowEffects": [
["None", 0],
["SOLID_COLOR", 1],
["BREATHING", 1],
@SFantasy
SFantasy / tabbar.js
Last active August 29, 2015 14:23
React TabBarIOS
var App = React.createClass({
render: function() {
return (
<TabBarIOS>
<TabBarIOS.Item title="React Native" selected={true}>
</TabBarIOS.Item>
<TabBarIOS.Item title="Hello World" selected={true}>
</TabBarIOS.Item>
</TabBarIOS>
);
@SFantasy
SFantasy / viewport.js
Created December 23, 2014 07:26
Dynamic Viewport
var width = parseInt(window.screen.width, 10);
var scale = width / 640;
document.getElementById('viewport').setAttribute(
'content', 'target-densitydpi=device-dpi,width=640,user-scalable=no,initial-scale=' + scale);
@SFantasy
SFantasy / cube.css
Last active August 29, 2015 14:10
CSS3 Random Cube
.cube {
perspective: 600px;
perspective-origin: 50% 50%;
width: 100px;
height: 100px;
margin: 100px auto;
position: relative;
}
.origin {
@SFantasy
SFantasy / ngShoppingCart
Last active August 29, 2015 14:08
Angular - Shopping Cart
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-app ng-controller="CartController">
<h1>Shopping Cart</h1>
<div ng-repeat="item in items">
@SFantasy
SFantasy / ngHelloWorld
Created October 29, 2014 15:13
Angular - Hello World!
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body ng-app>
<div ng-controller="HelloController">
<input type="text" ng-model="greeting.text">
@SFantasy
SFantasy / generator
Created October 24, 2014 08:34
ECMAScript 6 Generator
function * foo (input) {
var res = yield input;
}
var g = foo(10);
g.next(); // { value: 10, done: false }
g.next(); // { value: undefined, done: true }
@SFantasy
SFantasy / flex.sass
Last active August 29, 2015 14:04
Safari, UC, Android compatible flexible box.
@mixin display-flex()
display: -wekbit-box
display: -webkit-flex
display: flex
display: box
display: flexbox
@mixin flex-grow($val)
flex-grow: $val
-webkit-flex-grow: $val
@SFantasy
SFantasy / vertical-mid.sass
Created July 30, 2014 02:29
垂直居中 (use flex box)
.out-box
display: -webkit-flex
display: flex
height: 100px
& > p
margin: auto 0
@SFantasy
SFantasy / gradient.sass
Last active August 29, 2015 13:57
CSS3 Gradient (Ratchet)
@mixin gradient($color-from, $color-to)
background-image: $color-form // Old browsers
background-image: -moz-linear-gradient(top, $color-form 0%, $color-to 100%) // FF3.6+
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,$color-form), color-stop(100%,$color-to)) // Chrome,Safari4+
background-image: -webkit-linear-gradient(top, $color-form 0%, $color-to 100%) // Chrome10+,Safari5.1+
background-image: -o-linear-gradient(top, $color-form 0%, $color-to 100%) // Opera 11.10+
background-image: -ms-linear-gradient(top, $color-form 0%, $color-to 100%) // IE10+
background-image: linear-gradient(to bottom, $color-form 0%, $color-to 100%) // W3C