diff --git a/source/wp-content/themes/wporg-main-2022/functions.php b/source/wp-content/themes/wporg-main-2022/functions.php index 72ae61d0..d0054e71 100644 --- a/source/wp-content/themes/wporg-main-2022/functions.php +++ b/source/wp-content/themes/wporg-main-2022/functions.php @@ -13,6 +13,7 @@ require_once __DIR__ . '/src/google-search-embed/index.php'; require_once __DIR__ . '/src/random-heading/index.php'; require_once __DIR__ . '/src/release-tables/index.php'; +require_once __DIR__ . '/src/remembers-list/index.php'; /** * Actions and filters. diff --git a/source/wp-content/themes/wporg-main-2022/patterns/remembers.php b/source/wp-content/themes/wporg-main-2022/patterns/remembers.php index 5ecb96c0..f342ae24 100644 --- a/source/wp-content/themes/wporg-main-2022/patterns/remembers.php +++ b/source/wp-content/themes/wporg-main-2022/patterns/remembers.php @@ -10,266 +10,34 @@

- -
+ +

- - - -
-
- - - -
- - - - - - - - -
- - - - -
-
- -

- - - -
- - - - - - - - -
- - - - - + +
+ +

-
- -

- - - -
- - - - -
- - - - - -
-
- - - -

- - - -
- - - - -
- -
-
- - - -

- - - -
- - - - -
- -
-
- - - -

- - - -
- - - - -
- - - - - -
-
- - - -

- - - -
- - - - -
- - - - - -
-
- - - -

- - - -
- - - - -
- -
-
- - - -

- - - -
- - - - -
- - - - - -
-
- - - -

- - - -
- - - - -
- - - - - -
-
- - - -

- - - -
- - - - -
- -
-
- - - -

- - - -
- - - - -
- -
-
- - - -

- + +
+ +
- -
- + +

- -
- -
-
- - - -
- - -
- +
+
diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/block.json b/source/wp-content/themes/wporg-main-2022/src/remembers-list/block.json new file mode 100644 index 00000000..21cc7bb9 --- /dev/null +++ b/source/wp-content/themes/wporg-main-2022/src/remembers-list/block.json @@ -0,0 +1,35 @@ +{ + "$schema": "https://schemas.wp.org/trunk/block.json", + "apiVersion": 2, + "name": "wporg/remembers-list", + "version": "0.1.0", + "title": "Remembers Contributor List", + "category": "design", + "icon": "list-view", + "description": "Displays a list of memorialized contributors.", + "textdomain": "wporg", + "attributes": { + "columns": { + "type": "number", + "default": 3 + } + }, + "supports": { + "align": true, + "color": { + "background": true, + "text": true + }, + "spacing": { + "margin": [ "top", "bottom" ], + "padding": true, + "blockGap": false + }, + "typography": { + "fontSize": true, + "lineHeight": true + } + }, + "editorScript": "file:./index.js", + "style": "file:./style-index.css" +} diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/edit.js b/source/wp-content/themes/wporg-main-2022/src/remembers-list/edit.js new file mode 100644 index 00000000..e0cc2128 --- /dev/null +++ b/source/wp-content/themes/wporg-main-2022/src/remembers-list/edit.js @@ -0,0 +1,30 @@ +/** + * WordPress dependencies + */ + +import { Disabled, PanelBody, RangeControl } from '@wordpress/components'; +import ServerSideRender from '@wordpress/server-side-render'; +import { InspectorControls, useBlockProps } from '@wordpress/block-editor'; +import { __ } from '@wordpress/i18n'; + +export default function Edit( { attributes, name, setAttributes } ) { + const { columns } = attributes; + return ( +
+ + + setAttributes( { columns: parseInt( newNumber ) } ) } + min={ Math.max( 1, 1 ) } + max={ Math.max( 6, 10 ) } + /> + + + + + +
+ ); +} diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.js b/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.js new file mode 100644 index 00000000..5d6da2ae --- /dev/null +++ b/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.js @@ -0,0 +1,16 @@ +/** + * WordPress dependencies + */ +import { registerBlockType } from '@wordpress/blocks'; + +/** + * Internal dependencies + */ +import Edit from './edit'; +import metadata from './block.json'; +import './style.scss'; + +registerBlockType( metadata.name, { + edit: Edit, + save: () => null, +} ); diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.php b/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.php new file mode 100644 index 00000000..f48300a3 --- /dev/null +++ b/source/wp-content/themes/wporg-main-2022/src/remembers-list/index.php @@ -0,0 +1,80 @@ + __NAMESPACE__ . '\render', + ) + ); +} + +/** + * Render the block content. + * + * @param array $attributes Block attributes. + * @param string $content Block default content. + * @param WP_Block $block Block instance. + * + * @return string Returns the block markup. + */ +function render( $attributes, $content, $block ) { + + if ( ! function_exists( '\WordPressdotorg\MemorialProfiles\get_profiles' ) ) { + return __( 'Memorial Profiles mu-plugin is missing.', 'wporg' ); + } + + $profiles = \WordPressdotorg\MemorialProfiles\get_profiles(); + + $columns = $attributes['columns']; + $group_count = ceil( count( $profiles ) / $columns ); + + $groups = array(); + for ( $i = 0; $i < $group_count; $i++ ) { + $groups[] = array_slice( $profiles, $i * $columns, $columns ); + } + + $block_content = ''; + foreach ( $groups as $group ) { + // Set isStackedOnMobile to false so that the columns are not stacked on mobile. We override this in CSS to stack them. + $block_content .= '
'; + + foreach ( $group as $profile ) { + $block_content .= '
'; + $block_content .= ''; + $block_content .= '

'; + $block_content .= ''; + $block_content .= '' . esc_html( $profile->display_name ) . ''; + $block_content .= ''; + $block_content .= '

'; + $block_content .= ''; + $block_content .= '
'; + } + + $block_content .= '
'; + } + + $wrapper_attributes = get_block_wrapper_attributes(); + return sprintf( + '
%2$s
', + $wrapper_attributes, + do_blocks( $block_content ) + ); +} diff --git a/source/wp-content/themes/wporg-main-2022/src/remembers-list/style.scss b/source/wp-content/themes/wporg-main-2022/src/remembers-list/style.scss new file mode 100644 index 00000000..15c86c15 --- /dev/null +++ b/source/wp-content/themes/wporg-main-2022/src/remembers-list/style.scss @@ -0,0 +1,16 @@ +.wp-block-wporg-remembers-list a { + display: inline-block; + color: inherit; + text-decoration: none; + + &:hover { + color: var(--wp--custom--link--color--text); + text-decoration: underline; + } +} + +@media ( max-width: 500px) { + .wp-block-wporg-remembers-list .wp-block-columns { + flex-direction: column !important; + } +}