diff --git a/assets/src/block-templates/quick-links/block.json b/assets/src/block-templates/quick-links/block.json new file mode 100644 index 0000000000..a253c80012 --- /dev/null +++ b/assets/src/block-templates/quick-links/block.json @@ -0,0 +1,12 @@ +{ + "$schema": "https://schemas.wp.org/trunk/block.json", + "apiVersion": 2, + "name": "planet4-block-templates/quick-links", + "title": "Quick Links", + "category": "planet4-block-templates", + "textdomain": "planet4-blocks-backend", + "attributes": { + "title": { "type": "string" }, + "backgroundColor": { "type": "string" } + } +} diff --git a/assets/src/block-templates/quick-links/index.js b/assets/src/block-templates/quick-links/index.js new file mode 100644 index 0000000000..8b8d0ab4e6 --- /dev/null +++ b/assets/src/block-templates/quick-links/index.js @@ -0,0 +1,4 @@ +import metadata from './block.json'; +import template from './template'; + +export {metadata, template}; diff --git a/assets/src/block-templates/quick-links/template.js b/assets/src/block-templates/quick-links/template.js new file mode 100644 index 0000000000..a0166b6413 --- /dev/null +++ b/assets/src/block-templates/quick-links/template.js @@ -0,0 +1,45 @@ +import mainThemeUrl from '../main-theme-url'; + +const {__} = wp.i18n; + +const category = ['core/column', {}, [ + ['core/group', {className: 'group-stretched-link'}, [ + ['core/image', { + align: 'center', + className: 'is-style-rounded-90 force-no-lightbox force-no-caption mb-0', + width: '90px', + height: '90px', + url: `${mainThemeUrl}/images/placeholders/placeholder-90x90.jpg`, + }], + ['core/spacer', {height: '16px'}], + ['core/heading', { + level: 5, + style: {typography: {fontSize: '1rem'}}, + textAlign: 'center', + placeholder: __('Category', 'planet4-blocks-backend'), + }], + ]], +]]; + +const template = ({ + title = '', + backgroundColor = 'beige-100', +}) => ([ + ['core/group', { + className: 'block', + align: 'full', + backgroundColor, + }, [ + ['core/group', {className: 'container'}, [ + ['core/spacer', {height: '24px'}], + ['core/heading', {level: 4, placeholder: __('Enter title', 'planet4-blocks-backend'), content: title}], + ['core/columns', { + isStackedOnMobile: false, + className: 'is-style-mobile-carousel', + }, + [...Array(5).keys()].map(() => category)], + ]], + ]], +]); + +export default template; diff --git a/assets/src/block-templates/template-list.js b/assets/src/block-templates/template-list.js index a0f518ae52..102563cf25 100644 --- a/assets/src/block-templates/template-list.js +++ b/assets/src/block-templates/template-list.js @@ -1,9 +1,11 @@ import * as sideImgTextCta from './side-image-with-text-and-cta'; import * as issues from './issues'; import * as realityCheck from './reality-check'; +import * as quickLinks from './quick-links'; export default [ sideImgTextCta, issues, realityCheck, + quickLinks, ]; diff --git a/src/Patterns/BlockPattern.php b/src/Patterns/BlockPattern.php index 2ec9f46d50..eaaeba8220 100644 --- a/src/Patterns/BlockPattern.php +++ b/src/Patterns/BlockPattern.php @@ -44,6 +44,7 @@ public static function get_list(): array SideImageWithTextAndCta::class, Issues::class, RealityCheck::class, + QuickLinks::class, ]; } diff --git a/src/Patterns/QuickLinks.php b/src/Patterns/QuickLinks.php new file mode 100644 index 0000000000..28f3156581 --- /dev/null +++ b/src/Patterns/QuickLinks.php @@ -0,0 +1,42 @@ + 'Quick Links', + 'categories' => [ 'planet4' ], + 'content' => ' + + ', + ]; + } +}