@total_onion/onion-library 2.0.216 → 2.0.217

package/components/component-video-component-v3/video-component-v3.twig

@@ -1,4 +1,4 @@
-{# {% set videoEnabled = fields.enable_video %}
+{% set videoEnabled = fields.enable_video %}
 {% set renderDynamic = fields.child_pattern_settings.render_dynamic|default(0) %}
 {% set videoPlayingZindexClass = fields.video_playing_high_z_index ? 'video-playing--high-z-index' : '' %}
 {% if videoEnabled %}
@@ -87,4 +87,4 @@
 			{% endif %}
 		</div>
 	</div>
-{% endif %} #}
+{% endif %}

package/components/webc-loadmore-trigger/loadmore-trigger.html

@@ -1,3 +1,2 @@
-<loadmore-trigger id="loadmore-trigger" data-posts="" class="loadmore-trigger">
-	<button class="loadmore-trigger">Load More</button>
+<loadmore-trigger id="loadmore-trigger" class="loadmore-trigger">
 </loadmore-trigger>

package/components/webc-loadmore-trigger/loadmore-trigger.js

@@ -1,22 +1,29 @@
 export default function loadmoreTriggerJs(options = {}) {
 	try {
-		customElements.define(
-			'loadmore-trigger',
-			class extends HTMLElement {
-				// static observedAttributes = ['data-posts'];
-				constructor() {
-					super();
-				}
-				connectedCallback() {
-					console.log('Display module added to page.');
-					this.classList.add('loaded');
-				}
+		if (!customElements.get('loadmore-trigger')) {
+			customElements.define(
+				'loadmore-trigger',
+				class extends HTMLElement {
+					// static observedAttributes = ['data-posts'];
+					constructor() {
+						super();
+						this.enableLogs = this.dataset.enablelogs;
+						this.toggleButton = document.createElement('button');
+						this.toggleButton.className = 'loadmore-trigger';
+						this.appendChild(this.toggleButton);
+						this.toggleButton.innerText = this.dataset.toggletext;
+					}
+					connectedCallback() {
+						console.log('Display module added to page.');
+						this.classList.add('loaded');
+					}
 
-				attributeChangedCallback(name, oldValue, newValue) {
-					// console.log(`Attribute ${name} has changed.`);
+					attributeChangedCallback(name, oldValue, newValue) {
+						// console.log(`Attribute ${name} has changed.`);
+					}
 				}
-			}
-		);
+			);
+		}
 	} catch (error) {
 		console.error(error);
 	}

package/components/webc-post-filter-module/dev-content/dev-content.js

@@ -3,6 +3,7 @@ import kaiImage from './kai.webp';
 import kaiSelfie from './kai-selfie.webp';
 import kaiLounging from './kai-lounging.webp';
 import mrBusinessImage from './mr-business-doing-work.webp';
+import mrBusinessOnTop from './mr-business-on-top.webp';
 import amberImage from './amber.webp';
 import blueyImage from './bluey.webp';
 import ramsesKittenImage from './ramses-kitten.webp';
@@ -15,6 +16,7 @@ import skySecurity from './sky-security.webp';
 import skyLuxury from './sky-luxury-2.webp';
 import fatGigioSleepy from './fat-gigio-sleepy.webp';
 import fatGigioKitten from './fat-gigio-kitten.webp';
+import fatGigioBasket from './fat-gigio-basket-life.webp';
 import peteDinosaur from './pete-dinosaur.webp';
 import peteWork from './pete-at-work.webp';
 import vanillePartyDress from './vanille-party.webp';
@@ -23,7 +25,7 @@ import vanillePuppyFace from './vanille-puppy.webp';
 export const devContentPets = [
 	{
 		name: 'Ramses Big Yawn',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: ramsesImage
 		},
@@ -31,7 +33,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Kai sees a ghost',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: kaiImage
 		},
@@ -40,7 +42,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Mr Business doing Business',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: mrBusinessImage
 		},
@@ -49,25 +51,16 @@ export const devContentPets = [
 	},
 	{
 		name: 'Waking up Amber',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: amberImage
 		},
 
 		categories: [13, 5, 10]
 	},
-	{
-		name: 'Bluey on the move',
-		link: '#',
-		images: {
-			post_image_src: blueyImage
-		},
-
-		categories: [2, 13, 8]
-	},
 	{
 		name: 'Kitten Ramses',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: ramsesKittenImage
 		},
@@ -76,7 +69,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Mad Face Lulu',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: luluMadImage
 		},
@@ -85,7 +78,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Pete having a Bath',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: peteBath
 		},
@@ -94,7 +87,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Sky living large',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: skyLivingLarge
 		},
@@ -103,7 +96,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Dinosaur Pete',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: peteDinosaur
 		},
@@ -111,35 +104,44 @@ export const devContentPets = [
 		categories: [13, 10, 4]
 	},
 	{
-		name: 'Cutie Fat Gigio',
-		link: '#',
+		name: 'Puppy eyes Vanille',
+		link: 'https://totalonion.com',
 		images: {
-			post_image_src: fatGigioSleepy
+			post_image_src: vanillePuppyFace
 		},
 
-		categories: [13, 10, 5]
+		categories: [14, 10, 5]
 	},
 	{
-		name: 'Puppy eyes Vanille',
-		link: '#',
+		name: 'Cutie Fat Gigio',
+		link: 'https://totalonion.com',
 		images: {
-			post_image_src: vanillePuppyFace
+			post_image_src: fatGigioSleepy
 		},
 
-		categories: [14, 10, 5]
+		categories: [13, 10, 5]
 	},
 	{
 		name: 'Pete the Consultant',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: peteWork
 		},
 
 		categories: [12, 10, 4]
 	},
+	{
+		name: 'Bluey on the move',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: blueyImage
+		},
+
+		categories: [2, 13, 8]
+	},
 	{
 		name: 'Party Dress Vanille',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: vanillePartyDress
 		},
@@ -148,7 +150,7 @@ export const devContentPets = [
 	},
 	{
 		name: 'Fat Gigio Kitten',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: fatGigioKitten
 		},
@@ -157,25 +159,16 @@ export const devContentPets = [
 	},
 	{
 		name: 'Sky Security Corps',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: skySecurity
 		},
 
 		categories: [12, 10, 4]
 	},
-	{
-		name: 'Sky Luxury',
-		link: '#',
-		images: {
-			post_image_src: skyLuxury
-		},
-
-		categories: [12, 10, 4]
-	},
 	{
 		name: 'Kai Selfie',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: kaiSelfie
 		},
@@ -184,16 +177,25 @@ export const devContentPets = [
 	},
 	{
 		name: 'Lulu gets serious',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: luluSerious
 		},
 
 		categories: [12, 10, 5]
 	},
+	{
+		name: 'Sky Luxury',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: skyLuxury
+		},
+
+		categories: [12, 10, 4]
+	},
 	{
 		name: 'Pete rules her lawn',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: peteLawn
 		},
@@ -202,12 +204,30 @@ export const devContentPets = [
 	},
 	{
 		name: 'Kai takes it easy',
-		link: '#',
+		link: 'https://totalonion.com',
 		images: {
 			post_image_src: kaiLounging
 		},
 
 		categories: [13, 10, 4]
+	},
+	{
+		name: 'Fat Gigio Basket Life',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: fatGigioBasket
+		},
+
+		categories: [13, 10, 5, 1]
+	},
+	{
+		name: 'Mr Business On Top',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: mrBusinessOnTop
+		},
+
+		categories: [13, 10, 5, 1]
 	}
 ];
 
@@ -215,7 +235,7 @@ export const devContentCategories = [
 	{name: 'Mood', id: '6', parentid: '0'},
 	{name: 'Happy', id: '1', parentid: '6'},
 	{name: 'Frightened', id: '2', parentid: '6'},
-	{name: 'Sleepy', id: '3', parentid: '6'},
+	{name: 'Thoughtful', id: '3', parentid: '6'},
 	{name: 'Active', id: '4', parentid: '6'},
 	{name: 'Chilled', id: '5', parentid: '6'},
 	{name: 'Limbs', id: '7', parentid: '0'},

package/components/webc-post-filter-module/dev-content/dev-contentlocal.js

@@ -0,0 +1,258 @@
+const ramsesImage = '../webc-post-filter-module/dev-content/ramses-tired.webp';
+const kaiImage = '../webc-post-filter-module/dev-content/kai.webp';
+const kaiSelfie = '../webc-post-filter-module/dev-content/kai-selfie.webp';
+const kaiLounging = '../webc-post-filter-module/dev-content/kai-lounging.webp';
+const mrBusinessImage =
+	'../webc-post-filter-module/dev-content/mr-business-doing-work.webp';
+const mrBusinessOnTop =
+	'../webc-post-filter-module/dev-content/mr-business-on-top.webp';
+const amberImage = '../webc-post-filter-module/dev-content/amber.webp';
+const blueyImage = '../webc-post-filter-module/dev-content/bluey.webp';
+const ramsesKittenImage =
+	'../webc-post-filter-module/dev-content/ramses-kitten.webp';
+const luluMadImage = '../webc-post-filter-module/dev-content/lulu-mad.webp';
+const luluSerious = '../webc-post-filter-module/dev-content/lulu-serious.webp';
+const peteBath = '../webc-post-filter-module/dev-content/pete-bath.webp';
+const peteLawn = '../webc-post-filter-module/dev-content/pete-lawn.webp';
+const skyLivingLarge = '../webc-post-filter-module/dev-content/sky-field.webp';
+const skySecurity = '../webc-post-filter-module/dev-content/sky-security.webp';
+const skyLuxury = '../webc-post-filter-module/dev-content/sky-luxury-2.webp';
+const fatGigioSleepy =
+	'../webc-post-filter-module/dev-content/fat-gigio-sleepy.webp';
+const fatGigioKitten =
+	'../webc-post-filter-module/dev-content/fat-gigio-kitten.webp';
+const fatGigioBasket =
+	'../webc-post-filter-module/dev-content/fat-gigio-basket-life.webp';
+const peteDinosaur =
+	'../webc-post-filter-module/dev-content/pete-dinosaur.webp';
+const peteWork = '../webc-post-filter-module/dev-content/pete-at-work.webp';
+const vanillePartyDress =
+	'../webc-post-filter-module/dev-content/vanille-party.webp';
+const vanillePuppyFace =
+	'../webc-post-filter-module/dev-content/vanille-puppy.webp';
+
+export const devContentPets = [
+	{
+		name: 'Ramses Big Yawn',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: ramsesImage
+		},
+		categories: [13, 3, 10]
+	},
+	{
+		name: 'Kai sees a ghost',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: kaiImage
+		},
+
+		categories: [12, 2, 10]
+	},
+	{
+		name: 'Mr Business doing Business',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: mrBusinessImage
+		},
+
+		categories: [13, 3, 9]
+	},
+	{
+		name: 'Waking up Amber',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: amberImage
+		},
+
+		categories: [13, 5, 10]
+	},
+	{
+		name: 'Kitten Ramses',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: ramsesKittenImage
+		},
+
+		categories: [12, 2, 10]
+	},
+	{
+		name: 'Mad Face Lulu',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: luluMadImage
+		},
+
+		categories: [14, 10, 5]
+	},
+	{
+		name: 'Pete having a Bath',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: peteBath
+		},
+
+		categories: [13, 10, 5]
+	},
+	{
+		name: 'Sky living large',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: skyLivingLarge
+		},
+
+		categories: [13, 10, 4]
+	},
+	{
+		name: 'Dinosaur Pete',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: peteDinosaur
+		},
+
+		categories: [13, 10, 4]
+	},
+	{
+		name: 'Puppy eyes Vanille',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: vanillePuppyFace
+		},
+
+		categories: [14, 10, 5]
+	},
+	{
+		name: 'Cutie Fat Gigio',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: fatGigioSleepy
+		},
+
+		categories: [13, 10, 5]
+	},
+	{
+		name: 'Pete the Consultant',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: peteWork
+		},
+
+		categories: [12, 10, 4]
+	},
+	{
+		name: 'Bluey on the move',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: blueyImage
+		},
+
+		categories: [2, 13, 8]
+	},
+	{
+		name: 'Party Dress Vanille',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: vanillePartyDress
+		},
+
+		categories: [14, 10, 4]
+	},
+	{
+		name: 'Fat Gigio Kitten',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: fatGigioKitten
+		},
+
+		categories: [12, 10, 5]
+	},
+	{
+		name: 'Sky Security Corps',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: skySecurity
+		},
+
+		categories: [12, 10, 4]
+	},
+	{
+		name: 'Kai Selfie',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: kaiSelfie
+		},
+
+		categories: [12, 10, 5]
+	},
+	{
+		name: 'Lulu gets serious',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: luluSerious
+		},
+
+		categories: [12, 10, 5]
+	},
+	{
+		name: 'Sky Luxury',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: skyLuxury
+		},
+
+		categories: [12, 10, 4]
+	},
+	{
+		name: 'Pete rules her lawn',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: peteLawn
+		},
+
+		categories: [13, 10, 4]
+	},
+	{
+		name: 'Kai takes it easy',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: kaiLounging
+		},
+
+		categories: [13, 10, 4]
+	},
+	{
+		name: 'Fat Gigio Basket Life',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: fatGigioBasket
+		},
+
+		categories: [13, 10, 5, 1]
+	},
+	{
+		name: 'Mr Business On Top',
+		link: 'https://totalonion.com',
+		images: {
+			post_image_src: mrBusinessOnTop
+		},
+
+		categories: [13, 10, 5, 1]
+	}
+];
+
+export const devContentCategories = [
+	{name: 'Mood', id: '6', parentid: '0'},
+	{name: 'Happy', id: '1', parentid: '6'},
+	{name: 'Frightened', id: '2', parentid: '6'},
+	{name: 'Thoughtful', id: '3', parentid: '6'},
+	{name: 'Active', id: '4', parentid: '6'},
+	{name: 'Chilled', id: '5', parentid: '6'},
+	{name: 'Limbs', id: '7', parentid: '0'},
+	{name: 'Two', id: '8', parentid: '7'},
+	{name: 'Three', id: '9', parentid: '7'},
+	{name: 'Four', id: '10', parentid: '7'},
+	{name: 'Age', id: '11', parentid: '0'},
+	{name: 'Baby', id: '12', parentid: '11'},
+	{name: 'Adult', id: '13', parentid: '11'},
+	{name: 'Vintage', id: '14', parentid: '11'}
+];

package/components/webc-post-filter-module/post-filter-module.css

@@ -1,10 +1,38 @@
 post-filter-module {
+	position: fixed;
+	inset: 0;
+	background-color: black;
+	right: unset;
 	display: block;
-	background-color: aquamarine;
+	width: 100vw;
+	transform: translateX(-100%);
+	max-width: 414px;
+	z-index: 10;
+	transition: transform ease-in-out 0.3s;
+
+	@starting-style {
+		transform: translateX(-100%);
+	}
+
+	@media (min-width: 768px) {
+		max-width: unset;
+		width: 475px;
+	}
+
+	.post-filter-module__grouping-category-button {
+	}
+
 	.post-filter-module__filter-category-button {
-		border: 1px solid yellow;
+		appearance: none;
+		color: var(--theme-primary-text-colour, white);
+		border: 1px solid transparent;
+		background-color: var(--theme-primary-background-colour, black);
 	}
 	.post-filter-module__filter-category-button.active-cat {
-		border: 1px solid red;
+		color: gold;
+		border: 1px solid gold;
 	}
 }
+post-filter-module.active {
+	transform: translateX(0%);
+}

package/components/webc-post-filter-module/post-filter-module.html

@@ -2,7 +2,7 @@
 	id="filter-module"
 	data-dataobjectid=""
 	data-dev="true"
-	data-devcontent="Pets"
+	data-devdatalocation="local"
 	class="post-filter-module__filter"
 >
 </post-filter-module>