Skip to content

Instantly share code, notes, and snippets.

View geckotang's full-sized avatar
:octocat:

Shotaro Sakamaki geckotang

:octocat:
73 followers · 46 following
View GitHub Profile
@geckotang
geckotang / index.html
Created December 8, 2013 13:21
<!DOCTYPE html>
<html class="ua_js_no ua_css_standard">
<head>
<body class="page page__body">
{内容}
</body>
</head>
</html>
@geckotang
geckotang / index.html
Created December 8, 2013 13:21
<!DOCTYPE html>
<html class="ua_js_no ua_css_standard">
<head>
<body class="page page__body">
<div class="page__body-inner">
{内容}
</div>
</body>
</head>
</html>
@geckotang
geckotang / page.css
Created December 8, 2013 13:22
.page__body
{
font: 16px Helvetica, Arial, sans-serif;
background: #979797;
}
.page__body-inner
{
box-sizing: border-box;
width: 800px;
@geckotang
geckotang / sample.html
Created December 8, 2013 13:40
<ul class="goods">
<li class="goods__item">
<h3 class="goods__title"><a class="b-link" href="http://example.com/">猿でもわかるBEM</a></h3>
<img class="goods__image" src="http://dummyimage.com/300x200&amp;text=猿でもわかるBEM">
<div class="goods__author">弁梦太郎</div>
<div class="goods__price"><a class="b-link goods__link" href="http://example.com/">¥1,500で購入する</a></div>
</li>
<li class="goods__item">...</li>
<li class="goods__item goods__item_new_yes">...</li>
</ul>
@geckotang
geckotang / goods.css
Created December 11, 2013 16:46
.goods
{
}
.goods__item
{
border: 3px solid red;
}
@geckotang
geckotang / _index.ie.css
Created December 11, 2013 16:46
.goods__link
{
display: block;
font-weight: bold;
font-size: 16px;
text-decoration: none;
background: #87cefa;
color: #fff;
margin: 0 -10px;
padding: 12px 10px;
@geckotang
geckotang / index.bemjson.js
Created December 11, 2013 16:47
head: [
{ elem: 'css', url: '_index.css', ie: false },
{ elem: 'css', url: '_index.ie.css', ie: 'gte IE 6' },
{ elem: 'meta', attrs: { name: 'description', content: '俺の考えた最強のBEM' }}
],
@geckotang
geckotang / _helper.scss
Last active December 31, 2015 06:29
https://github.com/csswizardry/inuit.css/blob/7dbc892f8d298795e19aeb64d1369ae3271561d1/generic/_helper.scss のflushとか書きだすようなmixinだけど要らない気がする。 たぶんいらない。
//@mixin _prop_with_direction
//@description いろんな方向のプロパティを弄るための何か。
//@refs https://github.com/csswizardry/inuit.css/blob/7dbc892f8d298795e19aeb64d1369ae3271561d1/generic/_helper.scss
//
//@param $prefix {String} 生成するclassに付与するprefix。.は必要
//@param $classname {String} 生成するclass名(+方向)
//@param $property {Property} 各方向に指定したいCSSのproperty
//@param $value {Value} 各方向に指定したいCSSのvalue
//@param $direction-list {List} 方向。デフォは('', '-top', '-right', '-bottom', '-left')
//
@geckotang
geckotang / youtube_list.js
Last active January 3, 2016 03:29
アップロード済み一覧でコンソール出して以下を使うと、動画名[タブ]URLのリストを表示する。
/*
http://www.youtube.com/my_videos?o=U
*/
var result = [];
Array.prototype.slice.call(document.querySelectorAll('.vm-video-title-content.yt-uix-sessionlink')).forEach(function(node) {
result.push(node.innerText+'\t'+node.href);
});
prompt('コピーしてください',result.join('\n'));
@geckotang
geckotang / lineup.html
Created February 6, 2014 08:26
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="./jquery-1.10.2.min.js"></script>
<script src="./jquery-lineup.js"></script>
<script>