renatocarvalho

=background-2x($background, $file: 'png')
  $image: #{$background+"."+$file}
  $image2x: #{$background+"@2x."+$file}
  
  background: image-url($image) no-repeat
  @media (min--moz-device-pixel-ratio: 1.3),(-o-min-device-pixel-ratio: 2.6/2),(-webkit-min-device-pixel-ratio: 1.3),(min-device-pixel-ratio: 1.3),(min-resolution: 1.3dppx)
    background-image: image-url($image2x)
    background-size: image-width($image) image-height($image)

// usage for „logo.png” + „logo2x.png”

renatocarvalho

    <div id="content"><div id="content-inner">
        <!--begin #destaques-noticias-->
        <section class="destaques-categoria area-noticias">
          <header>
            <h1><a title="Notícias" href="/noticias">Notícias</a></h1>
          </header>
          <div class="destaque destaque-secundario"><a href="/noticias-detalhes">
            <span class="foto"><img width="300" src="images/destaque-noticia.jpg" /></span><span class="conteudo">
              <p>Acidente com ônibus deixa 30 feridos no RJ: ‘Ele veio voado’, diz motorista</p>
            </span></a></div>

renatocarvalho

// ---------------------------------------------------------------------------
// Imports
@import base


body
  font-family: $sans
  // +baseline-grid-background

renatocarvalho

// ---------------------------------------------------------------------------
// Imports
@import base


body
  font-family: $sans
  // +baseline-grid-background

renatocarvalho

// ---------------------------------------------------------------------------------
//   Mixin for Media Queries
// ---------------------------------------------------------------------------------
// http://thesassway.com/intermediate/responsive-web-design-in-sass-using-media-queries-in-sass-32
// Device Dimensions inpired on: http://css-tricks.com/snippets/css/media-queries-for-standard-devices


// Usage
// --------------------------------------------------
// .profile-pic

renatocarvalho

This was tested using Ruby 2.0.0 and Rails 4.0.0.rc1.

Bower

1. Set the install directory for Bower components:

   // .bowerrc
   {

"directory": "app/assets/components"

renatocarvalho

Screencasting Framework

The following document is a written account of the Code School screencasting framework. It should be used as a reference of the accompanying screencast on the topic.

Why you should care about screencasting?

You're probably aren't going to take the time to read this document if you're not interested, but there are a lot of nice side effects caused by learning how to create quality screencasts.

1. Communicating more effectively - At Envy Labs we produce screencasts for our clients all the time. Whether it's demoing a new feature or for a presentation for an invester, they're often much more effective and pleasent than a phone call or screen sharing.

renatocarvalho

I'm planning on either writing this up in detail or maybe doing a screencast about screencasting, but I'll give a short version here.

On sound quality:

This matters a lot. In decreasing order of importance:

1. Remove echo. You have to hear this to understand. Set up a mic in front of your mouth and record a sentence. Then, put a thick comforter over you and the mic and say it again at the same distance. Listen to

renatocarvalho

{
  "statusbar_modified_time" : false,
  "statusbar_modified_time_format" : "%A %b %d %H:%M:%S %Y",

  "statusbar_file_size" : false,

  "close_affected_buffers_when_deleting_even_if_dirty" : false,

  "hide_open_with_entries_when_there_are_no_applicable" : false,

renatocarvalho

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

/*
A slightly more automated approach to BEM modifier classes:
using '&' parent selector interpolation, modifiers extend their bases,
so that HTML markup requires only the modifier class not the base *and* modifier
*/