logos by css

intershop · Jan 8, 2020 · 2a5aa9d · 2a5aa9d
1 parent 4c8f17a
commit 2a5aa9d
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 6 deletions.
diff --git a/src/app/shell/header/header-default/header-default.component.html b/src/app/shell/header/header-default/header-default.component.html
@@ -63,17 +63,14 @@
       routerLink="/home"
       class="logo"
       data-testing-id="header-home-link-desktop"
-    >
-      <img src="assets/img/logo.png" alt="Logo" />
-    </a>
+    ></a>
     <a
       *ngIf="showMobileLogoLink"
       rel="home"
       routerLink="/home"
       class="mobile-logo"
       data-testing-id="header-home-link-mobile"
-      ><img src="assets/img/logo_mobile.png" alt="Logo" width="41" height="41"
-    /></a>
+    ></a>
   </div>
 
   <button class="navbar-toggler" type="button" (click)="toggle('navbar')">

diff --git a/src/assets/img/logo_blue.png b/src/assets/img/logo_blue.png
diff --git a/src/assets/img/logo_mobile_blue.png b/src/assets/img/logo_mobile_blue.png
diff --git a/src/theme/components/header/header.scss b/src/theme/components/header/header.scss
@@ -165,8 +165,20 @@ header {
   }
 }
 
+.logo {
+  display: inline-block;
+  width: 114px;
+  height: 40px;
+  background: url('/assets/img/logo.png') center;
+}
+
 .mobile-logo {
-  padding: 0 $space-default * 2 0 $space-default;
+  width: 41px;
+  min-width: 41px;
+  height: 41px;
+  margin: 0 $space-default * 2 0 $space-default;
+  background: url('/assets/img/logo_mobile.png') center no-repeat;
+  background-size: contain;
 }
 
 header .header-checkout {

diff --git a/src/theme/themes/blue/style.scss b/src/theme/themes/blue/style.scss
@@ -7,3 +7,11 @@
 @import '../../main';
 
 // customizations...
+
+.logo {
+  background-image: url('/assets/img/logo_blue.png');
+}
+
+.mobile-logo {
+  background-image: url('/assets/img/logo_mobile_blue.png');
+}