Giter Site home page Giter Site logo

axomi / credit_card_icons Goto Github PK

View Code? Open in Web Editor NEW

This project forked from kristianmandrup/credit_card_icons

0.0 3.0 0.0 3.18 MB

Credit card icons for Rails 3 as an engine, using CSS sprites with icons in various sizes and shapes

License: MIT License

Ruby 100.00%

credit_card_icons's Introduction

Credit Card icons

Credit Card icons for Rails 3.

This gem is a Rails 3 engine and includes a host of asset files including standalone image sets (icons), CSS sprites and stylesheets for the CSS sprites.

Usage

In Gemfile.

gem 'credit_card_icons'

Install via bundler:

bundle

Include the stylesheet(s) of choice in your Rails 3 stylesheets application manifest file, fx application.css or similar:

/*
 *= require credit_cards_default
*/

Using Compass, include stylesheet(s) via @import 'credit_cards_default'; instead.

Use the cards via CSS classes like this:

Stylesheets available

  • credit_cards_default (24x24)

  • credit_cards_24 (24x24)

  • credit_cards_32 (32x32)

  • straight_cards_32 (51x32)

  • straight_cards_64 (102x64)

  • straight_cards_128 (204x128)

  • curved_cards_32 (51x32)

  • curved_cards_64 (102x64)

  • curved_cards_128 (204x128)

Default

%ul.cc
	%li.card.mastercard

Also sizes 32 and 64 and 128px wide, use: cc_24 and cc_32

Straight

Sizes 32, 64 and 128px wide, use: cc_32, cc_64 or cc_128.

%ul.cc_64
  %li.straight_card.mastercard

Curved

Sizes 32, 64 and 128px wide.

%ul.cc_64
  %li.curved_card.mastercard

Not that here the HTML structure is defined using HAML syntax.

Please see the asset directory css files for how to use your stylesheet of choice. Feel free to improve this gem by modifying the css rules and/or include view helpers etc.

Contributing to credit_card_icons

  • Check out the latest master to make sure the feature hasn't been implemented or the bug hasn't been fixed yet.
  • Check out the issue tracker to make sure someone already hasn't requested it and/or contributed it.
  • Fork the project.
  • Start a feature/bugfix branch.
  • Commit and push until you are happy with your contribution.
  • Make sure to add tests for it. This is important so I don't break it in a future version unintentionally.
  • Please try not to mess with the Rakefile, version, or history. If you want to have your own version, or is otherwise necessary, that is fine, but please isolate to its own commit so I can cherry-pick around it.

Copyright

Copyright (c) 2012 Kristian Mandrup. See LICENSE.txt for further details.

credit_card_icons's People

Watchers

 avatar  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.