@biggive/components 0.0.21 → 0.0.25

package/dist/components/biggive-hero-image.js

@@ -0,0 +1,107 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './biggive-button2.js';
+
+const biggiveHeroImageCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents;font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;overflow:hidden;position:relative;margin-bottom:30px}.container.colour-scheme-primary{color:#2C089B}.container.colour-scheme-secondary{color:#2AF135}.container.colour-scheme-tertiary{color:#FF7272}.container.colour-scheme-white{color:#FFFFFF}.container.colour-scheme-black{color:#000000}.container .sleeve{display:flex;justify-content:space-between}.content-wrap{width:40%;position:relative;z-index:1;padding:180px 60px 60px 60px}.content-wrap .logo{height:75px;margin-bottom:30px;background-size:contain;background-repeat:no-repeat;background-position:left center}.content-wrap .logo img{display:none}.content-wrap .slug{font-size:20px;line-height:24px;font-weight:bold;margin:0;padding:0}.content-wrap h1{font-size:50px;line-height:60px;font-weight:bold;margin:0 0 15px 0;padding:0}.content-wrap .teaser{margin:0 0 45px 0;padding:0}.graphic-wrap{position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#F1F1F1;margin-left:20vw;clip-path:polygon(0 0, 100% 0, 100% 100%)}.graphic-wrap .image-wrap{position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-size:cover}.graphic-wrap .image-wrap img{display:none}";
+
+const BiggiveHeroImage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+* Space below component
+*/
+    this.spaceBelow = 0;
+    /**
+     * Colour Scheme
+     */
+    this.colourScheme = 'primary';
+    /**
+     * Header slug
+     */
+    this.slug = null;
+    /**
+     * Header slug colour
+     */
+    this.slugColour = null;
+    /**
+     * Full URL of a logo image.
+     */
+    this.logo = '';
+    /**
+     * Full URL of a main hero image.
+     */
+    this.mainImage = '';
+    /**
+     * Hero image title, typically the page.
+     */
+    this.mainTitle = null;
+    /**
+     * Main title colour
+     */
+    this.mainTitleColour = null;
+    /**
+     * Introductory teaser text
+     */
+    this.teaser = null;
+    /**
+     * Teaser colour
+     */
+    this.teaserColour = null;
+    /**
+     * Button Url
+     */
+    this.buttonUrl = null;
+    /**
+     * Button Label
+     */
+    this.buttonLabel = null;
+    /**
+     * Button Colour Scheme
+     */
+    this.buttonColourScheme = 'primary';
+  }
+  render() {
+    return (h("div", { class: 'container colour-scheme-' + this.colourScheme + ' space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "content-wrap" }, this.logo.length > 0 ? (h("div", { class: "logo image-wrap", style: { 'background-image': 'url(' + this.logo + ')' } }, h("img", { src: this.logo }))) : null, h("div", { class: 'slug text-colour-' + this.slugColour }, this.slug), h("h1", { class: 'main-title text-colour-' + this.mainTitleColour }, this.mainTitle), h("div", { class: 'teaser text-colour-' + this.teaserColour }, this.teaser), this.buttonLabel != null && this.buttonUrl != null
+      ? h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel })
+      : null), h("div", { class: "graphic-wrap" }, this.mainImage.length > 0 ? (h("div", { class: "image-wrap", style: { 'background-image': 'url(' + this.mainImage + ')' } }, h("img", { src: this.mainImage }))) : null))));
+  }
+  static get style() { return biggiveHeroImageCss; }
+}, [1, "biggive-hero-image", {
+    "spaceBelow": [2, "space-below"],
+    "colourScheme": [1, "colour-scheme"],
+    "slug": [1],
+    "slugColour": [1, "slug-colour"],
+    "logo": [1],
+    "mainImage": [1, "main-image"],
+    "mainTitle": [1, "main-title"],
+    "mainTitleColour": [1, "main-title-colour"],
+    "teaser": [1],
+    "teaserColour": [1, "teaser-colour"],
+    "buttonUrl": [1, "button-url"],
+    "buttonLabel": [1, "button-label"],
+    "buttonColourScheme": [1, "button-colour-scheme"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-hero-image", "biggive-button"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-hero-image":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggiveHeroImage$1);
+      }
+      break;
+    case "biggive-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const BiggiveHeroImage = BiggiveHeroImage$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggiveHeroImage, defineCustomElement };

package/dist/components/biggive-icon-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggiveIconGroup extends Components.BiggiveIconGroup, HTMLElement {}
+export const BiggiveIconGroup: {
+  prototype: BiggiveIconGroup;
+  new (): BiggiveIconGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-icon-group.js

@@ -0,0 +1,44 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const biggiveIconGroupCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.container .label{border-bottom:1px solid #4A4A4A;padding-bottom:5px;margin-bottom:10px}.container .sleeve{display:flex}::slotted(*){margin-right:15px}";
+
+const BiggiveIconGroup$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Space below component
+     */
+    this.spaceBelow = 0;
+    /**
+     * Label
+     */
+    this.label = null;
+  }
+  render() {
+    return (h("div", { class: 'container space-below-' + this.spaceBelow }, this.label != null ? h("div", { class: "label" }, this.label) : null, h("div", { class: "sleeve" }, h("slot", null))));
+  }
+  static get style() { return biggiveIconGroupCss; }
+}, [1, "biggive-icon-group", {
+    "spaceBelow": [2, "space-below"],
+    "label": [1]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-icon-group"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-icon-group":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggiveIconGroup$1);
+      }
+      break;
+  } });
+}
+
+const BiggiveIconGroup = BiggiveIconGroup$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggiveIconGroup, defineCustomElement };

package/dist/components/biggive-image-feature.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggiveImageFeature extends Components.BiggiveImageFeature, HTMLElement {}
+export const BiggiveImageFeature: {
+  prototype: BiggiveImageFeature;
+  new (): BiggiveImageFeature;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-image-feature.js

@@ -0,0 +1,100 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$2 } from './biggive-button2.js';
+
+const biggiveImageFeatureCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .sleeve{display:flex;justify-content:space-between}.container .content-wrap{width:calc(40% - 15px);position:relative;z-index:1}.container .content-wrap .slug{font-size:20px;line-height:24px;font-weight:bold;margin:0;padding:0}.container .content-wrap h2{font-size:38px;line-height:45px;font-weight:bold;margin:0 0 15px 0;padding:0}.container .content-wrap .teaser{margin:0 0 45px 0;padding:0}.container .graphic-wrap{width:calc(60% - 15px)}";
+
+const BiggiveImageFeature$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Space below component
+     */
+    this.spaceBelow = 0;
+    /**
+     * Default text colour
+     */
+    this.defaultTextColour = 'primary';
+    /**
+     * Full URL of a image.
+     */
+    this.imageUrl = '';
+    /**
+     * Slug
+     */
+    this.slug = null;
+    /**
+     * Slug colour
+     */
+    this.slugColour = '';
+    /**
+     * Video title
+     */
+    this.mainTitle = null;
+    /**
+     * Slug colour
+     */
+    this.mainTitleColour = '';
+    /**
+     * Introductory teaser text
+     */
+    this.teaser = null;
+    /**
+     * Teaser colour
+     */
+    this.teaserColour = '';
+    /**
+     * Button Url
+     */
+    this.buttonUrl = null;
+    /**
+     * Button Label
+     */
+    this.buttonLabel = null;
+    /**
+     * Button Colour Scheme
+     */
+    this.buttonColourScheme = 'primary';
+  }
+  render() {
+    return (h("div", { class: 'container text-colour-' + this.defaultTextColour + ' space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "content-wrap" }, h("div", { class: 'slug text-colour-' + this.slugColour }, this.slug), h("h2", { class: 'title text-colour-' + this.mainTitleColour }, this.mainTitle), h("div", { class: 'teaser text-colour-' + this.teaserColour }, this.teaser), this.buttonLabel != null && this.buttonUrl != null ? (h("biggive-button", { "colour-scheme": this.buttonColourScheme, url: this.buttonUrl, label: this.buttonLabel })) : null), h("div", { class: "graphic-wrap" }, this.imageUrl.length > 0 ? (h("div", { class: "image-wrap" }, h("img", { src: this.imageUrl }))) : null))));
+  }
+  static get style() { return biggiveImageFeatureCss; }
+}, [1, "biggive-image-feature", {
+    "spaceBelow": [2, "space-below"],
+    "defaultTextColour": [1, "default-text-colour"],
+    "imageUrl": [1, "image-url"],
+    "slug": [1],
+    "slugColour": [1, "slug-colour"],
+    "mainTitle": [1, "main-title"],
+    "mainTitleColour": [1, "main-title-colour"],
+    "teaser": [1],
+    "teaserColour": [1, "teaser-colour"],
+    "buttonUrl": [1, "button-url"],
+    "buttonLabel": [1, "button-label"],
+    "buttonColourScheme": [1, "button-colour-scheme"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-image-feature", "biggive-button"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-image-feature":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggiveImageFeature$1);
+      }
+      break;
+    case "biggive-button":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+
+const BiggiveImageFeature = BiggiveImageFeature$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggiveImageFeature, defineCustomElement };

package/dist/components/biggive-image.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggiveImage extends Components.BiggiveImage, HTMLElement {}
+export const BiggiveImage: {
+  prototype: BiggiveImage;
+  new (): BiggiveImage;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-image.js

@@ -0,0 +1,44 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const biggiveImageCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}";
+
+const BiggiveImage$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Space below component
+     */
+    this.spaceBelow = 0;
+    /**
+     * Full URL of a image.
+     */
+    this.imageUrl = '';
+  }
+  render() {
+    return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "image-wrap" }, h("img", { src: this.imageUrl }))));
+  }
+  static get style() { return biggiveImageCss; }
+}, [1, "biggive-image", {
+    "spaceBelow": [2, "space-below"],
+    "imageUrl": [1, "image-url"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-image"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-image":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggiveImage$1);
+      }
+      break;
+  } });
+}
+
+const BiggiveImage = BiggiveImage$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggiveImage, defineCustomElement };

package/dist/components/biggive-misc-icon.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggiveMiscIcon extends Components.BiggiveMiscIcon, HTMLElement {}
+export const BiggiveMiscIcon: {
+  prototype: BiggiveMiscIcon;
+  new (): BiggiveMiscIcon;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-misc-icon.js

@@ -0,0 +1,6 @@
+import { B as BiggiveMiscIcon$1, d as defineCustomElement$1 } from './biggive-misc-icon2.js';
+
+const BiggiveMiscIcon = BiggiveMiscIcon$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggiveMiscIcon, defineCustomElement };

package/dist/components/biggive-misc-icon2.js

@@ -0,0 +1,55 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { F as FontAwesomeIconsService } from './fontawesome-icons.js';
+
+const biggiveMiscIconCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.misc-icon-item{width:40px;height:40px;border-radius:50%;text-align:center;transition:all ease-in-out 0.5s;display:inline-block}.misc-icon-item.colour-scheme-primary{background-color:#2C089B}.misc-icon-item.colour-scheme-primary svg{fill:#FFFFFF}.misc-icon-item.colour-scheme-secondary{background-color:#2AF135}.misc-icon-item.colour-scheme-secondary svg{fill:#000000}.misc-icon-item.colour-scheme-tertiary{background-color:#FF7272}.misc-icon-item.colour-scheme-tertiary svg{fill:#000000}.misc-icon-item.colour-scheme-white{background-color:#FFFFFF}.misc-icon-item.colour-scheme-white svg{fill:#000000}.misc-icon-item.colour-scheme-black{background-color:#000000}.misc-icon-item.colour-scheme-black svg{fill:#FFFFFF}.misc-icon-item:hover{background-color:#FFFFFF}.misc-icon-item:hover svg{fill:#000000}.misc-icon-item a{display:block;position:relative;padding:5px;width:30px;height:30px}.misc-icon-item a svg{width:auto;height:60%;position:relative;top:50%;transform:translateY(-50%)}";
+
+const BiggiveMiscIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /**
+     * Background colour
+     */
+    this.backgroundColour = 'primary';
+    /**
+     * Background colour
+     */
+    this.iconColour = 'white';
+    /**
+     * Icon
+     */
+    this.icon = null;
+    /**
+     * Url
+     */
+    this.url = '#';
+  }
+  getMiscIcon() {
+    var icon = FontAwesomeIconsService.getMiscIcon(this.icon);
+    return icon;
+  }
+  render() {
+    return (h("div", { class: 'misc-icon-item background-colour-' + this.backgroundColour }, h("a", { href: this.url }, h("svg", { width: this.getMiscIcon().icon[0], height: this.getMiscIcon().icon[1], xmlns: "http://www.w3.org/2000/svg", class: 'fill-' + this.iconColour, viewBox: '0 0 ' + this.getMiscIcon().icon[0] + ' ' + this.getMiscIcon().icon[1] }, h("path", { d: this.getMiscIcon().icon[4].toString() })))));
+  }
+  static get style() { return biggiveMiscIconCss; }
+}, [0, "biggive-misc-icon", {
+    "backgroundColour": [1, "background-colour"],
+    "iconColour": [1, "icon-colour"],
+    "icon": [1],
+    "url": [1]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-misc-icon"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-misc-icon":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggiveMiscIcon);
+      }
+      break;
+  } });
+}
+
+export { BiggiveMiscIcon as B, defineCustomElement as d };

package/dist/components/{demo-campaign-cards.d.ts → biggive-page-column.d.ts}

@@ -1,9 +1,9 @@
 import type { Components, JSX } from "../types/components";
 
-interface DemoCampaignCards extends Components.DemoCampaignCards, HTMLElement {}
-export const DemoCampaignCards: {
-  prototype: DemoCampaignCards;
-  new (): DemoCampaignCards;
+interface BiggivePageColumn extends Components.BiggivePageColumn, HTMLElement {}
+export const BiggivePageColumn: {
+  prototype: BiggivePageColumn;
+  new (): BiggivePageColumn;
 };
 /**
  * Used to define this component and all nested components recursively.

package/dist/components/biggive-page-column.js

@@ -0,0 +1,33 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const biggivePageColumnCss = ":host{display:block}";
+
+const BiggivePageColumn$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return h("slot", null);
+  }
+  static get style() { return biggivePageColumnCss; }
+}, [1, "biggive-page-column"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-page-column"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-page-column":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggivePageColumn$1);
+      }
+      break;
+  } });
+}
+
+const BiggivePageColumn = BiggivePageColumn$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggivePageColumn, defineCustomElement };

package/dist/components/biggive-page-columns.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggivePageColumns extends Components.BiggivePageColumns, HTMLElement {}
+export const BiggivePageColumns: {
+  prototype: BiggivePageColumns;
+  new (): BiggivePageColumns;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-page-columns.js

@@ -0,0 +1,39 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const biggivePageColumnsCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.columns{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;max-width:1200px;padding-left:15px;padding-right:15px;margin-left:auto;margin-right:auto;margin-bottom:15px;display:flex;flex-flow:row wrap;justify-content:space-between}.columns .column-primary{width:calc(66.6% - 15px);box-sizing:border-box}.columns .column-secondary{width:calc(33.4% - 15px);box-sizing:border-box}";
+
+const BiggivePageColumns$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Space below component
+     */
+    this.spaceBelow = 0;
+  }
+  render() {
+    return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "columns" }, h("div", { class: "column-primary" }, h("slot", { name: "column-primary" })), h("div", { class: "column-secondary" }, h("slot", { name: "column-secondary" })))));
+  }
+  static get style() { return biggivePageColumnsCss; }
+}, [1, "biggive-page-columns", {
+    "spaceBelow": [2, "space-below"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-page-columns"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-page-columns":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggivePageColumns$1);
+      }
+      break;
+  } });
+}
+
+const BiggivePageColumns = BiggivePageColumns$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggivePageColumns, defineCustomElement };

package/dist/components/biggive-page-section.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface BiggivePageSection extends Components.BiggivePageSection, HTMLElement {}
+export const BiggivePageSection: {
+  prototype: BiggivePageSection;
+  new (): BiggivePageSection;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/biggive-page-section.js

@@ -0,0 +1,54 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+
+const biggivePageSectionCss = "body{background-color:#D7D7D7}h1{font-size:50px;line-height:60px;font-weight:bold}h2{font-size:38px;line-height:45px;font-weight:bold}h3{font-size:25px;line-height:32px;font-weight:bold}h4{font-size:20px;line-height:24px;font-weight:bold}h5{font-size:17px;line-height:24px;font-weight:bold}a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.colour-primary{color:#2C089B}.colour-secondary{color:#2AF135}.colour-tertiary{color:#FF7272}.colour-white{color:#FFFFFF}.colour-black{color:#000000}.text-colour-primary{color:#2C089B}.text-colour-secondary{color:#2AF135}.text-colour-tertiary{color:#FF7272}.text-colour-white{color:#FFFFFF}.text-colour-black{color:#000000}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.background-colour-primary{background-color:#2C089B}.background-colour-secondary{background-color:#2AF135}.background-colour-tertiary{background-color:#FF7272}.background-colour-white{background-color:#FFFFFF}.background-colour-black{background-color:#000000}.input-wrap{display:flex;justify-content:space-between}.input-text{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;color:#000000;padding:5px 10px;box-sizing:border-box;width:100%}.input-text:focus{outline:0}.input-text:placeholder{color:#4A4A4A}.button{font-size:18px;line-height:23px;padding:15px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;filter:drop-shadow(0px 8px 20px rgba(0, 0, 0, 0.22));color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#2C089B;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;box-shadow:none;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:50%}.progress-bar{display:flex}.progress-bar .slider{margin:auto 15px auto 0;position:relative;flex-grow:1}.progress-bar .slider:before{content:\"\";position:absolute;display:block;top:0;left:0;bottom:0;right:0;background-color:#E8E8E8;border-radius:4px}.progress-bar .slider .progress{position:relative;border-radius:4px;background-color:#000000;height:8px}.progress-bar .counter{font-weight:700;color:#000000;font-size:14px;line-height:18px}.progress-bar-primary .slider .progress{background-color:#2C089B}.progress-bar-primary .counter{color:#2C089B}.progress-bar-secondary .slider .progress{background-color:#2AF135}.progress-bar-secondary .counter{color:#2AF135}.video-wrap video{width:100%;height:auto}.image-wrap img{width:100%;height:auto}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .sleeve{max-width:1200px;padding-left:15px;padding-right:15px;margin-left:auto;margin-right:auto;padding:30px}.container.style-top-crop-right:before{content:\"\";display:block;height:75px;clip-path:polygon(0 0, 0% 100%, 100% 100%);transform:translateY(1px)}.container.style-top-crop-left:before{content:\"\";display:block;height:75px;clip-path:polygon(100% 0, 100% 0%, 100% 100%, 0 100%);transform:translateY(1px)}.container.style-bottom-crop-right:after{content:\"\";display:block;height:75px;clip-path:polygon(0 0, 100% 0, 0 100%);transform:translateY(-1px)}.container.style-bottom-crop-left:after{content:\"\";display:block;height:75px;clip-path:polygon(0 0, 100% 0, 100% 100%);transform:translateY(-1px)}.container .sleeve{position:relative}.container .sleeve:before{content:\"\";position:absolute;left:50%;transform:translateX(-50%);width:100vw;top:0;bottom:0}.container.background-color-primary:before,.container.background-color-primary:after,.container.background-color-primary .sleeve,.container.background-color-primary .sleeve:before{background-color:#2C089B;color:#FFFFFF}.container.background-color-secondary:before,.container.background-color-secondary:after,.container.background-color-secondary .sleeve:before,.container.background-color-secondary .sleeve{background-color:#2AF135;color:#FFFFFF}.container.background-color-tertiary:before,.container.background-color-tertiary:after,.container.background-color-tertiary .sleeve:before,.container.background-color-tertiary .sleeve{background-color:#FF7272;color:#FFFFFF}.container.background-color-white:before,.container.background-color-white:after,.container.background-color-white .sleeve:before,.container.background-color-white .sleeve{background-color:#FFFFFF;color:#000000}.container.background-color-black:before,.container.background-color-black:after,.container.background-color-black .sleeve:before,.container.background-color-black .sleeve{background-color:#000000;color:#FFFFFF}";
+
+const BiggivePageSection$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Space below component
+     */
+    this.spaceBelow = 0;
+    /**
+     * Section style top
+     */
+    this.sectionStyleTop = 'straight';
+    /**
+     * Section style bottom
+     */
+    this.sectionStyleBottom = 'straight';
+    /**
+     * Colour scheme
+     */
+    this.colourScheme = null;
+  }
+  render() {
+    return (h("div", { class: 'container space-below-' + this.spaceBelow + ' background-color-' + this.colourScheme + ' style-top-' + this.sectionStyleTop + ' style-bottom-' + this.sectionStyleBottom }, h("div", { class: "sleeve" }, h("slot", null))));
+  }
+  static get style() { return biggivePageSectionCss; }
+}, [1, "biggive-page-section", {
+    "spaceBelow": [2, "space-below"],
+    "sectionStyleTop": [1, "section-style-top"],
+    "sectionStyleBottom": [1, "section-style-bottom"],
+    "colourScheme": [1, "colour-scheme"]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["biggive-page-section"];
+  components.forEach(tagName => { switch (tagName) {
+    case "biggive-page-section":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, BiggivePageSection$1);
+      }
+      break;
+  } });
+}
+
+const BiggivePageSection = BiggivePageSection$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { BiggivePageSection, defineCustomElement };