From 63ad1813e9555668172442237eef07b0c4013732 Mon Sep 17 00:00:00 2001 From: Anssi Juvonen Date: Wed, 11 Sep 2024 13:45:04 +0300 Subject: [PATCH] Add a Q&A component --- src/assets/main.scss | 9 +++ src/components/QAComponent.vue | 67 +++++++++++++++++++ .../__snapshots__/SettingsView.spec.ts.snap | 41 +++++++++++- src/i18n/en.json | 48 ++++++++++++- src/i18n/fi.json | 48 ++++++++++++- src/views/SettingsView.vue | 15 +++-- 6 files changed, 216 insertions(+), 12 deletions(-) create mode 100644 src/components/QAComponent.vue diff --git a/src/assets/main.scss b/src/assets/main.scss index e0124bf..2e12d79 100644 --- a/src/assets/main.scss +++ b/src/assets/main.scss @@ -33,6 +33,15 @@ } } +main a { + @apply underline rounded-md; + @apply text-slate-300; + &:hover, + &:focus { + @apply text-slate-50; + } +} + html { @apply h-full; scrollbar-width: none; diff --git a/src/components/QAComponent.vue b/src/components/QAComponent.vue new file mode 100644 index 0000000..4b77cee --- /dev/null +++ b/src/components/QAComponent.vue @@ -0,0 +1,67 @@ + + + diff --git a/src/components/__tests__/__snapshots__/SettingsView.spec.ts.snap b/src/components/__tests__/__snapshots__/SettingsView.spec.ts.snap index a932477..e7a633e 100644 --- a/src/components/__tests__/__snapshots__/SettingsView.spec.ts.snap +++ b/src/components/__tests__/__snapshots__/SettingsView.spec.ts.snap @@ -15,7 +15,46 @@ exports[`SettingsView > renders 1`] = ` -
+ + + + + + + + + + + + + + + + + + + + + +
+ +
" `; diff --git a/src/i18n/en.json b/src/i18n/en.json index 61f5cbf..c238143 100644 --- a/src/i18n/en.json +++ b/src/i18n/en.json @@ -120,11 +120,53 @@ "en": "English", "fi": "Suomi" }, + "qa": { + "appPurpose": { + "title": "What's this app for?", + "text": "Eat Your Veggies is a free app for tracking plant-based ingredients on weekly basis in your diet. According to a study, consuming 30 or more veggies weekly has multiple health benefits over a less versatile diet. The key, according to study, is not as much in the amounts you consume, but in variation." + }, + "categories": { + "title": "But strawberry is a...", + "text": "...false fruit, I know. Also tomato is not a vegetable in biological sense, so the app takes some liberties in its categories. Still, please report any major inaccuracies you come across! You can also request missing veggies to be added. They should be such that are commercially available globally." + }, + "contact": { + "link": { + "url": "https://github.com/ajuvonen/veggies/", + "text": "GitHub" + }, + "title": "How to get in touch?", + "text": "You can find the project page in {0}. The page has separate boards for reporting issues and engaging in other discussion. Thank you for your interest towards the project!" + }, + "isItFree": { + "title": "Is the app monetized?", + "text": "The app is free to use, and it has no advertisements. There will be a possibility to donate, but don't feel obliged." + }, + "isMyDataSafe": { + "title": "Is my data safe?", + "text": "The data is stored in your browser's local storage and is not shared with any third parties. You can at any time you wish reset the app using the button below." + }, + "studyDetails": { + "link": { + "url": "https://doi.org/10.1128/msystems.00031-18", + "text": "American Society for Microbiology (ASM)" + }, + "title": "What's the science?", + "text": "I'm neither a nutritian nor a biologist, so I don't want to make exaggerated claims or interpretations. I'm not affiliated with the study in any way, but if you want to read more about the study, look up The American Gut Project from the journal of {0}." + }, + "title": "Common Questions", + "whatCounts": { + "title": "What counts as a portion?", + "text": "Ultimately, how you use the app is up to your discretion. However, consider that minuscule amounts might not be of any nutritional value. Therefore I personally consider only portions of a heaping tablespoon or larger adequate. It is also worth noting that very processed foods don't count towards a portion. So ketchup should not equal a tomato." + } + }, "settings": { "locale": "Language", - "reset": "Reset", - "resetDialogText": "Continuing with the reset will wipe all your previously saved data and start from scratch. This action cannot be undone.", - "resetDialogTitle": "Are you sure you want to reset?", + "reset": { + "button": "Reset", + "label": "Remove all data from the app", + "text": "Continuing with the reset will wipe all your previously saved data and start from scratch. This action cannot be undone.", + "title": "Are you sure you want to reset?" + }, "title": "Settings" }, "stats": { diff --git a/src/i18n/fi.json b/src/i18n/fi.json index 9101000..db0b2dc 100644 --- a/src/i18n/fi.json +++ b/src/i18n/fi.json @@ -120,11 +120,53 @@ "en": "English", "fi": "Suomi" }, + "qa": { + "appPurpose": { + "title": "Mitä sovelluksella tehdään", + "text": "Eat Your Veggies on ilmainen sovellus kasviperäisten ruoka-aineiden seuraamiseen ruokavaliossasi. Tutkimustulosten mukaan 30:n erilaisen kasviksen kuluttaminen viikoittain johtaa lukuisiin terveyshyötyihin vähemmän monipuoliseen ruokavalioon verrattuna. Avainasemassa ei siis tutkimuksen mukaan niinkään ole kulutettu määrä kuin monipuolisuus." + }, + "categories": { + "title": "Mutta mansikkahan on..", + "text": "...epähedelmä, tiedän. Tomaattikaan ei ole biologisessa mielessä vihannes, joten sovelluksessa otetaan pieniä vapauksia kategorioiden suhteen. Ilmoita silti suuret epätarkkuudet joita löydät. Voit myös ehdottaa puuttuvia vihanneksia sovellukseen lisättäväksi. Niiden pitäisi olla sellaisia, joita on kaupallisesti saatavilla maailmanlaajuisesti." + }, + "contact": { + "link": { + "url": "https://github.com/ajuvonen/veggies/", + "text": "GitHub" + }, + "title": "Mihin voin ottaa yhteyttä?", + "text": "Projektin sivu on täällä: {0}. Sivulta löytyy erilliset osiot bugien raportointiin sekä yleiseen keskusteluun. Kiitos mielenkiinnosta projektia kohtaan!" + }, + "isItFree": { + "title": "Maksaako sovelluksen käyttö?", + "text": "Sovellus on ilmainen eikä sisällä mainoksia. Mukaan on tulossa mahdollisuus tehdä lahjoitus, mutta se ei ole pakollista." + }, + "isMyDataSafe": { + "title": "Ovatko tietoni turvassa?", + "text": "Tietoja säilytetään ainoastaan selaimesi paikallisessa tallennustilassa laitteellasi, eikä niitä jaeta kolmansille osapuolille. Voit milloin vain tyhjentää tietosi alla olevalla napilla." + }, + "studyDetails": { + "link": { + "url": "https://doi.org/10.1128/msystems.00031-18", + "text": "American Society for Microbiology (ASM)" + }, + "title": "Mihin sovellus perustuu?", + "text": "En ole ravitsemusterapeutti enkä biologi, joten haluan välttää liioiteltujen terveysväittämien tai tulkintojen esittämistä. En ole kytköksissä tutkimusta tehneeseen ryhmään millään tavalla, mutta mikäli haluat lukea siitä lisää, tutustu The American Gut Projectiin julkaisussa {0}." + }, + "title": "Yleisiä kysymyksiä", + "whatCounts": { + "title": "Mikä lasketaan annokseksi?", + "text": "Se, miten sovellusta käytät, on viime kädessä kiinni omasta harkinnastasi. Huomioi kuitenkin, että hyvin vähäisissä määrissä kasviksia ei ole merkittävää ravitsemuksellista arvoa. Itse lasken mukaan vain kukkurallista ruokalusikkaa suuremmat annoskoot. Mainittakoon myös, että pitkälle prosessoiduilla ruoka-aineilla ei pidä korvata kasviksia. Ketsuppia ei siis lasketa tomaatiksi." + } + }, "settings": { "locale": "Kieli", - "reset": "Tyhjennä", - "resetDialogText": "Tyhjennys poistaa kaikki sovellukseen tallennetut tiedot ja palauttaa sovelluksen alkutilaansa. Tätä toimenpidettä ei voi perua.", - "resetDialogTitle": "Haluatko tyhjentää sovelluksen?", + "reset": { + "button": "Tyhjennä", + "label": "Poista sovelluksen tiedot", + "text": "Tyhjennys poistaa kaikki sovellukseen tallennetut tiedot ja palauttaa sovelluksen alkutilaansa. Tätä toimenpidettä ei voi perua.", + "title": "Haluatko tyhjentää sovelluksen?" + }, "title": "Asetukset" }, "stats": { diff --git a/src/views/SettingsView.vue b/src/views/SettingsView.vue index 39ada61..8494687 100644 --- a/src/views/SettingsView.vue +++ b/src/views/SettingsView.vue @@ -5,6 +5,7 @@ import {useActivityStore} from '@/stores/activityStore'; import {useAppStateStore} from '@/stores/appStateStore'; import LocaleChanger from '@/components/LocaleChanger.vue'; import ModalDialog from '@/components/ModalDialog.vue'; +import QAComponent from '@/components/QAComponent.vue'; const router = useRouter(); @@ -22,18 +23,22 @@ const reset = () => {