beenull/themes-wordpress
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add/pendant about page patterns (#5806)

Browse source 
Co-authored-by: Jeff Ong <jonger4@gmail.com>
This commit is contained in:
Jason Crist 2022-04-05 12:34:19 -04:00 committed by GitHub
parent 7f6d5d9505
commit 6ed0ab2380
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 171 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
pendant/assets/images/man-with-backward-cap.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 68 KiB

BIN
pendant/assets/images/person-in-dress-at-shore.jpg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 149 KiB

BIN
pendant/assets/images/person-with-shadow-on-wall.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 200 KiB

BIN
pendant/assets/images/smiling-woman-1.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 71 KiB

BIN
pendant/assets/images/smiling-woman-2.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 76 KiB

BIN
pendant/assets/images/smiling-woman-3.jpeg Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 59 KiB

9
pendant/functions.php
View file

@ -19,10 +19,11 @@ if ( ! function_exists( 'pendant_support' ) ) :
* @return void
*/
function pendant_support() {
// Add support for block styles.
add_theme_support( 'wp-block-styles' );
// Enqueue editor styles.
add_editor_style( 'style.css' );
}
endif;
@ -56,3 +57,9 @@ if ( ! function_exists( 'pendant_styles' ) ) :
endif;
add_action( 'wp_enqueue_scripts', 'pendant_styles' );
function pendant_register_block_pattern_categories() {
register_block_pattern_category( 'pendant', array( 'label' => __( 'Pendant', 'pendant' ) ) );
}
add_action( 'init', 'pendant_register_block_pattern_categories', 9 );

3
pendant/patterns/404.php
View file

@ -2,7 +2,7 @@
/**
* Title: A 404 page
* slug: pendant/404
* Inserter: no
* inserter: no
*/
?>
@ -27,4 +27,3 @@
</div>
<!-- /wp:group -->

31
pendant/patterns/about.php Normal file
View file

@ -0,0 +1,31 @@
<?php
/**
* Title: About
* slug: pendant/about
* categories: pendant
*/
?>
<!-- wp:group {"align":"full","style":{"spacing":{"margin":{"top":"0px"},"padding":{"top":"40px","bottom":"50px"}}},"backgroundColor":"foreground","textColor":"background","layout":{"inherit":true}} -->
<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background" style="margin-top:0px;padding-top:40px;padding-bottom:50px"><!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"width":"42%"} -->
<div class="wp-block-column" style="flex-basis:42%"><!-- wp:heading {"level":1,"align":"wide"} -->
<h1 class="alignwide"><?php echo esc_html__( 'About', 'pendant' ); ?></h1>
<!-- /wp:heading --></div>
<!-- /wp:column -->
<!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/person-in-dress-at-shore.jpg'; ?>" alt="" /></figure>
<!-- /wp:image -->
<!-- wp:heading {"level":4} -->
<h4><?php echo esc_html__( 'Mia Moore, Jewelry lover', 'pendant' ); ?></h4>
<!-- /wp:heading -->
<!-- wp:paragraph -->
<p><em><?php echo esc_html__( '“The more I learn about jewelry and dive into its history, the more I love it. Getting to know the meanings behind objects in particular moments in time, how they translated into status, wealth or power. Jewelry has always been a way to communicate and distinguish and with the evolution of society, it turned into another way of expression, like clothing. I’m passionate about how we use it to express who we really are.”', 'pendant' ); ?></em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

18
pendant/patterns/image-and-quote.php Normal file
View file

@ -0,0 +1,18 @@
<?php
/**
* Title: Image & Quote
* slug: pendant/image-and-quote
* categories: pendant
*/
?>
<!-- wp:media-text {"align":"full","mediaLink":"<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/person-with-shadow-on-wall.jpeg'; ?>","mediaType":"image","mediaWidth":40,"mediaSizeSlug":"full","backgroundColor":"secondary"} -->
<div class="wp-block-media-text alignfull is-stacked-on-mobile is-vertically-aligned-center has-secondary-background-color has-background" style="grid-template-columns:40% auto"><figure class="wp-block-media-text__media"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/person-with-shadow-on-wall.jpeg'; ?>" alt=""/></figure><div class="wp-block-media-text__content">
<!-- wp:group {"style":{"spacing":{"padding":{"top":"30px","right":"30px","bottom":"40px","left":"30px"}}}} -->
<div class="wp-block-group" style="padding-top:30px;padding-right:30px;padding-bottom:40px;padding-left:30px"><!-- wp:quote {"className":"is-style-plain"} -->
<blockquote class="wp-block-quote is-style-plain"><p>
<?php echo esc_html__( '"We’re very lucky to be able to write about our passion and interview those whose work we admire."', 'pendant' ); ?>
</p><cite><?php echo esc_html__( 'Marie, editor for PNDNT', 'pendant' ); ?></cite></blockquote>
<!-- /wp:quote --></div>
<!-- /wp:group --></div></div>
<!-- /wp:media-text -->

85
pendant/patterns/team.php Normal file
View file

@ -0,0 +1,85 @@
<?php
/**
* Title: Team
* slug: pendant/team
* categories: pendant
*/
?>
<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"5vw","bottom":"5vw"}}},"layout":{"inherit":true}} -->
<div class="wp-block-group alignwide" style="padding-top:5vw;padding-bottom:5vw"><!-- wp:columns {"align":"wide"} -->
<div class="wp-block-columns alignwide"><!-- wp:column {"verticalAlignment":"top","width":"25%","style":{"spacing":{"padding":{"top":"7vw"}}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="padding-top:7vw;flex-basis:25%"><!-- wp:heading {"level":3} -->
<h3><?php echo esc_html__( 'The Team', 'pendant' ); ?></h3>
<!-- /wp:heading --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top"} -->
<div class="wp-block-column is-vertically-aligned-top"><!-- wp:group {"style":{"spacing":{"padding":{"top":"1.5vw","bottom":"3vw"}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group" style="padding-top:1.5vw;padding-bottom:3vw"><!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized is-style-default"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/smiling-woman-1.jpeg'; ?>" alt="" /></figure>
<!-- /wp:image -->
<!-- wp:group {"style":{"spacing":{"blockGap":"0px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p><strong><?php echo esc_html__( 'Marie', 'pendant' ); ?></strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><em><?php echo esc_html__( 'Editor &amp; Jeweler', 'pendant' ); ?></em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"1.5vw","bottom":"3vw"}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group" style="padding-top:1.5vw;padding-bottom:3vw"><!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized is-style-default"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/smiling-woman-3.jpeg'; ?>" alt="" /></figure>
<!-- /wp:image -->
<!-- wp:group {"style":{"spacing":{"blockGap":"0px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p><strong><?php echo esc_html( 'Sandra', 'pendant' ); ?></strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><em><?php echo esc_html__( 'Writer, Editor &amp; Jewelry Designer' ); ?></em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top"} -->
<div class="wp-block-column is-vertically-aligned-top"><!-- wp:group {"style":{"spacing":{"padding":{"top":"1.5vw","bottom":"3vw"}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group" style="padding-top:1.5vw;padding-bottom:3vw"><!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized is-style-default"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/smiling-woman-2.jpeg'; ?>" alt="" /></figure>
<!-- /wp:image -->
<!-- wp:group {"style":{"spacing":{"blockGap":"0px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p><strong><?php echo esc_html__( 'Tanya', 'pendant' ); ?></strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><em><?php echo esc_html__( 'Editor &amp; Public Relations', 'pendant' ); ?></em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->
<!-- wp:group {"style":{"spacing":{"padding":{"top":"1.5vw","bottom":"3vw"}}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group" style="padding-top:1.5vw;padding-bottom:3vw"><!-- wp:image {"sizeSlug":"full","linkDestination":"none"} -->
<figure class="wp-block-image size-full is-resized is-style-default"><img src="<?php echo esc_url( get_template_directory_uri() ) . '/assets/images/man-with-backward-cap.jpeg'; ?>" alt="" /></figure>
<!-- /wp:image -->
<!-- wp:group {"style":{"spacing":{"blockGap":"0px"}},"layout":{"type":"flex","orientation":"vertical"}} -->
<div class="wp-block-group"><!-- wp:paragraph -->
<p><strong><?php echo esc_html__( 'Ryan', 'pendant' ); ?></strong></p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p><em><?php echo esc_html__( 'Marketing &amp; Social Media', 'pendant' ); ?></em></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

21
pendant/style.css
View file

@ -116,6 +116,13 @@ a:focus {
width: 1em;
}
/*
* We don't wish for the top-level elements to leverage the block-gap
*/
.wp-site-blocks > * {
margin-block-start: 0;
}
/*
* Alignment styles, borrowed from Twenty Twenty-Two.
* These rules are temporary, and should not be relied on or
@ -168,6 +175,18 @@ body > .is-root-container > .wp-block-template-part > .wp-block-cover,
width: inherit;
}
/* We are unable to style the "cite" element in the quote block */
.wp-block-quote cite {
font-family: var(--wp--preset--font-family--body-font);
font-style: italic;
font-size: var(--wp--preset--font-size--x-small);
}
/* The plain quote block has a left-padding that doesn't work well with our design */
.wp-block-quote.is-style-plain {
padding-left: 0;
}
/** Navigation sub-menu items **/
.wp-block-navigation .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container {
text-transform: uppercase;
@ -175,4 +194,4 @@ body > .is-root-container > .wp-block-template-part > .wp-block-cover,
line-height: 2.6;
font-size: var(--wp--preset--font-size--x-small);
letter-spacing: 0.1em;
}
}

10
pendant/theme.json
View file

@ -175,7 +175,7 @@
},
{
"name": "Medium",
"size": "1.25rem",
"size": "clamp(1rem, 2vw, 1.25rem)",
"slug": "medium"
},
{
@ -223,7 +223,7 @@
},
"core/heading": {
"typography": {
"lineHeight": 1.125
"lineHeight": 1.5
}
},
"core/navigation": {
@ -260,6 +260,12 @@
"fontSize": "var(--wp--preset--font-size--x-small)"
}
},
"core/quote": {
"typography": {
"fontFamily": "var(--wp--preset--font-family--heading-font)",
"fontSize": "clamp(1.25rem, 2.5vw, 2rem)"
}
},
"core/site-title": {
"typography": {
"fontSize": "var(--wp--preset--font-size--medium)",