diff --git a/assets/css/style.css b/assets/css/style.css
index e69de29..eca2b17 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -0,0 +1,59 @@
+@import 'normalize.css';
+
+@font-face {
+ font-family: 'MoodboardFont';
+ font-weight: 400;
+ src: url('assets/fonts/moodboardfont-webfont.woff2') format('woff2'),
+ url('assets/fonts/moodboardfont-webfont.woff2') format('woff');
+}
+@font-face {
+ font-family: 'Queensides';
+ font-weight: 400;
+ src: url('../fonts/Queensides-3z7Ey.ttf');
+}
+@font-face {
+ font-family: 'QueensidesL';
+ font-weight: 300;
+ src: url('../fonts/QueensidesLight-ZVj3l.ttf');
+}
+@font-face {
+ font-family: 'QueensidesM';
+ font-weight: 700;
+ src: url('../fonts/QueensidesMedium-x30zV.ttf');
+}
+:root {
+ --color-bg: #ffb4b4;
+}
+
+@media(prefers-color-scheme: dark) {
+ :root {
+ --color-bg: #2d2d47;
+ }
+
+ [data-theme="light"] {
+ --color-bg: #ffb4b4;
+ }
+
+ [data-theme="dark"] {
+ --color-bg: #2d2d47;
+ --color-txt-dark: #fff;
+ }
+}
+
+body {
+ font-family: 'QueensidesL';
+ font-size: 18px;
+ color: var(--color-txt-dark);
+ background-color: var(--color-bg);
+ padding: 0;
+ margin: 0;
+}
+
+.title {
+ font-family: 'MoodboardFont';
+}
+p {
+ font-family: 'QueensidesM';
+ font-size: 23px;
+}
+@media only screen and (min-width: 750px) {}
\ No newline at end of file
diff --git a/assets/fonts/Queensides-3z7Ey.ttf b/assets/fonts/Queensides-3z7Ey.ttf
new file mode 100644
index 0000000..7702be7
Binary files /dev/null and b/assets/fonts/Queensides-3z7Ey.ttf differ
diff --git a/assets/fonts/QueensidesLight-ZVj3l.ttf b/assets/fonts/QueensidesLight-ZVj3l.ttf
new file mode 100644
index 0000000..d248c35
Binary files /dev/null and b/assets/fonts/QueensidesLight-ZVj3l.ttf differ
diff --git a/assets/fonts/QueensidesMedium-x30zV.ttf b/assets/fonts/QueensidesMedium-x30zV.ttf
new file mode 100644
index 0000000..5264806
Binary files /dev/null and b/assets/fonts/QueensidesMedium-x30zV.ttf differ
diff --git a/assets/fonts/moodboardfont-webfont.woff b/assets/fonts/moodboardfont-webfont.woff
new file mode 100644
index 0000000..39f6121
Binary files /dev/null and b/assets/fonts/moodboardfont-webfont.woff differ
diff --git a/assets/fonts/moodboardfont-webfont.woff2 b/assets/fonts/moodboardfont-webfont.woff2
new file mode 100644
index 0000000..3276543
Binary files /dev/null and b/assets/fonts/moodboardfont-webfont.woff2 differ
diff --git a/assets/fonts/queensides-font.zip b/assets/fonts/queensides-font.zip
new file mode 100644
index 0000000..d9cca6b
Binary files /dev/null and b/assets/fonts/queensides-font.zip differ
diff --git a/assets/js/app.js b/assets/js/app.js
index c995a8d..54f63de 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -1,12 +1,29 @@
-'use strict';
-// image animation (joao)
+'use strict';
-var upItem = document.querySelector('.images--right');
-var bottomItem = document.querySelector('.images--left');
-const sideItem = document.querySelector('.svg__side');
+// pour prendre la classe du bouton
-window.addEventListener("scroll", function() {
- upItem.style.transform = "translateX(" + window.pageYOffset / 15 + "px)";
- bottomItem.style.transform = "translateX(" + -window.pageYOffset / 10 + "px)";
- sideItem.style.transform = "translateY(" + window.pageYOffset / 5 + "px)";
-});
+const themeTrigger = document.querySelector(".js-theme-trigger");
+if(themeTrigger){
+ themeTrigger.addEventListener("click", toggleTheme); //quand on inclu un click sur le bouton, on met un toggleTheme
+}
+
+function toggleTheme(){ // pour changer le data attribut on doit d'abord récupérer l'attribut sur le body qui est data-theme.
+ let theme = document.body.getAttribute("data-theme");
+ if(theme == "dark"){
+ setTheme("light");
+ }else{
+ setTheme("dark");
+ }
+}
+
+
+function setTheme(theme){
+ document.body.setAttribute("data-theme", theme);
+ localStorage.setItem("theme", theme);
+}
+
+let activeTheme = localStorage.getItem("theme");
+if(activeTheme !== null){
+ setTheme(activeTheme);
+}
+// permet de prendre en compte la dernière modification du theme.
\ No newline at end of file
diff --git a/credits.html b/credits.html
new file mode 100644
index 0000000..be7852b
--- /dev/null
+++ b/credits.html
@@ -0,0 +1,36 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ RUX Pina Vetrano — DWT — Heaj
+
+
+
+
+
+ RUX
+
+
+ RUX
+
+
+