@zanichelli/albe-web-components 5.5.5 → 5.5.6-cs1

package/dist/collection/components/footer/z-footer-link/index.js

@@ -1,37 +1,42 @@
-import { Component, Prop, h } from "@stencil/core";
+import { h } from "@stencil/core";
 /**
  * @slot - link label
  */
 export class ZFooterLink {
   render() {
-    return (h("a", { href: this.href, target: "_blank" },
-      h("slot", null)));
+    return (h("a", { href: this.href, target: "_blank" }, h("slot", null)));
   }
   static get is() { return "z-footer-link"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "href": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "link"
-      },
-      "attribute": "href",
-      "reflect": false
-    }
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "href": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "link"
+        },
+        "attribute": "href",
+        "reflect": false
+      }
+    };
+  }
 }

package/dist/collection/components/footer/z-footer-link/styles.css

@@ -5,29 +5,21 @@
 
 :host > a {
   display: inline-block;
-  color: var(--color-white);
+  width: 100%;
   padding: calc(var(--space-unit) / 2 * 3) 0;
   border-bottom: 1px solid var(--gray50);
-  text-decoration: none;
+  color: var(--color-white);
   font-size: 14px;
-  width: 100%;
+  text-decoration: none;
 }
 
 /* Tablet breakpoint */
 @media only screen and (min-width: 768px) {
   :host a {
-    font-size: 12px;
+    width: initial;
+    padding: 0;
     border-bottom: none;
+    font-size: 12px;
     text-decoration: underline;
-    padding: 0;
-    width: initial;
   }
 }
-
-/* Desktop breakpoint */
-@media only screen and (min-width: 1152px) {
-}
-
-/* Wide breakpoint */
-@media only screen and (min-width: 1366px) {
-}

package/dist/collection/components/footer/z-footer-section/index.js

@@ -1,4 +1,4 @@
-import { Component, Prop, h, State } from "@stencil/core";
+import { h } from "@stencil/core";
 /**
  * @slot - section content
  */
@@ -7,45 +7,47 @@ export class ZFooterSection {
     this.isOpen = false;
   }
   renderToggleButton() {
-    return (h("button", { class: "toggleButton", onClick: () => (this.isOpen = !this.isOpen) },
-      h("z-icon", { name: this.isOpen ? "chevron-up" : "chevron-down", width: 16, height: 16 })));
+    return (h("button", { class: "toggle-button", onClick: () => (this.isOpen = !this.isOpen) }, h("z-icon", { name: this.isOpen ? "chevron-up" : "chevron-down", width: 16, height: 16 })));
   }
   render() {
-    return (h("nav", null,
-      h("div", { class: "header" },
-        h("h2", null, this.name),
-        this.renderToggleButton()),
-      h("div", { class: `content ${this.isOpen ? "show" : ""}` },
-        h("slot", null))));
+    return (h("nav", null, h("div", { class: "header" }, h("h2", null, this.name), this.renderToggleButton()), h("div", { class: `content ${this.isOpen ? "show" : ""}` }, h("slot", null))));
   }
   static get is() { return "z-footer-section"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "name": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "section title"
-      },
-      "attribute": "name",
-      "reflect": false
-    }
-  }; }
-  static get states() { return {
-    "isOpen": {}
-  }; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "name": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "section title"
+        },
+        "attribute": "name",
+        "reflect": false
+      }
+    };
+  }
+  static get states() {
+    return {
+      "isOpen": {}
+    };
+  }
 }

package/dist/collection/components/footer/z-footer-section/styles.css

@@ -4,47 +4,43 @@
 }
 
 :host > nav {
-  background-color: var(--gray900);
   display: flex;
-  flex-direction: column;
-  justify-items: flex-start;
   overflow: hidden;
-  margin: calc(var(--space-unit) / 2) 0;
+  flex-direction: column;
   padding: 0;
+  margin: calc(var(--space-unit) / 2) 0;
+  background-color: var(--gray900);
+  justify-items: flex-start;
 }
 
 :host > nav > .header {
   position: relative;
   display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: flex-start;
-  align-items: stretch;
-  align-content: flex-start;
   height: calc(var(--space-unit) * 4);
+  flex-flow: row wrap;
+  align-content: flex-start;
+  align-items: stretch;
+  justify-content: flex-start;
   border-bottom: 1px solid var(--gray50);
+  fill: var(--color-white);
   line-height: 1;
 }
 
 :host > nav > .header > h2 {
+  margin: var(--space-unit) 0;
   color: var(--color-white);
   font-size: 16px;
-  margin: var(--space-unit) 0;
-}
-
-:host > nav > .header {
-  fill: var(--color-white);
 }
 
 :host > nav > .header > button {
   position: absolute;
   top: var(--space-unit);
   right: 0;
-  margin: 0;
   padding: 0;
-  background: transparent;
   border: 0;
+  margin: 0;
   appearance: none;
+  background: transparent;
   cursor: pointer;
 }
 
@@ -53,11 +49,11 @@
 }
 
 :host > nav > .content {
-  background-color: var(--gray800);
   display: none;
   height: 0;
-  transition: 0.3s ease;
   padding: calc(var(--space-unit) * 3) calc(var(--space-unit) * 2);
+  background-color: var(--gray800);
+  transition: 0.3s ease;
 }
 
 :host > nav > .content.show {
@@ -70,22 +66,22 @@
 @media only screen and (min-width: 768px) {
   :host > nav {
     display: grid;
-    grid-template-columns: repeat(4, 1fr);
-    grid-template-rows: 1fr;
-    grid-column-gap: var(--grid-tablet-margin);
     padding: calc(var(--space-unit) * 2) 0;
     border-bottom: 1px solid var(--color-white);
     margin: 0;
     background-color: var(--gray800);
+    grid-column-gap: var(--grid-tablet-margin);
+    grid-template-columns: repeat(4, 1fr);
+    grid-template-rows: 1fr;
   }
 
-  :host > nav > .header > button.toggleButton {
+  :host > nav > .header > button.toggle-button {
     display: none;
   }
 
   :host > nav > .header {
-    border-bottom: none;
     padding: 0;
+    border-bottom: none;
     margin: 0;
   }
 
@@ -95,19 +91,16 @@
 
   :host > nav > .content,
   :host > nav > .content.show {
-    grid-column: span 3;
-    width: 100%;
-    padding: 0;
-    margin: 0;
-
     display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    grid-column-gap: var(--grid-tablet-margin);
-    grid-row-gap: var(--space-unit);
+    width: 100%;
     height: auto;
-    align-items: stretch;
     align-content: stretch;
+    align-items: stretch;
+    padding: 0;
     margin: 0;
+    gap: var(--space-unit) var(--grid-tablet-margin);
+    grid-column: span 3;
+    grid-template-columns: repeat(3, 1fr);
   }
 }
 
@@ -115,10 +108,10 @@
 @media only screen and (min-width: 1152px) {
   :host > nav {
     display: grid;
-    grid-template-columns: 1fr;
-    grid-template-rows: 40px 4fr;
     padding: 0;
     border-bottom: none;
+    grid-template-columns: 1fr;
+    grid-template-rows: 40px 4fr;
   }
 
   :host > nav > .header {
@@ -129,35 +122,29 @@
 
   :host > nav > .header > h2 {
     width: auto;
-    font-size: 16px;
-    line-height: 1;
-    font-weight: 600;
-    color: var(--gray50);
     padding: 0 0 var(--space-unit);
     margin: 0;
+    color: var(--gray50);
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 1;
   }
 
   :host > nav > .header::after {
-    content: "";
-    display: block;
     position: absolute;
     top: 100%;
     left: 0;
+    display: block;
     width: 120px;
     border-bottom: 1px solid var(--gray50);
+    content: "";
   }
 
   :host > nav > .content,
   :host > nav > .content.show {
-    grid-column: auto;
-
     display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
+    flex-flow: column wrap;
     justify-content: flex-start;
+    grid-column: auto;
   }
 }
-
-/* Wide breakpoint */
-@media only screen and (min-width: 1366px) {
-}

package/dist/collection/components/footer/z-footer-social/index.js

@@ -1,68 +1,73 @@
-import { Component, Prop, h } from "@stencil/core";
+import { h } from "@stencil/core";
 export class ZFooterSocial {
   render() {
-    return (h("a", { href: this.href, target: "_blank" },
-      h("img", { src: this.icon, alt: this.description })));
+    return (h("a", { href: this.href, target: "_blank" }, h("img", { src: this.icon, alt: this.description })));
   }
   static get is() { return "z-footer-social"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["styles.css"]
-  }; }
-  static get properties() { return {
-    "icon": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "icon url"
-      },
-      "attribute": "icon",
-      "reflect": false
-    },
-    "href": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "social link"
-      },
-      "attribute": "href",
-      "reflect": false
-    },
-    "description": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+  static get originalStyleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["styles.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "icon": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "icon url"
+        },
+        "attribute": "icon",
+        "reflect": false
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "social description"
+      "href": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "social link"
+        },
+        "attribute": "href",
+        "reflect": false
       },
-      "attribute": "description",
-      "reflect": false
-    }
-  }; }
+      "description": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "social description"
+        },
+        "attribute": "description",
+        "reflect": false
+      }
+    };
+  }
 }

package/dist/collection/components/footer/z-footer-social/styles.css

@@ -7,17 +7,9 @@
   width: calc(var(--space-unit) * 3);
 }
 
-/* Tablet breakpoint */
-@media only screen and (min-width: 768px) {
-}
-
 /* Desktop breakpoint */
 @media only screen and (min-width: 1152px) {
   :host > a > img {
     width: 16px;
   }
 }
-
-/* Wide breakpoint */
-@media only screen and (min-width: 1366px) {
-}