Updated error display to modern UI and made it responsive

Updated error display to modern UI and made it responsive

Updated error display to modern UI

Updated error display to modern UI and made it responsive

Commit unstaged changes before rebasing

CHANGELOG.md

@@ -9,6 +9,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 - Enhance contribution guidelines: Refactored shell scripts, added additional steps. (#91)
 
+### Changed
+- Updated the error display to a modern UI. (#131)
+
 ## [1.2.1] - 2024-02-29
 
 ### Changed
@@ -46,7 +49,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
-- Name metadadata is not set correctly (#76)
+- Name metadadata is not set correctly (#76)s
 - Default publisher is not correctly spelled (#78)
 - Adapt to hatchling v1.19.0 which mandates packages setting (#79)
 - Small fixes in invoke tasks

zimui/src/components/ErrorDisplay.vue

@@ -9,10 +9,6 @@ const errimage = ref(errimageData)
 
 <template>
   <div class="error-page">
-    <nav class="nav-header">
-      <div class="logo">Kolibri</div>
-    </nav>
-
     <div class="error-container">
       <div class="error-content">
         <p class="error-text">{{ main.errorMessage }}</p>
@@ -26,11 +22,6 @@ const errimage = ref(errimageData)
 </template>
 
 <style scoped>
-body {
-  margin: 0;
-  background-color: #f0f4f8;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
-}
 
 .error-page {
   max-width: 1200px;
@@ -39,16 +30,6 @@ body {
   text-align: center;
 }
 
-.nav-header {
-  margin-bottom: 40px;
-}
-
-.logo {
-  font-weight: bold;
-  font-size: 28px;
-  color: #333;
-}
-
 .error-container {
   display: flex;
   justify-content: space-between;
@@ -90,14 +71,14 @@ body {
     flex-direction: column;
     text-align: center;
   }
-
+  
   .error-text {
     margin: 20px auto;
     font-size: 16px;
   }
-
+  
   .error-image {
     width: 300px;
   }
 }
-</style>
+</style>