HipsterBrown

//Full Featured Triangle Mixin

@mixin triangle($color, $size, $direction: top) {
  @include size(0px);
  border-#{$direction}: $size*1.75 solid $color; 
  
  @if $direction == top or $direction == bottom {
    border-left: $size solid transparent;
    border-right: $size solid transparent;
  } @else if $direction == left or $direction == right {

HipsterBrown

//Fairly Simple but Effective Flexbox Mixin w/ no fallback cause those suck

@mixin flexy($direction: row, $justify: center, $align: center) {
  display: flex;
  flex-direction: $direction;
  justify-content: $justify;
  align-items: $align;
}

HipsterBrown

var lettering = function(el, optionalArg) {
  var text = el.innerHTML,
      arg = optionalArg || "char",
      size = window.getComputedStyle(el).getPropertyValue("font-size").substring(0,2);
  if(el.classList.contains('fallback'));
  if(el.parentNode.getAttribute('aria-hidden') === null){
    var clone = el.cloneNode(true);
    
    clone.classList.add('fallback');
    

HipsterBrown

var dogSight = function grayJS (elem) {
  var x = elem || 'body';
  var el = document.querySelector(x);
  var children = el.children;

  var grayIt = function grayn(property) {
    var css = window.getComputedStyle(el);
    var prop = css.getPropertyValue(property);
    if (prop[4] === "a") {
      var rgb = prop.slice(5, -1).split(',');

HipsterBrown

- var i = 0
ul.shots
  while i < 8
    li.shot
      img(src="http://placehold.it/200x150")
      ul
        li 471
        li 45
        li 4806
    - i++

HipsterBrown

article.card
  section.content
    header
      img(src="http://placehold.it/48x48")
      h1 
        strong Designer News Bot 
        span @designernewsbot
      button Following
    p How To: Remove the U2 album from your iPhone #apple 
      a(href="https://t.co/Zl6so47ykV") news.layervault.com/click/stories/33709…

HipsterBrown

header Header
section
  aside Aside 1
  article Main Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur. Donec ut libero sed arcu vehicula ultricies a non tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ut gravida lorem. Ut turpis felis, pulvinar a semper sed, adipiscing id dolor. Pellentesque auctor nisi id magna consequat sagittis. Curabitur dapibus enim sit amet elit pharetra tincidunt feugiat nisl imperdiet. Ut convallis libero in urna ultrices accumsan. Donec sed odio eros. Donec viverra mi quis quam pulvinar at malesuada arcu rhoncus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In rutrum accumsan ultricies. Mauris vitae nisi at sem facilisis semper ac in est.
  aside 

HipsterBrown

<header>Header</header>
<section>
  <aside>Aside 1</aside>
  <article>Main Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur. Donec ut libero sed arcu vehicula ultricies a non tortor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ut gravida lorem. Ut turpis felis, pulvinar a semper sed, adipiscing id dolor. Pellentesque auctor nisi id magna consequat sagittis. Curabitur dapibus enim sit amet elit pharetra tincidunt feugiat nisl imperdiet. Ut convallis libero in urna ultrices accumsan. Donec sed odio eros. Donec viverra mi quis quam pulvinar at malesuada arcu rhoncus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In rutrum accumsan ultricies. Mauris vitae nisi at sem facilisis sem

HipsterBrown

  function scrollTo() {
    var steps = this.endPos - this.windowTop;
    var total = (this.options.speed / 1000) * 60;
    
    this.currentVal = steps * this.count / total + this.windowTop;
    
    window.scrollBy(0, this.currentVal);
    
    if(this.count < total) {
      this.count++; 

HipsterBrown

Attribution

Attribution

Attribution