@borderguru/footer - npm Package Compare versions

Comparing version 1.0.1-alpha.003261c to 1.0.1-alpha.06b5fe6

package.json

 {
   "name": "@borderguru/footer",
-  "version": "1.0.1-alpha.003261c",
+  "version": "1.0.1-alpha.06b5fe6",
   "description": "Hermes footer",
@@ -5,0 +5,0 @@ "main": "src/index.js",

src/footer.js

@@ -1,2 +0,2 @@
-import { html } from 'hybrids';
+import { html, property } from 'hybrids';
 import XingLogo from '../assets/xing.svg';
@@ -6,7 +6,11 @@ import LinkedinLogo from '../assets/linkedin.svg';
 
+const parseJSON = (value = []) => typeof value === 'string' ? JSON.parse(value) : value;
+
 // eslint-disable-next-line no-unused-vars
 const inlineStyle = `
   .footer {
+    padding-top: 46px;
     font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
     display: grid;
+    align-items: start;
     grid-template-columns: auto;
@@ -62,3 +66,3 @@ grid-template-rows: auto auto auto;
   .item--icons > div > p {
-    font-size: 16px;
+    font-size: 14px;
     color: #0091CD;
@@ -75,3 +79,3 @@ line-height: 22.4px;
   .item--texts > div > p {
-    font-size: 20px;
+    font-size: 18px;
     line-height: 30.8px;
@@ -81,2 +85,3 @@ color: #909AA0;
     margin-bottom: 0px;
+    margin-top: 0px;
   }
@@ -97,10 +102,11 @@
 
-  @media screen and (min-width: 768px) {
+  @media screen and (min-width: 770px) {
     .footer {
+      padding-top: 51px;
       background: #FFFFFF;
       display: grid;
+      align-items: start;
       grid-template-columns: auto;
       grid-template-rows: auto;
       justify-items: center;
-      align-items: center;
       grid-template-areas:
@@ -114,11 +120,16 @@ "icons icons"
     .footer {
+      padding-top: 42px;
       background: #FFFFFF;
       display: grid;
+      align-items: start;
       grid-template-columns: auto auto auto;
       grid-template-rows: 191px;
       justify-items: center;
-      align-items: center;
       grid-template-areas:
       "icons about legal"
     }
+
+    .item--texts > div > p {
+      font-size: 22px;
+    }
   }
@@ -128,48 +139,51 @@ `;
 export const footer = {
-  render: () => html`
-  <footer class="footer">
-    <section class="item item--icons">
-      <div>
-        <a target="_blank" href="https://www.xing.com/companies/hermesbordergurugmbh">
-          <img class="img" src="${XingLogo}" target="_blank">
-        </a>
-        <p>Xing</p>
-      </div>
-      <div>
-        <a target="_blank" href="https://www.linkedin.com/company/hermesborderguru/">
-          <img class="img" src="${TwitterLogo}" target="_blank">
-        </a>
-        <p>Twitter</p>
-      </div>
-      <div>
-        <a target="_blank" href="https://twitter.com/BorderGuru">
-          <img class="img" src="${LinkedinLogo}" target="_blank">
-        </a>
-        <p>Linkedin</p>
-      </div>
-    </section>
-    <section class="item item--texts about">
-      <div>
-        <p>About</p>
-        <div class="links">
-          <a target="_blank" href="https://www.hermesworld.com/int/our-services/transport-logistics/supply-chain-solutions/tailor-made-solutions/">Hermes International Freight</a>
-          <a target="_blank" href="https://www.hermesworld.com/de/unsere-dienstleistungen/global-e-commerce/global-e-commerce/">Hermes International Parcel</a>
-          <a target="_blank" href="https://status.hermesborderguru.io/">IT Service Health Status</a>
-          <a target="_blank" href="https://www.hermesworld.com/en/careers/">Careers</a>
-        </div>
-      </div>
-    </section>
-    <section class="item item--texts legal">
-      <div>
-        <p>Legal information</p>
-        <div class="links">
-          <a target="_blank" href="https://eportal-hint.hermesworld.com/en/imprint">Imprint</a>
-          <a target="_blank" href="https://eportal-hint.hermesworld.com/en/data-protection">Data protection</a>
-          <a target="_blank" href="https://eportal-hint.hermesworld.com/en/security-advice">Security Advice</a>
-          <p></p>
-        </div>
-      </div>
-    </section>
-  </footer>
-  `.style(inlineStyle),
+  about: property(parseJSON),
+  information: property(parseJSON),
+  render: ({ about, information }) =>
+    html`
+      <footer class="footer">
+        <section class="item item--icons">
+          <div>
+            <a
+              target="_blank"
+              href="https://www.xing.com/companies/hermesbordergurugmbh"
+            >
+              <img class="img" src="${XingLogo}" target="_blank" />
+            </a>
+            <p>Xing</p>
+          </div>
+          <div>
+            <a
+              target="_blank"
+              href="https://www.linkedin.com/company/hermesborderguru/"
+            >
+              <img class="img" src="${TwitterLogo}" target="_blank" />
+            </a>
+            <p>Twitter</p>
+          </div>
+          <div>
+            <a target="_blank" href="https://twitter.com/BorderGuru">
+              <img class="img" src="${LinkedinLogo}" target="_blank" />
+            </a>
+            <p>Linkedin</p>
+          </div>
+        </section>
+        <section class="item item--texts about">
+          <div>
+            <p>About</p>
+            <div class="links">
+              ${about.map(({ href, title, target }) => html`<a target="${target}" href="${href}">${title}</a>`)}
+            </div>
+          </div>
+        </section>
+        <section class="item item--texts legal">
+          <div>
+            <p>Legal information</p>
+            <div class="links">
+            ${information.map(({ href, title, target }) => html`<a target="${target}" href="${href}">${title}</a>`)}
+            </div>
+          </div>
+        </section>
+      </footer>
+    `.style(inlineStyle),
 };

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8999

increased by2.42%

Number of package files

8

increased by14.29%

Lines of code

168

increased by7.69%

No dependency changes