add about page

assets/css/_bootstrap.scss

@@ -21,7 +21,7 @@
 @import "~bootstrap/scss/breadcrumb";
 //  @import "~bootstrap/scss/pagination";
 @import "~bootstrap/scss/badge";
-//  @import "~bootstrap/scss/jumbotron";
+@import "~bootstrap/scss/jumbotron";
 @import "~bootstrap/scss/alert";
 //  @import "~bootstrap/scss/progress";
 //  @import "~bootstrap/scss/media";

assets/css/style.scss

@@ -28,7 +28,6 @@ $list-group-active-bg: rgba(0, 0, 255, 0.075);
 $list-group-active-color: var(--text-primary-color);
 $list-group-action-hover-color: var(--text-secondary-color);
 $list-group-action-color: var(--text-primary-color);
-$list-group-border-width: 0;
 
 // Cards
 $card-bg: var(--background-color-secondary);
@@ -41,6 +40,9 @@ $close-font-weight: 500;
 $mark-padding: 0.2em 0;
 $mark-bg: yellow;
 
+// Jumbotron
+$jumbotron-bg: var(--background-color-secondary);
+
 // Colors
 $info: #0a8299;
 
@@ -57,3 +59,27 @@ thead.sortable th {
 		vertical-align: middle;
 	}
 }
+
+.list-group-item {
+	&-action:not(.active) {
+		&:hover {
+			background: rgba(0, 0, 255, 0.075);
+			color: var(--text-primary-color);
+		}
+	}
+
+	div {
+		transition: left 0.3s ease-in-out;
+		left: 0;
+
+		&::before {
+			content: "›";
+			position: relative;
+			left: -0.5em;
+		}
+
+		&:hover {
+			left: 0.5em;
+		}
+	}
+}

components/navigation/Bar.vue

@@ -154,32 +154,6 @@ nav.breadcrumb-wrapper {
 		color: var(--text-primary-color);
 	}
 
-	.list-group-item {
-		&-action:not(.active) {
-			background: transparent;
-
-			&:hover {
-				background: rgba(0, 0, 255, 0.075);
-				color: var(--text-primary-color);
-			}
-		}
-
-		div {
-			transition: left 0.3s ease-in-out;
-			left: 0;
-
-			&::before {
-				content: "›";
-				position: relative;
-				left: -0.5em;
-			}
-
-			&:hover {
-				left: 0.5em;
-			}
-		}
-	}
-
 	.open & {
 		left: 0;
 	}

components/navigation/menu/Group.vue

@@ -5,7 +5,7 @@
 		</h2>
 		<div class="nav navbar-nav list-group list-group-flush">
 			<NuxtLink
-				class="list-group-item list-group-item-action p-0 pl-3"
+				class="list-group-item list-group-item-action p-0 pl-3 border-0"
 				:to="localePath(item.path)"
 				v-for="item in menu.items"
 				:key="item.path"

components/navigation/menu/Sidebar.vue

@@ -10,7 +10,7 @@
 			</nuxt-link>
 			<div
 				class="d-flex text-info justify-content-between align-items-baseline mt-3 mx-2">
-				<div class="">v0.07</div>
+				<div class="">v0.08</div>
 				<div class="small" v-if="countMax">
 					{{ $t("bloc.title") }} n°<span class="font-weight-bold">{{
 						countMax.number

i18n/locales/en.json

@@ -4,6 +4,17 @@
 		"desc": "Registration in the web of trust. Membership is valid for one year and must be renewed if you wish to continue to co-produce your Universal Dividend",
 		"title": "Membership"
 	},
+	"apropos": {
+		"bienvenue": "Welcome to Wotwizard !",
+		"contribuer": "The source code of the application is on <a href=\"https://git.duniter.org/clients/wotwizard-ui\" target=\"_blank\">our Gitlab server</a>. Don't hesitate to report bugs or suggestions for improvement in <a href=\"https://git.duniter.org/clients/wotwizard-ui/-/issues\" target=\"_blank\">the <b>Tickets</b> section</a>.",
+		"deploiement": "Deployment :",
+		"desc": "This tool allows you to track entries and exits from the Ğ1 free currency web of trust and is the result of a collaboration between various developers and users of the currency. Do not hesitate to thank them by making a donation on the following public key:",
+		"developpeurs": "Developers :",
+		"participants": "List of project participants :",
+		"title": "About",
+		"testeurs": "Testers :",
+		"traducteurs": "Translators :"
+	},
 	"aurevoir": "Goodbye to",
 	"bienvenue": "Welcome to",
 	"bloc": {

i18n/locales/es.json

@@ -4,6 +4,17 @@
 		"desc": "Registro en la red de confianza. La membresía es válida por un año y debe renovarse si desea continuar coproduciendo su Universal Dividend",
 		"title": "Membresía"
 	},
+	"apropos": {
+		"bienvenue": "¡Bienvenido a Wotwizard!",
+		"contribuer": "El código fuente de la aplicación está en <a href=\"https://git.duniter.org/clients/wotwizard-ui\" target=\"_blank\">nuestro servidor Gitlab</a>. No dudes en reportar errores o sugerencias de mejora en <a href=\"https://git.duniter.org/clients/wotwizard-ui/-/issues\" target=\"_blank\">la sección de <b>Tickets</b></a>.",
+		"deploiement": "Despliegue :",
+		"desc": "Esta herramienta le permite realizar un seguimiento de las entradas y salidas de la red de confianza de moneda libre Ğ1 y es el resultado de una colaboración entre varios desarrolladores y usuarios de la moneda. No dude en agradecerles haciendo una donación en la siguiente clave pública:",
+		"developpeurs": "Desarrolladores :",
+		"participants": "Lista de participantes del proyecto :",
+		"title": "A propósito",
+		"testeurs": "Probadores :",
+		"traducteurs": "Traductores :"
+	},
 	"aurevoir": "Salen",
 	"bienvenue": "Entran",
 	"bloc": {

i18n/locales/fr.json

@@ -4,6 +4,17 @@
 		"desc": "Inscription dans la toile de confiance. L'adhésion est valable un an et doit être renouvelée si on souhaite continuer à co-produire son Dividende Universel",
 		"title": "Adhésion"
 	},
+	"apropos": {
+		"bienvenue": "Bienvenue dans Wotwizard !",
+		"contribuer": "Le code source de l'application se trouve sur <a href=\"https://git.duniter.org/clients/wotwizard-ui\" target=\"_blank\">notre serveur Gitlab</a>. N'hésitez pas à y remonter les bugs ou les propositions d'amélioration dans <a href=\"https://git.duniter.org/clients/wotwizard-ui/-/issues\" target=\"_blank\">la section <b>Tickets</b></a>.",
+		"deploiement": "Déploiement :",
+		"desc": "Cet outil vous permet de suivre les entrées et les sorties de la toile de confiance de la monnaie libre Ğ1 et est le fruit d'une collaboration entre différents développeurs et utilisateurs de la monnaie. N'hésitez pas à les remercier en faisant un don sur la clé publique suivante:",
+		"developpeurs": "Développeurs :",
+		"participants": "Liste des participants au projet :",
+		"title": "À propos",
+		"testeurs": "Testeurs :",
+		"traducteurs": "Traducteurs :"
+	},
 	"aurevoir": "Au revoir à",
 	"bienvenue": "Bienvenue à",
 	"bloc": {

layouts/default.vue

@@ -30,7 +30,8 @@ export default {
 					title: "infos",
 					items: [
 						{ path: "/lexique", title: "lexique" },
-						{ path: "/parametres", title: "params.title" }
+						{ path: "/parametres", title: "params.title" },
+						{ path: "/a-propos", title: "apropos.title" }
 					]
 				}
 			]
@@ -70,15 +71,15 @@ export default {
 	transition: margin 0.5s ease-in-out;
 }
 main {
-	--paddingTop: 85px;
+	--paddingTop: 100px;
 	padding-top: var(--paddingTop);
 	position: relative;
 
 	@media (min-width: 576px) {
-		--paddingTop: 115px;
+		--paddingTop: 130px;
 	}
 	@media (min-width: 768px) {
-		--paddingTop: 85px;
+		--paddingTop: 100px;
 	}
 }
 

pages/a-propos.vue

+<template>
+	<main class="container">
+		<div class="jumbotron">
+			<h2 class="display-5">{{ $t("apropos.bienvenue") }}</h2>
+			<p class="lead">
+				{{ $t("apropos.desc") }}
+			</p>
+			<BtnClipboard
+				textContent="78ZwwgpgdH5uLZLbThUQH7LKwPgjMunYfLiCfUCySkM8" />
+			<hr class="my-4" />
+			<h3 class="h4 mb-4">{{ $t("apropos.participants") }}</h3>
+			<div class="row">
+				<div class="col-sm-6 col-md-4 col-lg-3">
+					<h4 class="h5">{{ $t("apropos.developpeurs") }}</h4>
+					<div class="list-group mb-4">
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Paidge
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							CaTasTrOOf
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Manutopik
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Hugo
+						</NuxtLink>
+					</div>
+				</div>
+				<div class="col-sm-6 col-md-4 col-lg-3">
+					<h4 class="h5">{{ $t("apropos.traducteurs") }}</h4>
+					<div class="list-group mb-4">
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Paidge
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Kapis
+						</NuxtLink>
+					</div>
+				</div>
+				<div class="col-sm-6 col-md-4 col-lg-3">
+					<h4 class="h5">{{ $t("apropos.testeurs") }}</h4>
+					<div class="list-group mb-4">
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Maaltir
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Hypericum
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Tchois
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Jean-Pierre13
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							GULLANDES
+						</NuxtLink>
+					</div>
+				</div>
+				<div class="col-sm-6 col-md-4 col-lg-3">
+					<h4 class="h5">API GraphQL :</h4>
+					<div class="list-group mb-4">
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Hugo
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Gerard94
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Cgeek
+						</NuxtLink>
+					</div>
+				</div>
+				<div class="col-sm-6 col-md-4 col-lg-3">
+					<h4 class="h5">{{ $t("apropos.deploiement") }}</h4>
+					<div class="list-group mb-4">
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Poka
+						</NuxtLink>
+						<NuxtLink
+							class="list-group-item list-group-item-action"
+							:to="localePath('/')">
+							Manutopik
+						</NuxtLink>
+					</div>
+				</div>
+			</div>
+			<p v-html="$t('apropos.contribuer')"></p>
+		</div>
+	</main>
+</template>
+
+<script>
+export default {
+	data() {
+		return {
+			breadcrumb: [
+				{
+					text: this.$t("accueil"),
+					to: "/"
+				},
+				{
+					text: this.$t("apropos.title"),
+					active: true
+				}
+			]
+		}
+	},
+	nuxtI18n: {
+		paths: {
+			fr: "/a-propos",
+			en: "/about",
+			es: "/a-proposito"
+		}
+	},
+	mounted() {
+		$nuxt.$emit("changeRoute", this.breadcrumb)
+	}
+}
+</script>

pages/favoris.vue

@@ -17,7 +17,9 @@
 				<transition name="fade">
 					<div
 						class="alert alert-info"
-						v-if="!$apollo.queries.favoris.loading && favoris.length == 0">
+						v-if="
+							!$apollo.queries.favoris.loading && favoris && favoris.length == 0
+						">
 						{{ $t("favoris.none") }}
 					</div>
 				</transition>