Merge pull request #588 from Automattic/fix-radcliffe2-284

Updated JS to changed the featured image height

radcliffe-2/assets/js/radcliffe-2.js

@@ -21,10 +21,26 @@
 	function fullScreenImages() {
 		var $entryBackground = $( '.entry-thumbnail' ),
 			$heroArea        = $( '.hero-area' ),
-			$windowWidth     = $window.width();
+			$windowWidth     = $window.width(),
+			$height			 = Math.round( $windowWidth / 1.33 );
 
 		if ( $entryBackground ) {
-			$entryBackground.height( Math.round( $windowWidth / 1.33 ) + 'px' );
+			// if we're on a blog/archive page, there may be more than one
+			if ( $entryBackground.length > 1 ){
+				$entryBackground.each( function() {
+					// reset the height
+					$this_height = $height;
+					// find the .entry-header height
+					$entryHeader = $( this ).siblings( '.entry-header' );
+					if ( $height < $entryHeader.outerHeight() ) {
+						// pick the taller of the two
+						$this_height = $entryHeader.outerHeight();
+					}
+					$( this ).height( $this_height + 'px' );
+				} );
+			} else {
+				$entryBackground.height( Math.round( $windowWidth / 1.33 ) + 'px' );
+			}
 		}
 
 		if ( $heroArea && $windowWidth > '768' ) { // Set a fixed height for larger screens
@@ -33,8 +49,6 @@
 		else if ( $heroArea ) { // Set a min-height for smaller screens
 			$heroArea.css( { 'min-height' : Math.round( $windowWidth / 1.33 ) + 'px', 'height' : 'auto' } );
 		}
-
-		$entryBackground.height( Math.round( $windowWidth / 1.33 ) + 'px' );
 	}
 
 	// Add SVG image zoom icon
@@ -56,6 +70,11 @@
 		fullScreenImages();
 	});
 
+	// One more time after everything (eg: Custom Fonts) has loaded for better height accuracy
+	$( window ).load( function() {
+		fullScreenImages();
+	});
+
 	// On window resize.
 	$( window ).on( 'resize', function() {
 		fullScreenImages();