@total_onion/onion-library 1.0.0

package/components/component-classic-nav-items-center/classic-nav-items-center.twig

@@ -0,0 +1,144 @@
+{% set blockClassName = "classic-nav-items-center" %}
+{% set headerLayout = 2 %}
+
+{% set navFontFamily = '--nav-font-family: ' ~ fields.classic_nav_items_center.nav_font_family|ru ~ ';' %}
+{% set navLinkColourMobile = '--nav-link-colour-mobile: ' ~ fields.classic_nav_items_center.nav_link_colour_mobile ~ ';' %}
+{% set navLinkColourDesktop = '--nav-link-colour-desktop: ' ~ fields.classic_nav_items_center.nav_link_colour_desktop ~ ';' %}
+{% set navLinkColourHover = '--nav-link-colour-hover: ' ~ fields.classic_nav_items_center.nav_link_colour_hover ~ ';' %}
+{% set navBgColourMobile = '--nav-bg-colour-mobile: ' ~ fields.classic_nav_items_center.nav_bg_colour_mobile ~ ';' %}
+{% set navBgColourDesktop = '--nav-bg-colour-desktop: ' ~ fields.classic_nav_items_center.nav_bg_colour_desktop ~ ';' %}
+{% set navMenuToggleColourMobile = '--nav-menu-toggle-colour-mobile: ' ~ fields.classic_nav_items_center.nav_menu_toggle_colour_mobile ~ ';' %}
+{% set navSlideInBgColourMobile = '--nav-slide-in-bg-colour-mobile: ' ~ fields.classic_nav_items_center.nav_slide_in_bg_colour_mobile ~ ';' %}
+
+{% set headerStyles = navFontFamily ~ navLinkColourMobile ~ navLinkColourDesktop ~ navLinkColourHover ~ navBgColourMobile ~ navBgColourDesktop ~ navMenuToggleColourMobile ~ navSlideInBgColourMobile %}
+
+
+<header class="{{blockClassName}} {{headerBackgroundImgDesktopClass}}" style="{{headerStyles}}">
+	{% if options.enable_header_banner %}
+		<div class="{{blockClassName}}__header-banner">
+			{{options.header_banner_text|striptags('<a>')}}
+		</div>
+	{% endif %}
+	{% set siteLogo = get_image(options.header_logo_desktop) %}
+	{% set siteLogoMobile = get_image(options.header_logo_mobile) %}
+
+	{% if siteLogo.src or siteLogoMobile.src %}
+		<a href="{{site.url}}/" class="header-logo">
+
+			{% if siteLogo.src %}
+				<img src="{{ siteLogo.src }}" scrset="{{ siteLogo.srcset }}" height="{{siteLogo.height}}" width="{{siteLogo.width}}" alt="site logo" class="header-logo__image header-logo__image--desktop"/>
+			{% endif %}
+			{% if siteLogoMobile.src %}
+				<img src="{{ siteLogoMobile.src }}" scrset="{{ siteLogoMobile.srcset }}" height="{{ siteLogoMobile.height }}" width="{{ siteLogoMobile.width }}" alt="site logo" class="header-logo__image header-logo__image--mobile"/>
+			{% endif %}
+		</a>
+	{% endif %}
+	{% if options.site_title or options.site_subtitle %}
+		<div class="{{blockClassName}}__title-container">
+			{% if options.site_title %}
+				<a class="{{blockClassName}}__site-title" href="/" title="{{options.site_title}}">{{options.site_title}}</a>
+			{% endif %}
+			{% if options.site_subtitle %}
+				<p class="{{blockClassName}}__site-subtitle">{{options.site_subtitle}}</p>
+			{% endif %}
+		</div>
+	{% endif %}
+	<div class="header-interactions">
+		{% if options.enable_header_favourite %}
+			<div class="header-interactions__favourite" data-better-reviews-personal-likes>
+				<a class="header-interactions__favourite-link" href="{{ options.favourites_listing_page.guid }}">{% include "/assets/images/icon/heart-outline-1.svg" with {'colour': 'white' }%}</a>
+				<span class="header-interactions__favourite-count better-reviews__personal-likes__count" data-better-reviews-personal-likes-total></span>
+			</div>
+		{% endif %}
+
+		{% if options.enable_header_cart %}
+			<div class="header-interactions__cart">
+				<img src="{{options.cart_icon.url}}" alt="{{options.cart_icon.alt}}" width="{{options.cart_icon.width}}" height="{{options.cart_icon.height}}">
+			</div>
+		{% endif %}
+		<div class="header-interactions__hamburger-wrapper" id="header-test">
+			<div class="header-interactions__hamburger">
+				<div class="header-interactions__hamburger-bar a"></div>
+				<div class="header-interactions__hamburger-bar b"></div>
+				<div class="header-interactions__hamburger-bar c"></div>
+			</div>
+		</div>
+	</div>
+	<div class="{{blockClassName}}__nav-wrapper {{headerBackgroundImgMobileClass}}">
+		{% if nav_menus.primary_menu is defined and nav_menus.primary_menu is not null %}
+			<nav class="header-nav header-nav--primary">
+				{% if nav_menus.primary_menu.items is defined and nav_menus.primary_menu.items is not empty %}
+					<ul class="header-nav__container">
+						{% for item in nav_menus.primary_menu.items %}
+							<li class="{{ item.class }} header-nav__item">
+								<a class="{{ item.class }} header-nav__item-link" href="{{ item.link }}">{{ item.title }}</a>
+								{% if item.children is defined and item.children is not empty %}
+									<div class="header-nav__sub-nav">
+										<ul class="header-nav__sub-nav-container">
+											{% for child in item.children %}
+												<li class="{{ child.class }} header-nav__item header-nav__sub-nav-item">
+													<a class="header-nav__link header-nav__sub-nav-link" href="{{ child.url }}">
+														{% if fn('get_field', 'product_thumbnail', child.object_id) is not empty %}
+															{% set image = fn('get_field', 'product_thumbnail', child.object_id) %}
+															{% if image is defined %}
+																{% set imageSizes = '(min-width: 768px) 10vw, (min-width: 500px) 10vw, 50vw' %}
+																{% set imageFields = [] %}
+																{% set imageFields = imageFields|merge({'enable_image' : true}) %}
+																{% set imageFields = imageFields|merge({'desktop_image' : image}) %}
+																{% set imageClassname = blockClassName ~ '__subnav-picture' %}
+																{{ include('components/responsive-image.twig', {fields : imageFields, block : block, blockClassName : imageClassname, desktopSizes: imageSizes}, with_context = false) }}
+															{% endif %}
+														{% endif %}
+
+														<p>
+															{{ child.name }}
+															{% if child.custom.subtitle is defined and child.custom.subtitle is not empty %}
+																<span>{{ child.custom.subtitle }}</span>
+															{% endif %}
+														</p>
+
+													</a>
+												</li>
+											{% endfor %}
+											{% if item.custom.subnavigation_bottom_link is defined and item.custom.subnavigation_bottom_link is not empty %}
+												<li class="header-nav__item header-nav__item--viewall">
+													<a href="{{item.custom.subnavigation_bottom_link.url}}" class="header-nav__item-link">{{item.custom.subnavigation_bottom_link.title}}</a>
+												</li>
+											{% endif %}
+										</ul>
+									</div>
+								{% endif %}
+							</li>
+						{% endfor %}
+					</ul>
+				{% endif %}
+				<div class="header-additionalnav">
+					<ul class="header-additionalnav__container">
+						{% if options.enable_header_cart %}
+							<li class="header-nav__item header-additionalnav__cart">
+								<a href="" class="header-nav__item-link">{% include "/assets/images/icon/cart.svg" %}
+									Cart</a>
+							</li>
+						{% endif %}
+						{% if options.enable_header_favourite %}
+							<li class="header-nav__item header-additionalnav__favourites">
+								<a href="" class="header-nav__item-link">{% include "/assets/images/icon/heart-outline-1.svg" with {'colour': 'white' }%}
+									Favourıtes</a>
+							</li>
+						{% endif %}
+					</ul>
+				</div>
+				<div class="header-social">
+					{% for social in options.social_accounts %}
+						{% if social.enabled %}
+							<a target="{{social.social_link.target}}" href="{{social.social_link.url}}" title="{{social.social_link.title}}" aria-label="{{social.social_newtork}}" class="{{blockClassName}}__social__link">
+								<img loading="lazy" class="{{blockClassName}}__social-icon" srcset="{{get_image(social.social_icon).srcset}}" width="{{social.social_icon.width}}" height="{{social.social_icon.height}}" src="{{get_image(social.social_icon).src}}" sizes="" alt="{{get_image(social.social_icon).alt}}">
+							</a>
+						{% endif %}
+					{% endfor %}
+				</div>
+				{# <div class="header-market-selector">																																																																																																																																																																																																																																										</div> #}
+			</nav>
+		{% endif %}
+	</div>
+</header>

package/components/component-classic-nav-items-center/group_66a2b63ae5cad.json

@@ -0,0 +1,277 @@
+{
+    "key": "group_66a2b63ae5cad",
+    "title": "Component: Classic Nav Items Center",
+    "fields": [
+        {
+            "key": "field_66a2b63b99dce",
+            "label": "Settings",
+            "name": "",
+            "aria-label": "",
+            "type": "tab",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "placement": "top",
+            "endpoint": 0,
+            "no_preference": 0,
+            "selected": 0
+        },
+        {
+            "key": "field_66a6752123ae6",
+            "label": "Nav font family",
+            "name": "nav_font_family",
+            "aria-label": "",
+            "type": "select",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "choices": {
+                "__var(--primary-font-family)": "Primary font",
+                "__var(--secondary-font-family)": "Secondary font",
+                "__var(--tertiary-font-family)": "Tertiary font",
+                "__var(--quaternary-font-family)": "Quaternary font"
+            },
+            "default_value": "__var(--primary-font-family)",
+            "return_format": "value",
+            "multiple": 0,
+            "max": "",
+            "prepend": "",
+            "append": "",
+            "allow_null": 0,
+            "ui": 0,
+            "ajax": 0,
+            "placeholder": "",
+            "allow_custom": 0,
+            "search_placeholder": "",
+            "min": ""
+        },
+        {
+            "key": "field_66a695722ed0f",
+            "label": "Nav link colour mobile",
+            "name": "nav_link_colour_mobile",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a7719c99e2b",
+            "label": "Nav link colour desktop",
+            "name": "nav_link_colour_desktop",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a69887d4600",
+            "label": "Nav link colour hover",
+            "name": "nav_link_colour_hover",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a69a2126a9e",
+            "label": "Nav background colour mobile",
+            "name": "nav_bg_colour_mobile",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a69a60e4496",
+            "label": "Nav background colour desktop",
+            "name": "nav_bg_colour_desktop",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a76cbbf16c6",
+            "label": "Nav menu toggle colour mobile",
+            "name": "nav_menu_toggle_colour_mobile",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        },
+        {
+            "key": "field_66a76fe7f7b46",
+            "label": "Nav slide in bg colour mobile",
+            "name": "nav_slide_in_bg_colour_mobile",
+            "aria-label": "",
+            "type": "color_picker",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 3,
+            "default_value": "",
+            "enable_opacity": 0,
+            "return_format": "string",
+            "display": "default",
+            "button_label": "Select Color",
+            "color_picker": 1,
+            "absolute": 0,
+            "input": 1,
+            "allow_null": 1,
+            "theme_colors": 0,
+            "colors": []
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "post_type",
+                "operator": "==",
+                "value": "post"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "left",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": false,
+    "description": "",
+    "show_in_rest": 0,
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfml_field_group_mode": "localization",
+    "acfe_form": 0,
+    "acfe_display_title": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1746891280
+}

package/components/component-code-block/code-block.scss

@@ -0,0 +1,10 @@
+@mixin codeBlock() {
+	&__code-block-container {
+		width: 100%;
+		overflow: scroll;
+		display: flex;
+	}
+	&__code-block__code {
+		display: block;
+	}
+}

package/components/component-code-block/code-block.twig

@@ -0,0 +1,7 @@
+{% if fields.code_block %}
+	<div class="{{blockClassName}}__code-block-container">
+		<pre>
+            <code class="{{blockClassName}}__code-block-code">{{fields.code_block|e}}</code>
+        </pre>
+	</div>
+{% endif %}

package/components/component-code-block/group_657eeb3aeb09e.json

@@ -0,0 +1,58 @@
+{
+    "key": "group_657eeb3aeb09e",
+    "title": "Component: Code block",
+    "fields": [
+        {
+            "key": "field_657eeb3b82a05",
+            "label": "Code block",
+            "name": "code_block",
+            "aria-label": "",
+            "type": "textarea",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "wpml_cf_preferences": 2,
+            "user_roles": [
+                "all"
+            ],
+            "default_value": "",
+            "maxlength": "",
+            "rows": "",
+            "placeholder": "",
+            "new_lines": "",
+            "acfe_textarea_code": 0
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "block",
+                "operator": "!=",
+                "value": "all"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "normal",
+    "style": "default",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": "",
+    "active": false,
+    "description": "",
+    "show_in_rest": 0,
+    "acfe_autosync": [
+        "json"
+    ],
+    "acfml_field_group_mode": "localization",
+    "acfe_form": 0,
+    "acfe_display_title": "",
+    "acfe_meta": "",
+    "acfe_note": "",
+    "modified": 1746891283
+}

package/components/component-competition-selection/competition-selection.twig

@@ -0,0 +1,5 @@
+{% set competition = fields.competition %}
+
+{% if competition %}
+	{{function('do_shortcode', competition)}}
+{% endif %}

package/components/component-content-container/content-container.js

@@ -0,0 +1,92 @@
+import shop from 'Assets/js/modules/library-modules/shopify/shop';
+
+export default function contentContainerJs(block) {
+	if (!block) {
+		return;
+	}
+	const blockClassName = block.dataset.assetkey;
+	const formContainerElement = block.querySelector('.form-container');
+	const countdownElement = block.querySelector('.countdowndate');
+	const socialMediaElement = block.querySelector('.social-media-share-popup');
+	const accordionV2Element = block.querySelector(
+		`.${blockClassName}__accordion-v2`
+	);
+	const marketSelector = block.querySelector('.market-selector');
+	const shopifySelector = block.querySelector('.shopify__cart');
+	const contentTooltip = block.querySelector('.content-tooltip-wrapper');
+	const spotifyEmbed = block.querySelector('.spotify-embed');
+	const truncatedText = block.querySelector('.truncated-text');
+	// const accordionV3Element = block.querySelector(
+	// 	'.standard-content-v2__accordion-v3'
+	// );
+
+	if (formContainerElement) {
+		import(
+			'Assets/js/modules/library-modules/form-selection/form-selection.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+
+	if (countdownElement) {
+		import('Assets/js/modules/library-modules/countdown/countdown.js').then(
+			(module) => {
+				module.default(block);
+			}
+		);
+	}
+
+	if (socialMediaElement) {
+		import(
+			'Assets/js/modules/library-modules/social-media-share/social-media-share.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+
+	if (accordionV2Element) {
+		import(
+			'Assets/js/modules/library-modules/accordion-v2/accordion-v2.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+
+	if (marketSelector) {
+		import(
+			'Assets/js/modules/library-modules/market-selector/market-selector.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+	if (shopifySelector) {
+		shop.loadShops();
+	}
+	if (contentTooltip) {
+		import(
+			'Assets/js/modules/library-modules/content-tooltip/content-tooltip.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+	if (spotifyEmbed) {
+		import(
+			'Assets/js/modules/library-modules/spotify-embed/spotify-embed.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+	if (truncatedText) {
+		import(
+			'Assets/js/modules/library-modules/truncated-text/truncated-text.js'
+		).then((module) => {
+			module.default(block);
+		});
+	}
+
+	// if (accordionV3Element) {
+	// 	import('Assets/js/modules/library-modules/accordion-v3/accordion-v3.js').then((module) => {
+	// 		module.default(block);
+	// 	})
+	// }
+}

package/components/component-content-container/content-container.scss

@@ -0,0 +1,57 @@
+@use 'Assets/scss/modules/library-modules/content-image-v2/content-image-v2';
+@use 'Assets/scss/modules/library-modules/nav-menu/nav-menu';
+@use 'Assets/scss/modules/library-modules/code-block/code-block';
+@use 'Assets/scss/modules/library-modules/countdown/countdown';
+@use 'Assets/scss/modules/library-modules/bazaarvoice-review/bazaarvoice-review';
+@use 'Assets/scss/modules/library-modules/post-author/post-author';
+@use 'Assets/scss/modules/library-modules/content-tooltip/content-tooltip';
+
+@use 'Assets/scss/modules/library-modules/accent-text/accent-text';
+@use 'Assets/scss/modules/library-modules/content-container-settings/content-container-settings';
+@use 'Assets/scss/modules/library-modules/better-reviews/better-reviews';
+@use 'Assets/scss/modules/library-modules/blockquote/blockquote';
+@use 'Assets/scss/modules/library-modules/social-media-share/social-media-share';
+@use 'Assets/scss/modules/library-modules/accordion-v2/accordion-v2';
+// @use 'Assets/scss/modules/library-modules/accordion-v3/accordion-v3';
+@use 'Assets/scss/modules/library-modules/market-selector/market-selector';
+@use 'Assets/scss/modules/library-modules/truncated-text/truncated-text';
+@use 'Assets/scss/modules/library-modules/spotify-embed/spotify-embed';
+@use 'Assets/scss/theme/buttons';
+
+@mixin contentContainer() {
+	@include nav-menu.navMenu();
+	@include code-block.codeBlock();
+	@include countdown.countdown();
+	@include bazaarvoice-review.bazaarvoice-review();
+	@include post-author.postauthorinfo();
+	@include content-tooltip.content-tooltip();
+	@include spotify-embed.spotify-embed();
+	@include market-selector.market-selector();
+	@include accent-text.accent-text();
+	@include content-container-settings.contentContainerSettings();
+	@include better-reviews.better-reviews();
+	@include blockquote.blockquote();
+	@include social-media-share.social-media-share();
+	@include accordion-v2.accordion-v2();
+	// @include accordion-v3.accordion-v3();
+	@include buttons.shareIconStyles();
+	@include buttons.playButtonStyles();
+	@include truncated-text.truncated-text();
+
+	&__video-play-button-container {
+		display: grid;
+		width: 100%;
+		pointer-events: all;
+		&:last-child {
+			margin-bottom: 0;
+		}
+	}
+	&__video-play-button {
+		grid-area: unset;
+		place-self: var(--playbutton-vertical-alignment, center)
+			var(--playbutton-horizontal-alignment, center);
+	}
+	&__content-image {
+		@include content-image-v2.contentImage();
+	}
+}