Skip to content

Instantly share code, notes, and snippets.

View tilomitra's full-sized avatar
👋

Tilo Mitra tilomitra

👋
192 followers · 9 following
View GitHub Profile
@tilomitra
tilomitra / mobile-first-grid.css
Created December 27, 2013 21:17
Mobile first Pure Grid generated by https://github.com/ericf/rework-pure-grids.
.pure-u-1,
.pure-u-1-1,
.pure-u-1-2,
.pure-u-1-3,
.pure-u-2-3,
.pure-u-1-4,
.pure-u-3-4,
.pure-u-1-6,
.pure-u-5-6,
.pure-u-1-8,
@tilomitra
tilomitra / grid.css
Created December 18, 2013 20:02
Example of mobile-first Pure Grid
.pure-u-1-12,
.pure-u-1,
.pure-u-1-6,
.pure-u-1-1,
.pure-u-1-4,
.pure-u-1-2,
.pure-u-1-3,
.pure-u-2-12,
.pure-u-2-3,
.pure-u-3-4,
@tilomitra
tilomitra / move-test.html
Created November 13, 2013 20:53
Test page for these events: https://github.com/tilomitra/yui3/blob/gesture-integration/src/event-gestures/js/Drag.js
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0/pure-min.css">
<style>
.box {
width: 150px;
@tilomitra
tilomitra / yuiconf-2013-carousel.html
Last active December 27, 2015 13:29
A carousel that highlights various gesture events that are upcoming in YUI. View it live here: http://rawgithub.com/tilomitra/7333549/raw/9ea70721628531b8e6720a2b73ca76ac73de2f19/yuiconf-2013-carousel.html
@tilomitra
tilomitra / mixins.scss
Last active December 26, 2015 13:29
Extending Pure components using pre-processors.
@mixin pure-form {
input {
padding: 0.5em 0.6em;
display: inline-block;
border: 1px solid #ccc;
font-size: 0.8em;
box-shadow: inset 0 1px 3px #ddd;
border-radius: 4px;
-webkit-transition: 0.3s linear border;
-moz-transition: 0.3s linear border;
@tilomitra
tilomitra / responsive-menu.css
Created September 26, 2013 23:54
This gist makes Pure Menus easier to customize, and adds a new responsive menu that collapses. Check out this pull request for details: https://github.com/yui/pure/pull/142 This is BETA!
/*!
Pure 0.3.0
Copyright 2013 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
https://github.com/yui/pure/blob/master/LICENSE.md
*/
/*csslint adjoining-classes: false, box-model:false*/
.pure-menu ul, .pure-menu li {
position: relative;
}
@tilomitra
tilomitra / mobile-first-grid.css
Created September 26, 2013 23:51
A mobile-first grid for Pure. This pull request has more information on how to use it. Ping me if you run into issues. This is BETA! https://github.com/yui/pure/pull/146
.pure-g {
letter-spacing: -0.31em; /* Webkit: collapse white-space between units */
*letter-spacing: normal; /* reset IE < 8 */
*word-spacing: -0.43em; /* IE < 8: collapse white-space between units */
text-rendering: optimizespeed; /* Webkit: fixes text-rendering: optimizeLegibility */
/*
Sets the font stack to fonts known to work properly with the above letter
and word spacings. See: https://github.com/yui/pure/issues/41/
@tilomitra
tilomitra / hold-unit-tests.js
Last active December 23, 2015 11:39
The hold module provides a gesture event, "hold", which fires when a user's finger/mouse stays at the same place for a given period of time. The release module provides a synthetic event, "release", which fires when a user's finger/mouse leaves the screen.
YUI.add('hold-unit-tests', function(Y) {
var HOLD_EVENT = Y.Node.DOM_EVENTS.hold.eventDef,
Assert = Y.Assert,
noop = function() {},
module = Y.one('#event-hold-module'),
submodule1 = Y.one('#event-hold-submodule1'),
submodule2 = Y.one('#event-hold-submodule2'),
HANDLES = {
@tilomitra
tilomitra / 1147-repro.html
Created September 6, 2013 17:07
Repro case for https://github.com/yui/yui3/issues/1147. This file should be run as a test HTML file inside `yui3/src/event-gestures/tests/manual/`
<!doctype html>
<html>
<head>
<title>Repro case for #1147</title>
<style>
#demo {
width: 200px;
}
#demo ul li {
@tilomitra
tilomitra / index.html
Last active December 21, 2015 17:59 — forked from dannyfritz/index.html
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/pure/0.2.1/pure-min.css">
<style>
.pure-g,
.pure-g-r {
font-family: "Bitstream Charter", Tinos, "Droid Sans", "Dejavu Sans", Helvetica, Arial, sans-serif;
}
.pure-g [class *= "pure-u"],