Fix Error page styles and ListCTAs

src/components/organisms/ListCTAs.svelte

@@ -5,6 +5,10 @@
             justify-content: center;
         }
 
+        :global(li) {
+            display: block;
+        }
+
         & > :global(*) {
             margin: 20px auto 0;
 

src/routes/__error.svelte

@@ -1,5 +1,5 @@
 <style lang="scss">
-    @import "../style/pages/shop";
+    @import "../style/pages/error";
 </style>
 
 <script lang="ts">
@@ -43,24 +43,30 @@
         />
 
         <ListCTAs>
-            <BoxCTA
+            <li>
-                url="{$page.url.pathname}#locations"
+                <BoxCTA
-                icon="globe"
+                    url="{$page.url.pathname}#locations"
-                label="Discover locations"
+                    icon="globe"
-                alt="Globe"
+                    label="Discover locations"
-            />
+                    alt="Globe"
-            <BoxCTA
+                />
-                url="/photos"
+            </li>
-                icon="photos"
+            <li>
-                label="Browse all photos"
+                <BoxCTA
-                alt="Photos"
+                    url="/photos"
-            />
+                    icon="photos"
-            <BoxCTA
+                    label="Browse all photos"
-                url="/shop"
+                    alt="Photos"
-                icon="bag"
+                />
-                label="Shop our products"
+            </li>
-                alt="Shopping bag"
+            <li>
-            />
+                <BoxCTA
+                    url="/shop"
+                    icon="bag"
+                    label="Shop our products"
+                    alt="Shopping bag"
+                />
+            </li>
         </ListCTAs>
     </div>
 

src/style/pages/_error.scss

@@ -8,7 +8,7 @@
         }
 
         // Heading
-        .heading {
+        :global(.heading) {
             padding: 0 24px;
             margin-bottom: 40px;
 
@@ -16,7 +16,7 @@
                 margin-bottom: 72px;
             }
 
-            p {
+            :global(p) {
                 @include bp (sm, max) {
                     max-width: 480px;
                 }
@@ -24,3 +24,14 @@
         }
     }
 }
+
+:global(.page-error) {
+    // Globe
+    :global(.globe) {
+        margin-top: 96px;
+
+        @include bp (sm) {
+            margin-top: 156px;
+        }
+    }
+}

src/style/pages/_homepage.scss

@@ -91,8 +91,8 @@
 
     // CTAS
     &__ctas {
-        text-align: center;
         margin-bottom: 96px;
+        text-align: center;
 
         @include bp (sm) {
             margin-bottom: 160px;
@@ -106,10 +106,6 @@
                 margin-top: 72px;
             }
         }
-
-        li {
-            display: block;
-        }
     }
 
     // World title