Fix layout issues in Webkit browsers

css/content.css

@@ -1,6 +1,5 @@
 .content {
   border-bottom: 1px solid var(--color-light-grey);
-  margin-bottom: var(--space-md);
   padding-bottom: var(--space-md);
 }
 

css/page.css

@@ -27,7 +27,8 @@
 @media (--viewport-lg) {
   .page {
     grid-template-columns: 224px 1fr;
-    grid-template-rows: 60px 134px;
+    grid-template-rows: 60px 134px 1fr;
+    grid-auto-rows: auto;
     grid-gap: var(--space-md);
     padding: 0 var(--space-md);
   }
@@ -45,16 +46,15 @@
   .page__content,
   .page__article {
     grid-column-start: 2;
+  }
+
+  .page__content,
+  .page__article.is-first {
     grid-row: span 2;
   }
 
   .page__metadata {
     grid-column-start: 1;
-    grid-row: span 2;
-  }
-
-  .page__metadata.is-first {
-    grid-row: span 1;
   }
 
   .page__pagination,

theme/index.php

@@ -4,7 +4,7 @@
     <?php get_template_part('partials/logo') ?>
   </section>
   <?php while ( have_posts() ) : the_post(); $index++; ?>
-  <section class="page__article">
+  <section class="page__article<?php echo ($index === 1 ? ' is-first' : '') ?>">
     <article class="article">
       <div class="article__date">
         <svg class="icon">
@@ -24,7 +24,7 @@
       </div>
     </article>
   </section>
-  <section class="page__metadata<?php echo ($index === 1 ? ' is-first' : '') ?>">
+  <section class="page__metadata">
     <?php get_template_part('partials/metadata') ?>
   </section>
   <?php endwhile; ?>

theme/page.php

@@ -4,27 +4,22 @@
     <?php get_template_part('partials/logo') ?>
   </section>
   <?php if (have_posts()): while (have_posts()) : the_post(); ?>
-  <section class="page__article">
-    <article class="article">
-      <div class="article__content">
+  <section class="page__content">
+    <div class="content">
       <h1 class="title">
-          <a href="<?php the_permalink(); ?>">
         <?php the_title(); ?>
-          </a>
       </h1>
-        <?php the_content(__('Continue reading <span class="meta-nav">&raquo;</span>', 'windycoys')); ?>
+      <?php the_content(); ?>
+      </div>
     </div>
-    </article>
   </section>
   <?php endwhile; ?>
   <?php else: ?>
-  <section class="page__article">
-    <article class="article">
-      <h1 class="article__title">Sorry, there is no article to display</h1>
-      <div class="article__content">
+  <section class="page__content">
+    <div class="content">
+      <h1 class="title">Sorry, there is no article to display</h1>
       <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
     </div>
-    </article>
   </section>
   <?php endif; ?>
   <section class="page__banner">

theme/search.php

@@ -56,13 +56,11 @@ get_header();
     <?php get_template_part('partials/pagination') ?>
   </section>
   <?php else: ?>
-  <section class="page__article">
-    <article class="article">
-      <h1 class="article__title">Sorry, no results found.</h1>
-      <div class="article__content">
+  <section class="page__content">
+    <div class="content">
+      <h1 class="title">Sorry, no results found.</h1>
       <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
     </div>
-    </article>
   </section>
   <?php endif; ?>
   <section class="page__banner">

theme/single.php

@@ -4,7 +4,7 @@
     <?php get_template_part('partials/logo') ?>
   </section>
   <?php if (have_posts()): while (have_posts()) : the_post(); ?>
-  <section class="page__article">
+  <section class="page__article is-first">
     <article class="article">
       <div class="article__date">
         <svg class="icon">
@@ -25,14 +25,14 @@
       </div>
     </article>
   </section>
-  <section class="page__metadata is-first">
+  <section class="page__metadata">
     <?php get_template_part('partials/metadata') ?>
   </section>
   <?php endwhile; ?>
   <?php else: ?>
-  <section class="page__article">
+  <section class="page__article is-first">
     <article class="article">
-      <h1 class="article__title">Sorry, there is no article to display</h1>
+      <h1 class="title">Sorry, there is no article to display</h1>
       <div class="article__content">
         <a class="link" href="<?php get_site_url() ?>/">Go back home</a>
       </div>

theme/tag.php

@@ -57,13 +57,11 @@
     <?php get_template_part('partials/pagination') ?>
   </section>
   <?php else: ?>
-  <section class="page__article">
-    <article class="article">
-      <h1 class="article__title">Sorry, no results found.</h1>
-      <div class="article__content">
+  <section class="page__content">
+    <div class="content">
+      <h1 class="title">Sorry, no results found.</h1>
       <a class="link" href="<?php echo get_site_url() ?>/">Go back home</a>
     </div>
-    </article>
   </section>
   <?php endif; ?>
   <section class="page__banner">