Skip to content

Commit 29a1f64

Browse files
MrAnyxMrAnyx
committed
Feat: Ajout des traductions (missing about page)
1 parent 9374e15 commit 29a1f64

File tree

18 files changed

+1622
-723
lines changed

18 files changed

+1622
-723
lines changed

‎assets/scss/variables.scss‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,24 @@
11
$dark: #222831;
22
$dark-transparent: #222831b9;
33

4-
$semi-dark: #393E46;
4+
$semi-dark: #393e46;
5+
$semi-dark-light: #59616e;
56
$semi-dark-less-transparent: #393e46a9;
6-
$semi-dark-transparent: #393E4677;
7+
$semi-dark-transparent: #393e4677;
78
$semi-dark-very-transparent: #393e4615;
89

9-
$accent: #FFD369;
10+
$accent: #ffd369;
1011
$accent2: #7c4b88;
1112
$accent-less-transparent: #ffd2696b;
1213
$accent-semi-less-transparent: #ffd2692a;
1314
$accent-semi-transparent: #ffd26913;
1415
$accent-transparent: #ffd2690a;
1516

16-
$light: #EEEEEE;
17+
$light: #eeeeee;
1718
$light-transparent: #eeeeeec9;
1819

19-
$secondary: #9BA4B4;
20-
$secondary-transparent: #9BA4B469;
20+
$semi-light: #6f7a8d;
21+
$semi-light-light: #a0aabb;
22+
23+
$secondary: #9ba4b4;
24+
$secondary-transparent: #9ba4b469;

‎components/Footer.vue‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,7 @@
99
><eva-icon name="twitter-outline" class="icon"></eva-icon>
1010
</a>
1111

12-
<a
13-
href="https://www.linkedin.com/in/rob-bch/"
14-
target="_blank"
12+
<a href="https://www.linkedin.com/in/rob-bch/" target="_blank"
1513
><eva-icon name="linkedin-outline" class="icon"></eva-icon>
1614
</a>
1715

@@ -25,11 +23,12 @@
2523
</div>
2624

2725
<div id="footer-credits">
28-
Made with <a href="https://nuxtjs.org/" class="accent">NuxtJS</a>
26+
{{ $t("footer.credits.madeWith") }}
27+
<a href="https://nuxtjs.org/" class="accent">Nuxt</a>
2928

3029
<br />
3130

32-
Licensed under
31+
{{ $t("footer.credits.license") }}
3332

3433
<a
3534
href="https://github.com/Codeon-org/codeon.fr/blob/master/LICENSE"
@@ -45,14 +44,10 @@
4544

4645
<script>
4746
export default {
48-
data() {
49-
return {
50-
year: 2021,
51-
};
52-
},
53-
54-
mounted() {
55-
this.year = new Date().getFullYear();
47+
computed: {
48+
year() {
49+
return new Date().getFullYear();
50+
},
5651
},
5752
};
5853
</script>

‎components/LocaleDropdown.vue‎

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
<template>
2+
<a v-click-outside="close" class="dropdown" @click="toggle">
3+
<div class="button-content">
4+
<eva-icon
5+
name="globe-outline"
6+
class="icon-globe"
7+
width="22px"
8+
height="22px"
9+
></eva-icon>
10+
<eva-icon
11+
:name="chevronIcon"
12+
class="icon-indicator"
13+
width="22px"
14+
height="22px"
15+
></eva-icon>
16+
</div>
17+
<div class="dropdown-content" :class="{ show: show }">
18+
<nuxt-link
19+
:to="switchLocalePath('fr')"
20+
:class="{ active: $i18n.locale === 'fr' }"
21+
>
22+
{{ $t("header.locale.french") }}
23+
</nuxt-link>
24+
<nuxt-link
25+
:to="switchLocalePath('en')"
26+
:class="{ active: $i18n.locale === 'en' }"
27+
>
28+
{{ $t("header.locale.english") }}
29+
</nuxt-link>
30+
</div>
31+
</a>
32+
</template>
33+
34+
<script>
35+
export default {
36+
directives: {
37+
"click-outside": {
38+
bind(el, binding, vnode) {
39+
el.clickOutsideEvent = function (event) {
40+
if (!(el === event.target || el.contains(event.target))) {
41+
vnode.context[binding.expression](event);
42+
}
43+
};
44+
document.body.addEventListener("click", el.clickOutsideEvent);
45+
},
46+
unbind(el) {
47+
document.body.removeEventListener("click", el.clickOutsideEvent);
48+
},
49+
},
50+
},
51+
data: () => ({
52+
show: false,
53+
}),
54+
computed: {
55+
chevronIcon() {
56+
return this.show ? "chevron-up" : "chevron-down";
57+
},
58+
},
59+
methods: {
60+
toggle() {
61+
this.show = !this.show;
62+
},
63+
close() {
64+
this.show = false;
65+
},
66+
},
67+
};
68+
</script>
69+
70+
<style lang="scss" scoped>
71+
.dropdown {
72+
position: relative;
73+
display: inline-block;
74+
background: transparent;
75+
cursor: pointer;
76+
77+
.button-content {
78+
user-select: none;
79+
display: flex;
80+
align-items: center;
81+
82+
.icon-globe {
83+
fill: $semi-light;
84+
transition: fill 300ms ease-in-out;
85+
}
86+
.icon-indicator {
87+
fill: $light;
88+
}
89+
90+
.icon-globe,
91+
.icon-indicator {
92+
pointer-events: none;
93+
width: 22px;
94+
height: 22px;
95+
}
96+
}
97+
98+
&:hover {
99+
.icon-globe {
100+
fill: $semi-light-light;
101+
}
102+
}
103+
}
104+
105+
.dropdown-content {
106+
display: none;
107+
position: absolute;
108+
top: 50px;
109+
right: 0;
110+
background-color: $semi-dark-transparent;
111+
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
112+
z-index: 1;
113+
border-radius: 6px;
114+
overflow: hidden;
115+
116+
a {
117+
color: $light;
118+
padding: 8px 16px;
119+
text-decoration: none;
120+
display: block;
121+
122+
&.active {
123+
background-color: $accent-less-transparent;
124+
}
125+
126+
&:hover {
127+
background-color: $semi-dark-light;
128+
}
129+
}
130+
}
131+
132+
.show {
133+
display: block;
134+
}
135+
</style>

‎components/Navbar.vue‎

Lines changed: 20 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -3,57 +3,53 @@
33
<nuxt-link
44
v-for="(link, index) in links"
55
:key="index"
6-
:class="{ active: $nuxt.$route.path === link.link }"
7-
:to="link.link"
6+
:class="{ active: $nuxt.$route.name.includes(link.link) }"
7+
:to="localePath(link.link)"
88
>
9-
<span class="link-icon">{{ link.icon }}</span> {{ link.text }}
9+
<span class="link-icon">{{ link.icon }}</span> {{ $t(link.text) }}
1010
</nuxt-link>
11+
<LocaleDropdown />
1112
</div>
1213
</template>
1314

1415
<script>
16+
import LocaleDropdown from "./LocaleDropdown.vue";
17+
1518
export default {
19+
components: {
20+
LocaleDropdown,
21+
},
1622
data() {
1723
return {
1824
links: [
1925
{
2026
icon: "🏡",
21-
22-
text: "Home",
23-
24-
link: "/",
27+
text: "header.links.home",
28+
link: "index",
2529
},
2630
2731
{
2832
icon: "📚",
29-
30-
text: "Blog",
31-
32-
link: "/blog",
33+
text: "header.links.blog",
34+
link: "blog",
3335
},
3436
3537
{
3638
icon: "💡",
37-
38-
text: "Projects",
39-
40-
link: "/projects",
39+
text: "header.links.projects",
40+
link: "projects",
4141
},
4242
4343
{
4444
icon: "💻",
45-
46-
text: "Tools",
47-
48-
link: "/tools",
45+
text: "header.links.tools",
46+
link: "tools",
4947
},
5048
5149
{
5250
icon: "📝",
53-
54-
text: "About",
55-
56-
link: "/about",
51+
text: "header.links.about",
52+
link: "about",
5753
},
5854
],
5955
};
@@ -64,29 +60,17 @@ export default {
6460
<style lang="scss" scoped>
6561
#container {
6662
width: 100%;
67-
6863
height: 70px;
69-
7064
background-color: $dark-transparent;
71-
7265
backdrop-filter: blur(10px);
73-
7466
position: fixed;
75-
7667
z-index: 5;
77-
7868
top: 0;
79-
8069
left: 0;
81-
8270
display: flex;
83-
8471
flex-direction: row;
85-
8672
justify-content: center;
87-
8873
align-items: center;
89-
9074
column-gap: 12px;
9175
9276
@include xs-screen {
@@ -95,28 +79,20 @@ export default {
9579
9680
& a {
9781
color: $light;
98-
9982
text-decoration: none;
100-
10183
font-size: 16px;
102-
10384
padding: 8px 12px;
104-
10585
border-radius: 6px;
106-
107-
transition: background-color 0.12s ease-in-out;
86+
transition: background-color 0.3s ease-in-out;
10887
10988
@include xs-screen {
11089
font-size: 14px;
111-
11290
padding: 6px 8px;
113-
11491
border-radius: 4px;
11592
}
11693
11794
&:hover {
11895
background-color: $semi-dark-transparent;
119-
12096
transition: background-color 0.3s ease-in-out;
12197
}
12298
@@ -129,12 +105,10 @@ export default {
129105
130106
& a.active {
131107
color: $accent;
132-
133108
transition: background-color 0.3s ease-in-out;
134109
135110
&:hover {
136111
background-color: $accent-semi-transparent;
137-
138112
transition: background-color 0.3s ease-in-out;
139113
}
140114
}

‎data/education.js‎

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
const educations = [
22
{
33
school: "3iL Ingénieurs",
4-
fields: ["Computer Science", "Maths", "Management", "Network"],
4+
fields: ["Programming", "Network", "Databases", "Management"],
55
country: "France",
66
from: "September 2017",
77
to: "September 2022",
@@ -20,19 +20,14 @@ const educations = [
2020
},
2121
{
2222
school: "Université du Québec à Chicoutimi (UQAC)",
23-
fields: [
24-
"Computer Science",
25-
"Maths",
26-
"Artificial Intelligence",
27-
"Machine Learning",
28-
],
23+
fields: ["Artificial Intelligence", "Cybersecurity", "Algorithmic"],
2924
country: "Québec",
3025
from: "September 2021",
3126
to: "December 2021",
3227
},
3328
{
3429
school: "Integrated Preparatory Class (3iL)",
35-
fields: ["Computer Science", "Maths", "Management"],
30+
fields: ["Maths", "Network", "Programming", "Databases"],
3631
country: "France",
3732
from: "September 2017",
3833
to: "May 2019",

0 commit comments

Comments
 (0)