From 04f30f480aee6231292e5cbb9ed106c3fcec2298 Mon Sep 17 00:00:00 2001
From: Dan Schlosser <dan.r.schlosser@gmail.com>
Date: Sun, 20 Dec 2020 23:03:31 -0500
Subject: [PATCH] content-visibility issue fix/hax

---
 _js/progressive-image.js | 7 +++++++
 _scss/_header.scss       | 2 +-
 _scss/_layout.scss       | 4 ++--
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/_js/progressive-image.js b/_js/progressive-image.js
index a6db040..9671bfe 100644
--- a/_js/progressive-image.js
+++ b/_js/progressive-image.js
@@ -131,6 +131,7 @@
       function () {
         if (document.body.className.indexOf(this.id) == -1) {
           this.viewerOpen = false;
+          this.figure.closest("section").style.contentVisibility = "auto";
           this.figure.className = this.figure.className
             .replace("is-open", "")
             .replace(/^\s+|\s+$/g, "");
@@ -183,6 +184,12 @@
       translateX = figureBoundingRect.left * -1;
     }
 
+    try {
+      this.figure.closest("section").style.contentVisibility = "visible";
+    } catch (error) {
+      console.error(error);
+    }
+
     // Apply DOM transformations
     document.body.className += " " + this.id;
     this.figure.className += " is-open";
diff --git a/_scss/_header.scss b/_scss/_header.scss
index 323adda..6fe5721 100644
--- a/_scss/_header.scss
+++ b/_scss/_header.scss
@@ -33,9 +33,9 @@ footer .footer-wrapper {
 
 .path {
   @extend %h2;
+  margin-bottom: 4rem;
   padding-left: 3.6rem;
   text-indent: -3.6rem;
-  margin-bottom: 4rem;
   user-select: none;
 
   .component {
diff --git a/_scss/_layout.scss b/_scss/_layout.scss
index b76ee80..d52a6be 100644
--- a/_scss/_layout.scss
+++ b/_scss/_layout.scss
@@ -14,9 +14,9 @@ $text-width: 44rem;
 }
 
 section {
-  margin: 6rem 0;
-  content-visibility: auto;
   contain-intrinsic-size: 1000px; // Total estimate
+  content-visibility: auto;
+  margin: 6rem 0;
 
   &.collection {
     padding: 4.5rem 0;