master: change repo

src/components/AppResume.vue

@@ -0,0 +1,121 @@
+<template>
+  <div class="app-resume" v-once>
+    <div class="columns is-multiline text-description is-centered">
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <img class="icon" src="../assets/icons/baseline-cloud_off-24px.svg" alt="offline" />
+        </div>
+        <p>
+          Vos données sont hors-lignes.
+          Utilisez Vaquant où vous voulez, seul ou en groupe.
+          Les données seront sauvegardées sur internet dès qu'une connexion est disponible
+          afin de les synchroniser avec vos amis.
+        </p>
+      </div>
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="users"></awe-icon>
+        </div>
+        <p>Choisissez de rendre le compte privé ou public.</p>
+        <p>Lorsque le compte est privé, seules les personnes du compte accéderont aux dépenses.</p>
+        <p>Lorsque le compte est public, toutes les personnes accédant au lien pourront voir, modifier ou supprimer les dépenses.</p>
+      </div>
+      <!-- <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="user-lock"/>
+        </div>
+        <p>
+          Les informations sensibles de vos comptes et transactions sont chiffrées de bout en bout.
+          Seuls les membres d'un compte peuvent visualiser ses données.
+        </p>
+      </div>-->
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="euro-sign" />&nbsp;
+          <awe-icon icon="exchange-alt" />&nbsp;
+          <awe-icon icon="dollar-sign" />
+        </div>
+        <p>
+          Vaquant vous permet d'enregistrer les dépenses dans la monnaie locale de vos vacances
+          et se charge de faire la conversion pour vous au jour le jour. 😙
+        </p>
+      </div>
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="sync-alt" />
+        </div>
+        <p>
+          Vaquant se met à jour en direct. Vous recevez automatiquement les
+          nouveaux comptes et dépenses sans même vous en rendre compte. 🎉
+        </p>
+      </div>
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="mobile" />
+        </div>
+        <p>
+          Vaquant est simple, sécurisée, rapide et accessible depuis un simple lien internet&nbsp;!
+          Votre partenaire idéal pour vos voyages&nbsp;! ⛺
+        </p>
+      </div>
+      <div class="column is-one-third">
+        <div class="main-icon">
+          <awe-icon icon="hand-holding-usd" />
+        </div>
+        <p>
+          Vaquant propose une offre gratuite sans publicité.
+          Si vous souhaitez encourager son développement, vous pouvez toujours
+          <a
+            target="_blank"
+            rel="noreferrer"
+            :href="coffee"
+          >offrir un ☕</a>&nbsp;!
+        </p>
+        <p>
+          Ou vous pouvez également me supporter sur
+          <a
+            target="_blank"
+            rel="noreferrer"
+            :href="brave"
+          >Brave</a>&nbsp;!
+        </p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import Vue from 'vue'
+import { COFFEE_LINK, BRAVE_LINK } from '@/utils/constants'
+
+export default Vue.extend({
+  data() {
+    return {
+      coffee: COFFEE_LINK,
+      brave: BRAVE_LINK
+    }
+  }
+})
+</script>
+
+
+<style lang="scss" scoped>
+.main-icon {
+  font-size: 34pt;
+  text-align: center;
+}
+
+.text-description {
+  font-size: 14pt;
+  text-align: justify;
+  text-align-last: center;
+
+  .column {
+    padding: 30px;
+    .emoji {
+      font-size: 20pt;
+      text-align: center;
+    }
+  }
+}
+</style>