COVID series landing page updates

wp-content/themes/caribbean/functions.php

@@ -26,6 +26,7 @@ function largo_child_require_files() {
 		'/inc/block-color-palette.php',
 		'/blocks/caribbean-group-block-fact-box.php',
 		'/blocks/caribbean-post-selector-block.php',
+		'/inc/metaboxes.php',
 		// homepage
 		'/homepages/layout.php',
 	);

wp-content/themes/caribbean/homepages/assets/less/homepage.less

@@ -10,13 +10,17 @@
     h2 {
         font-family: @font-body-display;
         color: @black;
+        font-size: 54px;
         a {
             color: @black;
             &:hover {
                 color: @blue;
                 text-decoration: underline;
             }
         }
+        &.subtitle {
+            font-size: 36px!important;
+        }
     }
     .excerpt {
         p {
@@ -152,6 +156,9 @@
                     }
                 }
             }
+            .morelink {
+                margin-bottom:80px!important;
+            }
         }
     }
     .widget-area-right {
@@ -205,3 +212,23 @@
         }
     }
 }
+
+.home {
+    .largo-recent-posts {
+        ul {
+            li {
+                h2.subtitle {
+                    font-family: @font-body-display;
+                    font-size: 36px;
+                    font-weight: 100;
+                    color: @black;
+                }
+                h5 {
+                    a {
+                        font-size: 54px;
+                    }
+                }
+            }
+        }
+    }
+}

wp-content/themes/caribbean/inc/metaboxes.php

@@ -0,0 +1,45 @@
+<?php
+/**
+ * Functions related to meta boxes
+ */
+
+/**
+ * Output the subtitle metabox.
+ *
+ * @link Copied from https://github.com/INN/umbrella-wcij/blob/16247cdd8f03a593633c82f8836c4c1e8aa83987/wp-content/themes/wisconsinwatch/inc/metaboxes.php with improvements
+ */
+function subtitle_meta_box_display() {
+	global $post;
+	$values = get_post_custom( $post->ID );
+	wp_nonce_field( 'largo_meta_box_nonce', 'meta_box_nonce' );
+	?>
+		<label for="subtitle"><?php esc_html_e( 'Subtitle', 'largo' ); ?></label>
+		<textarea name="subtitle" id="subtitle" class="widefat" rows="2" cols="20"><?php
+			// PHP open/close are at the textarea boundary so we don't prepend/append this with tabs.
+			if ( isset( $values['subtitle'] ) ) {
+				echo wp_kses_post( $values['subtitle'][0] );
+			}
+		?></textarea>
+		<p><small><?php esc_html_e( 'HTML tags that are allowed in posts are allowed in this area.', 'largo' ); ?></small></p>
+	<?php
+}
+/**
+ * Register our subtitle metabox
+ *
+ * This doesn't have anything special applied to it for Gutenberg.
+ * If Publicsource switches to Gutenberg, read https://developer.wordpress.org/block-editor/developers/backward-compatibility/meta-box/ and update this box as necessary.
+ */
+add_action(
+	'init',
+	function() {
+		largo_add_meta_box(
+			'subtitle',
+			'Subtitle',
+			'subtitle_meta_box_display',
+			'post',
+			'normal',
+			'high'
+		);
+		largo_register_meta_input( 'subtitle', 'wp_filter_post_kses' );
+	}
+);

wp-content/themes/caribbean/less/series.less

@@ -37,14 +37,44 @@
         .largo-recent-posts {
             .widgettitle {
                 text-align: center;
+                font-size: 30px;
+            }
+            ul {
+                // whacky way to figure out how many items are in the grid
+                // if 3+, add grid areas to each child
+                li:first-child:nth-last-child(n + 3),
+                li:first-child:nth-last-child(n + 3) ~ li {
+                    &:first-of-type {
+                        grid-area: a!important;
+                    }
+                    &:nth-child(even) {
+                        grid-area: b;
+                    }
+                    &:nth-child(odd) {
+                        grid-area: c;
+                    }
+                }
             }
             ul {
                 @media (min-width: 769px) {
                     display: grid;
                     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr) );
                     grid-gap: @measure;
+                        grid-template-areas: 
+                        "a a"
+                        "b c";
                 }
                 li {
+                    h5 {
+                        a {
+                            font-size: 36px;
+                        }
+                    }
+                    .post-image-top-term-container {
+                        img {
+                            width: 100%;
+                        }
+                    }
                     .widget-bottom {
                         display: none;
                     }

wp-content/themes/caribbean/less/single.less

@@ -6,6 +6,11 @@
         line-height: 5rem;
         text-align: center;
     }
+    h2.entry-subtitle.subtitle {
+        font-weight: 700;
+        font-size: 29.33px;
+        text-align: center;
+    }
     .byline {
         text-align: center;
         .sep {

wp-content/themes/caribbean/less/style.less

@@ -144,3 +144,16 @@ Version:        1.0
         color: @white;
     }
 }
+
+.read-more-button {
+    a {
+        color: @teal;
+        font-size: 19px;
+    }
+}
+
+h2.subtitle {
+    font-size: 24px;
+    color: @black;
+    font-family: @font-body-display;
+}

wp-content/themes/caribbean/less/widget-largo-recent-posts.less

@@ -13,11 +13,11 @@
             }
             p {
                 margin-bottom: @measure;
+                flex-grow: 1;
             }
             .byline {
                 text-align: left;
                 vertical-align: middle;
-                flex-grow: 1;
                 .sep,
                 .entry-date {
                     display: none;

wp-content/themes/caribbean/partials/archive-category-primary-feature.php

@@ -0,0 +1,31 @@
+<article id="post-<?php echo $featured_post->ID ?>" <?php post_class('clearfix row-fluid', $featured_post->ID); ?>>
+<?php if ( has_post_thumbnail($featured_post->ID) ) { ?>
+	<div class="span4 <?php largo_hero_class($featured_post->ID); ?>">
+		<a href="<?php echo get_permalink($featured_post->ID); ?>"><?php echo get_the_post_thumbnail($featured_post->ID, 'rect_thumb'); ?></a>
+	</div>
+
+	<div class="span8">
+<?php } else { ?>
+	<div class="span12">
+<?php } ?>
+		<header>
+			<h2 class="entry-title">
+				<a href="<?php echo get_permalink($featured_post->ID); ?>"
+					title="<?php echo __( 'Permalink to', 'largo' ) . esc_attr(strip_tags($featured_post->post_title)); ?>"
+					rel="bookmark"><?php echo $featured_post->post_title; ?></a>
+			</h2>
+			<?php if ( $subtitle = get_post_meta( $featured_post->ID, 'subtitle', true ) ) : ?>
+				<h2 class="subtitle"><?php echo $subtitle ?></h2>
+			<?php endif; ?>
+
+			<h5 class="byline"><?php largo_byline( true, false, $featured_post ); ?></h5>
+		</header>
+
+		<div class="entry-content">
+			<?php largo_excerpt($featured_post, 5, null, null, true, false); ?>
+		</div>
+		<div class="read-more-button">
+			<a href="<?php echo esc_attr( get_permalink() ); ?>"><?php _e( 'Click here to read more', 'caribbean' ); ?></a>
+		</div>
+	</div>
+</article>

wp-content/themes/caribbean/partials/content-single.php

@@ -12,7 +12,7 @@
 
 		<h1 class="entry-title" itemprop="headline"><?php the_title(); ?></h1>
 		<?php if ( $subtitle = get_post_meta( $post->ID, 'subtitle', true ) ) : ?>
-			<h2 class="subtitle"><?php echo $subtitle ?></h2>
+			<h2 class="entry-subtitle subtitle"><?php echo $subtitle ?></h2>
 		<?php endif; ?>
 		<h5 class="byline"><?php largo_byline( true, false, get_the_ID(), false ); ?></h5>
 

wp-content/themes/caribbean/partials/content.php

@@ -0,0 +1,102 @@
+<?php
+/*
+ * The default template for displaying content
+ *
+ * @package Largo
+ */
+$args = array (
+	// post-specific, should probably not be filtered but may be useful
+	'post_id' => $post->ID,
+	'hero_class' => largo_hero_class( $post->ID, FALSE ),
+
+	// only used to determine the existence of a youtube_url
+	'values' => get_post_custom( $post->ID ),
+
+	// this should be filtered in the event of a term-specific archive
+	'featured' => has_term( 'homepage-featured', 'prominence' ),
+
+	// $show_thumbnail does not control whether or not the thumbnail is displayed;
+	// it controls whether or not the thumbnail is displayed normally.
+	'show_thumbnail' => TRUE,
+	'show_byline' => TRUE,
+	'show_excerpt' => TRUE,
+	'in_series' => FALSE,
+);
+
+$args = apply_filters( 'largo_content_partial_arguments', $args, get_queried_object() );
+
+extract( $args );
+
+$entry_classes = 'entry-content';
+
+$show_top_tag = largo_has_categories_or_tags();
+
+if ( $featured ) {
+	$entry_classes .= ' span10 with-hero';
+	$show_thumbnail = FALSE;
+}
+
+?>
+<article id="post-<?php the_ID(); ?>" <?php post_class('clearfix'); ?>>
+
+	<?php
+		// Special treatment for posts that are in the Homepage Featured prominence taxonomy term and have thumbnails
+		if ( $featured && ( has_post_thumbnail() || $values['youtube_url'] ) ) { ?>
+			<header>
+				<div class="hero span12 <?php echo $hero_class; ?>">
+				<?php
+					if( has_post_thumbnail() ){
+						echo( '<a href="' . get_permalink() . '" title="' . the_title_attribute( array( 'before' => __( 'Permalink to', 'largo' ) . ' ', 'echo' => false )) . '" rel="bookmark">' );
+						the_post_thumbnail( 'full' );
+						echo( '</a>' );
+					}
+				?>
+				</div>
+			</header>
+		<?php } // end Homepage Featured thumbnail block
+
+		echo '<div class="' . $entry_classes . '">';
+
+		if ( largo_has_categories_or_tags() ) {
+			largo_maybe_top_term();
+		}
+
+		if ( $show_thumbnail ) {
+			echo '<div class="has-thumbnail '.$hero_class.'"><a href="' . get_permalink() . '">' . get_the_post_thumbnail() . '</a></div>';
+		}
+	?>
+
+		<h2 class="entry-title">
+			<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute( array( 'before' => __( 'Permalink to', 'largo' ) . ' ' ) )?>" rel="bookmark"><?php the_title(); ?></a>
+		</h2>
+
+		<?php if ( $subtitle = get_post_meta( $post->ID, 'subtitle', true ) ) : ?>
+			<h2 class="subtitle"><?php echo $subtitle ?></h2>
+		<?php endif; ?>
+
+		<?php
+			if ( $show_byline ) { ?>
+				<h5 class="byline"><?php largo_byline( true, false, get_the_ID() ); ?></h5>
+			<?php }
+		?>
+
+		<?php
+			if ( $show_excerpt ) {
+				largo_excerpt();
+			}
+        ?>
+
+        <?php
+            printf('
+                <div class="read-more-button">
+                    <a href="%1$s">%2$s</a>
+                </div>
+                <br/>',
+                esc_attr( get_permalink() ),
+                __( 'Click here to read more', 'caribbean' )
+            );
+        ?>
+
+		</div><!-- .entry-content -->
+
+</article><!-- #post-<?php the_ID(); ?> -->

wp-content/themes/caribbean/partials/home-top.php

@@ -10,10 +10,17 @@
 		<a class="img" href="<?php echo esc_attr( get_permalink( $topstory ) ); ?>"><?php echo get_the_post_thumbnail( $topstory, 'large' ); ?></a>
 	</div>
 	<h2><a href="<?php the_permalink( $topstory ); ?>"><?php echo get_the_title( $topstory ); ?></a></h2>
+	<?php if ( $subtitle = get_post_meta( $topstory->ID, 'subtitle', true ) ) : ?>
+		<h2 class="subtitle"><?php echo $subtitle ?></h2>
+	<?php endif; ?>
 	<div class="inner">
 		<div class="excerpt">
 			<?php largo_excerpt( $topstory, 4 ); ?>
 		</div>
+		<div class="read-more-button">
+			<a href="<?php echo esc_attr( get_permalink( $topstory ) ); ?>"><?php _e( 'Click here to read more', 'caribbean' ); ?></a>
+		</div>
+		<br/>
 		<span class="byline"><?php largo_byline( true, false, $topstory ); ?></span>
 		<?php if ( ! of_get_option( 'single_social_icons' ) == false ) {
 			largo_post_social_links();