From 5727eeb49f6b6e542e5f50f3a3e2c4f42706e39d Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Tue, 13 Sep 2022 09:17:04 +0200
Subject: [PATCH] feature: Tooltips for Topics

---
 .../CategoriesSelect/CategoriesSelect.vue     |  5 +++++
 .../FilterMenu/CategoriesFilter.vue           |  5 +++++
 webapp/locales/de.json                        | 21 +++++++++++++++++++
 webapp/locales/en.json                        | 21 +++++++++++++++++++
 webapp/pages/post/_id/_slug/index.vue         |  5 +++++
 5 files changed, 57 insertions(+)

diff --git a/webapp/components/CategoriesSelect/CategoriesSelect.vue b/webapp/components/CategoriesSelect/CategoriesSelect.vue
index b7d71de2d..24df0c179 100644
--- a/webapp/components/CategoriesSelect/CategoriesSelect.vue
+++ b/webapp/components/CategoriesSelect/CategoriesSelect.vue
@@ -9,6 +9,11 @@
       :disabled="isDisabled(category.id)"
       :icon="category.icon"
       size="small"
+      v-tooltip="{
+        content: $t(`contribution.category.description.${category.slug}`),
+        placement: 'bottom-start',
+        delay: { show: 500 },
+      }"
     >
       {{ $t(`contribution.category.name.${category.slug}`) }}
     </base-button>
diff --git a/webapp/components/FilterMenu/CategoriesFilter.vue b/webapp/components/FilterMenu/CategoriesFilter.vue
index 6ed37d4b3..23213929b 100644
--- a/webapp/components/FilterMenu/CategoriesFilter.vue
+++ b/webapp/components/FilterMenu/CategoriesFilter.vue
@@ -17,6 +17,11 @@
           :filled="filteredCategoryIds.includes(category.id)"
           :label="$t(`contribution.category.name.${category.slug}`)"
           @click="toggleCategory(category.id)"
+          v-tooltip="{
+            content: $t(`contribution.category.description.${category.slug}`),
+            placement: 'bottom-start',
+            delay: { show: 500 },
+          }"
         />
       </li>
     </template>
diff --git a/webapp/locales/de.json b/webapp/locales/de.json
index bc0b720c8..654376b4d 100644
--- a/webapp/locales/de.json
+++ b/webapp/locales/de.json
@@ -217,6 +217,27 @@
       "infoSelectedNoOfMaxCategories": "{chosen} von {max} Themen ausgewählt"
     },
     "category": {
+      "description": {
+        "body-and-excercise": "Sport, Yoga, Massage, Tanzen, Entspannung",
+        "children": "Familie, Pädagogik, Schule, Prägung",
+        "culture": "Kunst, Theater, Musik, Fotografie, Film",
+        "economy": "Handel, Konsum, Marketing, Lieferketten",
+        "energy": "Öl, Gas, Kohle, Wind, Wasserkraft, Biogas, Atomenergie",
+        "finance": "Geld, Finanzsystem, Alternativwährungen",
+        "health": "Medizin, Ernährung, WHO, Impfungen, Schadstoffe",
+        "home": "Bauen, Lebensgemeinschaften, Tiny Houses, Gemüsegarten",
+        "it-and-media": "Nachrichten, Manipulation, Datenschutz, Überwachung, Datenkraken, KI, Software, Apps",
+        "law": "Menschenrechte, Gesetze, Verordnungen",
+        "miscellaneous": "Miscellaneous",
+        "mobility": "Reise, Verkehr, Elektromobilität",
+        "nature": "Tiere, Pflanzen, Landwirtschaft, Ökologie, Artenvielfalt",
+        "networking": "Kooperation, Aktionsbündnisse, Solidarität, Hilfe",
+        "peace": "Krieg, Militär, soziale Verteidigung, Waffen, Cyberattacken",
+        "politics": "Demokratie, Mitbestimmung, Wahlen, Korruption, Parteien",
+        "psyche": "Seele, Gefühle, Glück",
+        "science": "Bildung, Hochschule, Publikationen",
+        "spirituality": "Religion, Werte, Ethik"
+      },
       "name": {
         "body-and-excercise": "Körper & Bewegung",
         "children": "Kinder",
diff --git a/webapp/locales/en.json b/webapp/locales/en.json
index b3555378f..f2a6c3fc2 100644
--- a/webapp/locales/en.json
+++ b/webapp/locales/en.json
@@ -217,6 +217,27 @@
       "infoSelectedNoOfMaxCategories": "{chosen} of {max} topics selected"
     },
     "category": {
+      "description": {
+        "body-and-excercise": "Sports, yoga, massage, relaxation",
+        "children": "Family, education, school, imprinting",
+        "culture": "Art, theatre, music, photography, film",
+        "economy": "Trade, consumption, marketing, supply chains",
+        "energy": "Oil, gas, coal, wind, hydrodynamic power, biogas, atomic energy",
+        "finance": "Money, financial system, alternative currencies",
+        "health": "Medicine, nutrition, WHO, vaccination, harmful substances",
+        "home": "Construction, communities, tiny houses, kitchen garden",
+        "it-and-media": "News, manipulation, privacy, control, data leeches, AI, software, apps",
+        "law": "Human rights, laws, decrees",
+        "miscellaneous": "Miscellaneous",
+        "mobility": "Travel, traffic, electric mobility",
+        "nature": "Animals, plants, agriculture, ecologu, biodiversity",
+        "networking": "Cooperation, action alliances, solidarity, help",
+        "peace": "War, military, social defence, arms, cyber attacks",
+        "politics": "Democracy, participation, elections, corruption, parties",
+        "psyche": "Soul, feelings, happiness",
+        "science": "Education, university, publications",
+        "spirituality": "Religion, values, ethics"
+      },
       "name": {
         "body-and-excercise": "Body & Excercise",
         "children": "Children",
diff --git a/webapp/pages/post/_id/_slug/index.vue b/webapp/pages/post/_id/_slug/index.vue
index d02a448da..30268778d 100644
--- a/webapp/pages/post/_id/_slug/index.vue
+++ b/webapp/pages/post/_id/_slug/index.vue
@@ -54,6 +54,11 @@
           :key="category.id"
           :icon="category.icon"
           :name="$t(`contribution.category.name.${category.slug}`)"
+          v-tooltip="{
+            content: $t(`contribution.category.description.${category.slug}`),
+            placement: 'bottom-start',
+            delay: { show: 500 },
+          }"
         />
       </div>
       <ds-space margin-bottom="small" />