Giter VIP home page Giter VIP logo

sprites's Introduction

Sprites

Sprites is a library that let's you define the sprites for your application with configuration or convention. Sprites will generate your sprites, and a corresponding stylesheet for each using either the cli or from within a Rails application.

The DSL for sprites.rb

sprite :bas

sprite :buttons, :path => "buttons.png", :stylesheet_path => "buttons.css", :autoload => false do
  sprite_piece 'buttons/btn-black-default-28.png', 'a.black.button > span, button.black.submit span'
  sprite_piece 'buttons/btn-black-default-cap-28.png', 'a.black.button, button.black.submit', :x => 'right'
  ...
end

For the cli

Project Structure

|
|\_config
|   \_sprites.rb
 \_public
    \_images
      \_sprite_images
        |\_sprite_name1
        | |\_blue_icon.png
        |  \_green_icon.png
         \_sprite_name2
           |\_blue_icon.png
            \_green_icon.png

gem install sprites

execute:

cd PROJECT_ROOT
sprites

For usage

sprites --help

In your Rails app

Gemfile

gem 'sprites'

application.rb

config.uses_sprites = true

Optionally include a config/sprites.rb (see above). Otherwise Sprites will use it's auto-load feature. Example, if you have app/assets/images/sprite_images/foo/bar.png and app/assets/images/sprite_images/foo/bas.png, Sprites will create app/assets/stylesheets/sprites/foo.css and app/assets/images/sprites/foo.png. The class for bar.png will be .bar and for bas.png, .bas, etc.

rake sprites

to generate.

In your Rails Engine

engine.rb

module MyGem
  class Engine < Rails::Engine
    config.uses_sprites = true
  end
end

Use app/assets in your gem like you would your rails app and use the asset pipeline.

From your rails root

ENGINES=true rake sprites

Note: this will generate your sprites for your Sprites enabled Engines and your Sprites enabled Rails app.

Contributing

  1. Fork it
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Added some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create new Pull Request

sprites's People

Contributors

shwoodard avatar raggi avatar callumlocke avatar lostboy avatar

Stargazers

 avatar

Watchers

craig t smith avatar  avatar James Cloos avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.