fix(stark-all): replace the stark logo

  - small refactor

CLOSES ISSUE: #1115

README.md

@@ -1,5 +1,7 @@
 <p align="center">
-  <img src="packages/stark-core/assets/logo/stark_logo_black.png" alt="Stark : a powerful front-end framework" width="150" height="60">
+	<a href="/packages/stark-core/assets/logo/dark/stark_logo_dark_small.png?raw=true" target="_blank" rel="noopener noreferrer">
+		<img src="/packages/stark-core/assets/logo/dark/stark_logo_dark_small.png?raw=true" alt="Stark: a powerful front-end framework" style="max-width:100%;">
+	</a>
 </p>
 
 > An Angular 6+ based front-end framework built on top of [Angular](https://angular.io)...

packages/stark-core/assets/css/pre-load-style.css

@@ -50,17 +50,21 @@
 
 .stark-preload header {
   padding: 16px;
-  background: #143e74 url("/assets/stark-core/logo/stark_header_bg.png") top right no-repeat;
+  background: #143e74 url(/assets/stark-core/logo/stark_header_bg.png) top right no-repeat;
   border-radius: 2px 2px 0 0;
 }
 
 .stark-preload header i {
-  margin: auto;
   display: block;
+  margin: auto;
+
   width: 200px;
   height: 60px;
-  background: url("/assets/stark-core/logo/stark_logo_transparent.svg") no-repeat;
-  background-size: 100% 100%;
+
+  background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg);
+  background-size: contain;
+  background-position: center;
+  background-repeat: no-repeat;
 }
 
 .stark-preload .content {

packages/stark-ui/src/modules/app-logo/components/app-logo.component.scss

@@ -13,8 +13,10 @@
     width: 200px;
     height: 60px;
     margin-top: 0;
-    background-image: url(/assets/stark-core/logo/stark_logo_transparent.svg);
-    background-size: 100% 100%;
+    background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg);
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
   }
 }
 

packages/stark-ui/src/modules/session-ui/pages/_session-ui-pages.scss

@@ -11,24 +11,27 @@
   border: solid 1px $divider-color;
   box-shadow: $elevation-2;
 
-  & header {
+  header {
     padding: 16px;
     background-image: url(/assets/images/app-header.png);
     background-position: top right;
     background-repeat: no-repeat;
     border-radius: 2px 2px 0 0;
 
-    & i {
+    i {
       margin: auto;
       display: block;
+
       width: 200px;
       height: 60px;
-      background: url(/assets/stark-core/logo/stark_logo_transparent.svg) no-repeat;
-      background-size: 100% 100%;
+      background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg);
+      background-size: contain;
+      background-position: center;
+      background-repeat: no-repeat;
     }
   }
 
-  & content {
+  content {
     display: block;
     padding: 16px;
     background: #fff;

showcase/src/app/_app.component.scss

@@ -28,13 +28,17 @@
   .stark-app-sidebar {
     .stark-app-sidenav-menu {
       .stark-app-logo {
-        & i {
+        i {
           display: block;
+          margin-top: 0;
+
           width: 200px;
           height: 60px;
-          margin-top: 0;
-          background-image: url(/assets/stark-core/logo/stark_logo_black.svg);
-          background-size: 100% 100%;
+
+          background-image: url(/assets/stark-core/logo/dark/stark_logo_dark.svg);
+          background-size: contain;
+          background-position: center;
+          background-repeat: no-repeat;
         }
       }
     }

showcase/src/app/welcome/pages/home/_home-page.component.scss

@@ -1,11 +1,16 @@
 //set the header image
 .about-background {
-  background: mat-color($primary-palette, 900) url("/assets/stark-core/logo/stark_logo_transparent.svg") no-repeat center center;
-  background-size: 250px 75px;
-  height: 100px;
   display: flex;
   align-items: center;
+
   margin-bottom: 20px;
+  height: 100px;
+
+  background-color: mat-color($primary-palette, 900);
+  background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg);
+  background-repeat: no-repeat;
+  background-size: 250px 100px;
+  background-position: center;
 }
 
 .light-font {
@@ -73,13 +78,17 @@
 
 @media #{$mobile-only-query} {
   .stark-app-bar-page-title {
+    position: absolute;
     top: 60px;
     left: 0;
-    position: absolute;
-    max-width: 100%;
-    background-image: url(/assets/stark-core/logo/stark_logo_transparent.svg);
-    background-size: 100% 100%;
-    height: 30px;
+
     width: 100px;
+    height: 30px;
+    max-width: 100%;
+
+    background-image: url(/assets/stark-core/logo/light/stark_logo_light.svg);
+    background-size: contain;
+    background-position: center;
+    background-repeat: no-repeat;
   }
 }

showcase/src/app/welcome/pages/news/_news-page.component.scss

@@ -7,10 +7,13 @@
 }
 
 .second-news-image {
-  background: url("/assets/stark-core/logo/stark_logo_black.svg") no-repeat center center;
-  width: 180px;
-  height: 55px;
-  background-size: 100% 100%;
+  height: 60px;
+  width: 200px;
+
+  background-image: url(/assets/stark-core/logo/dark/stark_logo_dark.svg);
+  background-size: contain;
+  background-position: center;
+  background-repeat: no-repeat;
 }
 
 @media #{$desktop-query} {