Add post classes where appropriate

bigbite · Dec 7, 2018 · 81928c6 · 81928c6
1 parent 027ad8a
commit 81928c6
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 18 deletions.
diff --git a/assets/styles/app.css b/assets/styles/app.css
diff --git a/partials/post/post-full.php b/partials/post/post-full.php
@@ -3,7 +3,7 @@
 
 $caption = Benenson_Display_Image_Credit::description( get_post_thumbnail_id( get_the_ID() ) );
 ?>
-<article class="post postImage--full" role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>" style="background-image: url(<?php echo esc_attr( esc_url( $featured_image ) ); ?>)">
+<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'postImage--full' ] ); ?> role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>" style="background-image: url(<?php echo esc_attr( esc_url( $featured_image ) ); ?>)">
 	<?php get_template_part( 'partials/post/post', 'content' ); ?>
 <?php if ( $caption ) : ?>
 	<span class="image-caption" aria-hidden="true"><?php echo esc_html( $caption ); ?></span>

diff --git a/partials/post/post-horizontal.php b/partials/post/post-horizontal.php
@@ -7,7 +7,7 @@
 }
 
 ?>
-<article class="post post--horizontal postImage--small" role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
+<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'post--horizontal', 'postImage--small' ] ); ?> role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
 	<figure class="post-figure">
 		<div class="post-figure-ratio" style="background-image: url( <?php echo esc_url( $featured_image ); ?> )">
 			<img src="<?php echo esc_url( $featured_image ); ?>" alt="">

diff --git a/partials/post/post-none.php b/partials/post/post-none.php
@@ -1,3 +1,3 @@
-<article class="post postImage--none" role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
+<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'postImage--none' ] ); ?> role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
 	<?php get_template_part( 'partials/post/post', 'content' ); ?>
 </article>
diff --git a/partials/post/post-search.php b/partials/post/post-search.php
@@ -11,7 +11,7 @@
 $date  = benenson_locale_date( $epoch );
 
 ?>
-<article class="post post--result" role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
+<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'post--result' ] ); ?> role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
 	<a class="floating-anchor" href="<?php the_permalink(); ?>" aria-hidden="true"></a>
 <?php if ( $post_term ) : ?>
 	<?php $post_term_link = get_term_link( $post_term, $post_term->taxonomy ); ?>

diff --git a/partials/post/post-small.php b/partials/post/post-small.php
@@ -3,7 +3,7 @@
 $featured_image_2x = benenson_featured_image( get_the_ID(), 'post-half@2x' );
 
 ?>
-<article class="post postImage--small" role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
+<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'postImage--small' ] ); ?> role="article" aria-label="Article: <?php echo esc_attr( format_for_aria_label( get_the_title() ) ); ?>">
 	<figure class="post-figure">
 		<div class="post-figure-ratio" style="background-image: url( <?php echo esc_url( $featured_image ); ?> )">
 			<img src="<?php echo esc_url( $featured_image ); ?>" alt="">

diff --git a/single.php b/single.php
@@ -67,7 +67,7 @@
 				<h1 id="article-title" class="article-title"><?php the_title(); ?></h1>
 			</header>
 
-			<article class="article-content <?php $reduced_width && print 'is-narrow'; ?>" role="article" aria-labelledby="article-title">
+			<article id="post-<?php the_ID(); ?>" <?php post_class( [ 'article-content', $reduced_width ? 'is-narrow' : '' ] ); ?> role="article" aria-labelledby="article-title">
 			<?php if ( $recipients ) : ?>
 				<details class="article-recipients">
 					<summary><?php esc_html_e( 'View Recipients', 'benenson' ); ?></summary>

diff --git a/src/styles/pages/_article.scss b/src/styles/pages/_article.scss
@@ -138,6 +138,16 @@
   max-width: 100%;
   order: 1;
 
+  .post {
+    border: none;
+
+    &:hover,
+    &:active,
+    &:focus {
+      box-shadow: none;
+    }
+  }
+
   @include mq(medium-sm) {
     flex: 1 1 calc(100% - 88px);
     order: 2;
@@ -332,7 +342,6 @@
   align-items: center;
   width: 50px;
   height: 50px;
-  //background-color: $color-black;
   border-radius: 50%;
   border: 1px solid $color-grey-x-light;
 }
@@ -342,17 +351,7 @@
 }
 
 .article-share ul li + li {
-  //border-left: 1px solid $color-grey-light;
-
-  .rtl & {
-    //border-right: 1px solid $color-grey-light;
-    //border-left: none;
-  }
-
   @include mq(small) {
-    //border-top: 1px solid $color-grey-light;
-    //border-left: none;
-
     .rtl & {
       border-right: none;
     }