From 665139f7d25a64f66e1149a6403fc26efcbabb2a Mon Sep 17 00:00:00 2001
From: pacien
Date: Sun, 3 May 2020 23:07:51 +0200
Subject: viewer/GalleryNavigation: better error messages

Introducing a generic error page with some icon and a different error for unknown resources

GitHub: closes #190
---
 viewer/src/components/LdError.vue | 64 +++++++++++++++++++++++++++++++++++++++
 1 file changed, 64 insertions(+)
 create mode 100644 viewer/src/components/LdError.vue

(limited to 'viewer/src/components/LdError.vue')

diff --git a/viewer/src/components/LdError.vue b/viewer/src/components/LdError.vue
new file mode 100644
index 0000000..5e266ab
--- /dev/null
+++ b/viewer/src/components/LdError.vue
@@ -0,0 +1,64 @@
+<!--
+-- ldgallery - A static generator which turns a collection of tagged
+--             pictures into a searchable web gallery.
+--
+-- Copyright (C) 2020  Pacien TRAN-GIRARD
+--
+-- This program is free software: you can redistribute it and/or modify
+-- it under the terms of the GNU Affero General Public License as
+-- published by the Free Software Foundation, either version 3 of the
+-- License, or (at your option) any later version.
+--
+-- This program is distributed in the hope that it will be useful,
+-- but WITHOUT ANY WARRANTY; without even the implied warranty of
+-- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+-- GNU Affero General Public License for more details.
+--
+-- You should have received a copy of the GNU Affero General Public License
+-- along with this program.  If not, see <https://www.gnu.org/licenses/>.
+-->
+
+<template>
+  <div :class="$style.container">
+    <div :class="$style.content">
+      <fa-icon :class="$style.icon" :icon="icon" size="6x" />
+      <div :class="$style.message" v-html="message"></div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from "vue-property-decorator";
+
+@Component export default class LdError extends Vue {
+  @Prop({ required: true }) readonly icon!: string;
+  @Prop({ required: true }) readonly message!: string;
+}
+</script>
+
+<style lang="scss" module>
+@import "~@/assets/scss/theme.scss";
+
+.container {
+  min-height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.content {
+  text-align: center;
+
+  & > *:not(last-child) {
+    margin-bottom: 0.15em;
+  }
+}
+
+.icon {
+  color: $disabled-color;
+}
+
+.message {
+  color: $text-light;
+}
+</style>
-- 
cgit v1.2.3


From 3cf40298471995fddea8a66860353a2b1ceeeeee Mon Sep 17 00:00:00 2001
From: pacien
Date: Fri, 8 May 2020 19:04:29 +0200
Subject: viewer/LdError: fix prop constructor type

---
 viewer/src/components/LdError.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'viewer/src/components/LdError.vue')

diff --git a/viewer/src/components/LdError.vue b/viewer/src/components/LdError.vue
index 5e266ab..4b958dc 100644
--- a/viewer/src/components/LdError.vue
+++ b/viewer/src/components/LdError.vue
@@ -31,8 +31,8 @@
 import { Component, Prop, Vue } from "vue-property-decorator";
 
 @Component export default class LdError extends Vue {
-  @Prop({ required: true }) readonly icon!: string;
-  @Prop({ required: true }) readonly message!: string;
+  @Prop({ required: true, type: String }) readonly icon!: string;
+  @Prop({ required: true, type: String }) readonly message!: string;
 }
 </script>
 
-- 
cgit v1.2.3


From e02b09f405c81fd3eb612b0bb1f78f5860b0a5e8 Mon Sep 17 00:00:00 2001
From: pacien
Date: Fri, 8 May 2020 19:10:52 +0200
Subject: viewer/style/global: factorise flex centering container

---
 viewer/src/components/LdError.vue | 9 +--------
 1 file changed, 1 insertion(+), 8 deletions(-)

(limited to 'viewer/src/components/LdError.vue')

diff --git a/viewer/src/components/LdError.vue b/viewer/src/components/LdError.vue
index 4b958dc..a53942d 100644
--- a/viewer/src/components/LdError.vue
+++ b/viewer/src/components/LdError.vue
@@ -19,7 +19,7 @@
 -->
 
 <template>
-  <div :class="$style.container">
+  <div class="container-vh-centering">
     <div :class="$style.content">
       <fa-icon :class="$style.icon" :icon="icon" size="6x" />
       <div :class="$style.message" v-html="message"></div>
@@ -39,13 +39,6 @@ import { Component, Prop, Vue } from "vue-property-decorator";
 <style lang="scss" module>
 @import "~@/assets/scss/theme.scss";
 
-.container {
-  min-height: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
 .content {
   text-align: center;
 
-- 
cgit v1.2.3


From 170d7a61f720ece9dc4b347b19f5a8213f1d8984 Mon Sep 17 00:00:00 2001
From: Zero~Informatique
Date: Sat, 20 Jun 2020 16:50:49 +0200
Subject: viewer: prettier formatting based on eslint-prettier plugin

---
 viewer/src/components/LdError.vue | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'viewer/src/components/LdError.vue')

diff --git a/viewer/src/components/LdError.vue b/viewer/src/components/LdError.vue
index a53942d..c71e2ad 100644
--- a/viewer/src/components/LdError.vue
+++ b/viewer/src/components/LdError.vue
@@ -30,7 +30,8 @@
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
 
-@Component export default class LdError extends Vue {
+@Component
+export default class LdError extends Vue {
   @Prop({ required: true, type: String }) readonly icon!: string;
   @Prop({ required: true, type: String }) readonly message!: string;
 }
-- 
cgit v1.2.3

