hagenburger

// Released under MIT license: http://www.opensource.org/licenses/mit-license.php

$('[placeholder]').focus(function() {
  var input = $(this);
  if (input.val() == input.attr('placeholder')) {
    input.val('');
    input.removeClass('placeholder');
  }
}).blur(function() {
  var input = $(this);

hagenburger

// Example:

JavaScript.load("/javascripts/something.js");


// With callback (that’s the good thing):

JavaScript.load("http://www.someawesomedomain.com/api.js", function() {
  API.use(); // or whatever api.js provides ...
});

hagenburger

=sprite-image($file)
  background: sprite-image($file)
  height: image-height($file)
  width: image-width($file)


.star
  +sprite-image("icons/star.png")

hagenburger

/*
 * 4 new mixins for sprite support in lemonade:
 * 
 * (1) Sprite classes
 * (2) Sprite classes with dimensions
 * (3) Sprite classes generated from folder
 * (4) Sprite classes with dimensions generated from folder
 * 
 * Source at: http://github.com/hagenburger/lemonade/blob/master/stylesheets/lemonade.scss
 * Don't forget to `gem install lemonade`

hagenburger

/*
 * A Grid Overlay for Any Website
 * ------------------------------
 *
 * Open your browser console, paste in this code and you’re done.
 * (Works at least for Safari, Firefox, Chrome and Internet Explorer 8.0)
 *
 * Adjust variables to your need. The example shows a 960.gs grid with 12 columns à 60px:
 */

hagenburger

run "cd #{release_path} && rake update_stylesheets"

hagenburger

$mobile-max-width: 767px;
$mobile: only screen and (max-width: $mobile-max-width);
$mobile-wide: only screen and (min-width: 480px) and (max-width: $mobile-max-width);
$retina: (min-device-pixel-ratio: 2);

@media $mobile {
  #some-rules {
    background: red;
  }
}

hagenburger

$exend-compass-mixins: true;

.my-box {
  background: red;
  @include box-shadow(black, 0, 1px, 5px);
  @include clearfix;
}

.my-other-box {
  background: green;

hagenburger

<div class="bubble">
  Hallo
</div>

hagenburger

<div class="bubble">
  Hallo
</div>