Skip to content

Instantly share code, notes, and snippets.

View terkel's full-sized avatar

Takeru Suzuki terkel

128 followers · 62 following
View GitHub Profile
@terkel
terkel / _map.scss
Last active December 18, 2015 19:39
// https://github.com/nex3/sass/issues/642
@function map-get ($map, $key) {
@each $element in $map {
@if index($element, $key) == 1 {
@return nth($element, 2);
}
}
@warn '\"#{ $key }\" is not found in the list.';
@return '';
@terkel
terkel / layout.jade
Last active December 18, 2015 03:49
block vars
- var bodyClass = ''
- var bodyId = ''
!!!
// if lt IE 7
| <html class="no-js lt-ie9 lt-ie8 lt-ie7">
// if IE 7
| <html class="no-js lt-ie9 lt-ie8">
// if IE 8
@terkel
terkel / _reset-button.scss
Last active December 18, 2015 00:19
// Reset default styles of the <button> element
$normalized: false !default;
@mixin reset-button () {
background-color: transparent; // for IE8
background-color: rgba(0, 0, 0, 0); // IE9 fix
border-width: 0;
color: inherit;
cursor: default;
@terkel
terkel / jquery.fullscreenimage.js
Last active December 16, 2015 05:39
(function ($) {
$.fn.fullscreenImage = function () {
this.each(function () {
var $image = $(this),
imageAspectRatio = $image.width() / $image.height(),
$screen = $image.offsetParent();
$(window).on('resize', resizeImage).trigger('resize');
function resizeImage () {
var screenWidth = $screen.width(),
@terkel
terkel / jquery-on-patterns.js
Last active December 15, 2015 18:59
$(document).on('mouseenter', function (event) { /* ... */ });
$(document).on('mouseenter focus', function (event) { /* ... */ });
$(document).on('mouseenter', '.foo', function (event) { /* ... */ });
$(document).on('mouseenter', '.foo, .bar', function (event) { /* ... */ });
$(document).on({
mouseenter: function (event) { /* ... */ },
@terkel
terkel / recommended-reading.md
Last active December 15, 2015 08:29
おすすめの書籍
@terkel
terkel / .gitignore
Last active December 15, 2015 02:29
# Sass
.sass-cache/
# Sublime Text
*.sublime-project
*.sublime-workspace
# Mac
.DS_Store
@terkel
terkel / css-animations-and-transitions.md
Last active December 15, 2015 01:39
CSS アニメーションとトランジションについてのリソース集。
@terkel
terkel / _x-vendor-prefixes.scss
Last active December 13, 2015 22:19
// Returns a list of vendor prefixes for the CSS feature
// @function x-vendor-prefixes
// @param {String} $key CSS property, value or at-rule
// @return {List} list of vendor prefixes
// @updated 2013-02-19
@function x-vendor-prefixes ($key) {
$features:
// Animations
// http://www.w3.org/TR/css3-animations/
@terkel
terkel / _retina-nir.scss
Created February 18, 2013 13:16
// http://terkel.jp/archives/2013/02/nir-for-retina-images/
// NIR for Retina image
@mixin retina-nir (
$x: 0,
$y: 0,
$width: null,
$height: null,
$path: "/img/sprites",
$mod: "@2x",