From da3d521824ad595335a56cb778847510fb42658e Mon Sep 17 00:00:00 2001
From: Kevin MacMartin <prurigro@gmail.com>
Date: Sun, 15 Apr 2018 22:02:06 -0400
Subject: [PATCH] Give the vue-based error page some basic styles

---
 resources/assets/sass/pages/_error.scss | 22 ++++++++++++++++++++++
 resources/components/pages/error404.vue |  2 +-
 2 files changed, 23 insertions(+), 1 deletion(-)
 create mode 100644 resources/assets/sass/pages/_error.scss

diff --git a/resources/assets/sass/pages/_error.scss b/resources/assets/sass/pages/_error.scss
new file mode 100644
index 0000000..c9cf0f6
--- /dev/null
+++ b/resources/assets/sass/pages/_error.scss
@@ -0,0 +1,22 @@
+.error-page-component {
+    display: flex;
+    padding: $grid-gutter-width ($grid-gutter-width / 2);
+    flex-grow: 1;
+    align-items: center;
+
+    h1 {
+        @include font-sans-bold;
+        width: 100%;
+        font-size: 22px;
+        text-align: center;
+        text-transform: uppercase;
+
+        @include media-breakpoint-up(sm) {
+            font-size: 32px;
+        }
+
+        @include media-breakpoint-up(lg) {
+            font-size: 48px;
+        }
+    }
+}
diff --git a/resources/components/pages/error404.vue b/resources/components/pages/error404.vue
index 39b7dce..9554c15 100644
--- a/resources/components/pages/error404.vue
+++ b/resources/components/pages/error404.vue
@@ -1,6 +1,6 @@
 <template>
     <div class="error-page-component">
-        Page Not Found
+        <h1>Page Not Found</h1>
     </div>
 </template>