prefix page-error class

resources/css/app.scss

@@ -67,7 +67,7 @@ code {
 }
 
 /* Page Errors */
-.page-error {
+.sm-page-error {
     display: flex;
     flex-direction: row;
     flex: 1;

resources/js/components/errors/Forbidden.vue

@@ -1,6 +1,6 @@
 <template>
     <SMPage no-breadcrumbs>
-        <div class="page-error forbidden">
+        <div class="sm-page-error sm-error-forbidden">
             <div class="image"></div>
             <div class="content">
                 <h1>The cat says no!</h1>
@@ -13,7 +13,7 @@
 <script setup lang="ts"></script>
 
 <style lang="scss">
-.page-error.forbidden .image {
+.sm-page-error.sm-error-forbidden .image {
     background-image: url("/img/403.jpg");
 }
 </style>

resources/js/components/errors/Internal.vue

@@ -1,6 +1,6 @@
 <template>
     <SMPage no-breadcrumbs>
-        <div class="page-error internal">
+        <div class="sm-page-error sm-error-internal">
             <div class="image"></div>
             <div class="content">
                 <h1>The cat has broken something</h1>
@@ -16,7 +16,7 @@
 <script setup lang="ts"></script>
 
 <style lang="scss">
-.page-error.internal .image {
+.sm-page-error.sm-error-internal .image {
     background-image: url("/img/500.jpg");
 }
 </style>

resources/js/components/errors/NotFound.vue

@@ -1,6 +1,6 @@
 <template>
     <SMPage no-breadcrumbs>
-        <div class="page-error not-found">
+        <div class="sm-page-error sm-error-not-found">
             <div class="image"></div>
             <div class="content">
                 <h1>Opps</h1>
@@ -13,7 +13,7 @@
 <script setup lang="ts"></script>
 
 <style lang="scss">
-.page-error.not-found .image {
+.sm-page-error.sm-error-not-found .image {
     background-image: url("/img/404.jpg");
 }
 </style>