Skip to content

Instantly share code, notes, and snippets.

@Tenderfeel
Tenderfeel / _pull.styl
Created August 4, 2014 08:29
pull utitily(stylus)
// Float
//
// floatの操作
//
// .pull_l - left
// .pull_r - right
// .pull_c - clear
//
// Markup:
@Tenderfeel
Tenderfeel / _abs.styl
Created August 4, 2014 08:26
absolute utility(stylus)
/*
abs
position:absoluteによる配置
.abs ... ベース <br>
.abs_mc ... marginによるcenteringの略 <br>
.abs_mc_h ... marginによるセンタリング(horizontal) <br>
.abs_mc_v ... marginによるセンタリング(vertical) <br>
.abs_tc ... translateによるcenteringの略 <br>
@Tenderfeel
Tenderfeel / _align.styl
Created August 4, 2014 08:25
align utility (stylus)
// Align
//
// インライン要素に有効。ブロック要素にはag-flexつかうよろし
//
// .align_c - center
// .align_l - left
// .align_r - right
//
// Markup:
// <p class="{$modifiers}">center</p>
@Tenderfeel
Tenderfeel / gist:8d3f9d79c356b59adcc2
Created August 4, 2014 08:23
Flexible Box Layout Module utility (stylus)
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// _flex.styl
//
// Flexible Box Layout Module
// W3C Working Draft, 23 July 2009. stylus & BEMver
//
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// Flex
//
@Tenderfeel
Tenderfeel / shower-css.md
Last active August 29, 2015 13:59
ShowerCSS

ShowerCSS

ソーシャルゲームのマークアップを主軸にした大規模開発用のHTML/CSS設計思想。
風呂 https://github.com/hiloki/flocss といったらシャワーだよねっていう

     *      *
  *     +  ネタです
     n ∧_∧ n
 + (ヨ(* ´∀`)E)
      Y     Y    *
@Tenderfeel
Tenderfeel / _css-speech-bubble.styl
Last active January 1, 2016 12:19
CSS Speech Bubble Mixin for Stylus
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// CSS Speech Bubble Mixin (for stylus)
// _bubble.scss
//
// http://jsdo.it/Tenderfeel/ApPq
// http://cssdeck.com/labs/x0v5zniy
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// Bubble-tail
//
@Tenderfeel
Tenderfeel / _setting-compass.scss
Last active January 7, 2016 07:41
Compass Configurable Variables
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// Compass Configurable Variables
//
// Compassのmixinとかのオプション
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
//
// # Compass Cross-Browser Support Configuration
// http://compass-style.org/reference/compass/support/
//
// `$legacy-support-for-ie` --- IE6&IE7用のhackを使うならtrue.初期値はfalse
@Tenderfeel
Tenderfeel / _animation.scss
Created November 7, 2013 09:34
Sass&Compass CSS3 animation mixin
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// CSS3 animation mixin
// !!! NEED Compass !!!
//
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// # Animation
//
// animationショートハンドにベンダープレフィックス付けるmixin
//
@Tenderfeel
Tenderfeel / _css-speech-bubble.scss
Created November 7, 2013 09:30
CSS Speech Bubble Mixin
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// CSS Speech Bubble Mixin
// _bubble.scss
//
// http://jsdo.it/Tenderfeel/ApPq
//--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--
// # bubble-tail-init
//
// しっぽのベース作成
//-----------------------------------------------
//CSS Flexible Box Layout Module Mixin
//W3C Candidate Recommendation, 18 September 2012
//http://www.w3.org/TR/2012/CR-css3-flexbox-20120918/
//-----------------------------------------------
//Flex Containers: the ‘flex’ and ‘inline-flex’ ‘display’ values
$default-flex-display: flex;