Use the navigation block for the podcast links

seedlet/assets/css/style-editor.css

@@ -901,33 +901,6 @@ dt {
 	padding-left: var(--global--spacing-horizontal);
 }
 
-.wp-block-navigation .wp-block-navigation__container {
-	background: var(--global--color-background);
-	padding: 0;
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
-	padding: var(--primary-nav--padding);
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
-	font-family: var(--primary-nav--font-family);
-	font-size: var(--primary-nav--font-size);
-	font-weight: var(--primary-nav--font-weight);
-}
-
-.wp-block-navigation .has-child .wp-block-navigation__container {
-	box-shadow: var(--global--elevation);
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover, .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus {
-	color: var(--primary-nav--color-link-hover);
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content {
-	color: currentColor;
-}
-
 p {
 	line-height: var(--wp--typography--line-height, --global--line-height-body);
 }

seedlet/assets/sass/blocks/_editor.scss

@@ -18,7 +18,6 @@
 @import "legacy/editor"; // "Blocks" from the legacy WP editor, ie: galleries, .button class, etc.
 @import "list/editor";
 @import "media-text/editor";
-@import "navigation/editor";
 @import "paragraph/editor";
 @import "posts-list/editor";
 @import "pullquote/editor";

seedlet/assets/sass/blocks/_style.scss

@@ -20,7 +20,6 @@
 @import "legacy/style"; // "Blocks" from the legacy WP editor, ie: galleries, .button class, etc.
 @import "list/style";
 @import "media-text/style";
-@import "navigation/style";
 @import "paragraph/style";
 @import "posts-list/style";
 @import "pullquote/style";

seedlet/assets/sass/blocks/navigation/_editor.scss

@@ -1,38 +0,0 @@
-.wp-block-navigation {
-    .wp-block-navigation__container {
-        background: var(--global--color-background);
-        padding: 0;
-    }
-
-    .wp-block-navigation-link {
-        .wp-block-navigation-link__content {
-            padding: var(--primary-nav--padding);
-        }
-
-        .wp-block-navigation-link__label {
-            font-family: var(--primary-nav--font-family);
-            font-size: var(--primary-nav--font-size);
-            font-weight: var(--primary-nav--font-weight);
-        }
-    }
-
-    .has-child {
-        .wp-block-navigation__container {
-            box-shadow: var(--global--elevation);
-        }
-    }
-    
-    &:not(.has-text-color){
-        .wp-block-navigation-link {
-            > a {
-                &:hover, &:focus {
-                    color: var(--primary-nav--color-link-hover);
-                }
-            }
-        }
-
-        .wp-block-navigation-link__content {
-            color: currentColor;
-        }
-    }
-}

seedlet/assets/sass/blocks/navigation/_style.scss

@@ -1,84 +0,0 @@
-.wp-block-navigation {
-    .wp-block-navigation-link {
-        padding: 0;
-
-        .wp-block-navigation-link__content {
-            padding: var(--primary-nav--padding);
-        }
-
-        .wp-block-navigation-link__label {
-            font-family: var(--primary-nav--font-family);
-            font-size: var(--primary-nav--font-size);
-            font-weight: var(--primary-nav--font-weight);
-        }
-    }
-
-    .wp-block-navigation-link__submenu-icon {
-        padding: 0;
-    }
-
-    // Top level navigation container.
-    > .wp-block-navigation__container {
-        .has-child {
-            .wp-block-navigation-link {
-                display: inherit;
-            }
-
-            .wp-block-navigation__container {
-                border: none;
-                left: 0;
-                margin-left: var(--primary-nav--padding);
-                min-width: max-content;
-                opacity: 0; 
-                padding: 0;
-                position: inherit;
-                top: inherit;
-
-                .wp-block-navigation-link {
-                    .wp-block-navigation-link__content {
-                        display: inline-block;
-                        padding: calc( 0.5 * var(--primary-nav--padding) ) var(--primary-nav--padding);
-                    }
-                }
-
-                .wp-block-navigation-link__submenu-icon {
-                    display: none;
-                }
-            }
-            &:hover, &:focus-within {
-                .wp-block-navigation__container {
-                    display: block;
-                    opacity: 1;
-                    visibility: visible;
-                }
-            }
-        }
-    }
-
-    > .wp-block-navigation__container {
-        > .has-child {
-            > .wp-block-navigation__container {
-                background: var(--global--color-background);
-                box-shadow: var(--global--elevation);
-                margin: 0;
-                padding: 0;
-                position: absolute;
-                top: 100%;
-            }
-        }
-    }
-    
-    &:not(.has-text-color){
-        .wp-block-navigation-link {
-            > a {
-                &:hover, &:focus {
-                    color: var(--primary-nav--color-link-hover);
-                }
-            }
-        }
-
-        .wp-block-navigation-link__content {
-            color: currentColor;
-        }
-    }
-}

seedlet/style-rtl.css

@@ -1940,71 +1940,6 @@ dd {
 	}
 }
 
-.wp-block-navigation .wp-block-navigation-link {
-	padding: 0;
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
-	padding: var(--primary-nav--padding);
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
-	font-family: var(--primary-nav--font-family);
-	font-size: var(--primary-nav--font-size);
-	font-weight: var(--primary-nav--font-weight);
-}
-
-.wp-block-navigation .wp-block-navigation-link__submenu-icon {
-	padding: 0;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation-link {
-	display: inherit;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container {
-	border: none;
-	right: 0;
-	margin-right: var(--primary-nav--padding);
-	min-width: max-content;
-	opacity: 0;
-	padding: 0;
-	position: inherit;
-	top: inherit;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
-	display: inline-block;
-	padding: calc( 0.5 * var(--primary-nav--padding)) var(--primary-nav--padding);
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon {
-	display: none;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child:hover .wp-block-navigation__container, .wp-block-navigation > .wp-block-navigation__container .has-child:focus-within .wp-block-navigation__container {
-	display: block;
-	opacity: 1;
-	visibility: visible;
-}
-
-.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container {
-	background: var(--global--color-background);
-	box-shadow: var(--global--elevation);
-	margin: 0;
-	padding: 0;
-	position: absolute;
-	top: 100%;
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover, .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus {
-	color: var(--primary-nav--color-link-hover);
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content {
-	color: currentColor;
-}
-
 p {
 	line-height: var(--wp--typography--line-height, --global--line-height-body);
 }

seedlet/style.css

@@ -1940,71 +1940,6 @@ dd {
 	}
 }
 
-.wp-block-navigation .wp-block-navigation-link {
-	padding: 0;
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__content {
-	padding: var(--primary-nav--padding);
-}
-
-.wp-block-navigation .wp-block-navigation-link .wp-block-navigation-link__label {
-	font-family: var(--primary-nav--font-family);
-	font-size: var(--primary-nav--font-size);
-	font-weight: var(--primary-nav--font-weight);
-}
-
-.wp-block-navigation .wp-block-navigation-link__submenu-icon {
-	padding: 0;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation-link {
-	display: inherit;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container {
-	border: none;
-	left: 0;
-	margin-left: var(--primary-nav--padding);
-	min-width: max-content;
-	opacity: 0;
-	padding: 0;
-	position: inherit;
-	top: inherit;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
-	display: inline-block;
-	padding: calc( 0.5 * var(--primary-nav--padding)) var(--primary-nav--padding);
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child .wp-block-navigation__container .wp-block-navigation-link__submenu-icon {
-	display: none;
-}
-
-.wp-block-navigation > .wp-block-navigation__container .has-child:hover .wp-block-navigation__container, .wp-block-navigation > .wp-block-navigation__container .has-child:focus-within .wp-block-navigation__container {
-	display: block;
-	opacity: 1;
-	visibility: visible;
-}
-
-.wp-block-navigation > .wp-block-navigation__container > .has-child > .wp-block-navigation__container {
-	background: var(--global--color-background);
-	box-shadow: var(--global--elevation);
-	margin: 0;
-	padding: 0;
-	position: absolute;
-	top: 100%;
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:hover, .wp-block-navigation:not(.has-text-color) .wp-block-navigation-link > a:focus {
-	color: var(--primary-nav--color-link-hover);
-}
-
-.wp-block-navigation:not(.has-text-color) .wp-block-navigation-link__content {
-	color: currentColor;
-}
-
 p {
 	line-height: var(--wp--typography--line-height, --global--line-height-body);
 }

spearhead/assets/sass/_block-extends.scss

@@ -2,5 +2,10 @@
 @import "block-extends/categories";
 @import "block-extends/latest-posts";
 @import "block-extends/links";
+<<<<<<< HEAD
 @import "block-extends/related-posts";
 @import "block-extends/search";
+=======
+@import "block-extends/navigation";
+@import "block-extends/related-posts";
+>>>>>>> Use the navigation block for the podcast links

spearhead/assets/sass/block-extends/_navigation.scss

@@ -0,0 +1,13 @@
+.wp-block-navigation {
+	.wp-block-navigation__container {
+		.wp-block-navigation-link {
+			margin: 0 calc( 0.5 * var(--global--spacing-unit) );
+
+			.wp-block-navigation-link__content {
+				color: var(--wp--style--color--link, var(--global--color-primary));
+				line-height: var(--global--line-height-body);
+				padding: 0;
+			}
+		}
+	}
+}

spearhead/inc/block-patterns.php

@@ -56,7 +56,18 @@ if ( ! function_exists( 'spearhead_register_block_patterns' ) ) :
 				array(
 					'title'      => __( 'Podcast links', 'spearhead' ),
 					'categories' => array( 'spearhead' ),
-					'content'    => '<!-- wp:paragraph {"className":"podcast-links-block","style":{"typography":{"fontSize":17}}} --><p class="podcast-links-block" style="font-size:17px">Podcast available on:  <a rel="noreferrer noopener" target="_blank" href="https://www.apple.com/">Apple </a><a rel="noreferrer noopener" target="_blank" href="https://www.breaker.audio/">Breaker </a><a rel="noreferrer noopener" target="_blank" href="https://www.google.com/">Google </a><a rel="noreferrer noopener" target="_blank" href="https://www.linkedin.com/">LinkedIn </a><a rel="noreferrer noopener" target="_blank" href="https://overcast.fm/">Overcast </a><a rel="noreferrer noopener" target="_blank" href="https://www.spotify.com/">Spotify </a><a rel="noreferrer noopener" target="_blank" href="https://twitter.com/">Twitter </a><a href="https://www.youtube.com/" target="_blank" rel="noreferrer noopener">YouTube</a></p><!-- /wp:paragraph -->',
+					'content'    => '
+						<!-- wp:navigation {"orientation":"horizontal"} -->
+						<!-- wp:paragraph --><p>' . __( 'Podcast available on:', 'spearhead' ) . '</p><!-- /wp:paragraph -->
+						<!-- wp:navigation-link {"label":"Apple","url":"https://www.apple.com/"} /-->
+						<!-- wp:navigation-link {"label":"Breaker","url":"https://www.breaker.audio/"} /-->
+						<!-- wp:navigation-link {"label":"Google","url":"https://www.google.com/"} /-->
+						<!-- wp:navigation-link {"label":"LinkedIn","url":"https://www.linkedin.com/"} /-->
+						<!-- wp:navigation-link {"label":"Overcast","url":"https://overcast.fm/"} /-->
+						<!-- wp:navigation-link {"label":"Spotify","url":"https://spotify.com/"} /-->
+						<!-- wp:navigation-link {"label":"Twitter","url":"https://twitter.com/"} /-->
+						<!-- wp:navigation-link {"label":"YouTube","url":"https://youtube.com/"} /-->
+						<!-- /wp:navigation -->',
 				)
 			);
 

spearhead/style-rtl.css

@@ -372,6 +372,19 @@ ul.wp-block-categories,
 	margin-right: 0;
 }
 
+<<<<<<< HEAD
+=======
+.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-link {
+	margin: 0 calc( 0.5 * var(--global--spacing-unit));
+}
+
+.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
+	color: var(--wp--style--color--link, var(--global--color-primary));
+	line-height: var(--global--line-height-body);
+	padding: 0;
+}
+
+>>>>>>> Use the navigation block for the podcast links
 .wp-block-jetpack-related-posts .jp-related-posts-i2__post {
 	margin: 0 0 0 var(--global--spacing-horizontal);
 }
@@ -394,6 +407,7 @@ ul.wp-block-categories,
 	text-transform: uppercase;
 }
 
+<<<<<<< HEAD
 .wp-block-search.wp-block-search__icon-button.wp-block-search__button-inside .wp-block-search__button {
 	padding: var(--button--padding-vertical) var(--button--padding-horizontal);
 }
@@ -449,6 +463,8 @@ ul.wp-block-categories,
 	border-bottom: var(--form--border-width) solid var(--form--border-color);
 }
 
+=======
+>>>>>>> Use the navigation block for the podcast links
 .screen-reader-text, .search-form input[type="submit"] {
 	/* Text meant only for screen readers. */
 	border: 0;

spearhead/style.css

@@ -372,6 +372,19 @@ ul.wp-block-categories,
 	margin-left: 0;
 }
 
+<<<<<<< HEAD
+=======
+.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-link {
+	margin: 0 calc( 0.5 * var(--global--spacing-unit));
+}
+
+.wp-block-navigation .wp-block-navigation__container .wp-block-navigation-link .wp-block-navigation-link__content {
+	color: var(--wp--style--color--link, var(--global--color-primary));
+	line-height: var(--global--line-height-body);
+	padding: 0;
+}
+
+>>>>>>> Use the navigation block for the podcast links
 .wp-block-jetpack-related-posts .jp-related-posts-i2__post {
 	margin: 0 var(--global--spacing-horizontal) 0 0;
 }
@@ -394,6 +407,7 @@ ul.wp-block-categories,
 	text-transform: uppercase;
 }
 
+<<<<<<< HEAD
 .wp-block-search.wp-block-search__icon-button.wp-block-search__button-inside .wp-block-search__button {
 	padding: var(--button--padding-vertical) var(--button--padding-horizontal);
 }
@@ -449,6 +463,8 @@ ul.wp-block-categories,
 	border-bottom: var(--form--border-width) solid var(--form--border-color);
 }
 
+=======
+>>>>>>> Use the navigation block for the podcast links
 .screen-reader-text, .search-form input[type="submit"] {
 	/* Text meant only for screen readers. */
 	border: 0;