From 65742e113e644dbfff049bad1ee2908e4f7bd57c Mon Sep 17 00:00:00 2001
From: Alex Page <hi@alexpage.dev>
Date: Fri, 3 Dec 2021 22:47:41 -0800
Subject: [PATCH 1/4] Responsive color scheme 404 page

---
 packages/next/pages/_error.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/packages/next/pages/_error.tsx b/packages/next/pages/_error.tsx
index fde0e21bb7ae1c3..19c12f857655202 100644
--- a/packages/next/pages/_error.tsx
+++ b/packages/next/pages/_error.tsx
@@ -49,7 +49,15 @@ export default class Error<P = {}> extends React.Component<P & ErrorProps> {
           </title>
         </Head>
         <div>
-          <style dangerouslySetInnerHTML={{ __html: 'body { margin: 0 }' }} />
+          <style
+            dangerouslySetInnerHTML={{
+              __html: `
+                body { margin: 0; color: #fff; background: #000; }
+                @media (prefers-color-scheme: dark) {
+                  body { color:#000; background: #fff; }
+                }`,
+            }}
+          />
           {statusCode ? <h1 style={styles.h1}>{statusCode}</h1> : null}
           <div style={styles.desc}>
             <h2 style={styles.h2}>
@@ -72,8 +80,6 @@ export default class Error<P = {}> extends React.Component<P & ErrorProps> {
 
 const styles: { [k: string]: React.CSSProperties } = {
   error: {
-    color: '#000',
-    background: '#fff',
     fontFamily:
       '-apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif',
     height: '100vh',

From e6933caca1e70806d9be825377903adba913bb1a Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Fri, 15 Apr 2022 23:39:49 -0500
Subject: [PATCH 2/4] correct styles

---
 packages/next/pages/_error.tsx | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/packages/next/pages/_error.tsx b/packages/next/pages/_error.tsx
index aff831ce8b67263..f530b06b0fd7dfe 100644
--- a/packages/next/pages/_error.tsx
+++ b/packages/next/pages/_error.tsx
@@ -55,13 +55,23 @@ export default class Error<P = {}> extends React.Component<P & ErrorProps> {
           <style
             dangerouslySetInnerHTML={{
               __html: `
-                body { margin: 0; color: #fff; background: #000; }
+                body { margin: 0; color: #000; background: #fff; }
+                .next-error-h1 {
+                  border-right: 1px solid rgba(0, 0, 0,.3);
+                }
                 @media (prefers-color-scheme: dark) {
-                  body { color:#000; background: #fff; }
+                  body { color:#fff; background: #000; }
+                  .next-error-h1 {
+                    border-right: 1px solid rgba(255, 255, 2555, .3);
+                  }
                 }`,
             }}
           />
-          {statusCode ? <h1 style={styles.h1}>{statusCode}</h1> : null}
+          {statusCode ? (
+            <h1 className="next-error-h1" style={styles.h1}>
+              {statusCode}
+            </h1>
+          ) : null}
           <div style={styles.desc}>
             <h2 style={styles.h2}>
               {this.props.title || statusCode ? (
@@ -103,7 +113,6 @@ const styles: { [k: string]: React.CSSProperties } = {
 
   h1: {
     display: 'inline-block',
-    borderRight: '1px solid rgba(0, 0, 0,.3)',
     margin: 0,
     marginRight: '20px',
     padding: '10px 23px 10px 0',

From b89264126651903d253c7cdeaecf7c91c052345a Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Fri, 15 Apr 2022 23:40:54 -0500
Subject: [PATCH 3/4] typo

---
 packages/next/pages/_error.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/next/pages/_error.tsx b/packages/next/pages/_error.tsx
index f530b06b0fd7dfe..4a2e3c6ad29ac07 100644
--- a/packages/next/pages/_error.tsx
+++ b/packages/next/pages/_error.tsx
@@ -57,12 +57,12 @@ export default class Error<P = {}> extends React.Component<P & ErrorProps> {
               __html: `
                 body { margin: 0; color: #000; background: #fff; }
                 .next-error-h1 {
-                  border-right: 1px solid rgba(0, 0, 0,.3);
+                  border-right: 1px solid rgba(0, 0, 0, .3);
                 }
                 @media (prefers-color-scheme: dark) {
                   body { color:#fff; background: #000; }
                   .next-error-h1 {
-                    border-right: 1px solid rgba(255, 255, 2555, .3);
+                    border-right: 1px solid rgba(255, 255, 255, .3);
                   }
                 }`,
             }}

From d015ffbcd4b010c690d894a883572afecc02ace7 Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Fri, 15 Apr 2022 23:42:18 -0500
Subject: [PATCH 4/4] consistent spacing

---
 packages/next/pages/_error.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/next/pages/_error.tsx b/packages/next/pages/_error.tsx
index 4a2e3c6ad29ac07..0e2449dd1b1353f 100644
--- a/packages/next/pages/_error.tsx
+++ b/packages/next/pages/_error.tsx
@@ -60,7 +60,7 @@ export default class Error<P = {}> extends React.Component<P & ErrorProps> {
                   border-right: 1px solid rgba(0, 0, 0, .3);
                 }
                 @media (prefers-color-scheme: dark) {
-                  body { color:#fff; background: #000; }
+                  body { color: #fff; background: #000; }
                   .next-error-h1 {
                     border-right: 1px solid rgba(255, 255, 255, .3);
                   }