@biggive/components 1.0.122 → 1.0.124
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/biggive/biggive.esm.js +1 -1
- package/dist/biggive/{p-dfc522af.entry.js → p-33c7e2c3.entry.js} +1 -1
- package/dist/biggive/p-44a5e3d5.entry.js +1 -0
- package/dist/biggive/{p-badd5542.entry.js → p-504602da.entry.js} +1 -1
- package/dist/biggive/{p-dd174c64.entry.js → p-b4f34aec.entry.js} +1 -1
- package/dist/biggive/p-cc38e81b.entry.js +1 -0
- package/dist/biggive/p-cfc3ec2c.entry.js +1 -0
- package/dist/biggive/{p-aa4e1a2a.js → p-d413b5f4.js} +1 -1
- package/dist/biggive/p-e417ec44.js +1 -0
- package/dist/cjs/{biggive-back-to-top_23.cjs.entry.js → biggive-back-to-top_21.cjs.entry.js} +70 -98
- package/dist/cjs/biggive-form-field-select-option.cjs.entry.js +30 -0
- package/dist/cjs/biggive-form-field-select.cjs.entry.js +29 -0
- package/dist/cjs/biggive.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/biggive-campaign-card/biggive-campaign-card.js +1 -1
- package/dist/collection/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.js +70 -141
- package/dist/components/biggive-campaign-card-filter-grid.js +72 -76
- package/dist/components/biggive-campaign-card.js +2 -14
- package/dist/components/biggive-form-field-select-option.js +44 -1
- package/dist/components/biggive-form-field-select.js +43 -1
- package/dist/esm/{biggive-back-to-top_23.entry.js → biggive-back-to-top_21.entry.js} +73 -99
- package/dist/esm/biggive-beneficiary-icon.entry.js +2 -2
- package/dist/esm/biggive-category-icon.entry.js +2 -2
- package/dist/{components/biggive-form-field-select-option2.js → esm/biggive-form-field-select-option.entry.js} +7 -27
- package/dist/{components/biggive-form-field-select2.js → esm/biggive-form-field-select.entry.js} +7 -27
- package/dist/esm/biggive-search.entry.js +1 -1
- package/dist/esm/biggive.js +1 -1
- package/dist/esm/{fontawesome-icons-ff9155ca.js → fontawesome-icons-ceecc882.js} +1 -1
- package/dist/esm/{index-7cfe62c2.js → index-6b1d9b0a.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/biggive-campaign-card-filter-grid/biggive-campaign-card-filter-grid.d.ts +0 -42
- package/dist/types/components.d.ts +0 -47
- package/hydrate/index.js +72 -56
- package/package.json +1 -1
- package/dist/biggive/p-88faca11.js +0 -1
- package/dist/biggive/p-8b2f6103.entry.js +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["biggive-back-to-
|
|
17
|
+
return index.bootstrapLazy([["biggive-back-to-top_21.cjs",[[1,"biggive-campaign-highlights",{"spaceBelow":[2,"space-below"],"banner":[1],"campaignTitle":[1,"campaign-title"],"primaryFigureLabel":[1,"primary-figure-label"],"primaryFigureAmount":[1,"primary-figure-amount"],"secondaryFigureLabel":[1,"secondary-figure-label"],"secondaryFigureAmount":[1,"secondary-figure-amount"],"progressBarCounter":[2,"progress-bar-counter"],"primaryStatIcon":[1,"primary-stat-icon"],"primaryStatText":[1,"primary-stat-text"],"secondaryStatIcon":[1,"secondary-stat-icon"],"secondaryStatText":[1,"secondary-stat-text"]}],[1,"biggive-call-to-action",{"spaceAbove":[2,"space-above"],"spaceBelow":[2,"space-below"],"defaultTextColour":[1,"default-text-colour"],"slugSize":[2,"slug-size"],"slugColour":[1,"slug-colour"],"slug":[1],"mainTitleColour":[1,"main-title-colour"],"mainTitleSize":[2,"main-title-size"],"mainTitle":[1,"main-title"],"subtitleSize":[2,"subtitle-size"],"subtitleColour":[1,"subtitle-colour"],"subtitle":[1],"teaserColour":[1,"teaser-colour"],"teaser":[1],"primaryButtonUrl":[1,"primary-button-url"],"primaryButtonLabel":[1,"primary-button-label"],"primaryButtonColourScheme":[1,"primary-button-colour-scheme"],"secondaryButtonUrl":[1,"secondary-button-url"],"secondaryButtonLabel":[1,"secondary-button-label"],"secondaryButtonColourScheme":[1,"secondary-button-colour-scheme"]}],[1,"biggive-footer"],[1,"biggive-hero-image",{"spaceBelow":[2,"space-below"],"colourScheme":[1,"colour-scheme"],"slug":[1],"slugColour":[1,"slug-colour"],"logo":[1],"mainImage":[1,"main-image"],"mainImageAlignHorizontal":[1,"main-image-align-horizontal"],"mainImageAlignVertical":[1,"main-image-align-vertical"],"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"]}],[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"]}],[1,"biggive-totalizer",{"spaceBelow":[2,"space-below"],"primaryColour":[1,"primary-colour"],"primaryTextColour":[1,"primary-text-colour"],"secondaryColour":[1,"secondary-colour"],"secondaryTextColour":[1,"secondary-text-colour"],"mainMessage":[1,"main-message"],"tickerItems":[16]}],[1,"biggive-video-feature",{"spaceAbove":[2,"space-above"],"spaceBelow":[2,"space-below"],"defaultTextColour":[1,"default-text-colour"],"videoUrl":[1,"video-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"]}],[1,"biggive-back-to-top"],[1,"biggive-campaign-card",{"spaceBelow":[2,"space-below"],"campaignType":[1,"campaign-type"],"banner":[1],"campaignTitle":[1,"campaign-title"],"organisationName":[1,"organisation-name"],"primaryFigureLabel":[1,"primary-figure-label"],"primaryFigureAmount":[1,"primary-figure-amount"],"secondaryFigureLabel":[1,"secondary-figure-label"],"secondaryFigureAmount":[1,"secondary-figure-amount"],"progressBarCounter":[2,"progress-bar-counter"],"donateButtonLabel":[1,"donate-button-label"],"donateButtonUrl":[1,"donate-button-url"],"donateButtonColourScheme":[1,"donate-button-colour-scheme"],"moreInfoButtonLabel":[1,"more-info-button-label"],"moreInfoButtonUrl":[1,"more-info-button-url"],"moreInfoButtonColourScheme":[1,"more-info-button-colour-scheme"]}],[1,"biggive-campaign-card-filter-grid",{"spaceBelow":[2,"space-below"],"intro":[1],"placeholderText":[1,"placeholder-text"],"buttonText":[1,"button-text"]}],[1,"biggive-grid",{"spaceBelow":[2,"space-below"],"columnCount":[2,"column-count"],"columnGap":[2,"column-gap"]}],[1,"biggive-header",{"spaceBelow":[2,"space-below"],"logoUrl":[1,"logo-url"]}],[1,"biggive-heading",{"spaceAbove":[2,"space-above"],"spaceBelow":[2,"space-below"],"colour":[1],"htmlElement":[1,"html-element"],"size":[2],"align":[1],"text":[1]}],[1,"biggive-page-column"],[1,"biggive-page-columns",{"spaceBelow":[2,"space-below"]}],[1,"biggive-page-section",{"spaceBelow":[2,"space-below"],"sectionStyleTop":[1,"section-style-top"],"sectionStyleBottom":[1,"section-style-bottom"],"colourScheme":[1,"colour-scheme"]}],[0,"biggive-social-icon",{"service":[1],"backgroundColour":[1,"background-colour"],"iconColour":[1,"icon-colour"],"url":[1]}],[0,"biggive-misc-icon",{"backgroundColour":[1,"background-colour"],"iconColour":[1,"icon-colour"],"icon":[1],"url":[1]}],[1,"biggive-progress-bar",{"spaceBelow":[2,"space-below"],"colourScheme":[1,"colour-scheme"],"counter":[2]}],[1,"biggive-totalizer-ticker-item",{"figure":[1],"label":[1]}],[1,"biggive-button",{"spaceBelow":[2,"space-below"],"colourScheme":[1,"colour-scheme"],"label":[1],"url":[1],"fullWidth":[4,"full-width"],"size":[1],"rounded":[4]}]]],["biggive-article-card.cjs",[[1,"biggive-article-card",{"spaceBelow":[2,"space-below"],"backgroundColour":[1,"background-colour"],"backgroundColourHover":[1,"background-colour-hover"],"textColour":[1,"text-colour"],"slug":[1],"date":[1],"mainTitle":[1,"main-title"],"imageUrl":[1,"image-url"],"imageLabel":[1,"image-label"],"buttonLabel":[1,"button-label"],"buttonUrl":[1,"button-url"]}]]],["biggive-basic-card.cjs",[[1,"biggive-basic-card",{"spaceBelow":[2,"space-below"],"backgroundColour":[1,"background-colour"],"backgroundImageUrl":[1,"background-image-url"],"cardColour":[1,"card-colour"],"textColour":[1,"text-colour"],"mainTitle":[1,"main-title"],"subtitle":[1],"iconColour":[1,"icon-colour"],"buttonLabel":[1,"button-label"],"buttonUrl":[1,"button-url"],"buttonColourScheme":[1,"button-colour-scheme"]}]]],["biggive-search.cjs",[[1,"biggive-search",{"placeholderText":[1,"placeholder-text"],"buttonText":[1,"button-text"],"searchText":[32]}]]],["biggive-beneficiary-icon.cjs",[[0,"biggive-beneficiary-icon",{"backgroundColour":[1,"background-colour"],"iconColour":[1,"icon-colour"],"icon":[1],"label":[1],"url":[1]}]]],["biggive-boxed-content.cjs",[[1,"biggive-boxed-content",{"spaceBelow":[2,"space-below"],"verticalPadding":[2,"vertical-padding"],"horizontalPadding":[2,"horizontal-padding"],"backgroundColour":[1,"background-colour"],"shadow":[4]}]]],["biggive-branded-image.cjs",[[1,"biggive-branded-image",{"spaceBelow":[2,"space-below"],"imageUrl":[1,"image-url"],"logoUrl":[1,"logo-url"],"slug":[1]}]]],["biggive-category-icon.cjs",[[0,"biggive-category-icon",{"backgroundColour":[1,"background-colour"],"iconColour":[1,"icon-colour"],"icon":[1],"label":[1],"url":[1]}]]],["biggive-form.cjs",[[1,"biggive-form"]]],["biggive-form-field-select.cjs",[[1,"biggive-form-field-select",{"selectedValue":[1,"selected-value"],"selectedLabel":[1,"selected-label"],"spaceBelow":[2,"space-below"],"placeholder":[1]},[[0,"doOptionSelect","doOptionSelectCompletedHandler"]]]]],["biggive-form-field-select-option.cjs",[[1,"biggive-form-field-select-option",{"label":[1],"value":[1],"selectedValue":[32],"selectedLabel":[32]}]]],["biggive-formatted-text.cjs",[[1,"biggive-formatted-text",{"spaceBelow":[2,"space-below"],"defaultTextColour":[1,"default-text-colour"]}]]],["biggive-icon-group.cjs",[[1,"biggive-icon-group",{"spaceBelow":[2,"space-below"],"label":[1]}]]],["biggive-image.cjs",[[1,"biggive-image",{"spaceAbove":[2,"space-above"],"spaceBelow":[2,"space-below"],"imageUrl":[1,"image-url"],"width":[2],"height":[2],"sizeUnit":[1,"size-unit"]}]]],["biggive-nav-group.cjs",[[1,"biggive-nav-group",{"inline":[4]}]]],["biggive-nav-item.cjs",[[1,"biggive-nav-item",{"url":[1],"label":[1],"iconColour":[1,"icon-colour"]}]]],["biggive-popup.cjs",[[1,"biggive-popup",{"open":[64]}]]],["biggive-quote.cjs",[[1,"biggive-quote",{"spaceBelow":[2,"space-below"],"defaultTextColour":[1,"default-text-colour"],"quote":[1],"attribution":[1]}]]],["biggive-tab.cjs",[[1,"biggive-tab",{"tabTitle":[1,"tab-title"]}]]],["biggive-tabbed-content.cjs",[[1,"biggive-tabbed-content",{"spaceBelow":[2,"space-below"],"defaultTextColour":[1,"default-text-colour"]}]]],["biggive-text-input.cjs",[[1,"biggive-text-input"]]],["biggive-video.cjs",[[1,"biggive-video",{"spaceAbove":[2,"space-above"],"spaceBelow":[2,"space-below"],"videoUrl":[1,"video-url"]}]]]], options);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -19,7 +19,7 @@ export class BiggiveCampaignCard {
|
|
|
19
19
|
this.moreInfoButtonColourScheme = 'clear-primary';
|
|
20
20
|
}
|
|
21
21
|
render() {
|
|
22
|
-
return (h("div", { class: 'container space-below-' + this.spaceBelow.toString() }, h("div", { class: "sleeve" }, this.campaignType !== null ? (h("div", { class: "campaign-type" }, h("span", null, this.campaignType))) : null, this.banner !== null ? (h("div", { class: "image-wrap banner", style: { 'background-image': 'url(' + this.banner + ')' } }, h("img", { src: this.banner, class: "banner" }))) : (h("div", { class: "image-wrap banner" })), h("div", { class: "title-wrap" }, h("h3", null, this.campaignTitle), h("div", { class: "organisation-name" }, "By ", this.organisationName)), h("div", { class: "meta-wrap" }, h("div", { class: "meta-item" }, h("span", { class: "label" }, this.primaryFigureLabel), h("span", { class: "text" }, this.primaryFigureAmount)), h("div", { class: "meta-item" }, h("span", { class: "label" }, this.secondaryFigureLabel), h("span", { class: "text" }, this.secondaryFigureAmount)))
|
|
22
|
+
return (h("div", { class: 'container space-below-' + this.spaceBelow.toString() }, h("div", { class: "sleeve" }, this.campaignType !== null ? (h("div", { class: "campaign-type" }, h("span", null, this.campaignType))) : null, this.banner !== null ? (h("div", { class: "image-wrap banner", style: { 'background-image': 'url(' + this.banner + ')' } }, h("img", { src: this.banner, class: "banner" }))) : (h("div", { class: "image-wrap banner" })), h("div", { class: "title-wrap" }, h("h3", null, this.campaignTitle), h("div", { class: "organisation-name" }, "By ", this.organisationName)), h("div", { class: "meta-wrap" }, h("div", { class: "meta-item" }, h("span", { class: "label" }, this.primaryFigureLabel), h("span", { class: "text" }, this.primaryFigureAmount)), h("div", { class: "meta-item" }, h("span", { class: "label" }, this.secondaryFigureLabel), h("span", { class: "text" }, this.secondaryFigureAmount))))));
|
|
23
23
|
}
|
|
24
24
|
static get is() { return "biggive-campaign-card"; }
|
|
25
25
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,63 +1,84 @@
|
|
|
1
|
-
import { h } from '@stencil/core';
|
|
2
|
-
import { faMagnifyingGlass } from '@fortawesome/pro-solid-svg-icons';
|
|
1
|
+
import { h /*, Element*/ } from '@stencil/core';
|
|
2
|
+
// import { faMagnifyingGlass } from '@fortawesome/pro-solid-svg-icons';
|
|
3
3
|
export class BiggiveCampaignCardFilterGrid {
|
|
4
4
|
constructor() {
|
|
5
|
-
this.searchText = null;
|
|
6
|
-
this.sortBy = null;
|
|
7
|
-
this.filterCategory = null;
|
|
8
|
-
this.filterBeneficiary = null;
|
|
9
|
-
this.filterLocation = null;
|
|
10
|
-
this.filterFunding = null;
|
|
11
|
-
this.handleSortByChanged = (event) => {
|
|
12
|
-
this.sortBy = event.target.value;
|
|
13
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
14
|
-
};
|
|
15
|
-
// private handleApplyFilterButtonClick = () => {
|
|
16
|
-
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
17
|
-
// };
|
|
18
|
-
this.handleSearchButtonPressed = () => {
|
|
19
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
20
|
-
};
|
|
21
|
-
this.handleSearchTextChanged = (event) => {
|
|
22
|
-
this.searchText = event.target.value;
|
|
23
|
-
};
|
|
24
|
-
this.handleEnterPressed = (ev) => {
|
|
25
|
-
if (ev.key === 'Enter') {
|
|
26
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
27
|
-
}
|
|
28
|
-
};
|
|
29
5
|
this.spaceBelow = 0;
|
|
30
6
|
this.intro = 'Find a charity or project';
|
|
31
7
|
this.placeholderText = 'Search';
|
|
32
8
|
this.buttonText = 'Search';
|
|
33
|
-
this.categoryOptions = [];
|
|
34
|
-
this.beneficiaryOptions = [];
|
|
35
|
-
this.locationOptions = [];
|
|
36
|
-
this.fundingOptions = [];
|
|
37
|
-
}
|
|
38
|
-
getSearchAndFilterObject() {
|
|
39
|
-
const event = {
|
|
40
|
-
searchText: this.searchText,
|
|
41
|
-
sortBy: this.sortBy,
|
|
42
|
-
filterCategory: this.filterCategory,
|
|
43
|
-
filterBeneficiary: this.filterBeneficiary,
|
|
44
|
-
filterFunding: this.filterFunding,
|
|
45
|
-
filterLocation: this.filterLocation,
|
|
46
|
-
};
|
|
47
|
-
return event;
|
|
48
|
-
}
|
|
49
|
-
doOptionSelectCompletedHandler() {
|
|
50
|
-
this.sortBy = this.el.shadowRoot.getElementById('sort-by').selectedValue;
|
|
51
|
-
this.filterCategory = this.el.shadowRoot.getElementById('categories').selectedValue;
|
|
52
|
-
this.filterBeneficiary = this.el.shadowRoot.getElementById('beneficiaries').selectedValue;
|
|
53
|
-
this.filterLocation = this.el.shadowRoot.getElementById('locations').selectedValue;
|
|
54
|
-
this.filterFunding = this.el.shadowRoot.getElementById('funding').selectedValue;
|
|
55
9
|
}
|
|
10
|
+
// /**
|
|
11
|
+
// * JSON array of category key/values
|
|
12
|
+
// */
|
|
13
|
+
// @Prop() categoryOptions: string[] = [];
|
|
14
|
+
// /**
|
|
15
|
+
// * JSON array of beneficiary key/values
|
|
16
|
+
// */
|
|
17
|
+
// @Prop() beneficiaryOptions: string[] = [];
|
|
18
|
+
// /**
|
|
19
|
+
// * JSON array of location key/values
|
|
20
|
+
// */
|
|
21
|
+
// @Prop() locationOptions: string[] = [];
|
|
22
|
+
// /**
|
|
23
|
+
// * JSON array of funding key/values
|
|
24
|
+
// */
|
|
25
|
+
// @Prop() fundingOptions: string[] = [];
|
|
26
|
+
// private getSearchAndFilterObject(): {
|
|
27
|
+
// searchText: string;
|
|
28
|
+
// sortBy: string;
|
|
29
|
+
// filterCategory: string;
|
|
30
|
+
// filterBeneficiary: string;
|
|
31
|
+
// filterLocation: string;
|
|
32
|
+
// filterFunding: string;
|
|
33
|
+
// } {
|
|
34
|
+
// const event: {
|
|
35
|
+
// searchText: string;
|
|
36
|
+
// sortBy: string;
|
|
37
|
+
// filterCategory: string;
|
|
38
|
+
// filterBeneficiary: string;
|
|
39
|
+
// filterLocation: string;
|
|
40
|
+
// filterFunding: string;
|
|
41
|
+
// } = {
|
|
42
|
+
// searchText: this.searchText,
|
|
43
|
+
// sortBy: this.sortBy,
|
|
44
|
+
// filterCategory: this.filterCategory,
|
|
45
|
+
// filterBeneficiary: this.filterBeneficiary,
|
|
46
|
+
// filterFunding: this.filterFunding,
|
|
47
|
+
// filterLocation: this.filterLocation,
|
|
48
|
+
// };
|
|
49
|
+
// return event;
|
|
50
|
+
// }
|
|
51
|
+
// @Listen('doSelectChange')
|
|
52
|
+
// doOptionSelectCompletedHandler() {
|
|
53
|
+
// this.sortBy = this.el.shadowRoot.getElementById('sort-by').selectedValue;
|
|
54
|
+
// this.filterCategory = this.el.shadowRoot.getElementById('categories').selectedValue;
|
|
55
|
+
// this.filterBeneficiary = this.el.shadowRoot.getElementById('beneficiaries').selectedValue;
|
|
56
|
+
// this.filterLocation = this.el.shadowRoot.getElementById('locations').selectedValue;
|
|
57
|
+
// this.filterFunding = this.el.shadowRoot.getElementById('funding').selectedValue;
|
|
58
|
+
// }
|
|
59
|
+
// private handleSortByChanged = (event: any) => {
|
|
60
|
+
// this.sortBy = event.target.value;
|
|
61
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
62
|
+
// };
|
|
63
|
+
// private handleApplyFilterButtonClick = () => {
|
|
64
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
65
|
+
// };
|
|
66
|
+
// private handleSearchButtonPressed = () => {
|
|
67
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
68
|
+
// };
|
|
69
|
+
// private handleSearchTextChanged = (event: any) => {
|
|
70
|
+
// this.searchText = event.target.value;
|
|
71
|
+
// };
|
|
72
|
+
// private handleEnterPressed = (ev: KeyboardEvent) => {
|
|
73
|
+
// if (ev.key === 'Enter') {
|
|
74
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
75
|
+
// }
|
|
76
|
+
// };
|
|
56
77
|
// private handleFilterButtonClick = () => {
|
|
57
78
|
// this.el.shadowRoot.getElementById('filter-popup').open();
|
|
58
79
|
// };
|
|
59
80
|
render() {
|
|
60
|
-
return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "
|
|
81
|
+
return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "campaign-grid" }, h("slot", { name: "campaign-grid" })))));
|
|
61
82
|
}
|
|
62
83
|
static get is() { return "biggive-campaign-card-filter-grid"; }
|
|
63
84
|
static get encapsulation() { return "shadow"; }
|
|
@@ -144,99 +165,7 @@ export class BiggiveCampaignCardFilterGrid {
|
|
|
144
165
|
"attribute": "button-text",
|
|
145
166
|
"reflect": false,
|
|
146
167
|
"defaultValue": "'Search'"
|
|
147
|
-
},
|
|
148
|
-
"categoryOptions": {
|
|
149
|
-
"type": "unknown",
|
|
150
|
-
"mutable": false,
|
|
151
|
-
"complexType": {
|
|
152
|
-
"original": "string[]",
|
|
153
|
-
"resolved": "string[]",
|
|
154
|
-
"references": {}
|
|
155
|
-
},
|
|
156
|
-
"required": false,
|
|
157
|
-
"optional": false,
|
|
158
|
-
"docs": {
|
|
159
|
-
"tags": [],
|
|
160
|
-
"text": "JSON array of category key/values"
|
|
161
|
-
},
|
|
162
|
-
"defaultValue": "[]"
|
|
163
|
-
},
|
|
164
|
-
"beneficiaryOptions": {
|
|
165
|
-
"type": "unknown",
|
|
166
|
-
"mutable": false,
|
|
167
|
-
"complexType": {
|
|
168
|
-
"original": "string[]",
|
|
169
|
-
"resolved": "string[]",
|
|
170
|
-
"references": {}
|
|
171
|
-
},
|
|
172
|
-
"required": false,
|
|
173
|
-
"optional": false,
|
|
174
|
-
"docs": {
|
|
175
|
-
"tags": [],
|
|
176
|
-
"text": "JSON array of beneficiary key/values"
|
|
177
|
-
},
|
|
178
|
-
"defaultValue": "[]"
|
|
179
|
-
},
|
|
180
|
-
"locationOptions": {
|
|
181
|
-
"type": "unknown",
|
|
182
|
-
"mutable": false,
|
|
183
|
-
"complexType": {
|
|
184
|
-
"original": "string[]",
|
|
185
|
-
"resolved": "string[]",
|
|
186
|
-
"references": {}
|
|
187
|
-
},
|
|
188
|
-
"required": false,
|
|
189
|
-
"optional": false,
|
|
190
|
-
"docs": {
|
|
191
|
-
"tags": [],
|
|
192
|
-
"text": "JSON array of location key/values"
|
|
193
|
-
},
|
|
194
|
-
"defaultValue": "[]"
|
|
195
|
-
},
|
|
196
|
-
"fundingOptions": {
|
|
197
|
-
"type": "unknown",
|
|
198
|
-
"mutable": false,
|
|
199
|
-
"complexType": {
|
|
200
|
-
"original": "string[]",
|
|
201
|
-
"resolved": "string[]",
|
|
202
|
-
"references": {}
|
|
203
|
-
},
|
|
204
|
-
"required": false,
|
|
205
|
-
"optional": false,
|
|
206
|
-
"docs": {
|
|
207
|
-
"tags": [],
|
|
208
|
-
"text": "JSON array of funding key/values"
|
|
209
|
-
},
|
|
210
|
-
"defaultValue": "[]"
|
|
211
168
|
}
|
|
212
169
|
};
|
|
213
170
|
}
|
|
214
|
-
static get events() {
|
|
215
|
-
return [{
|
|
216
|
-
"method": "doSearchAndFilterUpdate",
|
|
217
|
-
"name": "doSearchAndFilterUpdate",
|
|
218
|
-
"bubbles": true,
|
|
219
|
-
"cancelable": true,
|
|
220
|
-
"composed": true,
|
|
221
|
-
"docs": {
|
|
222
|
-
"tags": [],
|
|
223
|
-
"text": "This event `doSearchAndFilterUpdate` event is emitted and propogates to the parent\ncomponent which handles it"
|
|
224
|
-
},
|
|
225
|
-
"complexType": {
|
|
226
|
-
"original": "{\n searchText: string;\n sortBy: string;\n filterCategory: string;\n filterBeneficiary: string;\n filterLocation: string;\n filterFunding: string;\n }",
|
|
227
|
-
"resolved": "{ searchText: string; sortBy: string; filterCategory: string; filterBeneficiary: string; filterLocation: string; filterFunding: string; }",
|
|
228
|
-
"references": {}
|
|
229
|
-
}
|
|
230
|
-
}];
|
|
231
|
-
}
|
|
232
|
-
static get elementRef() { return "el"; }
|
|
233
|
-
static get listeners() {
|
|
234
|
-
return [{
|
|
235
|
-
"name": "doSelectChange",
|
|
236
|
-
"method": "doOptionSelectCompletedHandler",
|
|
237
|
-
"target": undefined,
|
|
238
|
-
"capture": false,
|
|
239
|
-
"passive": false
|
|
240
|
-
}];
|
|
241
|
-
}
|
|
242
171
|
}
|
|
@@ -1,8 +1,4 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement,
|
|
2
|
-
import { f as faMagnifyingGlass } from './index2.js';
|
|
3
|
-
import { d as defineCustomElement$4 } from './biggive-button2.js';
|
|
4
|
-
import { d as defineCustomElement$3 } from './biggive-form-field-select2.js';
|
|
5
|
-
import { d as defineCustomElement$2 } from './biggive-form-field-select-option2.js';
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
6
2
|
|
|
7
3
|
const biggiveCampaignCardFilterGridCss = "body{background-color:#D7D7D7}h1,h3,h4,h5,h6{margin-bottom:0}h1,.heading-1{font-size:47px;line-height:60px;font-weight:bold}h2,.heading-2{font-size:38px;line-height:45px;font-weight:bold}h3,.heading-3{font-size:25px;line-height:32px;font-weight:bold}h4,.heading-4{font-size:20px;line-height:24px;font-weight:bold}h5,.heading-5{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-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.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}.fill-red{fill:red}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.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:17px;line-height:24px;padding:10px 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.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.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-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#FFFFFF;background-color:#2C089B}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;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:27.5px}.button-rounded.size-small{border-radius:20px}.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{position:relative;padding-bottom:56.25%}.video-wrap iframe,.video-wrap video{position:absolute;border:0;display:block;left:0;right:0;top:0;bottom:0;width:100%;height:100%}.image-wrap img{width:100%;height:auto}.align-left{text-align:left}.align-right{text-align:right}.align-center{text-align:center}.align-justify{text-align:justify}.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}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top: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:content}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .search-wrap{filter:drop-shadow(-1px 3px 12px rgba(0, 0, 0, 0.25));background-color:#FFFFFF;padding:15px 30px;margin-bottom:60px}.container .search-wrap h4{margin-bottom:15px}.container .search-wrap .field-wrap{display:flex;justify-content:space-between}.container .search-wrap .field-wrap .input-wrap{padding-bottom:5px;border-bottom:1px solid #000000;margin-right:30px;flex-grow:1}.container .search-wrap .field-wrap .input-wrap input{border:0}.container .search-wrap .field-wrap button{padding:5px 30px}.sort-filter-wrap{display:flex;align-items:flex-end;margin-bottom:30px;text-align:right}.sort-filter-wrap .sort-wrap{margin-left:auto}.sort-filter-wrap .filter-wrap{margin-left:15px}.sort-filter-wrap .filter-wrap .button.filter{padding-left:60px;padding-right:30px}.sort-filter-wrap .filter-wrap .button.filter .filter-icon{content:\"\";display:block;position:absolute;left:25px;top:17px;width:13px;height:13px}.sort-filter-wrap .filter-wrap .button.filter .filter-icon svg{width:100%;height:auto;vertical-align:top}.sort-filter-wrap .filter-wrap .button.filter .filter-icon svg:hover{fill:#2C089B}.icon{height:1rem;width:2rem;vertical-align:-0.125rem;margin:auto}.icon>path{fill:#2C089B}";
|
|
8
4
|
|
|
@@ -11,102 +7,102 @@ const BiggiveCampaignCardFilterGrid$1 = /*@__PURE__*/ proxyCustomElement(class e
|
|
|
11
7
|
super();
|
|
12
8
|
this.__registerHost();
|
|
13
9
|
this.__attachShadow();
|
|
14
|
-
this.doSearchAndFilterUpdate = createEvent(this, "doSearchAndFilterUpdate", 7);
|
|
15
|
-
this.searchText = null;
|
|
16
|
-
this.sortBy = null;
|
|
17
|
-
this.filterCategory = null;
|
|
18
|
-
this.filterBeneficiary = null;
|
|
19
|
-
this.filterLocation = null;
|
|
20
|
-
this.filterFunding = null;
|
|
21
|
-
this.handleSortByChanged = (event) => {
|
|
22
|
-
this.sortBy = event.target.value;
|
|
23
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
24
|
-
};
|
|
25
|
-
// private handleApplyFilterButtonClick = () => {
|
|
26
|
-
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
27
|
-
// };
|
|
28
|
-
this.handleSearchButtonPressed = () => {
|
|
29
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
30
|
-
};
|
|
31
|
-
this.handleSearchTextChanged = (event) => {
|
|
32
|
-
this.searchText = event.target.value;
|
|
33
|
-
};
|
|
34
|
-
this.handleEnterPressed = (ev) => {
|
|
35
|
-
if (ev.key === 'Enter') {
|
|
36
|
-
this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
37
|
-
}
|
|
38
|
-
};
|
|
39
10
|
this.spaceBelow = 0;
|
|
40
11
|
this.intro = 'Find a charity or project';
|
|
41
12
|
this.placeholderText = 'Search';
|
|
42
13
|
this.buttonText = 'Search';
|
|
43
|
-
this.categoryOptions = [];
|
|
44
|
-
this.beneficiaryOptions = [];
|
|
45
|
-
this.locationOptions = [];
|
|
46
|
-
this.fundingOptions = [];
|
|
47
|
-
}
|
|
48
|
-
getSearchAndFilterObject() {
|
|
49
|
-
const event = {
|
|
50
|
-
searchText: this.searchText,
|
|
51
|
-
sortBy: this.sortBy,
|
|
52
|
-
filterCategory: this.filterCategory,
|
|
53
|
-
filterBeneficiary: this.filterBeneficiary,
|
|
54
|
-
filterFunding: this.filterFunding,
|
|
55
|
-
filterLocation: this.filterLocation,
|
|
56
|
-
};
|
|
57
|
-
return event;
|
|
58
|
-
}
|
|
59
|
-
doOptionSelectCompletedHandler() {
|
|
60
|
-
this.sortBy = this.el.shadowRoot.getElementById('sort-by').selectedValue;
|
|
61
|
-
this.filterCategory = this.el.shadowRoot.getElementById('categories').selectedValue;
|
|
62
|
-
this.filterBeneficiary = this.el.shadowRoot.getElementById('beneficiaries').selectedValue;
|
|
63
|
-
this.filterLocation = this.el.shadowRoot.getElementById('locations').selectedValue;
|
|
64
|
-
this.filterFunding = this.el.shadowRoot.getElementById('funding').selectedValue;
|
|
65
14
|
}
|
|
15
|
+
// /**
|
|
16
|
+
// * JSON array of category key/values
|
|
17
|
+
// */
|
|
18
|
+
// @Prop() categoryOptions: string[] = [];
|
|
19
|
+
// /**
|
|
20
|
+
// * JSON array of beneficiary key/values
|
|
21
|
+
// */
|
|
22
|
+
// @Prop() beneficiaryOptions: string[] = [];
|
|
23
|
+
// /**
|
|
24
|
+
// * JSON array of location key/values
|
|
25
|
+
// */
|
|
26
|
+
// @Prop() locationOptions: string[] = [];
|
|
27
|
+
// /**
|
|
28
|
+
// * JSON array of funding key/values
|
|
29
|
+
// */
|
|
30
|
+
// @Prop() fundingOptions: string[] = [];
|
|
31
|
+
// private getSearchAndFilterObject(): {
|
|
32
|
+
// searchText: string;
|
|
33
|
+
// sortBy: string;
|
|
34
|
+
// filterCategory: string;
|
|
35
|
+
// filterBeneficiary: string;
|
|
36
|
+
// filterLocation: string;
|
|
37
|
+
// filterFunding: string;
|
|
38
|
+
// } {
|
|
39
|
+
// const event: {
|
|
40
|
+
// searchText: string;
|
|
41
|
+
// sortBy: string;
|
|
42
|
+
// filterCategory: string;
|
|
43
|
+
// filterBeneficiary: string;
|
|
44
|
+
// filterLocation: string;
|
|
45
|
+
// filterFunding: string;
|
|
46
|
+
// } = {
|
|
47
|
+
// searchText: this.searchText,
|
|
48
|
+
// sortBy: this.sortBy,
|
|
49
|
+
// filterCategory: this.filterCategory,
|
|
50
|
+
// filterBeneficiary: this.filterBeneficiary,
|
|
51
|
+
// filterFunding: this.filterFunding,
|
|
52
|
+
// filterLocation: this.filterLocation,
|
|
53
|
+
// };
|
|
54
|
+
// return event;
|
|
55
|
+
// }
|
|
56
|
+
// @Listen('doSelectChange')
|
|
57
|
+
// doOptionSelectCompletedHandler() {
|
|
58
|
+
// this.sortBy = this.el.shadowRoot.getElementById('sort-by').selectedValue;
|
|
59
|
+
// this.filterCategory = this.el.shadowRoot.getElementById('categories').selectedValue;
|
|
60
|
+
// this.filterBeneficiary = this.el.shadowRoot.getElementById('beneficiaries').selectedValue;
|
|
61
|
+
// this.filterLocation = this.el.shadowRoot.getElementById('locations').selectedValue;
|
|
62
|
+
// this.filterFunding = this.el.shadowRoot.getElementById('funding').selectedValue;
|
|
63
|
+
// }
|
|
64
|
+
// private handleSortByChanged = (event: any) => {
|
|
65
|
+
// this.sortBy = event.target.value;
|
|
66
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
67
|
+
// };
|
|
68
|
+
// private handleApplyFilterButtonClick = () => {
|
|
69
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
70
|
+
// };
|
|
71
|
+
// private handleSearchButtonPressed = () => {
|
|
72
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
73
|
+
// };
|
|
74
|
+
// private handleSearchTextChanged = (event: any) => {
|
|
75
|
+
// this.searchText = event.target.value;
|
|
76
|
+
// };
|
|
77
|
+
// private handleEnterPressed = (ev: KeyboardEvent) => {
|
|
78
|
+
// if (ev.key === 'Enter') {
|
|
79
|
+
// this.doSearchAndFilterUpdate.emit(this.getSearchAndFilterObject());
|
|
80
|
+
// }
|
|
81
|
+
// };
|
|
66
82
|
// private handleFilterButtonClick = () => {
|
|
67
83
|
// this.el.shadowRoot.getElementById('filter-popup').open();
|
|
68
84
|
// };
|
|
69
85
|
render() {
|
|
70
|
-
return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "
|
|
86
|
+
return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: "sleeve" }, h("div", { class: "campaign-grid" }, h("slot", { name: "campaign-grid" })))));
|
|
71
87
|
}
|
|
72
|
-
get el() { return this; }
|
|
73
88
|
static get style() { return biggiveCampaignCardFilterGridCss; }
|
|
74
89
|
}, [1, "biggive-campaign-card-filter-grid", {
|
|
75
90
|
"spaceBelow": [2, "space-below"],
|
|
76
91
|
"intro": [1],
|
|
77
92
|
"placeholderText": [1, "placeholder-text"],
|
|
78
|
-
"buttonText": [1, "button-text"]
|
|
79
|
-
|
|
80
|
-
"beneficiaryOptions": [16],
|
|
81
|
-
"locationOptions": [16],
|
|
82
|
-
"fundingOptions": [16]
|
|
83
|
-
}, [[0, "doSelectChange", "doOptionSelectCompletedHandler"]]]);
|
|
93
|
+
"buttonText": [1, "button-text"]
|
|
94
|
+
}]);
|
|
84
95
|
function defineCustomElement$1() {
|
|
85
96
|
if (typeof customElements === "undefined") {
|
|
86
97
|
return;
|
|
87
98
|
}
|
|
88
|
-
const components = ["biggive-campaign-card-filter-grid"
|
|
99
|
+
const components = ["biggive-campaign-card-filter-grid"];
|
|
89
100
|
components.forEach(tagName => { switch (tagName) {
|
|
90
101
|
case "biggive-campaign-card-filter-grid":
|
|
91
102
|
if (!customElements.get(tagName)) {
|
|
92
103
|
customElements.define(tagName, BiggiveCampaignCardFilterGrid$1);
|
|
93
104
|
}
|
|
94
105
|
break;
|
|
95
|
-
case "biggive-button":
|
|
96
|
-
if (!customElements.get(tagName)) {
|
|
97
|
-
defineCustomElement$4();
|
|
98
|
-
}
|
|
99
|
-
break;
|
|
100
|
-
case "biggive-form-field-select":
|
|
101
|
-
if (!customElements.get(tagName)) {
|
|
102
|
-
defineCustomElement$3();
|
|
103
|
-
}
|
|
104
|
-
break;
|
|
105
|
-
case "biggive-form-field-select-option":
|
|
106
|
-
if (!customElements.get(tagName)) {
|
|
107
|
-
defineCustomElement$2();
|
|
108
|
-
}
|
|
109
|
-
break;
|
|
110
106
|
} });
|
|
111
107
|
}
|
|
112
108
|
|
|
@@ -1,6 +1,4 @@
|
|
|
1
1
|
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
|
-
import { d as defineCustomElement$3 } from './biggive-button2.js';
|
|
3
|
-
import { d as defineCustomElement$2 } from './biggive-progress-bar2.js';
|
|
4
2
|
|
|
5
3
|
const biggiveCampaignCardCss = "body{background-color:#D7D7D7}h1,h3,h4,h5,h6{margin-bottom:0}h1,.heading-1{font-size:47px;line-height:60px;font-weight:bold}h2,.heading-2{font-size:38px;line-height:45px;font-weight:bold}h3,.heading-3{font-size:25px;line-height:32px;font-weight:bold}h4,.heading-4{font-size:20px;line-height:24px;font-weight:bold}h5,.heading-5{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-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.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}.fill-red{fill:red}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.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:17px;line-height:24px;padding:10px 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.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.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-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#FFFFFF;background-color:#2C089B}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;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:27.5px}.button-rounded.size-small{border-radius:20px}.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{position:relative;padding-bottom:56.25%}.video-wrap iframe,.video-wrap video{position:absolute;border:0;display:block;left:0;right:0;top:0;bottom:0;width:100%;height:100%}.image-wrap img{width:100%;height:auto}.align-left{text-align:left}.align-right{text-align:right}.align-center{text-align:center}.align-justify{text-align:justify}.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}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top: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{display:flex;flex-direction:column;font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;filter:drop-shadow(-1px 3px 12px rgba(0, 0, 0, 0.25));position:relative;height:100%;background-color:#FFFFFF;padding:15px;box-sizing:border-box}.container .sleeve{display:flex;flex-direction:column;height:100%}.container .campaign-type{position:absolute;top:0;left:0;right:0;text-align:center;font-weight:bold}.container .campaign-type span{background-color:#2AF135;color:#000000;padding:5px 15px;display:inline-block}.container .banner{top:0;margin-top:2px;padding-bottom:33.3%;background-color:#F1F1F1;background-size:cover;background-repeat:no-repeat}.container .banner img{display:none}.container h3{font-size:20px;line-height:24px;font-weight:bold}.container .button{display:block}.container .organisation-name{margin-bottom:30px;color:#2C089B}.container .meta-wrap{display:flex;justify-content:space-between;margin-top:auto;margin-bottom:15px}.container .meta-wrap .meta-item{width:calc(50% - 15px)}.container .meta-wrap .meta-item .label{font-size:11px;line-height:14px;display:block}.container .meta-wrap .meta-item .text{font-size:25px;line-height:32px;font-weight:bold;display:block}.container .meta-wrap .meta-item:last-child{text-align:right}.container .meta-wrap .meta-item:last-child .text{color:#2C089B}.container .progress-bar-wrap{padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #E8E8E8}";
|
|
6
4
|
|
|
@@ -27,7 +25,7 @@ const BiggiveCampaignCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HTM
|
|
|
27
25
|
this.moreInfoButtonColourScheme = 'clear-primary';
|
|
28
26
|
}
|
|
29
27
|
render() {
|
|
30
|
-
return (h("div", { class: 'container space-below-' + this.spaceBelow.toString() }, h("div", { class: "sleeve" }, this.campaignType !== null ? (h("div", { class: "campaign-type" }, h("span", null, this.campaignType))) : null, this.banner !== null ? (h("div", { class: "image-wrap banner", style: { 'background-image': 'url(' + this.banner + ')' } }, h("img", { src: this.banner, class: "banner" }))) : (h("div", { class: "image-wrap banner" })), h("div", { class: "title-wrap" }, h("h3", null, this.campaignTitle), h("div", { class: "organisation-name" }, "By ", this.organisationName)), h("div", { class: "meta-wrap" }, h("div", { class: "meta-item" }, h("span", { class: "label" }, this.primaryFigureLabel), h("span", { class: "text" }, this.primaryFigureAmount)), h("div", { class: "meta-item" }, h("span", { class: "label" }, this.secondaryFigureLabel), h("span", { class: "text" }, this.secondaryFigureAmount)))
|
|
28
|
+
return (h("div", { class: 'container space-below-' + this.spaceBelow.toString() }, h("div", { class: "sleeve" }, this.campaignType !== null ? (h("div", { class: "campaign-type" }, h("span", null, this.campaignType))) : null, this.banner !== null ? (h("div", { class: "image-wrap banner", style: { 'background-image': 'url(' + this.banner + ')' } }, h("img", { src: this.banner, class: "banner" }))) : (h("div", { class: "image-wrap banner" })), h("div", { class: "title-wrap" }, h("h3", null, this.campaignTitle), h("div", { class: "organisation-name" }, "By ", this.organisationName)), h("div", { class: "meta-wrap" }, h("div", { class: "meta-item" }, h("span", { class: "label" }, this.primaryFigureLabel), h("span", { class: "text" }, this.primaryFigureAmount)), h("div", { class: "meta-item" }, h("span", { class: "label" }, this.secondaryFigureLabel), h("span", { class: "text" }, this.secondaryFigureAmount))))));
|
|
31
29
|
}
|
|
32
30
|
static get style() { return biggiveCampaignCardCss; }
|
|
33
31
|
}, [1, "biggive-campaign-card", {
|
|
@@ -52,23 +50,13 @@ function defineCustomElement$1() {
|
|
|
52
50
|
if (typeof customElements === "undefined") {
|
|
53
51
|
return;
|
|
54
52
|
}
|
|
55
|
-
const components = ["biggive-campaign-card"
|
|
53
|
+
const components = ["biggive-campaign-card"];
|
|
56
54
|
components.forEach(tagName => { switch (tagName) {
|
|
57
55
|
case "biggive-campaign-card":
|
|
58
56
|
if (!customElements.get(tagName)) {
|
|
59
57
|
customElements.define(tagName, BiggiveCampaignCard$1);
|
|
60
58
|
}
|
|
61
59
|
break;
|
|
62
|
-
case "biggive-button":
|
|
63
|
-
if (!customElements.get(tagName)) {
|
|
64
|
-
defineCustomElement$3();
|
|
65
|
-
}
|
|
66
|
-
break;
|
|
67
|
-
case "biggive-progress-bar":
|
|
68
|
-
if (!customElements.get(tagName)) {
|
|
69
|
-
defineCustomElement$2();
|
|
70
|
-
}
|
|
71
|
-
break;
|
|
72
60
|
} });
|
|
73
61
|
}
|
|
74
62
|
|
|
@@ -1,4 +1,47 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
+
|
|
3
|
+
const biggiveFormFieldSelectOptionCss = "body{background-color:#D7D7D7}h1,h3,h4,h5,h6{margin-bottom:0}h1,.heading-1{font-size:47px;line-height:60px;font-weight:bold}h2,.heading-2{font-size:38px;line-height:45px;font-weight:bold}h3,.heading-3{font-size:25px;line-height:32px;font-weight:bold}h4,.heading-4{font-size:20px;line-height:24px;font-weight:bold}h5,.heading-5{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-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.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}.fill-red{fill:red}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.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:17px;line-height:24px;padding:10px 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.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.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-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#FFFFFF;background-color:#2C089B}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;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:27.5px}.button-rounded.size-small{border-radius:20px}.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{position:relative;padding-bottom:56.25%}.video-wrap iframe,.video-wrap video{position:absolute;border:0;display:block;left:0;right:0;top:0;bottom:0;width:100%;height:100%}.image-wrap img{width:100%;height:auto}.align-left{text-align:left}.align-right{text-align:right}.align-center{text-align:center}.align-justify{text-align:justify}.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}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top: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}.option{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;padding:2px 10px}.option:hover{background-color:#2C089B;color:#FFFFFF;cursor:pointer}";
|
|
4
|
+
|
|
5
|
+
const BiggiveFormFieldSelectOption$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
+
constructor() {
|
|
7
|
+
super();
|
|
8
|
+
this.__registerHost();
|
|
9
|
+
this.__attachShadow();
|
|
10
|
+
this.doOptionSelect = createEvent(this, "doOptionSelect", 7);
|
|
11
|
+
this.optionSelected = (event) => {
|
|
12
|
+
this.selectedValue = event.target.getAttribute('data-value');
|
|
13
|
+
this.selectedLabel = event.target.innerText;
|
|
14
|
+
var keyValuePair = { value: this.selectedValue, label: this.selectedLabel };
|
|
15
|
+
this.doOptionSelect.emit(keyValuePair);
|
|
16
|
+
};
|
|
17
|
+
this.selectedValue = null;
|
|
18
|
+
this.selectedLabel = null;
|
|
19
|
+
this.label = null;
|
|
20
|
+
this.value = null;
|
|
21
|
+
}
|
|
22
|
+
render() {
|
|
23
|
+
return (h("div", { class: "option", "data-value": this.value, onClick: this.optionSelected }, this.label));
|
|
24
|
+
}
|
|
25
|
+
static get style() { return biggiveFormFieldSelectOptionCss; }
|
|
26
|
+
}, [1, "biggive-form-field-select-option", {
|
|
27
|
+
"label": [1],
|
|
28
|
+
"value": [1],
|
|
29
|
+
"selectedValue": [32],
|
|
30
|
+
"selectedLabel": [32]
|
|
31
|
+
}]);
|
|
32
|
+
function defineCustomElement$1() {
|
|
33
|
+
if (typeof customElements === "undefined") {
|
|
34
|
+
return;
|
|
35
|
+
}
|
|
36
|
+
const components = ["biggive-form-field-select-option"];
|
|
37
|
+
components.forEach(tagName => { switch (tagName) {
|
|
38
|
+
case "biggive-form-field-select-option":
|
|
39
|
+
if (!customElements.get(tagName)) {
|
|
40
|
+
customElements.define(tagName, BiggiveFormFieldSelectOption$1);
|
|
41
|
+
}
|
|
42
|
+
break;
|
|
43
|
+
} });
|
|
44
|
+
}
|
|
2
45
|
|
|
3
46
|
const BiggiveFormFieldSelectOption = BiggiveFormFieldSelectOption$1;
|
|
4
47
|
const defineCustomElement = defineCustomElement$1;
|