Github Page (customers only): https://github.com/esr360/Kayzen/tree/master/assets/modules/elements/corner-ribbons
<div class="corner-ribbon" data-ribbon="Sale"></div>
You can choose which colors to create a ribbon for in the module's configuration.
<div class="corner-ribbon-pink" data-ribbon="Pink"></div>
You can choose which sizes to create a ribbon for in the module's configuration.
<div class="corner-ribbon-large" data-ribbon="Large"></div>
The corner-ribbons can be customized using the following options:
Read the Configuration page to learn more about a module's configuration.
|Property Name||Default Value||Description|
||The color of the corner-ribbon text.|
||The different colors that should be created.|
||The different sizes that should be created.|
To change one of the above values, pass your new value(s) to the
corner-ribbons() mixin in your theme file (e.g. assets/themes/Kayzen/_kayzen.scss).
The options are recursive, so you always have access to the default options which you don't overwrite. Learn more.
@include corner-ribbons(( 'colors' : ( 'orange' : #ff6600 ), 'sizes' ( 'small' : 0.85em ) ));