From 1f4c899562842562ecf24968a1f3cc03b63404f1 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Fri, 16 Jun 2023 17:18:36 -0400
Subject: [PATCH 1/8] Make display of interview player conditional

** Why are these changes being introduced:

* There are some interview records which don't have a video component
  on YouTube. Currently, we cannot use the Interview display for these
  because the template always shows a YouTube player, even when there is
  no video. Which errors.

** Relevant ticket(s):

* https://mitlibraries.atlassian.net/browse/lm-421

** How does this address that need:

* This wraps the YouTube player iframe in a conditional check to make
  sure that there's a youtube ID in the record. If there isn't the
  player is skipped.

** Document any side effects to this change:

* None

Oops - rebase into youtube
---
 web/app/themes/mitlib-child/single-interview.php | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/web/app/themes/mitlib-child/single-interview.php b/web/app/themes/mitlib-child/single-interview.php
index 252e0198..d2294311 100644
--- a/web/app/themes/mitlib-child/single-interview.php
+++ b/web/app/themes/mitlib-child/single-interview.php
@@ -148,10 +148,12 @@
 
 				<div id="interview" class="entry-content flex-container">
 
-					<div id="playerWrap" class="wrap-videoplayer flex-item">
-						<iframe frameborder="0" height="300" id="myytplayer" src="https://www.youtube.com/embed/<?php echo esc_attr( the_field( 'youtube-id' ) ); ?>?enablejsapi=1" type="text/html" width="440" allowfullscreen></iframe>
-						<script type="text/javascript" src="<?php echo esc_url( $threeplay_url ); ?>"></script>
-					</div>
+					<?php if ( get_field( 'youtube-id' ) ) { ?>
+						<div id="playerWrap" class="wrap-videoplayer flex-item">
+							<iframe frameborder="0" height="300" id="myytplayer" src="https://www.youtube.com/embed/<?php echo esc_attr( the_field( 'youtube-id' ) ); ?>?enablejsapi=1" type="text/html" width="440" allowfullscreen></iframe>
+							<script type="text/javascript" src="<?php echo esc_url( $threeplay_url ); ?>"></script>
+						</div>
+					<?php } ?>
 
 					<div id="chapterWrap" class="flex-item">
 

From b252751ddf6d31071d3513aad8a94e5db3cd2424 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Fri, 16 Jun 2023 17:33:17 -0400
Subject: [PATCH 2/8] Add commas between tag values

Add margin below the metadata lists in titlebar

Bump theme version because stylesheet changes
---
 web/app/themes/mitlib-child/css/scss/interviews.scss | 10 ++++++++++
 web/app/themes/mitlib-child/style.css                |  2 +-
 2 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/web/app/themes/mitlib-child/css/scss/interviews.scss b/web/app/themes/mitlib-child/css/scss/interviews.scss
index a7688c5d..b158e72a 100644
--- a/web/app/themes/mitlib-child/css/scss/interviews.scss
+++ b/web/app/themes/mitlib-child/css/scss/interviews.scss
@@ -6,11 +6,21 @@
 	background: #f2f0f0;
 
 	.list-inline {
+		margin-bottom: 12px;
 		margin-top: 12px;
 
 		&.links li {
 			margin-right: 12px;
 		}
+
+		&.tags li::after {
+			content: ', ';
+		}
+
+		&.tags li:first-child::after,
+		&.tags li:last-child::after {
+			content: none;
+		}
 	}
 
 	.post-thumbnail {
diff --git a/web/app/themes/mitlib-child/style.css b/web/app/themes/mitlib-child/style.css
index 5c54a19f..dd7baf53 100644
--- a/web/app/themes/mitlib-child/style.css
+++ b/web/app/themes/mitlib-child/style.css
@@ -1,7 +1,7 @@
 /*
 Theme Name: MITlib Child
 Author: MIT Libraries
-Version: 1.0.0
+Version: 1.0.1
 Description: A child theme of the MIT Libraries' parent, focused on sites built primarily with static pages.
 Template: mitlib-parent
 

From e855cdcbecbdae6a070afc8ecaa8f226da800518 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Tue, 20 Jun 2023 13:24:02 -0400
Subject: [PATCH 3/8] Remove "no photo" image from child theme

The MOH site had a feature where we would load the Libraries' logo
if an interviewee had no headshot in our system. The logo we were
using was out of date, and we've decided we do not want this feature
anyway.

This removes that default use of an image when no headshot is defined.
---
 web/app/themes/mitlib-child/images/no-photo.png  | Bin 8008 -> 0 bytes
 web/app/themes/mitlib-child/single-interview.php |   2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 delete mode 100644 web/app/themes/mitlib-child/images/no-photo.png

diff --git a/web/app/themes/mitlib-child/images/no-photo.png b/web/app/themes/mitlib-child/images/no-photo.png
deleted file mode 100644
index be7cdafdd285ae0e64f3c16e3c4749ecfa86d45e..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 8008
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
Msc0+LDO!gA7w4<%#{d8T

diff --git a/web/app/themes/mitlib-child/single-interview.php b/web/app/themes/mitlib-child/single-interview.php
index d2294311..8b9719b7 100644
--- a/web/app/themes/mitlib-child/single-interview.php
+++ b/web/app/themes/mitlib-child/single-interview.php
@@ -39,7 +39,7 @@
 		$interviewee_music = get_field( 'music-professional-work', $interviewee->ID );
 		$interviewee_mit = get_field( 'mit-affiliation', $interviewee->ID );
 
-		$interviewee_thumbnail = '<img src="' . get_stylesheet_directory_uri() . '/images/no-photo.png" alt="No Photo">';
+		$interviewee_thumbnail = '';
 		if ( get_the_post_thumbnail( $interviewee->ID, 'thumbnail' ) ) {
 			$interviewee_thumbnail = get_the_post_thumbnail( $interviewee->ID, 'thumbnail' );
 		}

From b355a169442f41de0428dec04c7869b621f34205 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Tue, 20 Jun 2023 13:25:42 -0400
Subject: [PATCH 4/8] Restructure page headings on singler interview template

The heading structure used by the Interview template had some poor
choices, with a poorly placed h2 and the primary heading being marked
as an h3 (which is a peer to some internal headings farther down).

This rationalizes the heading structure a bit, but does not touch the much
larger problem of using the organization name as the h1 - which still
needs to be changed, but this is not the ticket for that work.
---
 web/app/themes/mitlib-child/single-interview.php | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/app/themes/mitlib-child/single-interview.php b/web/app/themes/mitlib-child/single-interview.php
index 8b9719b7..48ece54d 100644
--- a/web/app/themes/mitlib-child/single-interview.php
+++ b/web/app/themes/mitlib-child/single-interview.php
@@ -75,7 +75,7 @@
 	<?php get_template_part( 'inc/title-banner' ); ?>
 
 	<div class="title-page flex-container">
-		<h3 class="title-sub"><?php the_title(); ?></h3>
+		<h2 class="title-sub"><?php the_title(); ?></h2>
 	</div>
 
 	<div id="content" class="content">
@@ -137,8 +137,8 @@
 				<section class="expandable group" role="region">
 					<h3><a href="#">Biography &amp; other information</a></h3>
 					<div id="biography" class="content" style="display: none;">
-						<h2 class="heading"><?php echo esc_html( $interviewee->post_title ); ?></h2>
-						<p class="muted"><strong>
+						<p><strong><?php echo esc_html( $interviewee->post_title ); ?></strong></p>
+						<p><strong>
 							<?php echo esc_html( $interviewee_mit ); ?><br>
 							<?php echo esc_html( $interviewee_music ); ?>
 						</strong></p>

From aeaf4d0a2d36b7688f8379cff1f97db5028f12dd Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Tue, 20 Jun 2023 14:13:48 -0400
Subject: [PATCH 5/8] Add dashicons to front end of child theme

The Dashicon styles are automatically enqueued for use in the admin
interface, but are not loaded by default for public-facing pages. We use
one of these icons on the interview page, however.

This change makes sure that those dashicons are enqueued on the
front end as well, by declaring them a dependency of the main child
stylesheet.
---
 web/app/themes/mitlib-child/functions.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/app/themes/mitlib-child/functions.php b/web/app/themes/mitlib-child/functions.php
index 74c046c8..dcf57157 100644
--- a/web/app/themes/mitlib-child/functions.php
+++ b/web/app/themes/mitlib-child/functions.php
@@ -30,7 +30,7 @@ function child_scripts_styles() {
 	wp_register_style( 'bootstrap', '//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css', array(), '3.0.0' );
 	wp_register_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css', array(), '4.6.0' );
 	wp_register_style( 'interviews', get_stylesheet_directory_uri() . '/css/build/interviews.css', array(), $theme_version );
-	wp_register_style( 'child-style', get_stylesheet_uri(), array( 'parent-global' ), $theme_version );
+	wp_register_style( 'child-style', get_stylesheet_uri(), array( 'parent-global', 'dashicons' ), $theme_version );
 
 	// Then we register javascript libraries.
 	wp_deregister_script( 'jquery' );

From 39e706b0130572b28222aac44141a0be2616e0bf Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Wed, 21 Jun 2023 12:11:55 -0400
Subject: [PATCH 6/8] Implement dynamically-built archive of interviews

** Why are these changes being introduced:

* We don't want the index of interviewees (used on Music Oral History
  site) to be a static page, needing to be updated every time a new
  interview is published. It should instead be populated out of the set
  of interview and interviewee records on the site.

** Relevant ticket(s):

* https://mitlibraries.atlassian.net/browse/lm-420

** How does this address that need:

* This re-implements the dynamically-built archive of interviewee
  records, which we used to have on the legacy site. This archive needed
  to be built from scratch, rather than copy-pasted from the legacy
  site, because the data model changes we made during migration are not
  compatible with the legacy template.

  Details of this archive are in the Jira ticket.

* As part of this change the Interviewee post type is updated to support
  a public display of its records, and to enable its archive page. We
  still do not have a template for Interviewee records - the only
  template is for individual Interview records, not for the person being
  interviewed.

* The archive of interviewees is a responsive page that needs its own
  set of CSS rules, so there is now an interviewees.scss file that is
  only enqueued for this display.

* The archive page uses a smaller image size than we previously had
  supported in the child theme, so that new "small" size is defined in
  functions.php

* The child theme version is bumped to 1.0.2 for cache busting with the
  new styles.

** Document any side effects to this change:

* An unnoticed bug in the interview template is being fixed. The bug
  meant that unrelated records were being displayed in the "related
  interviews" display, because the query which populated that list was
  imprecise.

  (This precision is only implemented on the single interview template -
  the archive template uses a different strategy of two large queries
  that are then repeatedly looped over and filtered, rather than the
  same query re-run multiple times in N+1 times).
---
 .../src/class-interviewee.php                 |   6 +-
 .../mitlib-child/archive-interviewee.php      | 114 ++++++++++++++++++
 .../mitlib-child/css/scss/interviewees.scss   | 108 +++++++++++++++++
 web/app/themes/mitlib-child/functions.php     |   8 ++
 .../themes/mitlib-child/single-interview.php  |   8 +-
 web/app/themes/mitlib-child/style.css         |   2 +-
 6 files changed, 238 insertions(+), 8 deletions(-)
 create mode 100644 web/app/themes/mitlib-child/archive-interviewee.php
 create mode 100644 web/app/themes/mitlib-child/css/scss/interviewees.scss

diff --git a/web/app/plugins/mitlib-post-interviewees/src/class-interviewee.php b/web/app/plugins/mitlib-post-interviewees/src/class-interviewee.php
index 1395dd4f..2f6bf776 100644
--- a/web/app/plugins/mitlib-post-interviewees/src/class-interviewee.php
+++ b/web/app/plugins/mitlib-post-interviewees/src/class-interviewee.php
@@ -27,13 +27,13 @@ public static function define() {
 			'labels' => $labels,
 			'description' => '',
 			'public' => true,
-			'publicly_queryable' => false,
+			'publicly_queryable' => true,
 			'show_ui' => true,
 			'show_in_rest' => false,
 			'rest_base' => '',
 			'rest_controller_class' => 'WP_REST_Posts_Controller',
 			'rest_namespace' => 'wp/v2',
-			'has_archive' => false,
+			'has_archive' => true,
 			'show_in_menu' => true,
 			'show_in_nav_menus' => true,
 			'delete_with_user' => false,
@@ -43,7 +43,7 @@ public static function define() {
 			'map_meta_cap' => true,
 			'hierarchical' => false,
 			'can_export' => true,
-			'rewrite' => true,
+			'rewrite' => array( 'slug' => 'interviewees' ),
 			'query_var' => true,
 			'supports' => array( 'title', 'editor', 'custom-fields', 'revisions', 'thumbnail' ),
 			'taxonomies' => array( 'category', 'post_tag' ),
diff --git a/web/app/themes/mitlib-child/archive-interviewee.php b/web/app/themes/mitlib-child/archive-interviewee.php
new file mode 100644
index 00000000..40f68de1
--- /dev/null
+++ b/web/app/themes/mitlib-child/archive-interviewee.php
@@ -0,0 +1,114 @@
+<?php
+/**
+ * The template for displaying the archive of all Interviewee records.
+ *
+ * Learn more: http://codex.wordpress.org/Template_Hierarchy
+ *
+ * @package MITlib_Child
+ * @since 1.0.2
+ */
+
+namespace Mitlib\Child;
+
+$interviewee_params = array(
+	'posts_per_page' => -1,
+	'post_type' => 'interviewee',
+	'post_status' => 'publish',
+	'meta_key' => 'sort-name',
+	'orderby' => 'sort-name',
+	'order' => 'ASC',
+);
+$interviewees = new \WP_Query( $interviewee_params );
+
+$interview_params = array(
+	'post_type' => 'interview',
+	'posts_per_page' => -1,
+	'orderby' => 'post_date',
+	'order' => 'ASC',
+	'post_status' => 'publish',
+);
+$interviews = new \WP_Query( $interview_params );
+?>
+
+<?php get_header( 'child' ); ?>
+
+<?php get_template_part( 'inc/breadcrumbs', 'child' ); ?>
+
+<div id="stage" class="inner" role="main">
+
+	<?php get_template_part( 'inc/title-banner' ); ?>
+
+	<div id="content" class="content">
+
+		<div class="content-main main-content">
+
+			<?php if ( $interviewees->have_posts() ) { ?>
+
+				<div class="entry-content">
+					<h1>Index of interviewees</h1>
+
+					<div class="table">
+						<div class="table-row table-head">
+							<div class="table-cell"><span>Photo</span></div>
+							<div class="table-cell"><span>Name</span></div>
+							<div class="table-cell"><span>MIT affiliation</span></div>
+							<div class="table-cell"><span>Music / professional work</span></div>
+							<div class="table-cell"><span>Interview dates</span></div>
+						</div>
+
+					<?php
+					while ( $interviewees->have_posts() ) {
+						$interviewees->the_post();
+						$record_id = get_the_ID();
+						$interviewee_name = get_the_title();
+						$affiliation = get_field( 'mit-affiliation' );
+						$work = get_field( 'music-professional-work' );
+						?>
+
+						<div class="table-row">
+							<div class="table-cell">
+								<?php
+								if ( has_post_thumbnail() ) {
+									echo '<span class="table-value-only">';
+									the_post_thumbnail( 'small' );
+									echo '</span>';
+								} else {
+									echo '<span class="table-value-only null-image">&nbsp;</span>';
+								}
+								?>
+							</div>
+							<div class="table-cell"><span class="table-value-only record-title"><strong><?php the_title(); ?></strong></span></div>
+							<div class="table-cell"><span class="table-label">MIT affiliation</span><span class="table-value"><?php echo esc_html( $affiliation ); ?></span></div>
+							<div class="table-cell"><span class="table-label">Music / professional work</span><span class="table-value"><?php echo esc_html( $work ); ?></span></div>
+							<div class="table-cell">
+								<span class="table-label">Interview dates</span>
+								<?php
+								if ( $interviews->have_posts() ) {
+									echo '<ul class="table-value">';
+									while ( $interviews->have_posts() ) {
+										$interviews->the_post();
+										$interview_title = get_the_title();
+										if ( str_contains( $interview_title, $interviewee_name ) ) {
+											echo '<li><a href="' . esc_url( get_permalink() ) . '">';
+											echo get_the_date( 'n/j/Y' );
+											echo '</a></li>';
+										}
+									};
+									echo '</ul>';
+								};
+								?>
+							</div>
+						</div>
+					<?php } ?>
+					</div> <!-- end div.table -->
+
+				</div> <!-- end div.entry-content -->
+
+			<?php } ?>
+		</div>
+
+	</div>
+
+</div>
+
+<?php get_footer(); ?>
diff --git a/web/app/themes/mitlib-child/css/scss/interviewees.scss b/web/app/themes/mitlib-child/css/scss/interviewees.scss
new file mode 100644
index 00000000..c7f24667
--- /dev/null
+++ b/web/app/themes/mitlib-child/css/scss/interviewees.scss
@@ -0,0 +1,108 @@
+.table {
+	display: table;
+
+	.table-head {
+		font-weight: bold;
+	}
+
+	.table-row {
+		display: table-row;
+
+		.table-cell {
+			border-bottom: 1px solid #ddd;
+			display: table-cell;
+			vertical-align: top;
+
+			.table-label {
+				display: none;
+			}
+
+			img {
+				height: auto;
+				max-width: 100px;
+				width: 100px;
+			}
+
+			span {
+				display: block;
+				margin: 10px 20px 10px 10px;
+
+				&.null-image {
+					height: 100px;
+				}
+
+				&.record-title {
+					font-size: 18px;
+				}
+			}
+
+			ul {
+				margin: 10px 20px 10px 10px;
+
+				li {
+					margin: 0;
+					list-style: none;
+
+					&:before {
+						content: " ";
+						font-family: FontAwesome;
+						color: #338bc5;
+						font-size: 12px;
+						margin-left: -12px;
+					}
+				}
+			}
+		}
+
+		&:nth-child(even) {
+			background-color: #f2f2f2;
+		}
+	}
+}
+
+
+@media (max-width: 768px) {
+	.table {
+		display: block;
+
+		.table-head {
+			display: none;
+		}
+
+		.table-row {
+			border-bottom: 1px solid #676767;
+			display: block;
+			padding: 15px 0;
+
+			.table-cell {
+				border-bottom: none;
+				display: flex;
+
+				.table-label {
+					display: block;
+					font-weight: bold;
+					width: 33%;
+				}
+
+
+				.table-value {
+					width: 66%;
+				}
+
+				.table-value-only {
+					margin-left: 33%;
+					padding-left: 20px;
+					width: 66%;
+				}
+
+				ul li:before {
+					margin-left: 0;
+				}
+			}
+
+			&.table-head {
+				display: none;
+			}
+		}
+	}
+}
\ No newline at end of file
diff --git a/web/app/themes/mitlib-child/functions.php b/web/app/themes/mitlib-child/functions.php
index dcf57157..51d827fe 100644
--- a/web/app/themes/mitlib-child/functions.php
+++ b/web/app/themes/mitlib-child/functions.php
@@ -30,6 +30,7 @@ function child_scripts_styles() {
 	wp_register_style( 'bootstrap', '//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css', array(), '3.0.0' );
 	wp_register_style( 'font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css', array(), '4.6.0' );
 	wp_register_style( 'interviews', get_stylesheet_directory_uri() . '/css/build/interviews.css', array(), $theme_version );
+	wp_register_style( 'interviewees', get_stylesheet_directory_uri() . '/css/build/interviewees.css', array(), $theme_version );
 	wp_register_style( 'child-style', get_stylesheet_uri(), array( 'parent-global', 'dashicons' ), $theme_version );
 
 	// Then we register javascript libraries.
@@ -53,6 +54,11 @@ function child_scripts_styles() {
 		wp_enqueue_style( 'interviews' );
 		wp_enqueue_script( 'youtube-iframe-api' );
 	}
+
+	// Load the styles for the index of interviewees only on that archive.
+	if ( is_post_type_archive( 'interviewee' ) ) {
+		wp_enqueue_style( 'interviewees' );
+	}
 }
 add_action( 'wp_enqueue_scripts', 'Mitlib\Child\child_scripts_styles' );
 
@@ -111,6 +117,8 @@ function theme_setup() {
 		'uploads' => true,
 	);
 	add_theme_support( 'custom-header', $args );
+
+	add_image_size( 'small', 100, 100, true );
 }
 add_action( 'after_setup_theme', 'Mitlib\Child\theme_setup' );
 
diff --git a/web/app/themes/mitlib-child/single-interview.php b/web/app/themes/mitlib-child/single-interview.php
index 48ece54d..aa6678b5 100644
--- a/web/app/themes/mitlib-child/single-interview.php
+++ b/web/app/themes/mitlib-child/single-interview.php
@@ -56,15 +56,15 @@
  */
 $query = array(
 	'post_type' => 'interview',
-	'posts_per_page' => 10,
+	'posts_per_page' => -1,
 	'orderby' => 'post_date',
 	'order' => 'ASC',
 	'post_status' => 'publish',
 	'meta_key' => 'interviewee',
 	'meta_query' => array(
 		'key' => 'interviewee',
-		'value' => $interviewee->ID,
-		'compare' => 'LIKE',
+		'value' => serialize( array( strval( $interviewee->ID ) ) ),
+		'compare' => '=',
 	),
 );
 $related = new \WP_Query( $query );
@@ -195,7 +195,7 @@
 							echo '<ul class="more-interviews">';
 							while ( $related->have_posts() ) {
 								$related->the_post();
-								if ( get_the_id() != $interview_id ) {
+								if ( ( get_the_id() != $interview_id ) ) {
 									echo '<li><a href="' . esc_url( get_permalink() ) . '">' . esc_html( get_the_title() ) . '</a></li>';
 								}
 							};
diff --git a/web/app/themes/mitlib-child/style.css b/web/app/themes/mitlib-child/style.css
index dd7baf53..a946ab43 100644
--- a/web/app/themes/mitlib-child/style.css
+++ b/web/app/themes/mitlib-child/style.css
@@ -1,7 +1,7 @@
 /*
 Theme Name: MITlib Child
 Author: MIT Libraries
-Version: 1.0.1
+Version: 1.0.2
 Description: A child theme of the MIT Libraries' parent, focused on sites built primarily with static pages.
 Template: mitlib-parent
 

From 45ebdb38944d0aee72172703d3c69b658c9d0634 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Fri, 23 Jun 2023 15:56:19 -0400
Subject: [PATCH 7/8] Tweak how category and tag values are displayed

** Why are these changes being introduced:

* On the Interview record display, we want to change how individual
  tag and category values are displayed. Additionally, the way these
  sets of values are labelled is currently confusing.

** Relevant ticket(s):

* https://mitlibraries.atlassian.net/browse/lm-421

** How does this address that need:

* The folder and tag icon which appears next to the rows of values is
  now separate from the list of values themselves (prior to this the
  icon was an extra element in the list of values, which isn't great on
  an a11y basis)

* Rather than separating these values with a column (confusing because
  these values also have columns within them), each value is now backed
  by a darker rectangle - which is how they used to be called out.

** Document any side effects to this change:

* None, hopefully
---
 .../mitlib-child/css/scss/interviews.scss     | 19 +++++-----
 .../themes/mitlib-child/single-interview.php  | 36 ++++++++++---------
 2 files changed, 30 insertions(+), 25 deletions(-)

diff --git a/web/app/themes/mitlib-child/css/scss/interviews.scss b/web/app/themes/mitlib-child/css/scss/interviews.scss
index b158e72a..102f4867 100644
--- a/web/app/themes/mitlib-child/css/scss/interviews.scss
+++ b/web/app/themes/mitlib-child/css/scss/interviews.scss
@@ -5,21 +5,22 @@
 #titlebar {
 	background: #f2f0f0;
 
+	.row-icon {
+		margin: 9px 6px 6px 9px;
+	}
+
 	.list-inline {
-		margin-bottom: 12px;
-		margin-top: 12px;
+		margin-bottom: 6px;
+		margin-top: 9px;
 
 		&.links li {
 			margin-right: 12px;
 		}
 
-		&.tags li::after {
-			content: ', ';
-		}
-
-		&.tags li:first-child::after,
-		&.tags li:last-child::after {
-			content: none;
+		&.tags li,
+		&.categories li {
+			background-color: #ccc;
+			margin: 0 5px;
 		}
 	}
 
diff --git a/web/app/themes/mitlib-child/single-interview.php b/web/app/themes/mitlib-child/single-interview.php
index aa6678b5..838001c2 100644
--- a/web/app/themes/mitlib-child/single-interview.php
+++ b/web/app/themes/mitlib-child/single-interview.php
@@ -99,22 +99,26 @@
 						<?php echo wp_kses( $interviewee_thumbnail, $allowed_thumbnail ); ?>
 					</div>
 					<div class="flex-item">
-						<ul class="list-inline categories">
-							<li><i class="icon-folder-close"></i></li>
-							<?php
-							foreach ( $categories as $category ) {
-								echo '<li>' . esc_html( $category->name ) . '</li>';
-							}
-							?>
-						</ul>
-						<ul class="list-inline tags">
-							<li><i class="icon-tag"></i></li>
-							<?php
-							foreach ( $tags as $tag ) {
-								echo '<li>' . esc_html( $tag->name ) . '</li>';
-							}
-							?>
-						</ul>
+						<div class="flex-container">
+							<i class="icon-folder-close flex-item row-icon"></i>
+							<ul class="list-inline categories flex-item">
+								<?php
+								foreach ( $categories as $category ) {
+									echo '<li>' . esc_html( $category->name ) . '</li>';
+								}
+								?>
+							</ul>
+						</div>
+						<div class="flex-container">
+							<i class="icon-tag flex-item row-icon"></i>
+							<ul class="list-inline tags flex-item">
+								<?php
+								foreach ( $tags as $tag ) {
+									echo '<li>' . esc_html( $tag->name ) . '</li>';
+								}
+								?>
+							</ul>
+						</div>
 						<ul class="list-inline links">
 							<?php
 							if ( $audio ) {

From 423fcbec703bcf467a41903994bbbeac280dac75 Mon Sep 17 00:00:00 2001
From: Matthew Bernhardt <mjbernha@mit.edu>
Date: Fri, 23 Jun 2023 16:25:42 -0400
Subject: [PATCH 8/8] Pipes, not shading, on interview template

---
 .../themes/mitlib-child/css/scss/interviews.scss    | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/web/app/themes/mitlib-child/css/scss/interviews.scss b/web/app/themes/mitlib-child/css/scss/interviews.scss
index 102f4867..50c23dd5 100644
--- a/web/app/themes/mitlib-child/css/scss/interviews.scss
+++ b/web/app/themes/mitlib-child/css/scss/interviews.scss
@@ -6,7 +6,7 @@
 	background: #f2f0f0;
 
 	.row-icon {
-		margin: 9px 6px 6px 9px;
+		margin: 9px 9px 6px 9px;
 	}
 
 	.list-inline {
@@ -19,8 +19,15 @@
 
 		&.tags li,
 		&.categories li {
-			background-color: #ccc;
-			margin: 0 5px;
+			padding-left: 0;
+
+			&:after {
+				content: ' | ';
+			}
+
+			&:last-child:after {
+				content: '';
+			}
 		}
 	}