To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "heading",
			"heading" => [
				"heading_text" => "We speak to Yubico's CSO about the problem with passwords, different modern authentication solutions, and how to make passwordless a success in your organisation.",
				"heading_size" => "h2"
			]
		],
		[
			"content_type" => "large_text",
			"large_paragraph" => "<div>Here is an example of a startfirst using the large text. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</div>"
		],
		[
			"content_type" => "text",
			"copy" => "<div>Here is an example of a normal paragraph using the normal wysiwyg. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.</div>",
			"wysiwyg_img_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text",
			"copy" => "<div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</div><div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat</div><div>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</div>",
			"wysiwyg_img_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquya.</p>",
			"wysiwyg_img_border" => false
		],
		[
			"content_type" => "quote",
			"quote" => [
				"bg_colour" => "oatmeal",
				"background_overlay" => [
					"has_overlay" => true,
					"overlay_image" => [
						[
							"url" => "/resources/images/patterns/Butterfly_2.svg",
							"alt" => "A stylized version of the Kocho butterfly logo"
						]
					],
					"overlay_position" => "top_right"
				],
				"show_quote" => true,
				"quote_text" => "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>",
				"quote_source" => "Bob Ross",
				"quote_link" => [
					"url" => "https://www.google.co.uk"
				]
			]
		],
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquya.</p>",
			"wysiwyg_img_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquya.</p>",
			"wysiwyg_img_border" => false
		],
		[
			"content_type" => "image",
			"image" => [
				"url" => "/resources/images/pattern-library/kitten-green.jpg",
				"alt" => "kitten"
			],
			"image_source" => [
				"title" => "google.com",
				"url" => "https://google.com"
			],
			"image_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "accordion",
			"accordion" => [
				"accordion_text" => "<p>Sustainable and secure growth that powers your potential. Select an option below to see how we can help your business.</p>",
				"items" => [
					[
						"title" => "Identity",
						"text" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>"
					],
					[
						"title" => "Secure Workforce",
						"text" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>"
					],
					[
						"title" => "Secure Operation",
						"text" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>"
					],
					[
						"title" => "Innovation & Transformation",
						"text" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>"
					],
					[
						"title" => "Managed Services",
						"text" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr.</p>"
					]
				]
			]
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "icons",
			"icons" => [
				"layout" => "grid",
				"heading_level" => "h2",
				"items" => [
					[
						"title" => "Example title here",
						"copy" => "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?</p>",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					],
					[
						"title" => "Example title here",
						"copy" => "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?</p>",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					],
					[
						"title" => "Example title here",
						"copy" => "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?</p>",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					],
					[
						"title" => "Example title here",
						"copy" => "Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					]
				]
			]
		],
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p><p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquya.</p>",
			"wysiwyg_img_border" => false
		],
		[
			"content_type" => "icons",
			"icons" => [
				"layout" => "stacked",
				"heading_level" => "h2",
				"items" => [
					[
						"title" => "Example title here",
						"copy" => "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?</p>",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					],
					[
						"title" => "Example title here",
						"copy" => "<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?</p>",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					],
					[
						"title" => "Example title here",
						"copy" => "Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit dolorum blanditiis minima beatae similique nostrum odit cum reiciendis autem omnis aspernatur provident est architecto quasi, dolore nemo ut iste illum?",
						"image" => [
							"url" => "/resources/images/icons/brand-icons/id.svg",
							"alt" => "icon"
						]
					]
				]
			]
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p><ul><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt.</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt.</li><li>Lorem ipsum dolor sit amet, consetetur sadip scing elitr, sed diam nonumy.</li></ul>",
			"wysiwyg_img_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text_button",
			"text_button" => [
				"text_align" => "left",
				"title" => "Title text",
				"title_size" => "h4",
				"copy" => "<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ducimus atque, iusto neque eos cum asperiores aperiam omnis perspiciatis porro soluta error nemo aut fugiat similique ea minus quae provident voluptatum?</p>",
				"text_has_button" => true,
				"text_cta" => [
					"button_text" => "Primary Button",
					"button_style" => "primary-green",
					"button_type" => "link",
					"link_url" => "https://google.com"
				],
				"has_tag" => true,
				"tag_type" => "icon",
				"tag_text" => "Tag with Icon",
				"bg_colour" => "white"
			]
		],
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>",
			"wysiwyg_img_border" => false
		]
	]
]

To use this element: @include('.srv.www.kocho.co.uk.releases.20241029111403.web.app.themes.sage10.app.View.......library.blocks.centred-narrow-content.centred-narrow-content', $options)

Options used for this example:

[
	"centred_content" => [
		[
			"content_type" => "text",
			"copy" => "<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>",
			"wysiwyg_img_border" => false
		],
		[
			"content_type" => "video",
			"video_content" => [
				"provider" => "youtube",
				"embed_code" => "pVE92TNDwUk",
				"title" => "Placeholder video",
				"caption" => "A video from YouTube",
				"sources" => [],
				"modal" => false,
				"overlay_img" => [
					"url" => "/resources/images/pattern-library/placeholder-video-overlay.jpeg",
					"alt" => "placeholder overlay"
				],
				"video_duration" => [
					"video_hours" => "00",
					"video_minutes" => "00",
					"video_seconds" => "33"
				]
			]
		]
	]
]