task/issue 399 resize images for better best practise score (#409)

* task: resize images add srcset

* fix: add additional greenwood logo for 5x DPR

* fix: typo srcset

* fix: header merge issue

www/components/banner/banner.js

@@ -1,7 +1,11 @@
 import { html, LitElement } from 'lit-element';
 import bannerCss from './banner.css';
 import buttonCss from './button.css';
-import greenwoodLogo from '../../assets/greenwood-logo.png';
+import greenwoodLogo300 from '../../assets/greenwood-logo-300w.png';
+import greenwoodLogo500 from '../../assets/greenwood-logo-500w.png';
+import greenwoodLogo750 from '../../assets/greenwood-logo-750w.png';
+import greenwoodLogo1000 from '../../assets/greenwood-logo-1000w.png';
+import greenwoodLogo1500 from '../../assets/greenwood-logo-1500w.png';
 import '@evergreen-wc/eve-button';
 import '@evergreen-wc/eve-container';
 
@@ -53,7 +57,14 @@ class Banner extends LitElement {
       <div class='banner'>
         <eve-container>
           <div class='content'>
-            <img src="${greenwoodLogo}" alt="Greenwood Logo"/>
+            <img 
+              src="${greenwoodLogo300}" 
+              alt="Greenwood Logo"
+              srcset="${greenwoodLogo300} 1x,
+                      ${greenwoodLogo500} 2x,
+                      ${greenwoodLogo750} 3x,
+                      ${greenwoodLogo1000} 4x,
+                      ${greenwoodLogo1500} 5x"/>
 
             <h3>The static site generator for your. . . <br /><span class="${this.animateState}">${currentProjectType}.</span></h3>