diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..b58b603
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,5 @@
+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
diff --git a/.idea/SAE_RIOT_2024.iml b/.idea/SAE_RIOT_2024.iml
new file mode 100644
index 0000000..24643cc
--- /dev/null
+++ b/.idea/SAE_RIOT_2024.iml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="WEB_MODULE" version="4">
+  <component name="NewModuleRootManager">
+    <content url="file://$MODULE_DIR$">
+      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
+      <excludeFolder url="file://$MODULE_DIR$/temp" />
+      <excludeFolder url="file://$MODULE_DIR$/tmp" />
+    </content>
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..89d44bd
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/SAE_RIOT_2024.iml" filepath="$PROJECT_DIR$/.idea/SAE_RIOT_2024.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..35eb1dd
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/onzer.riot b/onzer.riot
index ed62ea2..c48bef8 100644
--- a/onzer.riot
+++ b/onzer.riot
@@ -1,9 +1,9 @@
 <onzer>
     <div class="px-12">
-        <div class="flex-row">
-            <input type="button" onclick={ click } value="Albums" class="mr-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 mb-4 h-14 w-40 mt-2"/>
-            <input type="button" onclick={ click } value="Artists" class="mx-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 mb-4 h-14 w-40 mt-2"/>
-            <input type="button" onclick={ click } value="Songs" class="ml-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 mb-4 h-14 w-40 mt-2"/>
+        <div class="flex-row mb-2">
+            <input id="album" type="button" onclick={ click } value="Albums" class="mr-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 h-14 w-40 mt-2"/>
+            <input id="artist" type="button" onclick={ click } value="Artists" class="mx-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 h-14 w-40 mt-2"/>
+            <input id="song" type="button" onclick={ click } value="Songs" class="ml-2 border-solid bg-emerald-100 border rounded-lg border-emerald-300 h-14 w-40 mt-2"/>
         </div>
         <form onsubmit={ add }>
             <div class="flex flex-row items-baseline">
@@ -17,27 +17,35 @@
     <script>
         export default {
             async onBeforeMount(props){
-                const response = await fetch('https://dwarves.iut-fbleau.fr/~fauvet/api/songs');
-
-                console.log(response);
-
-                this.state.placeholder = "Rechercher dans les albums";
-                console.log(this.state.items);
+                this.state.placeholder = 'Rechercher dans les albums';
             },
             edit(e) {
 
             },
             click(e) {
                 e.preventDefault();
+                document.getElementById("song").style.backgroundColor = "#D1FAE5";
+                document.getElementById("song").style.borderColor = "#6EE7B7";
+                document.getElementById("album").style.backgroundColor = "#D1FAE5";
+                document.getElementById("album").style.borderColor = "#6EE7B7";
+                document.getElementById("artist").style.backgroundColor = "#D1FAE5";
+                document.getElementById("artist").style.borderColor = "#6EE7B7";
+
                 switch (e.target.attributes.value.value) {
                     case 'Songs':
-                        this.state.placeholder = "Rechercher dans les songs";
+                        this.state.placeholder = "Rechercher dans les songs"
+                        document.getElementById("song").style.backgroundColor = "#6EE7B7";
+                        document.getElementById("song").style.borderColor = "#059669";
                         break;
                     case 'Artists':
                         this.state.placeholder = "Rechercher dans les artists";
+                        document.getElementById("artist").style.backgroundColor = "#6EE7B7";
+                        document.getElementById("artist").style.borderColor = "#059669";
                         break;
                     default:
                         this.state.placeholder = "Rechercher dans les albums";
+                        document.getElementById("album").style.backgroundColor = "#6EE7B7";
+                        document.getElementById("album").style.borderColor = "#059669";
                 };
                 this.update();
             }