HOWTOs for Ruby on Rails, RSpec, Cucumber and Javascript

Automatically build sprites with Lemonade

How it works

Unfortunately, the gem has a few problems:

it does not work with Sass2
it always generates all sprites when the sass file changes, which is too slow for big projects
it expects a folder structure quite different to our usual

All these problems are solved for us, in our own lemonade fork. This fork has since been merged to the original gem, maybe we can use t…

Basic styles for flash notifications

.notice,
.error,
.information,
.warning {
    font-weight: bold;
}

.notice {
    color: #11bb00;
}

.error {
    color: #F53A31;
}

.information {
    color: #557;
}

.warning {
    color: #d07d2d;
}

Copy a Paperclip attachment to another record

Just assign the existing attachment to another record:

new_photo = Photo.new
new_photo.image = old_photo.image

Paperclip will duplicate the file when saving.

To use this in forms, pimp your attachment container like this:

class Photo < ActiveRecord::Base
  has_attached_file :image
  
  attr_accessor :copy_of

  def image_url
    if copy_of
      copy_of.url
    else
      image.url
    end
  end
end

And in the controller do:

new_photo = Photo.new(:copy_of => old_photo)

Highlighted prompt for production shells

Insert into ~/.bashrc and reload afterwards: source ~/.bashrc

PS1='${debian_chroot:+($debian_chroot)}\[\033[41;33m\]\u@\h\[\033[00m\]:\[\033[01;34m\]\w\[\033[00m\]\$ '

Generate CSS Sprites on the Fly with Lemonade

Lemonade’s goal as a sprite generator is to be incredible easy to use, so you’ll use ist for every project—just because there’s no overhead. It needs no configuration, no Rake task, no Photoshop, just a little change in your Sass or SCSS files.

hagenburger.net

Handy! RGB to HSL and RGB to HSV color model conversion algorithms in JavaScript - Axon Flux // A Ruby on Rails Blog

Here is a set of additive color model conversion algorithms that I found published on Wikipedia and have implemented in JavaScript.

axonflux.com

jnicklas's carrierwave at master - GitHub

File upload solution that supports form roundtrips when a validation fails.

github.com

michaeldv's awesome_print at master - GitHub

Pretty print your Ruby objects with style – in full color and with proper indentation

github.com

CSS Speech Bubble · David DeSandro

Speech bubble icons have become synonymous with comments. When creating yet another one for a standard comment link, it occurred to me that there might be a way to make the icon without ever opening up an image editor. It could all be done with CSS

desandro.com

htmlBurger PSD to HTML » Home - Convert your Design into Standards compliant XHTML/CSS

We simply convert your design (PSD, PNG, AI, etc.) into a hand coded, pixel perfect and Standards compliant XHTML/CSS. Since our service is targeted to agencies and freelancers the job done by us is 100% confidential. In addition we are offering payment after satisfaction.

htmlburger.com

Image Rollover Borders That Do Not Change Layout | CSS-Tricks

It’s a fact of CSS life that the ‘border’ of any block level element gets factored into it’s final box size for layout. That means that if you add a border on a hover to an element that didn’t already have a border of that exact size, you will cause a layout shift.

css-tricks.com

1 8 9 10 11 12 13 14

Automatically build sprites with Lemonade

How it works

Basic styles for flash notifications

Copy a Paperclip attachment to another record

Highlighted prompt for production shells

Generate CSS Sprites on the Fly with Lemonade

Handy! RGB to HSL and RGB to HSV color model conversion algorithms in JavaScript - Axon Flux // A Ruby on Rails Blog

jnicklas's carrierwave at master - GitHub

michaeldv's awesome_print at master - GitHub

CSS Speech Bubble · David DeSandro

htmlBurger PSD to HTML » Home - Convert your Design into Standards compliant XHTML/CSS

Image Rollover Borders That Do Not Change Layout | CSS-Tricks

MailStyle: A HTML Email Plugin for Ruby on Rails | Purify Blog

The DevIL Image Library For Ruby « Like Dream of Banister Fiend

Highslide JS - JavaScript thumbnail viewer

Pennysmalls

Why Should I Care What Color the Bikeshed Is?

Set up Paperclip to use hashed file paths | Medium eXposure

Index of /projects/sleight