peduarte

(function(Modernizr) {

  'use strict';

  /**
   * Modernizr test to check if CSS3 Sizing values are supported
   * W3: http://www.w3.org/TR/css3-sizing/
   * CanIUse: http://caniuse.com/#feat=intrinsic-width
   *
   * Values to check:

peduarte

/**
*
* Settings
*
**/

// Defining breakpoints
$bp-small: 520px;
$bp-medium: 768px;
$bp-wide: 960px;

peduarte

'use strict';

var $ = require('zepto');
var extend = require('lodash/object/extend');
var bind = require('lodash/function/bind');
var fastclick = require('fastclick');
var mediator = require('../helpers/mediator');
var EventEmitter = require('events').EventEmitter;
var MQ = require('../ui/base');

peduarte

'use strict';

var $ = require('zepto');
var MobileMenu = require('../components/mobile-menu.js');
var Dropdown = require('../components/dropdown');
var bind = require('lodash/function/bind');

module.exports = {
    initialize: function () {
        new MobileMenu();

peduarte

/**
 * dummy-module.scss
 *
 * This example shows a module which spans:
 * 3 columns on mobile (mobile first approach)
 * 4 columns on tablet
 * 3 columns on desktop
 */

.DummyModule {

peduarte

@mixin tt-span($pattern) {
    width: span($pattern);

    // For no flex browsers...
    .#{$no-flex} & {
        float: left;
    }
}

peduarte

/**
*
* Settings
*
**/

// Defining breakpoints
$bp-small: 520px !default;
$bp-medium: 768px !default;
$bp-wide: 1024px !default;

peduarte

<div class="Slice">
  <div class="Item NL1"></div>
  <div class="Item T2"></div>
</div>

peduarte

/**
*
* Slice
*
**/

.Slice {
    @include flexbox;
    @include flex-direction(row);
    @include flex-wrap(wrap);

peduarte

<div class="Item NL1">
  <div class="Item-content">
    <h2 class="Item-headline">Hello World</h2>
    <p class="Item-dip">This is an example of a slice item.</p>
    <a href="" class="Item-cta">Read the full story</a>
  </div>
  
  <div class="Item-media">
    <a href="">
      <img src="">