Add brief box styles implementation (grey, yellow and black)

diff --git a/app/static/src/sass/modules/boxes/_brief-box.scss b/app/static/src/sass/modules/boxes/_brief-box.scss
index f3e251fa95428a5a04ae80cb67a44fc444ab5203..853c509b0d085c425712d44d7fc25f350b5a2146 100644 (file)
--- a/app/static/src/sass/modules/boxes/_brief-box.scss
+++ b/app/static/src/sass/modules/boxes/_brief-box.scss
@@ -62,6 +62,36 @@ $module: ".brief-box";
         @extend .button--small;
 
         @include margin-bottom(5);
+        margin-right: 0;
+
+    }
+
+    &--black {
+
+        background: $color-black;
+
+        #{$module}__title {
+            color: white;
+        }
+        #{$module}__desc {
+            color: white;
+        }
+
+    }
+
+    &--yellow {
+
+        background: $color-main;
+
+        #{$module}__title {
+            color: $color-black;
+        }
+        #{$module}__desc {
+            color: $color-black;
+        }
+        #{$module}__button {
+            @extend .button--black;
+        }
 
     }
 

diff --git a/app/templates/magazine/brief/inc/brief_card.html b/app/templates/magazine/brief/inc/brief_card.html
index 2953f9697ec65fd69b1bdaedff0bfce94b3416b1..e0eca2261b9404acf54d5298d8f4b86025a2d3e4 100644 (file)
--- a/app/templates/magazine/brief/inc/brief_card.html
+++ b/app/templates/magazine/brief/inc/brief_card.html
@@ -1,8 +1,7 @@
 {% load i18n mezzanine_tags %}
 
-<div class="brief-box">
-    {{ content.content_object.style }}
-
+<div class="brief-box brief-box--{{ content.content_object.style }}">
+    
     <div class="brief-box__head">
         {% trans 'Brief !' %}
     </div>