ribbonit 0.3.0 → 1.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
-SHA1:
-  metadata.gz: 59e312f51b512269d4ea31095f39b27c2d67e37a
-  data.tar.gz: 6e346df688f98baa773efda599fc5c46647452d3
+SHA256:
+  metadata.gz: c5ca8f4d7bea650a675a768118ad09ebcf436cbe95f030e32f24cb2531a92e2e
+  data.tar.gz: 0af1f3378026d75532001084c855a4db7ab9a2542d10a746ff559ed5c7dee821
 SHA512:
-  metadata.gz: 4c14899ba350feb3d23f684a3c84f34e8227f1d475ea7ad484d5d34afbf1dc24fcde2c95df3790008d87901cc4bbd13c3fd9d280de70970c2a49a5ff27878771
-  data.tar.gz: 6fa6226506a52ef05c0d017e994bdb9a1770f5830bd2e27de73d3c26a84431d4a1f075a5ecd56364226a97a88836f54120e84f385c343ba212eaa8368546ebcf
+  metadata.gz: ab01f4f2611da1cc2d1b39c29aa6715e0aee4d2bea0838c045c51ec74a4592a6d85ba034994a1bab88b806cdb3d310af3f0a13d0c3cac58a40403514146d793f
+  data.tar.gz: 82f5751ad0cd9a167f7732ec2e536ee3ccaf7cb9a773a11e90310ff725b054423dc64a926cca169775c5b7097b7a6c8ad7e07eed0c380e8bb1d0efd0805a9471

data/CHANGELOG.md

@@ -1,59 +1,88 @@
-# Change Log
+# Changelog
 
-## [v0.3.0](https://github.com/anthony-robin/Ribbonit/tree/v0.3.0) (2017-11-06)
-[Full Changelog](https://github.com/anthony-robin/Ribbonit/compare/v0.2.1...v0.3.0)
+## [Unreleased](https://github.com/anthony-robin/ribbonit/tree/HEAD)
+
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/v1.0.0...HEAD)
+
+**Closed issues:**
+
+- +YJIT [\#27](https://github.com/anthony-robin/ribbonit/issues/27)
+- config for production [\#22](https://github.com/anthony-robin/ribbonit/issues/22)
+
+## [v1.0.0](https://github.com/anthony-robin/ribbonit/tree/v1.0.0) (2023-12-09)
+
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/v0.3.0...v1.0.0)
+
+**Implemented enhancements:**
+
+- USE `I18n` files to store hardcoded texts [\#9](https://github.com/anthony-robin/ribbonit/issues/9)
+- Add `extra_content` configuration option [\#28](https://github.com/anthony-robin/ribbonit/pull/28) ([anthony-robin](https://github.com/anthony-robin))
+
+**Closed issues:**
+
+- ADD option to display 'server' name [\#20](https://github.com/anthony-robin/ribbonit/issues/20)
+- ADD specs [\#15](https://github.com/anthony-robin/ribbonit/issues/15)
+
+## [v0.3.0](https://github.com/anthony-robin/ribbonit/tree/v0.3.0) (2017-11-06)
+
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/v0.2.1...v0.3.0)
 
 **Implemented enhancements:**
 
-- REFACTOR way to define environments to apply [\#25](https://github.com/anthony-robin/Ribbonit/pull/25) ([anthony-robin](https://github.com/anthony-robin))
-- UPDATE Rubocop sources [\#24](https://github.com/anthony-robin/Ribbonit/pull/24) ([anthony-robin](https://github.com/anthony-robin))
+- REFACTOR way to define environments to apply [\#25](https://github.com/anthony-robin/ribbonit/pull/25) ([anthony-robin](https://github.com/anthony-robin))
+- UPDATE Rubocop sources [\#24](https://github.com/anthony-robin/ribbonit/pull/24) ([anthony-robin](https://github.com/anthony-robin))
 
 **Merged pull requests:**
 
-- CLEAN documentation options [\#26](https://github.com/anthony-robin/Ribbonit/pull/26) ([anthony-robin](https://github.com/anthony-robin))
+- CLEAN documentation options [\#26](https://github.com/anthony-robin/ribbonit/pull/26) ([anthony-robin](https://github.com/anthony-robin))
 
-## [v0.2.1](https://github.com/anthony-robin/Ribbonit/tree/v0.2.1) (2017-06-04)
-[Full Changelog](https://github.com/anthony-robin/Ribbonit/compare/v0.2.0...v0.2.1)
+## [v0.2.1](https://github.com/anthony-robin/ribbonit/tree/v0.2.1) (2017-06-04)
+
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/v0.2.0...v0.2.1)
 
 **Fixed bugs:**
 
-- FIX broken CSS [\#21](https://github.com/anthony-robin/Ribbonit/pull/21) ([anthony-robin](https://github.com/anthony-robin))
+- FIX broken CSS [\#21](https://github.com/anthony-robin/ribbonit/pull/21) ([anthony-robin](https://github.com/anthony-robin))
+
+## [v0.2.0](https://github.com/anthony-robin/ribbonit/tree/v0.2.0) (2017-05-28)
 
-## [v0.2.0](https://github.com/anthony-robin/Ribbonit/tree/v0.2.0) (2017-05-28)
-[Full Changelog](https://github.com/anthony-robin/Ribbonit/compare/v0.1.0...v0.2.0)
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/v0.1.0...v0.2.0)
 
 **Implemented enhancements:**
 
-- REFACTOR style using BEM syntax [\#19](https://github.com/anthony-robin/Ribbonit/pull/19) ([anthony-robin](https://github.com/anthony-robin))
-- ADD 'root\_link' option that wraps ribbon [\#18](https://github.com/anthony-robin/Ribbonit/pull/18) ([anthony-robin](https://github.com/anthony-robin))
-- ADD Changelog file [\#17](https://github.com/anthony-robin/Ribbonit/pull/17) ([anthony-robin](https://github.com/anthony-robin))
-- ADD 'git\_branch' option [\#14](https://github.com/anthony-robin/Ribbonit/pull/14) ([anthony-robin](https://github.com/anthony-robin))
-- ADD 'sticky' option [\#13](https://github.com/anthony-robin/Ribbonit/pull/13) ([anthony-robin](https://github.com/anthony-robin))
-- USE Array for infos [\#12](https://github.com/anthony-robin/Ribbonit/pull/12) ([anthony-robin](https://github.com/anthony-robin))
-- REPLACE 'minitest' by 'rspec' [\#8](https://github.com/anthony-robin/Ribbonit/pull/8) ([anthony-robin](https://github.com/anthony-robin))
-- ADD Codacy badges [\#5](https://github.com/anthony-robin/Ribbonit/pull/5) ([anthony-robin](https://github.com/anthony-robin))
-- ADD Gemnasium badge [\#4](https://github.com/anthony-robin/Ribbonit/pull/4) ([anthony-robin](https://github.com/anthony-robin))
-- ADD badge displaying 'gem' version [\#3](https://github.com/anthony-robin/Ribbonit/pull/3) ([anthony-robin](https://github.com/anthony-robin))
+- REFACTOR style using BEM syntax [\#19](https://github.com/anthony-robin/ribbonit/pull/19) ([anthony-robin](https://github.com/anthony-robin))
+- ADD 'root\_link' option that wraps ribbon [\#18](https://github.com/anthony-robin/ribbonit/pull/18) ([anthony-robin](https://github.com/anthony-robin))
+- ADD Changelog file [\#17](https://github.com/anthony-robin/ribbonit/pull/17) ([anthony-robin](https://github.com/anthony-robin))
+- ADD 'git\_branch' option [\#14](https://github.com/anthony-robin/ribbonit/pull/14) ([anthony-robin](https://github.com/anthony-robin))
+- ADD 'sticky' option [\#13](https://github.com/anthony-robin/ribbonit/pull/13) ([anthony-robin](https://github.com/anthony-robin))
+- USE Array for infos [\#12](https://github.com/anthony-robin/ribbonit/pull/12) ([anthony-robin](https://github.com/anthony-robin))
+- REPLACE 'minitest' by 'rspec' [\#8](https://github.com/anthony-robin/ribbonit/pull/8) ([anthony-robin](https://github.com/anthony-robin))
+- ADD Codacy badges [\#5](https://github.com/anthony-robin/ribbonit/pull/5) ([anthony-robin](https://github.com/anthony-robin))
+- ADD Gemnasium badge [\#4](https://github.com/anthony-robin/ribbonit/pull/4) ([anthony-robin](https://github.com/anthony-robin))
+- ADD badge displaying 'gem' version [\#3](https://github.com/anthony-robin/ribbonit/pull/3) ([anthony-robin](https://github.com/anthony-robin))
 
 **Fixed bugs:**
 
-- RUN specs with Travis [\#7](https://github.com/anthony-robin/Ribbonit/pull/7) ([anthony-robin](https://github.com/anthony-robin))
+- RUN specs with Travis [\#7](https://github.com/anthony-robin/ribbonit/pull/7) ([anthony-robin](https://github.com/anthony-robin))
 
 **Closed issues:**
 
-- ADD 'git\_branch' option to Ribbon displayed informations [\#16](https://github.com/anthony-robin/Ribbonit/issues/16)
-- CREATE a 'CHANGELOG' file [\#11](https://github.com/anthony-robin/Ribbonit/issues/11)
-- ADD 'sticky' option to Ribbon configuration [\#10](https://github.com/anthony-robin/Ribbonit/issues/10)
+- ADD 'git\_branch' option to Ribbon displayed informations [\#16](https://github.com/anthony-robin/ribbonit/issues/16)
+- CREATE a 'CHANGELOG' file [\#11](https://github.com/anthony-robin/ribbonit/issues/11)
+- ADD 'sticky' option to Ribbon configuration [\#10](https://github.com/anthony-robin/ribbonit/issues/10)
+
+## [v0.1.0](https://github.com/anthony-robin/ribbonit/tree/v0.1.0) (2017-05-21)
+
+[Full Changelog](https://github.com/anthony-robin/ribbonit/compare/d88c4473e5d90902326a4ddbc398237872ee4462...v0.1.0)
 
-## [v0.1.0](https://github.com/anthony-robin/Ribbonit/tree/v0.1.0) (2017-05-21)
 **Implemented enhancements:**
 
-- UPDATE travis instructions, FIX rubocop offenses [\#1](https://github.com/anthony-robin/Ribbonit/pull/1) ([anthony-robin](https://github.com/anthony-robin))
+- UPDATE travis instructions, FIX rubocop offenses [\#1](https://github.com/anthony-robin/ribbonit/pull/1) ([anthony-robin](https://github.com/anthony-robin))
 
 **Fixed bugs:**
 
-- ADD 'line-height' css property [\#2](https://github.com/anthony-robin/Ribbonit/pull/2) ([anthony-robin](https://github.com/anthony-robin))
+- ADD 'line-height' css property [\#2](https://github.com/anthony-robin/ribbonit/pull/2) ([anthony-robin](https://github.com/anthony-robin))
 
 
 
-\* *This Change Log was automatically generated by [github_changelog_generator](https://github.com/skywinder/Github-Changelog-Generator)*
+\* *This Changelog was automatically generated by [github_changelog_generator](https://github.com/github-changelog-generator/github-changelog-generator)*

data/README.md

@@ -39,9 +39,12 @@ $ bin/rails g ribbonit:install
 This will create a `ribbonit.rb` file in `config/initializers`
 
 2) Import assets
-```sass
-// application.sass
-@import ribbon
+```css
+/* application.css */
+
+/*
+*= require ribbon
+*/
 ```
 
 3) Call ribbon in layout
@@ -63,6 +66,9 @@ Ribbonit.configure do |config|
   # git_branch: Current git branch (only displayed in development)
   config.infos_to_display = %i[rails_version ruby_version git_branch]
 
+  # additional extra content to display at the bottom of ribbon
+  config.extra_content = nil # 'Foo bar'
+
   config.root_link = false # Wrap ribbon with root_url link ?
 
   config.hide_for_small = true # Display ribbon in small devices ?

data/app/assets/stylesheets/ribbon.css

@@ -0,0 +1,204 @@
+:root {
+  --ribbon-width: 165px;
+  --ribbon-height: 165px;
+
+  --ribbon-top: 33px;
+  --ribbon-left: -66px;
+  --ribbon-offset: -5px;
+}
+
+.ribbon,
+.ribbon__container {
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.ribbon {
+  display: block;
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: var(--ribbon-width);
+  height: var(--ribbon-height);
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-size: 16px;
+  line-height: 1rem;
+  overflow: hidden;
+  z-index: 1001;
+}
+
+.ribbon__container {
+  position: absolute;
+  top: var(--ribbon-top);
+  left: var(--ribbon-left);
+  width: 260px;
+  padding: 7px 40px;
+  transform: rotate(-45deg);
+  background: #333;
+  color: #fff;
+  font-size: 1rem;
+  text-align: center;
+  text-decoration: none;
+  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
+}
+
+.ribbon__container a {
+  display: block;
+  color: inherit;
+  text-decoration: none;
+}
+
+.ribbon__container a:hover {
+  color: inherit;
+}
+
+.ribbon__container::before,
+.ribbon__container::after {
+  display: block;
+  position: absolute;
+  top: 1px;
+  left: 0;
+  width: 100%;
+  height: 1px;
+  background: #fff;
+  content: '';
+}
+
+.ribbon__container::after {
+  top: auto;
+  bottom: 1px;
+}
+
+.ribbon__container--orange {
+  background: #f80;
+}
+
+.ribbon__container--blue {
+  background: #49a;
+}
+
+.ribbon__container--green {
+  background: #090;
+}
+
+.ribbon__container--red {
+  background: #a00;
+}
+
+.ribbon__container--purple {
+  background: #551a8b;
+}
+
+.ribbon__container--black {
+  background: #333;
+}
+
+.ribbon__container--white {
+  background: #fff;
+  color: #333;
+}
+
+.ribbon__container--white a {
+  color: #333;
+}
+
+.ribbon__container__environment {
+  display: block;
+  text-transform: uppercase;
+}
+
+.ribbon__container__version,
+.ribbon__container__git {
+  display: block;
+  font-size: 11px;
+}
+
+.ribbon--sticky {
+  position: fixed;
+}
+
+.ribbon--top-right {
+  right: 0;
+  left: inherit;
+}
+
+.ribbon--top-right .ribbon__container {
+  right: var(--ribbon-left);
+  left: inherit;
+  transform: rotate(45deg);
+}
+
+.ribbon--bottom-left {
+  top: inherit;
+  bottom: 0;
+}
+
+.ribbon--bottom-left .ribbon__container {
+  top: inherit;
+  bottom: var(--ribbon-top);
+  transform: rotate(45deg);
+}
+
+.ribbon--bottom-right {
+  top: inherit;
+  right: 0;
+  bottom: 0;
+  left: inherit;
+}
+
+.ribbon--bottom-right .ribbon__container {
+  top: inherit;
+  right: var(--ribbon-left);
+  bottom:var(--ribbon-top);
+  left: inherit;
+  transform: rotate(-45deg);
+}
+
+/* 3 lines */
+
+.ribbon--3-lines {
+  width: calc(var(--ribbon-width) + 15px);
+  height: calc(var(--ribbon-height) + 15px);
+}
+
+.ribbon--3-lines.ribbon--top-left,
+.ribbon--4-lines.ribbon--top-left {
+  top: var(--ribbon-offset);
+  left: var(--ribbon-offset);
+}
+
+.ribbon--3-lines.ribbon--top-right,
+.ribbon--4-lines.ribbon--top-right {
+  top: var(--ribbon-offset);
+  right: var(--ribbon-offset);
+}
+
+.ribbon--3-lines.ribbon--bottom-left,
+.ribbon--4-lines.ribbon--bottom-left {
+  bottom: var(--ribbon-offset);
+  left: var(--ribbon-offset);
+}
+
+.ribbon--3-lines.ribbon--bottom-right,
+.ribbon--4-lines.ribbon--bottom-right {
+  right: var(--ribbon-offset);
+  bottom: var(--ribbon-offset);
+}
+
+/* 4 lines */
+
+.ribbon--4-lines {
+  width: calc(var(--ribbon-width) + 30px);
+  height: calc(var(--ribbon-height) + 30px);
+}
+
+.ribbon--4-lines .ribbon__container {
+  width: 280px;
+}
+
+@media only screen and (max-width: 40em) {
+  .ribbon--hide-for-small {
+    display: none;
+  }
+}

data/{lib/app/views/partials → app/views/application}/_lines.html.erb

@@ -15,3 +15,9 @@
     Branch: <strong><%= branch_name %></strong>
   </span>
 <% end %>
+
+<% if config.extra_content.present? %>
+  <span class="ribbon__container__extra">
+    <%= config.extra_content %>
+  </span>
+<% end %>

data/{lib/app/views/partials → app/views/application}/_ribbon.html.erb

@@ -6,10 +6,10 @@
   <div class="ribbon__container ribbon__container--<%= config.themes[Rails.env.to_sym] %>">
     <% if config.root_link %>
       <%= link_to root_url do %>
-        <%= render '/lines', config: config %>
+        <%= render 'lines', config: config %>
       <% end %>
     <% else %>
-      <%= render '/lines', config: config %>
+      <%= render 'lines', config: config %>
     <% end %>
   </div>
 </div>

data/lib/generators/ribbonit/templates/ribbonit.rb

@@ -9,6 +9,11 @@ Ribbonit.configure do |config|
   #
   config.infos_to_display = %i[rails_version ruby_version git_branch]
 
+  ###
+  # Extra content to add at the end
+  #
+  config.extra_content = nil
+
   ###
   # Wrap ribbon with link that goes to root_url ?
   #

data/lib/ribbonit/configuration.rb

@@ -15,6 +15,7 @@ module Ribbonit
     config_accessor(:infos_to_display) do
       %i[rails_version ruby_version]
     end
+    config_accessor(:extra_content) { nil }
     config_accessor(:root_link) { false }
     config_accessor(:hide_for_small) { true }
     config_accessor(:position) { 'top-left' }

data/lib/ribbonit/rails/engine.rb

@@ -6,9 +6,6 @@ module Ribbonit
     class Engine < ::Rails::Engine
       initializer 'ribbonit.view_helpers' do |_app|
         ActionView::Base.send :include, ViewHelpers
-        ActiveSupport.on_load(:action_controller) do
-          append_view_path "#{Gem.loaded_specs['ribbonit'].full_gem_path}/lib/app/views/partials"
-        end
       end
     end
   end

data/lib/ribbonit/version.rb

@@ -1,3 +1,3 @@
 module Ribbonit
-  VERSION = '0.3.0'.freeze
+  VERSION = '1.0.0'.freeze
 end

data/lib/ribbonit/view_helpers.rb

@@ -1,7 +1,7 @@
 module Ribbonit
   module ViewHelpers
     def ribbonit
-      render '/ribbon'
+      render 'ribbon'
     end
 
     def branch_name
@@ -10,10 +10,17 @@ module Ribbonit
 
     def line_count
       height = 1
-      items = Ribbonit.configuration.infos_to_display
+      items = configuration.infos_to_display
       height += 1 if items.include?(:ruby_version) || items.include?(:rails_version)
       height += 1 if items.include?(:git_branch)
+      height += 1 if configuration.extra_content.present?
       height
     end
+
+    private
+
+    def configuration
+      Ribbonit.configuration
+    end
   end
 end

data/ribbonit.gemspec

@@ -19,9 +19,8 @@ Gem::Specification.new do |spec|
   spec.require_paths = ['lib']
 
   spec.add_dependency 'rails'
-  spec.add_dependency 'sassc-rails'
 
-  spec.add_development_dependency 'bundler', '~> 1.14'
+  spec.add_development_dependency 'bundler', '>= 2.2.33'
   spec.add_development_dependency 'rake', '~> 12.0'
   spec.add_development_dependency 'rspec', '~> 3.6'
   spec.add_development_dependency 'byebug'

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: ribbonit
 version: !ruby/object:Gem::Version
-  version: 0.3.0
+  version: 1.0.0
 platform: ruby
 authors:
 - Anthony Robin
-autorequire: 
+autorequire:
 bindir: exe
 cert_chain: []
-date: 2017-11-06 00:00:00.000000000 Z
+date: 2023-12-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -24,34 +24,20 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '0'
-- !ruby/object:Gem::Dependency
-  name: sassc-rails
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
-  type: :runtime
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '0'
 - !ruby/object:Gem::Dependency
   name: bundler
   requirement: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '1.14'
+        version: 2.2.33
   type: :development
   prerelease: false
   version_requirements: !ruby/object:Gem::Requirement
     requirements:
-    - - "~>"
+    - - ">="
       - !ruby/object:Gem::Version
-        version: '1.14'
+        version: 2.2.33
 - !ruby/object:Gem::Dependency
   name: rake
   requirement: !ruby/object:Gem::Requirement
@@ -153,12 +139,13 @@ files:
 - Gemfile
 - README.md
 - Rakefile
+- app/assets/stylesheets/ribbon.css
+- app/views/application/_lines.html.erb
+- app/views/application/_ribbon.html.erb
 - bin/console
 - bin/rspec
 - bin/rubocop
 - bin/setup
-- lib/app/views/partials/_lines.html.erb
-- lib/app/views/partials/_ribbon.html.erb
 - lib/generators/ribbonit/install_generator.rb
 - lib/generators/ribbonit/templates/ribbonit.rb
 - lib/ribbonit.rb
@@ -179,11 +166,10 @@ files:
 - vendor/assets/images/positions/bottom-left.png
 - vendor/assets/images/positions/bottom-right.png
 - vendor/assets/images/positions/top-right.png
-- vendor/assets/stylesheets/_ribbon.sass
 homepage: https://github.com/anthony-robin/ribbonit
 licenses: []
 metadata: {}
-post_install_message: 
+post_install_message:
 rdoc_options: []
 require_paths:
 - lib
@@ -198,9 +184,8 @@ required_rubygems_version: !ruby/object:Gem::Requirement
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubyforge_project: 
-rubygems_version: 2.6.12
-signing_key: 
+rubygems_version: 3.4.1
+signing_key:
 specification_version: 4
 summary: Display Ribbon with Rails env
 test_files: []

data/vendor/assets/stylesheets/_ribbon.sass

@@ -1,143 +0,0 @@
-$ribbon_width: 165px
-$ribbon_height: 165px
-
-$top: 33px
-$left: -66px
-$offset: -5px
-
-.ribbon,
-.ribbon__container
-  -webkit-box-sizing: border-box
-  box-sizing: border-box
-
-.ribbon
-  display: block
-  position: absolute
-  top: 0
-  left: 0
-  width: $ribbon_width
-  height: $ribbon_height
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif
-  font-size: 16px
-  line-height: 1rem
-  overflow: hidden
-  z-index: 1001
-
-  // Container
-  &__container
-    position: absolute
-    top: $top
-    left: $left
-    width: 260px
-    padding: 7px 40px
-    transform: rotate(-45deg)
-    background: #333
-    color: #fff
-    font-size: 1rem
-    text-align: center
-    text-decoration: none
-    box-shadow: 1px 1px 3px rgba(#000, 0.8)
-
-    a
-      display: block
-      color: inherit
-      text-decoration: none
-      &:hover
-        color: inherit
-
-    &::before, &::after
-      display: block
-      position: absolute
-      top: 1px
-      left: 0
-      width: 100%
-      height: 1px
-      background: #fff
-      content: ''
-
-    &::after
-      top: auto
-      bottom: 1px
-
-    // Colors
-    &--orange
-      background: #f80
-    &--blue
-      background: #49a
-    &--green
-      background: #090
-    &--red
-      background: #a00
-    &--purple
-      background: #551a8b
-    &--black
-      background: #333
-    &--white
-      background: #fff
-      color: #333
-      a
-        color: #333
-
-    // Displayed informations
-    &__environment
-      display: block
-      text-transform: uppercase
-
-    &__version, &__git
-      display: block
-      font-size: 11px
-
-  // Sticky
-  &--sticky
-    position: fixed
-
-  // Position
-  &--top-right
-    right: 0
-    left: inherit
-    .ribbon__container
-      right: $left
-      left: inherit
-      transform: rotate(45deg)
-
-  &--bottom-left
-    top: inherit
-    bottom: 0
-    .ribbon__container
-      top: inherit
-      bottom: $top
-      transform: rotate(45deg)
-
-  &--bottom-right
-    top: inherit
-    right: 0
-    bottom: 0
-    left: inherit
-    .ribbon__container
-      top: inherit
-      right: $left
-      bottom: $top
-      left: inherit
-      transform: rotate(-45deg)
-
-  // Ribbon size depending of displayed options
-  &--3-lines
-    width: $ribbon_width + 15px
-    height: $ribbon_height + 15px
-    &--top-left
-      top: $offset
-      left: $offset
-    &--top-right
-      top: $offset
-      right: $offset
-    &--bottom-left
-      bottom: $offset
-      left: $offset
-    &--bottom-right
-      right: $offset
-      bottom: $offset
-
-@media only screen and (max-width: 40em)
-  .ribbon
-    &--hide-for-small
-      display: none