suite

app/views/layouts/public.html.haml

@@ -163,19 +163,14 @@
                     
           =link_to add_banner_public_banners_path(), :remote => true, :onclick => "$('#banner').show();$('#small_banner').closest('#small_banner').hide();" do
             #small_banner{:style => ("display:none;" if !session[:no_banner])}
-              %span{:style => "font-size:20px;"}
-                =ic(:warning)
-              %br
-              Informations
-              %br
-              COVID-2019
+              =image_tag "/covid.png"
                   
           #banner{:style => ("display:none;" if session[:no_banner])}
+            .banner_wrapper
               .left
-              %span{:style => "font-size:25px;"}=ic(:warning)
-              %br
-              COVID-2019
+                =image_tag "/covid.png"
               .right
+                %h4 Continuité de production
                 %p
                   %strong Jipé continue à produire
                   en prenant les mesures nécessaires pour 
@@ -187,6 +182,7 @@
                   %strong prestataires 
                   et
                   %strong fournisseurs. 
+                %h4 Solutions d’urgence et pour l’après confinement
                 %p
                   Après avoir fourni des 
                   %strong structures pour faire face à l’urgence,
@@ -208,27 +204,36 @@
             .clear
 
           :scss
+            .banner_wrapper{
+            max-width:950px;
+            margin:auto;
+
+
+            }
             #small_banner{
               position:absolute;
-              top:50px;
+              top:70px;
               left:0;
            
-              background:#ffedcd;
-              color:#333f48;
-              color:#BF2F2A;
+              background:#F9F1E4;
+              color:#DB3028;
+    
               font-size:14px;
               text-align:center;
-              padding:10px 30px;
+              padding:10px 40px;
               z-index:10;
               font-weight:bold;
+              img{
+              width:100px;
+              }
 
             }
 
 
             #banner{
-              background:#ffedcd;
+              background:#F9F1E4;
               color:#333f48;
-              padding:20px 20px;
+              padding:30px 20px;
               font-size:14px;
               position:relative;
               p{
@@ -238,10 +243,11 @@
               .actions{
                 a{
                   padding:4px 8px;
-                  border:1px solid #BF2F2A;
+                  border:1px solid #DB3028;
                   display:inline-block;
                   margin-right:8px;
                   margin-top:8px;
+                  color:#DB3028;
                 }
 
               }
@@ -251,18 +257,51 @@
               }
 
               .right{
-              margin-left:200px;
-
+              margin-left:230px;
+              h4{
+              margin-bottom:-4px;
+              color:#DB3028;
+              }
               }
 
               .left{
+
               color:#BF2F2A;
               font-size:18px;
               float:left;
-              text-align:center;
-              width:200px;
+              text-align:left;
+              width:250px;
+              img{
+              max-width:180px;display:block;margin:30px 10px;
+              }
               margin-left:-10px;
-              padding-top:30px;
+        
+              }
+
+            }
+
+            @media screen and (max-width: 820px){
+              #small_banner{
+                img{
+                width:50px;
+                }
+
+                padding:8px 15px;
+
+              }
+              #banner{
+                .right{
+                margin:0;
+                padding-bottom:50px;
+                }
+                .left{
+                float:none;
+                width:100%;
+                img{
+                margin:auto;
+                
+                }
+                }
               }
 
             }