Repository is archived
No commit activity in last 3 years
No release in over 3 years
Sass functions and mixins to inline images and get images size
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
 Dependencies
 Project Readme

Rails Sass Images Build Status

Sass functions and mixins to inline images and get images size:

.icon
  +image-size("icon.png")
  background: inline("icon.png")

.icon-wrap
  width: image-width("icon.png") + 6px
  height: image-height("icon.png")

with HiDPI (Retina) support:

.icon
  +hidpi-inline("icon.png")

.background
  +hidpi-image("big-image.jpg")

and fonts support:

@font-face
  font-family: "MyFont"
  src: inline("my.woff") format('woff')
Sponsored by Evil Martians

Features

Instead of Compass, Rails Sass Images has:

  • HiDPI (Retina) support.
  • Full Assets Pipeline support.
  • Useful shortcuts.
  • More file types support.
  • Smaller and cleaner code.

If you still need Compass for CSS 3 prefixes, see Autoprefixer.

Usage

Ruby on Rails

Add gem to your Rails Gemfile:

gem "rails-sass-images"

and import mixins in your application.sass:

@import "rails-sass-images"

Sprockets

You can use Rails Sass Images with plain Ruby application with Sprockets. Just install in to Sprockets environment:

require 'rails-sass-images'

RailsSassImages.install(sprockets_env)

and import mixins in your Sass files:

@import "rails-sass-images"

Other

You can use Rails Sass Images without Sprockets. Just set dir to load assets:

require 'rails-sass-images'

RailsSassImages.load_from = './images/'

By default, load dir will be current dir ..