Add/pendant header (#5725)

pendant/parts/header.html

@@ -1,29 +1,11 @@
-<!-- wp:group {"className":"gapless-group","layout":{"inherit":"true"}} -->
-<div class="wp-block-group gapless-group">
-	<!-- wp:group {"align":"full","className":"site-header","layout":{"type":"flex","justifyContent":"space-between"},"style":{"spacing":{"padding":{"bottom":"var(--wp--custom--gap--vertical)","top":"var(--wp--custom--gap--vertical)"}}}} -->
-	<div class="wp-block-group site-header alignfull" style="padding-bottom:var(--wp--custom--gap--vertical);padding-top:var(--wp--custom--gap--vertical)">
-	
-		<!-- wp:group {"className":"site-brand","layout":{"type":"flex"}} -->
-		<div class="wp-block-group site-brand">
-			<!-- wp:site-logo {"width":64} /-->
-	
-			<!-- wp:group -->
-			<div class="wp-block-group">
-				<!-- wp:site-title /-->
-				<!-- wp:site-tagline /-->
-			</div>
-			<!-- /wp:group -->
-		</div>
-		<!-- /wp:group -->
-	
-		<!-- wp:navigation {"__unstableLocation":"primary","__unstableSocialLinks":"social","layout":{"type":"flex","setCascadingProperties":true,"justifyContent":"right","orientation":"horizontal"},"style":{"spacing":{"margin":{"top":"0"}}}} /-->
-	
-	</div>
-	<!-- /wp:group -->
+<!-- wp:group {"layout":{"inherit":true}} -->
+<div class="wp-block-group"><!-- wp:group {"align":"full","style":{"spacing":{"padding":{"bottom":"3vw","top":"3vw"}}},"backgroundColor":"foreground","textColor":"background","layout":{"type":"flex","justifyContent":"space-between","flexWrap":"nowrap"}} -->
+<div class="wp-block-group alignfull has-background-color has-foreground-background-color has-text-color has-background" style="padding-top:3vw;padding-bottom:3vw"><!-- wp:navigation {"overlayMenu":"always"} /-->
 
-</div>
-<!-- /wp:group -->
+<!-- wp:site-title {"textAlign":"center","isLink":false,"style":{"elements":{"link":{"color":{"text":"var:preset|color|background"}}}}} /-->
 
-<!-- wp:spacer {"height":50} -->
-<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
-<!-- /wp:spacer -->
+<!-- wp:social-links {"iconColor":"background","iconColorValue":"#ffffff","className":"is-style-logos-only"} -->
+<ul class="wp-block-social-links has-icon-color is-style-logos-only"><!-- wp:social-link {"url":"https://instagram.com","service":"instagram"} /--></ul>
+<!-- /wp:social-links --></div>
+<!-- /wp:group --></div>
+<!-- /wp:group -->

pendant/parts/post-meta.html

@@ -1,8 +1,9 @@
 <!-- wp:group {"layout":{"type":"flex"}} -->
-<div class="wp-block-group">
-	<!-- wp:post-author {"showAvatar":false,"showBio":false,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
-	<!-- wp:post-date {"isLink":true,"style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
-	<!-- wp:post-terms {"term":"category","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
-	<!-- wp:post-terms {"term": "post_tag","style":{"typography":{"fontSize":"var(--wp--custom--font-sizes--x-small)"}}} /-->
-</div>
+<div class="wp-block-group"><!-- wp:post-author {"showAvatar":false,"showBio":false,"style":{"typography":{"fontSize":"14px"}}} /-->
+
+<!-- wp:post-date {"isLink":true,"style":{"typography":{"fontSize":"14px"}}} /-->
+
+<!-- wp:post-terms {"term":"category","style":{"typography":{"fontSize":"14px"}}} /-->
+
+<!-- wp:post-terms {"term":"post_tag","style":{"typography":{"fontSize":"14px"}}} /--></div>
 <!-- /wp:group -->

pendant/style.css

@@ -13,7 +13,9 @@ License URI: https://raw.githubusercontent.com/Automattic/themes/trunk/LICENSE
 Template: 
 Text Domain: pendant
 Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, rtl-language-support, theme-options, threaded-comments, translation-ready, wide-blocks
-*//*
+*/
+
+/*
  * Font smoothing
  */
 
@@ -51,6 +53,14 @@ Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, feature
 	padding: calc(0.667em + 2px) calc(1.333em + 2px);
 }
 
+/*
+ * Decrease the size of social icons
+ */
+.wp-block-social-links.is-style-logos-only .wp-social-link svg {
+	height: 1em;
+	width: 1em;
+}
+
 /*
  * Alignment styles, borrowed from Twenty Twenty-Two.
  * These rules are temporary, and should not be relied on or
@@ -102,17 +112,3 @@ body > .is-root-container > .wp-block-template-part > .wp-block-cover,
 	margin-right: auto !important;
 	width: inherit;
 }
-
-/*
- * Responsive menu container padding.
- * This ensures the responsive container inherits the same
- * spacing defined above. This behavior may be built into
- * the Block Editor in the future.
- */
-
-.wp-block-navigation__responsive-container.is-menu-open {
-	padding-top: var(--wp--custom--gap--horizontal);
-	padding-bottom: var(--wp--custom--gap--vertical);
-	padding-right: var(--wp--custom--gap--horizontal);
-	padding-left: var(--wp--custom--gap--horizontal);
-}

pendant/theme.json

@@ -68,50 +68,8 @@
             "link": true
         },
         "custom": {
-            "button": {
-                "border": {
-                    "color": "var(--wp--preset--color--primary)",
-                    "radius": "4px",
-                    "style": "solid",
-                    "width": "2px"
-                },
-                "color": {
-                    "background": "var(--wp--preset--color--primary)",
-                    "text": "var(--wp--preset--color--background)"
-                },
-                "hover": {
-                    "color": {
-                        "text": "var(--wp--preset--color--background)",
-                        "background": "var(--wp--preset--color--secondary)"
-                    },
-                    "border": {
-                        "color": "var(--wp--preset--color--secondary)"
-                    }
-                },
-                "spacing": {
-                    "padding": {
-                        "top": "0.667em",
-                        "bottom": "0.667em",
-                        "left": "1.333em",
-                        "right": "1.333em"
-                    }
-                },
-                "typography": {
-                    "fontSize": "var(--wp--preset--font-size--medium)",
-                    "fontWeight": "normal",
-                    "lineHeight": 2
-                }
-            },
             "gap": {
-                "baseline": "15px",
-                "horizontal": "min(30px, 5vw)",
-                "vertical": "min(30px, 5vw)"
-            },
-            "heading": {
-                "typography": {
-                    "fontWeight": 400,
-                    "lineHeight": 1.125
-                }
+                "horizontal": "clamp(20px, 12vw - 40px, 100px)"
             }
         },
         "spacing": {
@@ -135,18 +93,22 @@
                     "name": "Body (System Font)",
                     "fontFace": [
                         {
-	                        "fontFamily": "Jost",
-							"fontWeight": "300 400",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Jost-Light.ttf" ]
+                            "fontFamily": "Jost",
+                            "fontWeight": "300 400",
+                            "fontStyle": "normal",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Jost-Light.ttf"
+                            ]
                         },
                         {
-	                        "fontFamily": "Jost",
-							"fontWeight": "500 600",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Jost-Medium.ttf" ]
+                            "fontFamily": "Jost",
+                            "fontWeight": "500 600",
+                            "fontStyle": "normal",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Jost-Medium.ttf"
+                            ]
                         }
                     ]
                 },
@@ -155,34 +117,42 @@
                     "slug": "heading-font",
                     "name": "Headings (System Font)",
                     "fontFace": [
-						{
-							"fontFamily": "Literata",
-							"fontWeight": "400",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Literata_72pt-Light.ttf" ]
-						},
-						{
-							"fontFamily": "Literata",
-							"fontWeight": "400",
-							"fontStyle": "italic",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Literata_72pt-LightItalic.ttf" ]
-						},
-						{
-							"fontFamily": "Literata",
-							"fontWeight": "800 900",
-							"fontStyle": "normal",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Literata_72pt-Bold.ttf" ]
-						},
-						{
-							"fontFamily": "Literata",
-							"fontWeight": "800 900",
-							"fontStyle": "italic",
-							"fontStretch": "normal",
-							"src": [ "file:./assets/fonts/Literata_72pt-BoldItalic.ttf" ]
-						}
+                        {
+                            "fontFamily": "Literata",
+                            "fontWeight": "400",
+                            "fontStyle": "normal",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Literata_72pt-Light.ttf"
+                            ]
+                        },
+                        {
+                            "fontFamily": "Literata",
+                            "fontWeight": "400",
+                            "fontStyle": "italic",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Literata_72pt-LightItalic.ttf"
+                            ]
+                        },
+                        {
+                            "fontFamily": "Literata",
+                            "fontWeight": "800 900",
+                            "fontStyle": "normal",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Literata_72pt-Bold.ttf"
+                            ]
+                        },
+                        {
+                            "fontFamily": "Literata",
+                            "fontWeight": "800 900",
+                            "fontStyle": "italic",
+                            "fontStretch": "normal",
+                            "src": [
+                                "file:./assets/fonts/Literata_72pt-BoldItalic.ttf"
+                            ]
+                        }
                     ]
                 }
             ],
@@ -211,7 +181,7 @@
             "lineHeight": true
         },
         "layout": {
-            "contentSize": "620px",
+            "contentSize": "820px",
             "wideSize": "1000px"
         },
         "border": {
@@ -223,138 +193,35 @@
     },
     "styles": {
         "blocks": {
-            "core\/button": {
+            "core/button": {
                 "border": {
-                    "radius": "var(--wp--custom--button--border--radius)"
+                    "radius": "0px"
                 },
                 "color": {
-                    "background": "var(--wp--custom--button--color--background)",
-                    "text": "var(--wp--custom--button--color--text)"
+                    "background": "var(--wp--preset--color--primary)",
+                    "text": "var(--wp--preset--color--background)"
                 },
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--body-font)",
-                    "fontSize": "var(--wp--custom--button--typography--font-size)",
-                    "fontWeight": "var(--wp--custom--button--typography--font-weight)",
-                    "lineHeight": "var(--wp--custom--button--typography--line-height)"
+                    "fontSize": "var(--wp--preset--font-size--medium)",
+                    "fontWeight": "normal",
+                    "lineHeight": 2
                 }
             },
-            "core\/code": {
-                "border": {
-                    "color": "#CCCCCC",
-                    "radius": "0px",
-                    "style": "solid",
-                    "width": "2px"
-                },
-                "spacing": {
-                    "padding": {
-                        "left": "var(--wp--custom--gap--horizontal)",
-                        "right": "var(--wp--custom--gap--horizontal)",
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
-                },
+            "core/heading": {
                 "typography": {
-                    "fontFamily": "monospace"
-                }
-            },
-            "core\/gallery": {
-                "spacing": {
-                    "margin": {
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
-                }
-            },
-            "core\/list": {
-                "spacing": {
-                    "padding": {
-                        "left": "calc( 2 * var(--wp--custom--gap--horizontal) )"
-                    }
+                    "lineHeight": 1.125
                 }
             },
-            "core\/navigation": {
+            "core/navigation": {
                 "typography": {
                     "fontSize": "var(--wp--preset--font-size--medium)"
                 }
             },
-            "core\/post-title": {
-                "spacing": {
-                    "margin": {
-                        "bottom": "0"
-                    }
-                },
-                "typography": {
-                    "fontFamily": "var(--wp--preset--font-family--heading-font)",
-                    "fontSize": "var(--wp--preset--font-size--large)",
-                    "lineHeight": "1.125"
-                }
-            },
-            "core\/post-date": {
-                "color": {
-                    "text": "var(--wp--preset--color--foreground)"
-                },
-                "typography": {
-                    "fontSize": "var(--wp--preset--font-size--small)"
-                }
-            },
-            "core\/pullquote": {
-                "border": {
-                    "style": "solid",
-                    "width": "1px 0"
-                },
-                "typography": {
-                    "fontStyle": "italic",
-                    "fontSize": "var(--wp--preset--font-size--large)"
-                },
-                "spacing": {
-                    "padding": {
-                        "left": "var(--wp--custom--gap--horizontal)",
-                        "right": "var(--wp--custom--gap--horizontal)",
-                        "top": "var(--wp--custom--gap--horizontal)",
-                        "bottom": "var(--wp--custom--gap--horizontal)"
-                    }
-                }
-            },
-            "core\/search": {
-                "typography": {
-                    "fontSize": "var(--wp--custom--button--typography--font-size)",
-                    "lineHeight": "1.6"
-                }
-            },
-            "core\/separator": {
-                "color": {
-                    "text": "var(--wp--preset--color--foreground)"
-                },
-                "border": {
-                    "color": "currentColor",
-                    "style": "solid",
-                    "width": "0 0 1px 0"
-                }
-            },
-            "core\/quote": {
-                "border": {
-                    "color": "var(--wp--preset--color--primary)",
-                    "style": "solid",
-                    "width": "0 0 0 1px"
-                },
-                "spacing": {
-                    "padding": {
-                        "left": "var(--wp--custom--gap--horizontal)"
-                    }
-                },
-                "typography": {
-                    "fontSize": "var(--wp--preset--font-size--medium)",
-                    "fontStyle": "normal"
-                }
-            },
-            "core\/site-tagline": {
-                "typography": {
-                    "fontSize": "14px"
-                }
-            },
-            "core\/site-title": {
+            "core/site-title": {
                 "typography": {
                     "fontSize": "var(--wp--preset--font-size--medium)",
-                    "fontWeight": "700",
+                    "fontWeight": "900",
                     "textDecoration": "none"
                 }
             }
@@ -367,89 +234,47 @@
             "h1": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--heading-font)",
-                    "fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 400,
                     "fontSize": "clamp(48px, 6vw, 80px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "h2": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--heading-font)",
-                    "fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 400,
                     "fontSize": "clamp(30px, 4vw, 50px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "h3": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--heading-font)",
-                    "fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 400,
                     "fontSize": "clamp(25px, 3vw, 40px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "h4": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--heading-font)",
-                    "fontWeight": "var(--wp--custom--heading--typography--font-weight)",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 400,
                     "fontSize": "clamp(20px, 2vw, 30px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "h5": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--body-font)",
-                    "fontWeight": "600",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 600,
                     "letterSpacing": "0.1em",
                     "textTransform": "uppercase",
                     "fontSize": "clamp(18px, 2vw, 20px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "h6": {
                 "typography": {
                     "fontFamily": "var(--wp--preset--font-family--body-font)",
-                    "fontWeight": "500",
-                    "lineHeight": "var(--wp--custom--heading--typography--line-height)",
+                    "fontWeight": 500,
                     "letterSpacing": "0.1em",
                     "textTransform": "uppercase",
                     "fontSize": "clamp(15px, 2vw, 15px)"
-                },
-                "spacing": {
-                    "margin": {
-                        "top": "var(--wp--custom--gap--vertical)",
-                        "bottom": "var(--wp--custom--gap--vertical)"
-                    }
                 }
             },
             "link": {
@@ -459,7 +284,7 @@
             }
         },
         "spacing": {
-            "blockGap": "calc(2 * var(--wp--custom--gap--baseline))"
+            "blockGap": "min(30px, 5vw)"
         },
         "typography": {
             "lineHeight": "1.6",