Fork me on GitHub – From SASS/BEM 2 CSS ribbon

This is a pure BEM / SASS -> CSS implementation of the famous Fork me on GitHub ribbon.

Usage

To use it on your site, just view source and copy the two marked sections (one the CSS, the other the HTML tag). You'll also need to grab the CSS files here.

Using with Bower

You can install the CSS files using Bower.

bower install gfr-css-bem

Using with NPM

You can install the CSS files using NPM.

npm install gfr-css-bem --save

Using with webpack

You can use this ribbon and ship the styles with webpack by requiring the SASS or CSS file during your webpack build. Make sure the appropriate loader is configured and works.

# First install the npm package
npm install gfr-css-bem --save

# In your source require the CSS or SASS file e.g.
require('gfr-css-bem/dist/gh-fork-ribbon-bem.min.css');
        

Supported formats

To change the base color of your ribbon add one of the following selectors. See the source code of this page for examples.

gfr__ribbon--red (default)

gfr__ribbon--red (default)

gfr__ribbon--orange

gfr__ribbon--orange

gfr__ribbon--black

gfr__ribbon--black

gfr__ribbon--gray

gfr__ribbon--gray

gfr__ribbon--green

gfr__ribbon--green

gfr__ribbon--pink

gfr__ribbon--pink

gfr__ribbon--white-black

gfr__ribbon--white-black

gfr__ribbon--white-black

gfr__ribbon--white-black

About

This project was inspired by Simon Whitaker and pure CSS port of the famous GitHub fork ribbons. This project is a fork and ported to SASS + BEM. How every as the original fork it is not endorsed in any way by GitHub.