diff --git a/db.py b/db.py
index 9d65f00..1ad4a47 100755
--- a/db.py
+++ b/db.py
@@ -241,7 +241,7 @@ class Object:
 
     @staticmethod
     def all_by_project(db: sqlite3.Connection) -> list[Project]:
-        objects = Object.all(db)
+        objects = [x.full(db) for x in Object.all(db)]
         objects_by_projects = itertools.groupby(objects, lambda x: x.project)
         # print(dict(objects_by_projects))
         return list(map(lambda x: Project(x[0], list(x[1])), objects_by_projects))
diff --git a/templates/index.html b/templates/index.html
index bd1909e..48ed7f2 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,5 +1,13 @@
 {% extends "base.html" %}
 
+{% block extracss %}
+<style>
+    .project {
+        display: none;
+    }
+</style>
+{% endblock %}
+
 {% block content %}
 <section class="section">
     <div class="container">
@@ -7,19 +15,44 @@
         {% if projects %}
             <div class="content">
                 <p>Voici les projets existants dans la base de données :
-                <ul>
+                <div class="fixed-grid has-6-cols">
+                    <div class="grid">
+                    {% for project in projects %}
+                    <a href="#" id="project-{{ loop.index0 }}" class="cell p-2 has-text-centered" style="border: solid; border-width: 1px; border-radius: 5px;">
+                        <div>
+                            <strong>{{ project.name }}</strong>
+                        </div>
+                        <div>
+                            <em>({{ project.objects | length }} objets)</em>
+                        </div>
+                    </a>
+                    {% endfor %}
+                    </div>
+                </div>
                 {% for project in projects %}
-                    <li>
-                        <h2 class="title mb-0 mt-3">{{ project.name }} <em>({{ project.objects | length }} objets)</em></h2>
+                    <div class="project project-{{ loop.index0 }}">
+                        <h2>{{ project.name }} <em>({{ project.objects | length }} objets)</em></h2>
+                        <div class="fixed-grid has-6-cols mb-5">
+                            <div class="grid">
+                                {% for object in project.objects %}
+                                <a href="/object/{{ object.id }}" class="cell p-2 has-text-centered" style="border: solid; border-width: 1px; border-radius: 5px;">
+                                        <div>
+                                            <strong>{{ object.name }}</strong>
+                                        </div>
+                                        <div>
+                                            {% if object.acquisitions %}
+                                            <img src="/data/objects/{{ object.id }}/{{ object.acquisitions[0].id }}/{{ leds[0] }}.jpg">
 
-                        <ul>
-                            {% for object in project.objects %}
-                                <li><a href="/object/{{ object.id }}">{{ object.name }}</a></li>
-                            {% endfor %}
-                        </ul>
-                    </li>
+                                            {% else %}
+                                                <em>Pas d'acquisitions</em>
+                                            {% endif %}
+                                        </div>
+                                    </a>
+                                {% endfor %}
+                            </div>
+                        </div>
+                    </div>
                 {% endfor %}
-                </ul>
             </div>
         {% else %}
             <p>Il n'y a aucun projet pour le moment...</p>
@@ -72,5 +105,18 @@ document.addEventListener('DOMContentLoaded', () => {
         });
     });
 });
+
+let projects = document.getElementsByClassName('project');
+for (let i = 0; i < {{ projects | length }}; i++) {
+    document.getElementById('project-' + i).addEventListener('click', () => {
+        for (let p of projects) {
+            if (p.classList.contains('project-' + i)) {
+                p.style.display = "block";
+            } else {
+                p.style.display = "none";
+            }
+        }
+    });
+}
 </script>
 {% endblock extrajs %}