toggle-components-library 1.28.2 → 1.28.3-zonalbeta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "toggle-components-library",
-  "version": "1.28.2",
+  "version": "1.28.3-zonalbeta.0",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/assets/icons/booster_close.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 31.998 32">
+  <path id="Subtraction_5" data-name="Subtraction 5" d="M-12255-3623a15.914,15.914,0,0,1-6.227-1.257,15.938,15.938,0,0,1-5.086-3.429,15.942,15.942,0,0,1-3.43-5.085A15.912,15.912,0,0,1-12271-3639a15.908,15.908,0,0,1,1.256-6.228,15.937,15.937,0,0,1,3.43-5.085,15.938,15.938,0,0,1,5.086-3.429A15.9,15.9,0,0,1-12255-3655a15.9,15.9,0,0,1,6.229,1.257,15.973,15.973,0,0,1,5.086,3.429,15.974,15.974,0,0,1,3.43,5.085A15.908,15.908,0,0,1-12239-3639a15.912,15.912,0,0,1-1.256,6.229,15.98,15.98,0,0,1-3.43,5.085,15.981,15.981,0,0,1-5.086,3.429A15.917,15.917,0,0,1-12255-3623Zm.139-13.37h0l3.217,3.219a1.7,1.7,0,0,0,1.211.5,1.7,1.7,0,0,0,1.213-.5,1.717,1.717,0,0,0,0-2.424l-3.219-3.219,3.219-3.221a1.7,1.7,0,0,0,.5-1.208,1.713,1.713,0,0,0-.5-1.217,1.7,1.7,0,0,0-1.213-.5,1.7,1.7,0,0,0-1.211.5l-3.217,3.219-3.15-3.149a1.707,1.707,0,0,0-1.215-.5,1.707,1.707,0,0,0-1.215.5,1.724,1.724,0,0,0,0,2.424l3.152,3.152-3.152,3.15a1.724,1.724,0,0,0,0,2.424,1.707,1.707,0,0,0,1.215.5,1.707,1.707,0,0,0,1.215-.5l3.148-3.15Z" transform="translate(12271 3655.001)" fill="#fff"/>
+</svg>

package/src/assets/img/loyaltybooster.svg

@@ -0,0 +1,28 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="290.327" height="52.513" viewBox="0 0 290.327 52.513">
+  <defs>
+    <clipPath id="clip-path">
+      <rect id="Rectangle_1075" data-name="Rectangle 1075" width="290.327" height="52.513" transform="translate(0 0)" fill="none"/>
+    </clipPath>
+  </defs>
+  <g id="Group_363" data-name="Group 363" transform="translate(0 0)">
+    <g id="Group_359" data-name="Group 359" transform="translate(0 0)" clip-path="url(#clip-path)">
+      <path id="Path_295" data-name="Path 295" d="M49.754,1.931a101.435,101.435,0,0,1,46.07,11.06,3.2,3.2,0,0,1,1.753,2.861v20.1a3.2,3.2,0,0,1-1.753,2.861A101.272,101.272,0,0,1,65.5,48.644a101.878,101.878,0,0,1-15.749,1.229A101.893,101.893,0,0,1,34,48.644,101.314,101.314,0,0,1,3.684,38.812a3.2,3.2,0,0,1-1.753-2.861v-20.1A3.2,3.2,0,0,1,3.684,12.99,101.44,101.44,0,0,1,49.754,1.931m0-1.931A103.354,103.354,0,0,0,2.808,11.271h0A5.141,5.141,0,0,0,0,15.852v20.1a5.142,5.142,0,0,0,2.807,4.581h0a103.222,103.222,0,0,0,30.9,10.019A103.778,103.778,0,0,0,49.754,51.8,103.768,103.768,0,0,0,65.8,50.551,103.2,103.2,0,0,0,96.7,40.533a5.142,5.142,0,0,0,2.807-4.581v-20.1A5.14,5.14,0,0,0,96.7,11.271,103.351,103.351,0,0,0,49.754,0" transform="translate(0 0)" fill="#fff"/>
+      <path id="Path_296" data-name="Path 296" d="M212.52,2.379V4.053h-.346V2.379h-.565V2.063h1.476v.316Zm2.519,1.674V2.425L214.5,4h-.249l-.54-1.572V4.053h-.346V2.063h.545l.474,1.435.473-1.435h.53v1.99Z" transform="translate(-114.033 -1.112)" fill="#fff"/>
+      <path id="Path_297" data-name="Path 297" d="M105.06,41.14a2.575,2.575,0,0,0-2.572,2.573v1.017a2.021,2.021,0,0,0,.415,1.414l2.873,5.069c.011.017.017.026.017.02a1.352,1.352,0,0,1,0,.154v1a.736.736,0,1,1-1.471,0V51.7a.608.608,0,0,0-.6-.6h-.638a.607.607,0,0,0-.6.6v.677a2.573,2.573,0,1,0,5.145,0v-1a2.016,2.016,0,0,0-.415-1.394l-2.873-5.067c-.009-.015-.015-.027-.017-.022a1.434,1.434,0,0,1,0-.173V43.713a.736.736,0,1,1,1.471,0v.677a.593.593,0,0,0,.6.6h.638a.593.593,0,0,0,.6-.6v-.677a2.576,2.576,0,0,0-2.573-2.573" transform="translate(-55.23 -22.17)" fill="#fff"/>
+      <path id="Path_298" data-name="Path 298" d="M30.152,31.74a2.766,2.766,0,0,0-.412-.032c-1.674,0-2.937,1.575-2.937,3.664V53.581a.694.694,0,0,0,.156.45.515.515,0,0,0,.39.19.4.4,0,0,0,.07-.006l.875-.134a.734.734,0,0,0,.57-.755V43.973l2.5-.036v8.98a.653.653,0,0,0,.144.425.5.5,0,0,0,.472.175l.875-.134a.711.711,0,0,0,.57-.721V36a4.278,4.278,0,0,0-3.276-4.261m1.215,4.087v5.741l-2.5-.037V35.546c0-.86.552-1.489,1.246-1.4a1.644,1.644,0,0,1,1.257,1.685" transform="translate(-14.443 -17.087)" fill="#fff"/>
+      <path id="Path_299" data-name="Path 299" d="M57.668,36.085l-.875-.134a.537.537,0,0,0-.617.558v17.5a.519.519,0,0,0,.524.537.583.583,0,0,0,.093-.007l.875-.134a.669.669,0,0,0,.569-.652V36.736a.7.7,0,0,0-.569-.652" transform="translate(-30.273 -19.37)" fill="#fff"/>
+      <path id="Path_300" data-name="Path 300" d="M78.679,39.473l-2.268-.347a.968.968,0,0,0-.8.2.74.74,0,0,0-.258.564V54.328a.45.45,0,0,0,.154.344.543.543,0,0,0,.358.125.69.69,0,0,0,.1-.008l.874-.134a.662.662,0,0,0,.57-.582V47.789l1.226-.018,0-.155.04.155a1.4,1.4,0,0,1,.87.281.831.831,0,0,1,.342.651v4.964a.479.479,0,0,0,.617.427l.875-.134a.618.618,0,0,0,.569-.549V48.635a2.237,2.237,0,0,0-.86-1.722,2.182,2.182,0,0,0,.86-1.7V42.486c0-1.385-1.469-2.737-3.275-3.013m1.215,2.839v2.834a.806.806,0,0,1-.341.631,1.439,1.439,0,0,1-.894.279h0l-1.241-.018v-5l1.219.15a1.331,1.331,0,0,1,1.257,1.126" transform="translate(-40.609 -21.077)" fill="#fff"/>
+      <path id="Path_301" data-name="Path 301" d="M131.676,38.464l-.847.1a.645.645,0,0,0-.574.585v6.555l-2.5.029V39.479a.514.514,0,0,0-.612-.461l-.875.107a.634.634,0,0,0-.574.58V53.523a.609.609,0,0,0,.574.558l.875.107a.5.5,0,0,0,.612-.462V47.491l2.5.03v6.531a.621.621,0,0,0,.574.585l.847.1a.63.63,0,0,0,.082.006.5.5,0,0,0,.53-.493v-15.3a.524.524,0,0,0-.612-.488" transform="translate(-67.733 -20.725)" fill="#fff"/>
+      <path id="Path_302" data-name="Path 302" d="M156.456,35.955l-.875.107a.681.681,0,0,0-.574.668V53.8a.657.657,0,0,0,.574.64l.875.107a.58.58,0,0,0,.074,0,.531.531,0,0,0,.538-.548V36.5a.546.546,0,0,0-.612-.544" transform="translate(-83.531 -19.374)" fill="#fff"/>
+      <path id="Path_303" data-name="Path 303" d="M181.619,36.78c0-2.149-1.493-3.8-3.317-3.576l-2.705.33a.72.72,0,0,0-.574.727V53.53a.69.69,0,0,0,.574.7l.874.107a.52.52,0,0,0,.059,0,.564.564,0,0,0,.526-.606V45.018l1.3.015c1.8,0,3.268-1.746,3.268-3.891Zm-2.061,4.415a1.4,1.4,0,0,1-1.239,1.5l-1.263.015V35.665l1.281-.126c.679-.069,1.222.55,1.222,1.38Z" transform="translate(-94.317 -17.882)" fill="#fff"/>
+      <line id="Line_299" data-name="Line 299" x1="4.863" y2="33.909" transform="translate(114.609 9.071)" fill="none" stroke="#fe6c66" stroke-width="1"/>
+      <path id="Path_304" data-name="Path 304" d="M283.719,53.384l4.654-33.335h6.085l-3.892,27.965h14.274l-.761,5.37Z" transform="translate(-152.893 -10.804)" fill="#fff"/>
+      <path id="Path_305" data-name="Path 305" d="M347.11,63.8a12.484,12.484,0,0,1-6.176-1.544,11.626,11.626,0,0,1-6.041-10.447,13.05,13.05,0,0,1,4.005-9.531,13.994,13.994,0,0,1,4.362-2.863,13.536,13.536,0,0,1,5.28-1.03,12.573,12.573,0,0,1,6.219,1.544,11.59,11.59,0,0,1,4.385,4.228,11.85,11.85,0,0,1,1.611,6.219,12.784,12.784,0,0,1-1.075,5.213,13.762,13.762,0,0,1-2.953,4.3A13.517,13.517,0,0,1,347.11,63.8m.089-5.369a6.836,6.836,0,0,0,3.826-1.1,7.49,7.49,0,0,0,2.617-2.953,8.933,8.933,0,0,0,.94-4.094,7.187,7.187,0,0,0-.761-3.378,5.713,5.713,0,0,0-2.125-2.282,6.053,6.053,0,0,0-3.2-.828,6.951,6.951,0,0,0-3.848,1.1,7.48,7.48,0,0,0-2.64,2.931,8.8,8.8,0,0,0-.939,4.072,7.189,7.189,0,0,0,.76,3.378,5.8,5.8,0,0,0,2.148,2.3,6.034,6.034,0,0,0,3.221.85" transform="translate(-180.47 -20.687)" fill="#fff"/>
+      <path id="Path_306" data-name="Path 306" d="M393.652,73.827a8.607,8.607,0,0,1-2.036-.224,7.786,7.786,0,0,1-1.633-.582l.357-4.788q.582.134,1.365.246a9.924,9.924,0,0,0,1.365.112,4.914,4.914,0,0,0,2.26-.469,5.168,5.168,0,0,0,1.61-1.3,13.445,13.445,0,0,0,1.275-1.812l2.193-3.58-.582,4.922-6.8-26.8h6.04l4.654,19.778h-2.326l10.2-19.778h6.667L403.853,66.535a18.512,18.512,0,0,1-2.8,3.96,11.041,11.041,0,0,1-3.379,2.483,9.461,9.461,0,0,1-4.026.85" transform="translate(-210.157 -21.315)" fill="#fff"/>
+      <path id="Path_307" data-name="Path 307" d="M457.841,63.8a10.738,10.738,0,0,1-4.183-.76,6.366,6.366,0,0,1-2.841-2.237,6.173,6.173,0,0,1-1.03-3.624,6.659,6.659,0,0,1,1.186-3.982,8.844,8.844,0,0,1,3.244-2.707,15.386,15.386,0,0,1,4.742-1.454l8.188-1.3-.448,4.475-6.891,1.208a6.68,6.68,0,0,0-2.774,1.141,2.658,2.658,0,0,0-1.119,2.259,2.123,2.123,0,0,0,.917,1.879,4.075,4.075,0,0,0,2.349.627,6.322,6.322,0,0,0,3.222-.828,7.163,7.163,0,0,0,2.371-2.215,6.625,6.625,0,0,0,1.119-3.042l.85-6.085a3.027,3.027,0,0,0-.4-2.036,3.477,3.477,0,0,0-1.522-1.275,5.239,5.239,0,0,0-2.192-.448,6.177,6.177,0,0,0-3.58,1.074,7.324,7.324,0,0,0-2.416,2.729l-4.608-2.55a9.5,9.5,0,0,1,2.55-3.311,12.52,12.52,0,0,1,3.826-2.17,13.42,13.42,0,0,1,4.586-.783,11.622,11.622,0,0,1,5.3,1.163,8.382,8.382,0,0,1,3.512,3.177,6.879,6.879,0,0,1,.805,4.7l-2.192,15.84h-5.594l.581-4.161,1.477.044a12.015,12.015,0,0,1-2.506,2.618,9.5,9.5,0,0,1-3.021,1.544,12.109,12.109,0,0,1-3.512.492" transform="translate(-242.385 -20.687)" fill="#fff"/>
+      <path id="Path_308" data-name="Path 308" d="M508.358,52.756,513.1,18.885h5.906l-4.742,33.871Z" transform="translate(-273.948 -10.177)" fill="#fff"/>
+      <path id="Path_309" data-name="Path 309" d="M545.418,57.679q-4.206,0-6.241-2.349t-1.5-6.421l1.477-10.6h-4.206l.76-5.235h.314A4.374,4.374,0,0,0,539,32.04a4.461,4.461,0,0,0,1.454-2.819l.224-1.7h5.951l-.76,5.548h3.2l1.129,5.235H545.1l-1.477,10.56a4.8,4.8,0,0,0,.068,2.058,1.957,1.957,0,0,0,1.028,1.208,4.815,4.815,0,0,0,2.171.4q.4,0,.805-.022a8.537,8.537,0,0,0,.939-.112l-.447,5.011a6.535,6.535,0,0,1-1.409.224q-.784.044-1.366.045" transform="translate(-288.277 -14.831)" fill="#fff"/>
+      <path id="Path_310" data-name="Path 310" d="M571.964,73.827a8.6,8.6,0,0,1-2.035-.224,7.776,7.776,0,0,1-1.634-.582l.358-4.788c.389.089.842.172,1.365.246a9.934,9.934,0,0,0,1.364.112,4.914,4.914,0,0,0,2.26-.469,5.171,5.171,0,0,0,1.611-1.3,13.6,13.6,0,0,0,1.275-1.812l2.192-3.58-.581,4.922-6.8-26.8h6.04l4.654,19.778H579.7l10.2-19.778h6.667L582.166,66.535a18.574,18.574,0,0,1-2.8,3.96,11.049,11.049,0,0,1-3.378,2.483,9.466,9.466,0,0,1-4.028.85" transform="translate(-306.247 -21.315)" fill="#fff"/>
+    </g>
+  </g>
+</svg>

package/src/components/boosters/ToggleBoosterBasicButton.vue

@@ -0,0 +1,45 @@
+<template>
+
+    <button :class="['toggle-booster-basic-button', boosterType, {'disabled': disabled}]" :disabled="disabled" @click="click">
+      <slot>{{buttonText}}</slot>
+    </button>
+  
+</template>
+  
+  <script>
+  
+  export default {
+    name: 'ToggleBoosterBasicButton',
+    components: {
+    },
+    props: {
+      buttonText: {
+        type: String,
+        default: "Create sign up form"
+      },
+        // boosterType will define which logo and colour palette is used 
+        boosterType: {
+        type: String,
+        default: 'loyalty'
+      },
+      disabled: {
+        type: Boolean,
+        default: false,
+      }
+    },
+    methods: {
+      click() {
+        /**
+         * Emitted when the button is clicked.
+         * @event click
+         * @type {Event}
+         */
+        this.$emit('click');
+      },
+    },
+  };
+  </script>
+  
+  <style scoped>
+  
+  </style>

package/src/components/boosters/ToggleBoosterButton.vue

@@ -0,0 +1,53 @@
+<template>
+  <button :class="['toggle-booster-button-container', boosterType]" @click="click">
+
+    <img
+      :src="logo.src"
+      :alt="logo.alt"
+      class="toggle-booster-button-logo"
+    >
+
+    <div :class="['toggle-booster-button', boosterType]" >
+      <p class="plus">+</p>
+      <slot>{{buttonText}}</slot>
+    </div>
+  </button>
+</template>
+  
+  <script>
+  
+  export default {
+    name: 'ToggleBoosterButton',
+    components: {
+    },
+    props: {
+      // boosterType will define which logo and colour palette is used 
+      boosterType: {
+        type: String,
+        default: 'loyalty'
+      },
+      buttonText: {
+        type: String,
+        default: "Create sign up form"
+      },
+      logo: {
+        type: Object,
+        required: true,
+      },
+    },
+    methods: {
+      click() {
+        /**
+         * Emitted when the button is clicked.
+         * @event click
+         * @type {Event}
+         */
+        this.$emit('click');
+      },
+    },
+  };
+  </script>
+  
+  <style scoped>
+  
+  </style>

package/src/components/boosters/ToggleBoosterModal.vue

@@ -0,0 +1,99 @@
+<template>
+        <transition name="toggle-modal">
+            <div class="toggle-modal-mask toggle-modal-close" v-if="showModal" @mousedown="backgroundClick">
+              <div class="toggle-modal-wrapper toggle-modal-close" >
+                <div :class="['toggle-modal-container','toggle-booster-modal', boosterType]" >
+
+                    <span class="toggle-booster-modal-close-button" @click="showModal = false"></span>
+                    
+                    <img
+                    :src="logo.src"
+                    :alt="logo.alt"
+                    class="toggle-booster-modal-logo"
+                    >
+
+                    <slot></slot>
+
+                    <a v-if="showContactPrompt" :href="contactLink" class="toggle-booster-contact-prompt"><span class="contact-us-prompt">Contact us</span> {{ contactPromptText }}</a>
+                
+                </div>
+              </div>
+          </div>
+        </transition>
+</template>
+
+<script>
+
+import { mixins } from '../mixins/mixins'
+
+export default {
+    mixins:[mixins],
+    props: {
+        name: {
+            type: String,
+            required: true
+        },
+        logo: {
+            type: Object,
+            required: true,
+        },
+        boosterType: {
+            type: String,
+            default: 'loyalty'
+        },
+        showContactPrompt: {
+            type: Boolean,
+            default: false
+        },
+        contactPromptText:{
+            type: String,
+            default: 'to activate this feature'
+        },
+        contactLink:{
+            type: String,
+            default:'https://www.usetoggle.com/demo'
+        }
+    },
+
+    components: {
+    },
+
+    data : function(){
+        return {
+            showModal:false
+        }; 
+    },
+    created : function(){
+        this.$toggle_event.$on('modal_show', this.show);
+        this.$toggle_event.$on('modal_hide', this.hide);
+
+    },
+    beforeDestroy() {
+        this.$toggle_event.$off('modal_show', this.show);
+        this.$toggle_event.$off('modal_hide', this.hide);
+    },
+    computed: {
+       
+    },
+    methods: {
+
+        show(payload)
+        {
+            if(payload == this.name)
+                this.showModal = true;
+        },
+        hide(payload)
+        {
+            if(payload == this.name)
+                this.showModal = false;
+        },
+
+        backgroundClick(e)
+        {
+            if(e.target.classList.contains('toggle-modal-close'))
+                this.showModal = false;
+        }
+    }
+}
+
+</script>

package/src/index.js

@@ -23,6 +23,10 @@ import ToggleInputNumber from "./components/forms/ToggleInputNumber.vue";
 import ToggleColourPicker from "./components/forms/ToggleColourPicker.vue";
 import ToggleModal from "./components/modals/ToggleModal.vue";
 
+import ToggleBoosterButton from "./components/boosters/ToggleBoosterButton.vue";
+import ToggleBoosterBasicButton from "./components/boosters/ToggleBoosterBasicButton.vue";
+import ToggleBoosterModal from "./components/boosters/ToggleBoosterModal.vue";
+
 import ToggleInputSearch from "./components/forms/ToggleInputSearch.vue";
 import ToggleInputRadioButtonGroup from "./components/forms/ToggleInputRadioButtonGroup.vue";
 import ToggleButton from "./components/buttons/ToggleButton.vue";
@@ -133,8 +137,10 @@ const Components = {
     ToggleMetricPieChart,
     ToggleMetricFunnelChart,
     ToggleThreeDots,
-    ToggleThreeDotsButton
-
+    ToggleThreeDotsButton,
+    ToggleBoosterButton,
+    ToggleBoosterBasicButton,
+    ToggleBoosterModal
 }
 
 Object.keys(Components).forEach(name => {

package/src/sass/includes/_as_boosters.scss

@@ -0,0 +1,142 @@
+.toggle-booster-button-container{
+    border: 0;
+    font-family: $toggle-font-family;
+    width: fit-content;
+    font-weight: bold;
+    display: grid;
+    padding: 0.3rem;
+    border-radius: 0.6rem;
+    align-items: center;
+    justify-content: center;
+   
+    &.loyalty{
+        background-color: $booster-loyalty-colour-light;
+    }
+
+    &.test{
+        background-color: $booster-test-colour-light;
+    }
+}
+
+.toggle-booster-button-logo{
+    width: auto;
+    height: 1.1rem;
+    margin-left: 0.6rem;
+    margin-right: 0.9rem;
+}
+    
+.toggle-booster-button {
+    font-family: $toggle-font-family;
+    padding-right: 0.6rem;
+    display: flex;
+    align-items: center;
+    font-weight: bold;
+    height: 30px;
+    border-radius: 0.3rem;
+    border: none;
+    grid-column: 3;
+    color: #ffffff;
+    cursor: pointer;
+
+    //additional colours follow below pattern - background transparency without changing text
+    &.loyalty{ 
+        background-color: rgba($booster-loyalty-colour-med, 0.8);
+        &:hover{
+            background-color: rgba($booster-loyalty-colour-med, 1);
+        }
+    }
+
+    &.test{
+        background-color: rgba($booster-test-colour-med, 0.8);
+        &:hover{
+            background-color: rgba($booster-test-colour-med, 1);
+        }
+    }
+
+    .plus{
+    padding-right: 0.5rem;
+    padding-left: 0.6rem;
+    }
+}
+
+.toggle-booster-basic-button{
+    font-family: $toggle-font-family;
+    font-size: 1rem;
+    padding-right: 0.5rem;
+    font-weight: bold;
+    height: 3rem;
+    width: 16rem;
+    background-color: #fff;
+    border-radius: 0.5rem;
+    border: none;
+    opacity: 0.9;
+    cursor: pointer;
+
+    &:hover{
+        opacity: 1;
+    }
+
+    &.loyalty{
+        color: $booster-loyalty-colour-light;
+    }
+
+    &.test{
+        color: $booster-test-colour-light;
+    }
+
+    &.disabled{
+        opacity:0.5;
+    }
+}
+
+.toggle-booster-modal{
+    width: fit-content;
+    min-width: 0;
+    padding: 2rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1rem;
+    border-radius: 1.5rem;
+
+    &.loyalty{
+        background-color: $booster-loyalty-colour-light;
+    }
+
+    &.test{
+        background-color: $booster-test-colour-light;
+    } 
+    .toggle-booster-modal-logo{
+        height: 2rem;
+        width: auto;
+        margin-bottom: 1rem;
+    }
+    .toggle-booster-contact-prompt{
+        margin: 0;
+        color: #fff;
+        font-family: $toggle-font-family;
+        font-size: 0.7rem;
+        
+        .contact-us-prompt{
+        text-decoration: underline;
+        }
+    }
+}
+
+.toggle-booster-modal-close-button{
+    background-image: url("../assets/icons/booster_close.svg");
+    position:absolute;
+    width:1rem;
+    height:1rem;
+    right:1rem;
+    top:1rem;
+    cursor: pointer;
+    z-index: 99;
+    opacity   : 0.5;
+
+    &:hover{
+        opacity: 1;
+    }
+  
+  }
+

package/src/sass/includes/_as_modals.scss

@@ -53,6 +53,7 @@
     background-image: url("../assets/icons/delete-grey.svg");
 }
 
+
 /*
  * The following styles are auto-applied to elements with
  * transition="modal" when their visibility is toggled

package/src/sass/includes/_as_variables.scss

@@ -41,6 +41,15 @@ $toggle-button-neutral:$toggle-light-blue;
 $toggle-button-disabled:#d6d6d6;
 $toggle-button-amber: #E6A831;
 
+/* Booster Colours */
+$booster-loyalty-colour-light:#aacc00;
+$booster-loyalty-colour-med:#97b500;
+$booster-loyalty-colour-dark:#7da400;
+
+$booster-test-colour-light:#02add3;
+$booster-test-colour-med:#0098ac;
+$booster-test-colour-dark:#008ba4;
+
 /* metrics */
 $toggle-metric-label-blue: #477EF6;
 $toggle-metric-label-black: #354B64;

package/src/sass/main.scss

@@ -20,3 +20,4 @@
 @import "./includes/_as_notifications.scss";
 @import "./includes/_as_metrics.scss";
 @import "./includes/_as_threedots.scss";
+@import "./includes/_as_boosters.scss";

package/dist/demo.html

@@ -1,10 +0,0 @@
-<meta charset="utf-8">
-<title>toggle-components-library demo</title>
-<script src="./toggle-components-library.umd.js"></script>
-
-<link rel="stylesheet" href="./toggle-components-library.css">
-
-
-<script>
-console.log(toggle-components-library)
-</script>

package/dist/img/add_circle.7c6b29c6.svg

@@ -1,29 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="7685 5379 14 14">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #edffdd;
-      }
-
-      .cls-1, .cls-2 {
-        stroke: #71be37;
-      }
-
-      .cls-2, .cls-4 {
-        fill: none;
-      }
-
-      .cls-3 {
-        stroke: none;
-      }
-    </style>
-  </defs>
-  <g id="Symbol_1_114" data-name="Symbol 1 – 114" transform="translate(6828 4814)">
-    <g id="Ellipse_12" data-name="Ellipse 12" class="cls-1" transform="translate(854.1 572) rotate(-45)">
-      <circle class="cls-3" cx="7" cy="7" r="7"/>
-      <circle class="cls-4" cx="7" cy="7" r="6.5"/>
-    </g>
-    <line id="Line_20" data-name="Line 20" class="cls-2" x1="5.137" y2="5.137" transform="translate(860.5 571.8) rotate(-45)"/>
-    <line id="Line_21" data-name="Line 21" class="cls-2" x2="5.137" y2="5.137" transform="translate(860.5 571.8) rotate(-45)"/>
-  </g>
-</svg>

package/dist/img/airship-audiences-hover.7197407c.svg

@@ -1,9 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
-  <g id="Group_340" data-name="Group 340" transform="translate(-5223.304 -1302)">
-    <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#477ef6"/>
-    <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
-      <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#477ef6"/>
-      <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#477ef6"/>
-    </g>
-  </g>
-</svg>

package/dist/img/airship-audiences.e7477e19.svg

@@ -1,9 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
-  <g id="Group_339" data-name="Group 339" transform="translate(-5223.304 -1302)">
-    <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#354b64"/>
-    <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
-      <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#354b64"/>
-      <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#354b64"/>
-    </g>
-  </g>
-</svg>

package/dist/img/airship-circle-user-icon-hover.7eecff69.svg

@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
-  <path id="Exclusion_3" data-name="Exclusion 3" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-4.034-45.308a12.917,12.917,0,0,0-9.831,4.836,16.519,16.519,0,0,0-3.95,10.54,2.967,2.967,0,0,0,.64,1.918,2.452,2.452,0,0,0,1.905.842h.089c.04,0,.081,0,.121,0l30.117-1.59h.007a2.756,2.756,0,0,0,2.749-2.756,13.7,13.7,0,0,0-4.037-9.747,13.69,13.69,0,0,0-9.745-4.039Zm4.03-25.366a10.193,10.193,0,0,0-10.181,10.181,10.191,10.191,0,0,0,10.181,10.177,10.111,10.111,0,0,0,7.2-2.981,10.1,10.1,0,0,0,2.981-7.2,10.111,10.111,0,0,0-2.981-7.2A10.111,10.111,0,0,0-11986-16099.674Z" transform="translate(12033.001 16123.001)" fill="#477ef6"/>
-</svg>

package/dist/img/airship-circle-user-icon.b39571b4.svg

@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
-  <path id="Exclusion_1" data-name="Exclusion 1" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-4.034-45.308a12.917,12.917,0,0,0-9.831,4.836,16.519,16.519,0,0,0-3.95,10.54,2.967,2.967,0,0,0,.64,1.918,2.452,2.452,0,0,0,1.905.842h.089c.04,0,.081,0,.121,0l30.117-1.59h.007a2.756,2.756,0,0,0,2.749-2.756,13.7,13.7,0,0,0-4.037-9.747,13.69,13.69,0,0,0-9.745-4.039Zm4.03-25.366a10.193,10.193,0,0,0-10.181,10.181,10.191,10.191,0,0,0,10.181,10.177,10.111,10.111,0,0,0,7.2-2.981,10.1,10.1,0,0,0,2.981-7.2,10.111,10.111,0,0,0-2.981-7.2A10.111,10.111,0,0,0-11986-16099.674Z" transform="translate(12033.001 16123.001)" fill="#354b64"/>
-</svg>

package/dist/img/airship-clipboard-hover.80ae4cc8.svg

@@ -1,10 +0,0 @@
-<svg id="Group_302" data-name="Group 302" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="77.291" height="96" viewBox="0 0 77.291 96">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_722" data-name="Rectangle 722" width="77.291" height="96" fill="#477ef6"/>
-    </clipPath>
-  </defs>
-  <g id="Group_288" data-name="Group 288" clip-path="url(#clip-path)">
-    <path id="Path_180" data-name="Path 180" d="M69.583,14.842,59.83,13.67A17.4,17.4,0,0,0,27.207,9.751L17.451,8.579a8.751,8.751,0,0,0-9.733,7.645L.063,79.941a8.753,8.753,0,0,0,7.645,9.733L59.84,95.937a8.751,8.751,0,0,0,9.733-7.645l7.655-63.717a8.751,8.751,0,0,0-7.645-9.733M37.028,16.807a5.834,5.834,0,1,1,5.1,6.488,5.831,5.831,0,0,1-5.1-6.488m-20.8,22.55A4.066,4.066,0,0,1,20.745,35.8l12.743,1.531a4.066,4.066,0,0,1-.97,8.073L19.775,43.878a4.066,4.066,0,0,1-3.552-4.522M14.436,54.236a4.066,4.066,0,0,1,4.522-3.552l22.989,2.762a4.066,4.066,0,1,1-.97,8.073L17.988,58.758a4.066,4.066,0,0,1-3.552-4.522M60,73.886h0a4.066,4.066,0,0,1-4.522,3.552L16.309,72.732a4.066,4.066,0,1,1,.97-8.073L56.45,69.364A4.066,4.066,0,0,1,60,73.886" transform="translate(0 0)" fill="#477ef6"/>
-  </g>
-</svg>

package/dist/img/airship-clipboard.4e2aec57.svg

@@ -1,10 +0,0 @@
-<svg id="Group_289" data-name="Group 289" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="77.291" height="96" viewBox="0 0 77.291 96">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_722" data-name="Rectangle 722" width="77.291" height="96" fill="none"/>
-    </clipPath>
-  </defs>
-  <g id="Group_288" data-name="Group 288" clip-path="url(#clip-path)">
-    <path id="Path_180" data-name="Path 180" d="M69.583,14.842,59.83,13.67A17.4,17.4,0,0,0,27.207,9.751L17.451,8.579a8.751,8.751,0,0,0-9.733,7.645L.063,79.941a8.753,8.753,0,0,0,7.645,9.733L59.84,95.937a8.751,8.751,0,0,0,9.733-7.645l7.655-63.717a8.751,8.751,0,0,0-7.645-9.733M37.028,16.807a5.834,5.834,0,1,1,5.1,6.488,5.831,5.831,0,0,1-5.1-6.488m-20.8,22.55A4.066,4.066,0,0,1,20.745,35.8l12.743,1.531a4.066,4.066,0,0,1-.97,8.073L19.775,43.878a4.066,4.066,0,0,1-3.552-4.522M14.436,54.236a4.066,4.066,0,0,1,4.522-3.552l22.989,2.762a4.066,4.066,0,1,1-.97,8.073L17.988,58.758a4.066,4.066,0,0,1-3.552-4.522M60,73.886h0a4.066,4.066,0,0,1-4.522,3.552L16.309,72.732a4.066,4.066,0,1,1,.97-8.073L56.45,69.364A4.066,4.066,0,0,1,60,73.886" transform="translate(0 0)" fill="#354b64"/>
-  </g>
-</svg>

package/dist/img/airship-cog-hover.9bfe1b84.svg

@@ -1,10 +0,0 @@
-<svg id="Group_305" data-name="Group 305" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="95.626" height="96" viewBox="0 0 95.626 96">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_725" data-name="Rectangle 725" width="95.626" height="96" fill="#477ef6"/>
-    </clipPath>
-  </defs>
-  <g id="Group_294" data-name="Group 294" clip-path="url(#clip-path)">
-    <path id="Path_184" data-name="Path 184" d="M95.593,42.307a4.266,4.266,0,0,1-2.24,4.214L86.2,50.433a5.744,5.744,0,0,0-2.882,4.035q-.185,1.024-.432,2.047t-.553,2.018a5.745,5.745,0,0,0,.714,4.907l4.568,6.754a4.266,4.266,0,0,1,.061,4.772,47.7,47.7,0,0,1-4.387,5.57l-1.217,1.271a49.539,49.539,0,0,1-5.423,4.739,4.3,4.3,0,0,1-4.776.157L64.9,82.456a5.682,5.682,0,0,0-4.838-.514,41.751,41.751,0,0,1-4.126,1.2A5.736,5.736,0,0,0,52.1,86.2l-3.59,7.368A4.341,4.341,0,0,1,45.435,95.9a5.176,5.176,0,0,1-1.5.08,49.266,49.266,0,0,1-7.618-1.246,47.972,47.972,0,0,1-7.01-2.3A5.193,5.193,0,0,1,28,91.671a4.34,4.34,0,0,1-1.665-3.477l.182-8.152a5.736,5.736,0,0,0-2.033-4.49,36.983,36.983,0,0,1-3.047-2.912,5.742,5.742,0,0,0-4.606-1.831l-8.113.582a4.291,4.291,0,0,1-4.176-2.327,49.337,49.337,0,0,1-2.653-6.7l-.5-1.687A46.889,46.889,0,0,1,.029,53.718a4.27,4.27,0,0,1,2.249-4.212L9.431,45.59a5.743,5.743,0,0,0,2.878-4.024q.187-1.028.436-2.055t.553-2.026a5.743,5.743,0,0,0-.716-4.895L8.018,25.833a4.262,4.262,0,0,1-.07-4.775,47.088,47.088,0,0,1,4.4-5.566l1.212-1.273a48.671,48.671,0,0,1,5.424-4.729,4.268,4.268,0,0,1,4.778-.158l6.945,4.226a5.743,5.743,0,0,0,4.935.478,36.14,36.14,0,0,1,4.036-1.19,5.739,5.739,0,0,0,3.874-3.064L47.12,2.461A4.264,4.264,0,0,1,51.233.012,48.686,48.686,0,0,1,66.759,3.776a4.264,4.264,0,0,1,2.535,4.061l-.183,8.185A5.74,5.74,0,0,0,71.133,20.5a40.726,40.726,0,0,1,3.113,2.955,5.681,5.681,0,0,0,4.535,1.762l8.137-.577a4.276,4.276,0,0,1,4.173,2.329,48.632,48.632,0,0,1,2.653,6.687l.5,1.688a47.7,47.7,0,0,1,1.349,6.96M44.272,62.626a15.121,15.121,0,1,0-11.03-18.32,15.069,15.069,0,0,0,11.03,18.32" transform="translate(0 -0.001)" fill="#477ef6"/>
-  </g>
-</svg>

package/dist/img/airship-cog.6c89b74b.svg

@@ -1,10 +0,0 @@
-<svg id="Group_295" data-name="Group 295" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="95.626" height="96" viewBox="0 0 95.626 96">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_725" data-name="Rectangle 725" width="95.626" height="96" fill="none"/>
-    </clipPath>
-  </defs>
-  <g id="Group_294" data-name="Group 294" clip-path="url(#clip-path)">
-    <path id="Path_184" data-name="Path 184" d="M95.593,42.307a4.266,4.266,0,0,1-2.24,4.214L86.2,50.433a5.744,5.744,0,0,0-2.882,4.035q-.185,1.024-.432,2.047t-.553,2.018a5.745,5.745,0,0,0,.714,4.907l4.568,6.754a4.266,4.266,0,0,1,.061,4.772,47.7,47.7,0,0,1-4.387,5.57l-1.217,1.271a49.539,49.539,0,0,1-5.423,4.739,4.3,4.3,0,0,1-4.776.157L64.9,82.456a5.682,5.682,0,0,0-4.838-.514,41.751,41.751,0,0,1-4.126,1.2A5.736,5.736,0,0,0,52.1,86.2l-3.59,7.368A4.341,4.341,0,0,1,45.435,95.9a5.176,5.176,0,0,1-1.5.08,49.266,49.266,0,0,1-7.618-1.246,47.972,47.972,0,0,1-7.01-2.3A5.193,5.193,0,0,1,28,91.671a4.34,4.34,0,0,1-1.665-3.477l.182-8.152a5.736,5.736,0,0,0-2.033-4.49,36.983,36.983,0,0,1-3.047-2.912,5.742,5.742,0,0,0-4.606-1.831l-8.113.582a4.291,4.291,0,0,1-4.176-2.327,49.337,49.337,0,0,1-2.653-6.7l-.5-1.687A46.889,46.889,0,0,1,.029,53.718a4.27,4.27,0,0,1,2.249-4.212L9.431,45.59a5.743,5.743,0,0,0,2.878-4.024q.187-1.028.436-2.055t.553-2.026a5.743,5.743,0,0,0-.716-4.895L8.018,25.833a4.262,4.262,0,0,1-.07-4.775,47.088,47.088,0,0,1,4.4-5.566l1.212-1.273a48.671,48.671,0,0,1,5.424-4.729,4.268,4.268,0,0,1,4.778-.158l6.945,4.226a5.743,5.743,0,0,0,4.935.478,36.14,36.14,0,0,1,4.036-1.19,5.739,5.739,0,0,0,3.874-3.064L47.12,2.461A4.264,4.264,0,0,1,51.233.012,48.686,48.686,0,0,1,66.759,3.776a4.264,4.264,0,0,1,2.535,4.061l-.183,8.185A5.74,5.74,0,0,0,71.133,20.5a40.726,40.726,0,0,1,3.113,2.955,5.681,5.681,0,0,0,4.535,1.762l8.137-.577a4.276,4.276,0,0,1,4.173,2.329,48.632,48.632,0,0,1,2.653,6.687l.5,1.688a47.7,47.7,0,0,1,1.349,6.96M44.272,62.626a15.121,15.121,0,1,0-11.03-18.32,15.069,15.069,0,0,0,11.03,18.32" transform="translate(0 -0.001)" fill="#354b64"/>
-  </g>
-</svg>

package/dist/img/airship-down-arrow-active.bab27497.svg

@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="130" height="65" viewBox="0 0 130 65">
-  <path id="Polygon_38" data-name="Polygon 38" d="M56.515,8.485a12,12,0,0,1,16.971,0l36.029,36.029A12,12,0,0,1,101.029,65H28.971a12,12,0,0,1-8.485-20.485Z" transform="translate(130 65) rotate(180)" fill="#477ef6"/>
-</svg>

package/dist/img/airship-down-arrow.5b2f3f44.svg

@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="130" height="65" viewBox="0 0 130 65">
-  <path id="Polygon_39" data-name="Polygon 39" d="M56.515,8.485a12,12,0,0,1,16.971,0l36.029,36.029A12,12,0,0,1,101.029,65H28.971a12,12,0,0,1-8.485-20.485Z" transform="translate(130 65) rotate(180)" fill="#c3ced9"/>
-</svg>

package/dist/img/airship-hat-hover.56740dd2.svg

@@ -1,10 +0,0 @@
-<svg id="Group_306" data-name="Group 306" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="95.661" height="69.125" viewBox="0 0 95.661 69.125">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_726" data-name="Rectangle 726" width="95.661" height="69.125" fill="#477ef6"/>
-    </clipPath>
-  </defs>
-  <g id="Group_296" data-name="Group 296" clip-path="url(#clip-path)">
-    <path id="Path_185" data-name="Path 185" d="M92.737,8.968,49.044.259A9.461,9.461,0,0,0,42.7.953L2.043,18.885a3.7,3.7,0,0,0,.755,6.9l5.3,1.463C6.583,29.8,6.9,66.418,6.9,66.418c0,1.353.9,2.705,1.836,2.707l1.921-.3c1.477-.162,3.463-.94,3.607-2.705,0,0-.835-35.1.751-37.272L46.7,36.289a9.461,9.461,0,0,0,6.339-.693L93.619,15.858a3.679,3.679,0,0,0,2.02-3.715,3.624,3.624,0,0,0-2.9-3.175M55.278,42.47a12.909,12.909,0,0,1-4.555,1.345,14.244,14.244,0,0,1-4.872-.307L26.261,38.824a2.381,2.381,0,0,0-2.934,2.329l.1,18.542c.675,6.17,13.934,9.77,29.906,8.023C69.039,66,81.476,59.592,80.8,53.426L76.9,35.28a2.38,2.38,0,0,0-3.364-1.642Z" transform="translate(0 0)" fill="#477ef6"/>
-  </g>
-</svg>

package/dist/img/airship-hat.5cff7b4e.svg

@@ -1,10 +0,0 @@
-<svg id="Group_297" data-name="Group 297" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="95.661" height="69.125" viewBox="0 0 95.661 69.125">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_726" data-name="Rectangle 726" width="95.661" height="69.125" fill="none"/>
-    </clipPath>
-  </defs>
-  <g id="Group_296" data-name="Group 296" clip-path="url(#clip-path)">
-    <path id="Path_185" data-name="Path 185" d="M92.737,8.968,49.044.259A9.461,9.461,0,0,0,42.7.953L2.043,18.885a3.7,3.7,0,0,0,.755,6.9l5.3,1.463C6.583,29.8,6.9,66.418,6.9,66.418c0,1.353.9,2.705,1.836,2.707l1.921-.3c1.477-.162,3.463-.94,3.607-2.705,0,0-.835-35.1.751-37.272L46.7,36.289a9.461,9.461,0,0,0,6.339-.693L93.619,15.858a3.679,3.679,0,0,0,2.02-3.715,3.624,3.624,0,0,0-2.9-3.175M55.278,42.47a12.909,12.909,0,0,1-4.555,1.345,14.244,14.244,0,0,1-4.872-.307L26.261,38.824a2.381,2.381,0,0,0-2.934,2.329l.1,18.542c.675,6.17,13.934,9.77,29.906,8.023C69.039,66,81.476,59.592,80.8,53.426L76.9,35.28a2.38,2.38,0,0,0-3.364-1.642Z" transform="translate(0 0)" fill="#354b64"/>
-  </g>
-</svg>

package/dist/img/airship-megaphone-hover.2a7711d9.svg

@@ -1,10 +0,0 @@
-<svg id="Group_300" data-name="Group 300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="87.481" height="96" viewBox="0 0 87.481 96">
-  <defs>
-    <clipPath id="clip-path">
-      <rect id="Rectangle_720" data-name="Rectangle 720" width="87.481" height="96" fill="#477ef6"/>
-    </clipPath>
-  </defs>
-  <g id="Group_284" data-name="Group 284" clip-path="url(#clip-path)">
-    <path id="Path_178" data-name="Path 178" d="M77.7,28.12,72.393,4.168A5.318,5.318,0,0,0,62.719,2.46L57.2,11.115A42.561,42.561,0,0,1,30.521,29.793L8.338,34.709A10.642,10.642,0,0,0,.254,47.4L3.706,62.976A10.642,10.642,0,0,0,16.394,71.06L21,91.832a5.316,5.316,0,0,0,6.344,4.042l10.386-2.3a5.313,5.313,0,0,0,4.042-6.344l-4.6-20.772,1.412-.313a42.407,42.407,0,0,1,32.038,5.515l8.692,5.65a5.312,5.312,0,0,0,8.048-5.631L82.047,47.724c2.7-2.1,5.354-6.758,4.35-11.285s-5.36-7.559-8.7-8.318M74.211,61.531a53.166,53.166,0,0,0-37.935-5.774l-1.412.313L31.411,40.491l1.412-.313A53.166,53.166,0,0,0,64.766,18.917Z" transform="translate(0 -0.001)" fill="#477ef6"/>
-  </g>
-</svg>