Ribbons

Ribbon Top Right

Allows you to easily add a sash style ribbon with text at the top right corner of the page (like the github fork ribbon) Demo

Margin: auto
Padding: auto
Font: 1em
Background color: #f00
Color:#fff
Hover background color:#c00
Hover font color: #fff

.ribbon-tr(@margin:auto, @padding:auto, @font:1em, @bgcolor:#f00, @color:#fff, @hover:#c00, @hoverfont:#fff);

Import the ribbon mixin into the less file for your site or page:

@import "[path]/mixins/ribbons/ribbon-tr.less";

OR using the absolute url:

@import "https://raw.github.com/commons/less/master/mixins/ribbons/ribbon-tr.less"

Add a ribbon to your style(s) using defaults:

.someclass {  
    .ribbon-tr();  
}

Creating a blue ribbon with light grey text and a darker blue hover colour with white hover text:

.someclass {  
    .ribbon-tr(auto, 2px, auto, #00f, #ccc, #00c, #fff);
}

Working on all above as at 27 Dec 2012