@total_onion/onion-library 1.0.84 → 1.0.85

package/components/component-athena-head-v3/athena-head-v3.twig

@@ -0,0 +1,4 @@
+{{ include('components/noscript.twig', ignore_missing = true) }}
+{{ include('components/core-design-settings-v3.twig', ignore_missing = true) }}
+{{ include('components/speculation-api.twig', ignore_missing = true) }}
+{{ include('components/global-preload.twig', ignore_missing = true) }}

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

@@ -154,6 +154,9 @@
 				'static'
 			)
 			var(--text-stroke-colour);
+		&:last-child {
+			margin-bottom: 0;
+		}
 		@include core-mixins-v3.defaultThemeTextColours();
 		@include core-mixins-v3.defaultTextTransform();
 		@include core-mixins-v3.defaultTextAlign();
@@ -172,10 +175,6 @@
 			@include core-mixins-v3.defaultFontStyle();
 		}
 
-		&:last-child {
-			margin-bottom: 0;
-		}
-
 		@include core-mixins-v3.device(breakpoints.$tabPortrait) {
 			max-width: var(--wysiwyg-max-width-portrait);
 		}

package/components/component-gradient-overlay-v3/gradient-overlay-v3.scss

@@ -0,0 +1,45 @@
+// LIBRARY FILE - Do not modify/override here as your changes will be lost when the package is updated.
+// This is the new version the older mixins should be removed and the blocks use Gradient Overlay mixin instead
+@mixin gradientOverlay() {
+	--spread: calc(100% - var(--gradient-spread));
+	&__gradient-overlay-element {
+		position: absolute;
+		inset: 0;
+		z-index: var(--gradient-zindex);
+		grid-area: var(--gradient-grid-area);
+		&::before,
+		&:after {
+			content: '';
+			pointer-events: none;
+			position: absolute;
+			inset: 0;
+			opacity: var(--gradient-opacity);
+		}
+		&::before {
+			background: linear-gradient(
+				var(--gradient-origin-before),
+				rgba(255, 255, 255, 0) 0%,
+				rgba(255, 255, 255, 0)
+					calc(var(--spread) - var(--gradient-amount)),
+				var(--gradient-colour) calc(100% - var(--gradient-amount))
+			);
+		}
+		&::after {
+			content: var(--enable-after);
+			background: linear-gradient(
+				var(--gradient-origin-after),
+				rgba(255, 255, 255, 0) 0%,
+				rgba(255, 255, 255, 0)
+					calc(var(--spread) - var(--gradient-amount)),
+				var(--gradient-colour) calc(100% - var(--gradient-amount))
+			);
+		}
+	}
+	&__blur-overlay-element {
+		background: var(--blur-colour);
+		backdrop-filter: blur(var(--blur-value));
+		position: absolute;
+		inset: 0;
+		z-index: var(--blur-zindex);
+	}
+}

package/components/fields-block-editor-assets-v3/block-editor-assets-v3.php

@@ -0,0 +1,17 @@
+<?php
+add_action('enqueue_block_assets', 'add_block_editor_assets_v3', 10, true);
+function add_block_editor_assets_v3(): void
+{
+    if (is_admin()) {
+        wp_enqueue_style('core-wordpress-block-editor-previews', gtp_get_asset_uri('corewordpressblockeditorpreviewcss.css'), array(), null);
+        wp_enqueue_script('editorstyles', gtp_get_asset_uri('corewordpressblockeditorpreview.js'), array(), null, true);
+        wp_localize_script('editorstyles', 'previewvars', core_design_system());
+        wp_localize_script('editorstyles', 'corecta', core_cta());
+        wp_localize_script('editorstyles', 'coretypography', core_typography_v3());
+        wp_localize_script('editorstyles', 'corefontmodifiers', core_font_modifiers());
+        wp_localize_script('editorstyles', 'ctastylenames', []);
+        wp_localize_script('editorstyles', 'themenames', []);
+        wp_localize_script('editorstyles', 'corethemes', core_themes());
+        wp_localize_script('editorstyles', 'colourconfig', create_colour_data());
+    }
+}

package/components/fields-core-design-settings-v3/core-design-settings-v3.twig

@@ -0,0 +1,6 @@
+{{function('core_critical_css').0}}
+{{function('core_design_system').0}}
+{{function('core_typography_v3').0}}
+{{function('core_font_modifiers').0}}
+{{function('core_themes').0}}
+{{function('core_cta').0}}

package/components/fields-core-design-system-v3/core-design-system-v3.php

@@ -0,0 +1,44 @@
+<?php
+// @codingStandardsIgnoreStart
+function core_design_system_v3()
+{
+    $output = '';
+    $current_post = [];
+    if (isset($GLOBALS['post'])) {
+        $current_post = Timber::get_post($GLOBALS['post']->ID);
+    }
+    if (defined('GLOBAL_SETTINGS') && is_array(GLOBAL_SETTINGS)) {
+        $options = GLOBAL_SETTINGS;
+        if ($options) {
+            $output = '
+            <style id="core-design-system">
+            :root { 
+                --mobile-inline:' . ($options['mobile_inline'] ?? 0) . '; 
+                --portrait-inline:' . ($options['portrait_inline'] ?? 0) . '; 
+                --landscape-inline:' . ($options['landscape_inline'] ?? 0) . '; 
+                --desktop-inline:' . ($options['desktop_inline'] ?? 0) . '; 
+                --screen-width-fullhd:' . ($options['screen_width_full_hd'] ?? 1920) . ';
+                --font-reference-fullhd:' . ($options['font_reference_full_hd'] ?? 1920) . ';
+                --screen-width-desktop:' . ($options['screen_width_desktop'] ?? 1440) . ';
+                --font-reference-desktop:' . ($options['font_reference_desktop'] ?? 1440) . ';
+                --screen-width-landscape:' . ($options['screen_width_landscape'] ?? 1024) . ';
+                --font-reference-landscape:' . ($options['font_reference_landscape'] ?? 1024) . ';
+                --screen-width-portrait:' . ($options['screen_width_portrait'] ?? 768) . ';
+                --font-reference-portrait:' . ($options['font_reference_portrait'] ?? 768) . ';
+                --font-reference-mobile:' . ($options['font_reference_mobile'] ?? 375) . ';
+                --screen-width-mobile:' . ($options['screen_width_mobile'] ?? 375) . ';
+                --screen-width-static:' . ($options['desktop_design_reference'] ?? 1920) . 'px;
+                --fullhd-design-reference:' . ($options['full_hd_design_reference'] ?? 1920) . ';
+                --desktop-design-reference:' . ($options['desktop_design_reference'] ?? 1440) . ';
+                --landscape-design-reference:' . ($options['landscape_design_reference'] ?? 1024) . ';
+                --portrait-design-reference:' . ($options['portrait_design_reference'] ?? 1024) . ';
+                --mobile-design-reference:' . ($options['mobile_design_reference'] ?? 1024) . ';
+                --global-content-max-width-setting:' . ($options['global_content_max_width_setting'] ?? 1024) . ';
+                --post-colour:' . ($current_post && (property_exists($current_post, 'meta') && isset($current_post->meta['post_colour'])) ? $current_post->meta['post_colour'] : '') . ';
+                --post-text-colour-style:' .  ($current_post && (property_exists($current_post, 'meta') && isset($current_post->meta['post_text_colour_style'])) ? remove_underscore($current_post->meta['post_text_colour_style']) : '') . ';
+                }</style>';
+        }
+    }
+    return [$output];
+} // END function core_design_vars
+// @codingStandardsIgnoreEnd

package/components/fields-core-typography-v3/core-typography-v3.scss

@@ -24,8 +24,8 @@ h5,
 h6 {
 	margin: 0; //reset default margin
 	font-weight: unset; //reset default font weight
-	@include core-typography-mixins-v3.fontPrimary();
 	margin-top: unset;
+	@include core-typography-mixins-v3.fontPrimary();
 }
 .override-element-styles {
 	h1,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@total_onion/onion-library",
-	"version": "1.0.84",
+	"version": "1.0.85",
 	"description": "Component library",
 	"main": "index.js",
 	"scripts": {