Merge pull request #3408 from betagouv/3407-maj-logo-en-tête

MAJ logo dans le site et widget

frontend/src/components/AppHeader.vue

@@ -21,24 +21,19 @@
       hide-on-scroll
     >
       <v-toolbar-title class="align-self-center">
-        <router-link :to="{ name: 'LandingPage' }" class="text-decoration-none d-flex pl-4">
-          <v-img
-            src="/static/images/Marianne.png"
-            height="90"
-            contain
-            position="center left"
+        <router-link :to="{ name: 'LandingPage' }" class="text-decoration-none d-flex align-center pl-4">
+          <img src="/static/images/Marianne.png" height="90" alt="" />
+          <img
+            v-if="$vuetify.breakpoint.smAndUp"
+            src="/static/images/ma-cantine-logo-light.jpg"
+            height="65"
             alt="Page d'accueil ma cantine"
-          ></v-img>
-          <div v-if="$vuetify.breakpoint.smAndUp" style="height: 90px" class="d-flex align-center">
-            <p id="ma-cantine-header" class="my-0">ma cantine</p>
-          </div>
+          />
+          <v-chip v-if="chipInfo" label outlined :color="chipInfo.color" class="font-weight-bold ml-3" small>
+            {{ chipInfo.text }}
+          </v-chip>
         </router-link>
       </v-toolbar-title>
-      <div v-if="chipInfo">
-        <v-chip label outlined :color="chipInfo.color" class="font-weight-bold ml-3" small>
-          {{ chipInfo.text }}
-        </v-chip>
-      </div>
 
       <v-spacer></v-spacer>
 
@@ -372,12 +367,6 @@ export default {
   max-height: 30px;
   border-left: solid 1px #ccc;
 }
-#ma-cantine-header {
-  font-size: 1.25rem;
-  line-height: 1.75rem;
-  font-weight: 700;
-  color: rgb(22, 22, 22);
-}
 .mc-tab {
   height: 100%;
   line-height: 24px;

frontend/src/components/WidgetHeader.vue

@@ -2,17 +2,14 @@
   <div>
     <v-app-bar app clipped-right color="white" ref="appbar" id="en-tete" hide-on-scroll height="30" class="pt-4">
       <v-toolbar-title>
-        <router-link :to="{ name: 'LandingPage' }" class="text-decoration-none d-flex ml-3" target="_blank">
-          <v-img
-            src="/static/images/Marianne-logo.png"
-            height="20"
-            max-width="60"
-            contain
-            position="center left"
-          ></v-img>
-          <p id="ma-cantine-header" class="text-body-1 grey--text text--darken-3 ml-2 my-0">
-            ma cantine
-          </p>
+        <router-link
+          :to="{ name: 'LandingPage' }"
+          class="text-decoration-none d-flex align-center ml-3"
+          target="_blank"
+          rel="noopener"
+        >
+          <img src="/static/images/Marianne-logo.png" height="20" max-width="60" class="mr-1" />
+          <img src="/static/images/ma-cantine-logo-light.jpg" height="48" alt="ma cantine" />
         </router-link>
       </v-toolbar-title>
     </v-app-bar>