From cf3a38072390c6a2ab3338dd41bdc832ebbec005 Mon Sep 17 00:00:00 2001 From: "nicolas.marsal" Date: Sat, 16 Jul 2022 12:39:01 +0200 Subject: [PATCH] feat: add localisation --- package-lock.json | 174 +++++++++++++++++- package.json | 3 +- src/components/common/LeftSection.vue | 33 ++++ src/components/common/RightSection.vue | 1 + src/components/education/MyEducation.vue | 9 +- src/components/experiences/MyExperiences.vue | 2 +- src/components/informations/MyHobbies.vue | 10 +- .../informations/MyInformations.vue | 10 +- src/components/informations/MyLanguages.vue | 9 +- src/components/skills/MySkills.vue | 2 +- src/main.ts | 20 +- 11 files changed, 256 insertions(+), 17 deletions(-) create mode 100644 src/components/common/LeftSection.vue diff --git a/package-lock.json b/package-lock.json index dbac037..98ec136 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,7 +9,8 @@ "version": "0.0.0", "dependencies": { "pinia": "^2.0.14", - "vue": "^3.2.37" + "vue": "^3.2.37", + "vue-i18n": "^9.1.10" }, "devDependencies": { "@rushstack/eslint-patch": "^1.1.0", @@ -528,6 +529,88 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, + "node_modules/@intlify/core-base": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.1.10.tgz", + "integrity": "sha512-So9CNUavB/IsZ+zBmk2Cv6McQp6vc2wbGi1S0XQmJ8Vz+UFcNn9MFXAe9gY67PreIHrbLsLxDD0cwo1qsxM1Nw==", + "dependencies": { + "@intlify/devtools-if": "9.1.10", + "@intlify/message-compiler": "9.1.10", + "@intlify/message-resolver": "9.1.10", + "@intlify/runtime": "9.1.10", + "@intlify/shared": "9.1.10", + "@intlify/vue-devtools": "9.1.10" + }, + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/devtools-if": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/devtools-if/-/devtools-if-9.1.10.tgz", + "integrity": "sha512-SHaKoYu6sog3+Q8js1y3oXLywuogbH1sKuc7NSYkN3GElvXSBaMoCzW+we0ZSFqj/6c7vTNLg9nQ6rxhKqYwnQ==", + "dependencies": { + "@intlify/shared": "9.1.10" + }, + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/message-compiler": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.1.10.tgz", + "integrity": "sha512-+JiJpXff/XTb0EadYwdxOyRTB0hXNd4n1HaJ/a4yuV960uRmPXaklJsedW0LNdcptd/hYUZtCkI7Lc9J5C1gxg==", + "dependencies": { + "@intlify/message-resolver": "9.1.10", + "@intlify/shared": "9.1.10", + "source-map": "0.6.1" + }, + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/message-resolver": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/message-resolver/-/message-resolver-9.1.10.tgz", + "integrity": "sha512-5YixMG/M05m0cn9+gOzd4EZQTFRUu8RGhzxJbR1DWN21x/Z3bJ8QpDYj6hC4FwBj5uKsRfKpJQ3Xqg98KWoA+w==", + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/runtime": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/runtime/-/runtime-9.1.10.tgz", + "integrity": "sha512-7QsuByNzpe3Gfmhwq6hzgXcMPpxz8Zxb/XFI6s9lQdPLPe5Lgw4U1ovRPZTOs6Y2hwitR3j/HD8BJNGWpJnOFA==", + "dependencies": { + "@intlify/message-compiler": "9.1.10", + "@intlify/message-resolver": "9.1.10", + "@intlify/shared": "9.1.10" + }, + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/shared": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.1.10.tgz", + "integrity": "sha512-Om54xJeo1Vw+K1+wHYyXngE8cAbrxZHpWjYzMR9wCkqbhGtRV5VLhVc214Ze2YatPrWlS2WSMOWXR8JktX/IgA==", + "engines": { + "node": ">= 10" + } + }, + "node_modules/@intlify/vue-devtools": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/vue-devtools/-/vue-devtools-9.1.10.tgz", + "integrity": "sha512-5l3qYARVbkWAkagLu1XbDUWRJSL8br1Dj60wgMaKB0+HswVsrR6LloYZTg7ozyvM621V6+zsmwzbQxbVQyrytQ==", + "dependencies": { + "@intlify/message-resolver": "9.1.10", + "@intlify/runtime": "9.1.10", + "@intlify/shared": "9.1.10" + }, + "engines": { + "node": ">= 10" + } + }, "node_modules/@jridgewell/gen-mapping": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz", @@ -4142,6 +4225,23 @@ "node": ">=10" } }, + "node_modules/vue-i18n": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz", + "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==", + "dependencies": { + "@intlify/core-base": "9.1.10", + "@intlify/shared": "9.1.10", + "@intlify/vue-devtools": "9.1.10", + "@vue/devtools-api": "^6.0.0-beta.7" + }, + "engines": { + "node": ">= 10" + }, + "peerDependencies": { + "vue": "^3.0.0" + } + }, "node_modules/vue-tsc": { "version": "0.38.5", "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-0.38.5.tgz", @@ -4594,6 +4694,67 @@ "integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==", "dev": true }, + "@intlify/core-base": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/core-base/-/core-base-9.1.10.tgz", + "integrity": "sha512-So9CNUavB/IsZ+zBmk2Cv6McQp6vc2wbGi1S0XQmJ8Vz+UFcNn9MFXAe9gY67PreIHrbLsLxDD0cwo1qsxM1Nw==", + "requires": { + "@intlify/devtools-if": "9.1.10", + "@intlify/message-compiler": "9.1.10", + "@intlify/message-resolver": "9.1.10", + "@intlify/runtime": "9.1.10", + "@intlify/shared": "9.1.10", + "@intlify/vue-devtools": "9.1.10" + } + }, + "@intlify/devtools-if": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/devtools-if/-/devtools-if-9.1.10.tgz", + "integrity": "sha512-SHaKoYu6sog3+Q8js1y3oXLywuogbH1sKuc7NSYkN3GElvXSBaMoCzW+we0ZSFqj/6c7vTNLg9nQ6rxhKqYwnQ==", + "requires": { + "@intlify/shared": "9.1.10" + } + }, + "@intlify/message-compiler": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/message-compiler/-/message-compiler-9.1.10.tgz", + "integrity": "sha512-+JiJpXff/XTb0EadYwdxOyRTB0hXNd4n1HaJ/a4yuV960uRmPXaklJsedW0LNdcptd/hYUZtCkI7Lc9J5C1gxg==", + "requires": { + "@intlify/message-resolver": "9.1.10", + "@intlify/shared": "9.1.10", + "source-map": "0.6.1" + } + }, + "@intlify/message-resolver": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/message-resolver/-/message-resolver-9.1.10.tgz", + "integrity": "sha512-5YixMG/M05m0cn9+gOzd4EZQTFRUu8RGhzxJbR1DWN21x/Z3bJ8QpDYj6hC4FwBj5uKsRfKpJQ3Xqg98KWoA+w==" + }, + "@intlify/runtime": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/runtime/-/runtime-9.1.10.tgz", + "integrity": "sha512-7QsuByNzpe3Gfmhwq6hzgXcMPpxz8Zxb/XFI6s9lQdPLPe5Lgw4U1ovRPZTOs6Y2hwitR3j/HD8BJNGWpJnOFA==", + "requires": { + "@intlify/message-compiler": "9.1.10", + "@intlify/message-resolver": "9.1.10", + "@intlify/shared": "9.1.10" + } + }, + "@intlify/shared": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/shared/-/shared-9.1.10.tgz", + "integrity": "sha512-Om54xJeo1Vw+K1+wHYyXngE8cAbrxZHpWjYzMR9wCkqbhGtRV5VLhVc214Ze2YatPrWlS2WSMOWXR8JktX/IgA==" + }, + "@intlify/vue-devtools": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/@intlify/vue-devtools/-/vue-devtools-9.1.10.tgz", + "integrity": "sha512-5l3qYARVbkWAkagLu1XbDUWRJSL8br1Dj60wgMaKB0+HswVsrR6LloYZTg7ozyvM621V6+zsmwzbQxbVQyrytQ==", + "requires": { + "@intlify/message-resolver": "9.1.10", + "@intlify/runtime": "9.1.10", + "@intlify/shared": "9.1.10" + } + }, "@jridgewell/gen-mapping": { "version": "0.1.1", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz", @@ -7081,6 +7242,17 @@ } } }, + "vue-i18n": { + "version": "9.1.10", + "resolved": "https://registry.npmjs.org/vue-i18n/-/vue-i18n-9.1.10.tgz", + "integrity": "sha512-jpr7gV5KPk4n+sSPdpZT8Qx3XzTcNDWffRlHV/cT2NUyEf+sEgTTmLvnBAibjOFJ0zsUyZlVTAWH5DDnYep+1g==", + "requires": { + "@intlify/core-base": "9.1.10", + "@intlify/shared": "9.1.10", + "@intlify/vue-devtools": "9.1.10", + "@vue/devtools-api": "^6.0.0-beta.7" + } + }, "vue-tsc": { "version": "0.38.5", "resolved": "https://registry.npmjs.org/vue-tsc/-/vue-tsc-0.38.5.tgz", diff --git a/package.json b/package.json index 5c319e7..4e5d855 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,8 @@ }, "dependencies": { "pinia": "^2.0.14", - "vue": "^3.2.37" + "vue": "^3.2.37", + "vue-i18n": "^9.1.10" }, "devDependencies": { "@rushstack/eslint-patch": "^1.1.0", diff --git a/src/components/common/LeftSection.vue b/src/components/common/LeftSection.vue new file mode 100644 index 0000000..251a2ca --- /dev/null +++ b/src/components/common/LeftSection.vue @@ -0,0 +1,33 @@ + + + + + + diff --git a/src/components/common/RightSection.vue b/src/components/common/RightSection.vue index 4af17c1..251a2ca 100644 --- a/src/components/common/RightSection.vue +++ b/src/components/common/RightSection.vue @@ -25,6 +25,7 @@ defineProps<{ font-size: 18px; font-weight: bolder; font-variant: titling-caps; + text-transform: capitalize; } .body { flex: 1; diff --git a/src/components/education/MyEducation.vue b/src/components/education/MyEducation.vue index 7268e87..2f20b3f 100644 --- a/src/components/education/MyEducation.vue +++ b/src/components/education/MyEducation.vue @@ -1,10 +1,13 @@ + - diff --git a/src/components/informations/MyHobbies.vue b/src/components/informations/MyHobbies.vue index 5dd14c0..8818971 100644 --- a/src/components/informations/MyHobbies.vue +++ b/src/components/informations/MyHobbies.vue @@ -1,10 +1,14 @@ + + - + - - diff --git a/src/main.ts b/src/main.ts index 6641b86..fce6e58 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,11 +1,29 @@ import { createApp } from "vue"; +import { createI18n } from "vue-i18n"; import { createPinia } from "pinia"; import App from "./App.vue"; import "./assets/main.css"; +const i18n = createI18n({ + locale: "fr", + messages: { + fr: { + section: { + information: "informations", + education: "formation", + languages: "langues", + hobbies: "hobbies", + experiences: "expériences", + skills: "compétences", + }, + }, + en: { hello: "こんにちは！" }, + }, +}); + const app = createApp(App); app.use(createPinia()); - +app.use(i18n); app.mount("#app");