alecperkins

<div class="LayoutName__">

  <div class="_RegionName__">
    <div class="ComponentName" data-state="true">
      <div class="_SubComponent"></div>
    </div>
    <div class="ComponentName -variant_group--large">
      <div class="_SubComponent"></div>
    </div>
  </div>

alecperkins

<div class="LayoutName__">
  <div class="_RegionName__">
    <div class="ComponentName" data-state="true">
      <div class="_SubComponent"></div>
    </div>
    <div class="ComponentName -variant_group--large">
      <div class="_SubComponent"></div>
    </div>
  </div>
</div>

alecperkins

Keybase proof

I hereby claim:

• I am alecperkins on github.
• I am alecperkins (https://keybase.io/alecperkins) on keybase.
• I have a public key whose fingerprint is 6FE3 06A2 D971 4442 2A3C 18F9 5DF1 1A38 4980 66DE

To claim this, I am signing this object:

alecperkins

<div class="Stream">
  <div class="Stream_Header"></div>
  <div class="Stream_Entries">
    <div class="CollectionEntry">
      <div class="StoryItem -featured"></div>
      <div class="StoryItem"></div>
      <div class="StoryItem"></div>
      <div class="StoryItem"></div>
      <div class="StoryItem"></div>
    </div>

alecperkins

<div class="Bar">Bar</div>
<div class="Baz">Baz</div>
<div class="Qux">
  Qux
  <div class="Qux_Sub">Qux_Sub</div>
</div>

alecperkins

(function(){

var CONTENT_API_ROOT = 'http://marquee.by/content/';
var CONTENT_API_TOKEN = '<token>';
function getSelectionHtml() {
    var html = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            var container = document.createElement("div");

alecperkins

<iframe src="http://blog.alecperkins.net/one-toolkit-per-child/"></iframe>

alecperkins

// It's pretty straightforward to wrap callback-based functions in ones that
// use and return promises.
function readOne (url) {
   var deferred = when.defer();
   httpRequest(url, function(response){
      deferred.resolve(response.length);
   });
   // This promise represents the end result of the operation, and will
   // be resolved when `httpRequest` calls `deferred.resolve` above.
   // Once resolved, anything waiting for its result can continue.

alecperkins

<div class="Content">
<p id="b1" class="TextBlock">
Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
</p>

<p id="b2" class="TextBlock">
Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam id dolor id nibh ultricies vehicula ut id elit. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.
<span class="Spacer"></span>
</p>

<div id="b3" class="ImageBlock">
  <img src="http://sample.marquee-cdn.net/images/34-51

alecperkins

// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----

=extend-variants($module_name, $variants...)
    @each $variant in $variants
        @if type_of($variant) == "list"
            $variant: #{nth($variant, 1)}--#{nth($variant, 2)}
        @extend %#{$module_name}%-#{$variant}