Leon Coto grancalavera

Hello, visitors! If you want an updated version of this styleguide in repo form with tons of real-life examples… check out Trellisheets! https://github.com/trello/trellisheets

Trello CSS Guide

“I perfectly understand our CSS. I never have any issues with cascading rules. I never have to use !important or inline styles. Even though somebody else wrote this bit of CSS, I know exactly how it works and how to extend it. Fixes are easy! I have a hard time breaking our CSS. I know exactly where to put new CSS. We use all of our CSS and it’s pretty small overall. When I delete a template, I know the exact corresponding CSS file and I can delete it all at once. Nothing gets left behind.”

You often hear updog saying stuff like this. Who’s updog? Not much, who is up with you?

The introduction to Reactive Programming you've been missing

(by @andrestaltz)

This tutorial as a series of videos

If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.

	❯ rollup --version
	rollup version 0.25.3

	❯ time rollup -c ./rollup.js
	rollup -c ./rollup.js 4.65s user 0.22s system 118% cpu 4.131 total

	❯ time webpack
	Hash: ebb00bbccd954c114d3c
	Version: webpack 2.0.7-beta
	Time: 3623ms


	interface Result<T, E> {
	map<U>(fn: (a: T) => U): Result<U, E>;
	mapErr<U>(fn: (a: E) => U): Result<T, U>;
	isOk(): boolean;
	isErr(): boolean;
	ok(): Option<T>;
	err(): Option<E>;
	and<U>(res: Result<U,E>): Result<U,E>;
	andThen<U>(op: (T) => Result<U,E>): Result<U,E>;

	<header>
	<h1>Second Cube</h1>
	<p>An experiment on infinite sequences and CSS animations.</p>
	<p>Based on <a href="http://ffffound.com/image/15cca3c0766a634da538fb4bc8b23e2f5a4fe8a7">this image</a> from ffffound.</p>
	</header>
	<div id="viewport">
	<div id="tower">
	<div id="cubes"></div>
	</div>
	</div>

	define([
	'marionette',
	'handlebars',
	'modules/accountsData/views/pie',
	'modules/accountsData/views/table',
	'text!modules/accountsData/templates/wrapper.html',
	],

	function(Marionette, Handlebars, pie, table, tmpl) {

	// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
	// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating

	// requestAnimationFrame polyfill by Erik Möller
	// fixes from Paul Irish and Tino Zijdel

	(function() {
	var lastTime = 0;
	var vendors = ['ms', 'moz', 'webkit', 'o'];
	for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {

	Latency Comparison Numbers (~2012)
	----------------------------------
	L1 cache reference 0.5 ns
	Branch mispredict 5 ns
	L2 cache reference 7 ns 14x L1 cache
	Mutex lock/unlock 25 ns
	Main memory reference 100 ns 20x L2 cache, 200x L1 cache
	Compress 1K bytes with Zippy 3,000 ns 3 us
	Send 1K bytes over 1 Gbps network 10,000 ns 10 us
	Read 4K randomly from SSD* 150,000 ns 150 us ~1GB/sec SSD

	authors:
	hanzou:
	name: Hanzou Hattori
	display_name: Hanzou
	gravatar: c66919cb194f96c696c1da0c47354a6a
	email: [email protected]
	web: http://company.com
	twitter: company
	github: hhattori
	jorgen: