yamoo9’s gists

yamoo9 / index.slim

Created December 19, 2012 00:06

A CodePen by 야무. RWD Media :: jQuery Plugin - 반응형 웹 디자인에 적용 가능한 유연한 미디어(embed, object, iframe) 처리 jQuery 플러그인입니다.

	div#page

	/ vimeo 영상

	iframe class="rwd-video" src="http://player.vimeo.com/video/48857883?title=0&byline=0&portrait=0&color=ff9933" width="400" height="300" webkitAllowFullScreen mozallowfullscreen allowFullScreen

	/ youtube 영상

	iframe class="rwd-video" width="640" height="360" src="http://www.youtube-nocookie.com/embed/rHAKK6eDsU4?list=PLvaeCFvGpjsNc9lvJ2TribIiN3-g8Bkyu&hl=ko_KR" allowfullscreen

yamoo9 / _shapes.scss

Last active August 29, 2015 14:02

CSS3 도형(원, 삼각형)을 빠르게 그릴 수 있는 SASS 믹스인: Create Configurable CSS3 Shapes with SASS Mixins

	// CSS3 둥근 테두리
	// https://developer.mozilla.org/ko/docs/CSS/border-radius
	@mixin border-radius ($radius) {
	-webkit-border-radius: $radius;
	-moz-border-radius: $radius;
	border-radius: $radius;
	}

	// CSS3 배경 위치 설정
	// http://www.css3.info/preview/background-origin-and-background-clip/

yamoo9 / _ir+each.scss

Created June 3, 2014 04:35

이미지대체기법 + SASS @each문 활용

	// 이미지 대체기법
	// http://nicolasgallagher.com/another-css-image-replacement-technique/
	// https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757c9e03dda4e463fb0d4db5a5f82d7
	%ir {
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	}

	// SASS 리스트(Lists) 데이터 타입 선언

yamoo9 / _text-contrast-function.scss

Created June 3, 2014 07:55

텍스트/배경 색상 대조를 조정하는 SASS 사용자 정의 함수

	// 배경색상에 대한 대조(contrast) 글꼴 컬러를 설정하는 사용자 정의 함수
	@function contrast-text($bgcolor, $amount: 50%) {
	$text-color: null;

	// 유효성 검사
	@if type-of($bgcolor) != color {
	@warn "전달받은 인자의 데이터 형이 잘못되었습니다. color 형이 필요합니다.";
	@debug "전달 받은 인자 $bgcolor 값은 #{type-of($bgcolor)} 입니다.";
	}

yamoo9 / config.rb

Created June 9, 2014 23:25

Compass 프로젝트 config.rb

	# Compass 플러그인 추가

	# CSS 파일 기본 인코딩(Default Encoding) 설정
	# Windows에서 한글, 일어, 중국어 등 SCSS 파일을 CSS로 컴파일 시 문자 인코딩 에러가 생길 경우
	# 아래 코드를 설정하여 기본 인코딩을 UTF-8로 설정하면 문제가 해결됨.
	Encoding.default_external = "utf-8"

	# 프로젝트 내 폴더 경로 지정
	http_path = "/"
	css_dir = "css"

yamoo9 / improveIR.js

Last active April 22, 2016 13:22

CSS Background 이미지 대체기법(Image Replacement Tech.) 사용시, 문제가 되는 접근성을 해결하기 위한 방법입니다.

	/*! improveIR.js © yamoo9.net, 2014
	* CSS (on), Img (off) 로컬호스팅, 웹서버 환경에서만 테스팅 가능
	* Windows High Contrast 모드 테스팅은 로컬 환경에서도 가능
	*/

	// 참조URL
	// http://blog.paciellogroup.com/2011/10/detecting-if-images-are-disabled-in-browsers/
	// http://blog.paciellogroup.com/2012/08/notes-on-accessible-css-image-sprites/
	// http://blog.adrianroselli.com/2012/08/css-background-images-high-contrast-mode.html

yamoo9 / toggleFirstLayersVisible.jsx

Created June 23, 2014 12:10

포토샵 첫번째 레이어(그룹) 토글 스크립트

	/! toggleFirstLayersVisible.jsx(첫번째 레이어 보임/숨김 토글 스크립트), 2013 @ yamoo9.net /
	(function(docuemnt){
	var firstLayers = docuemnt.layers[0];
	firstLayers.visible = !firstLayers.visible;
	})(activeDocument);

yamoo9 / terminal_poweshell_cmd.txt

Created June 24, 2014 10:20

terminal 또는 powershell(installed gow) 에서 Compass 프로젝트 생성 시, 사용되는 명령어

	# --------------------------------------------------------------------------
	# 윈도우(Windows) CMD/Powershell + Gow(https://github.com/bmatzelle/gow/wiki)
	# --------------------------------------------------------------------------

	# 기본 정보
	$ whoami 사용자 정보를 보여줍니다.
	$ ipconfig IP 정보를 보여줍니다.
	$ ver windows 버전을 보여줍니다.

	# 날짜/시간

yamoo9 / Gemfile

Created June 27, 2014 10:50

bundler를 사용하여 다수의 gem 파일 설치를 위한 Gemfile 코드 (bundle init → bundle install)

	source 'http://rubygems.org'
	gem 'compass', '~>1.0.0.alpha.13'
	gem 'breakpoint', '~>2.4.2'
	gem 'singularitygs', '~>1.2.0.rc.6'
	gem 'singularity-extras', '~>1.0.0.alpha.3'
	gem 'toolkit', '~>2.0.0.alpha.7'
	gem 'susy', :git => 'git://github.com/ericam/susy.git', :tag => 'v1.0.rc.1'

yamoo9 / grid.scss

Last active August 29, 2015 14:03

960.gs 그리드 시스템 생성기(Grid System Generater) Using Sass

	@mixin generate-960gs (
	$grid_count: 12
	) {
	@if($grid_count != 12 or $grid_count != 16 or $grid_count != 24) {
	@warn "960 그리드 시스템에 해당하는 숫자 값이 아닙니다.";
	@debug "입력하신 전달인자 $grid_count 값은 #{$grid_count}(#{type-of($grid_count)}) 입니다.";
	}
	// =======================================
	// Grid Options
	// =======================================

야무 yamoo9