diff --git a/CHANGELOG b/CHANGELOG
index befadca..e929caf 100644
--- a/CHANGELOG
+++ b/CHANGELOG
@@ -2,6 +2,7 @@
 	- Change config folders & files to new organisation
 	- Remove celme
 	- Add option to run a specific function test & module of pyros
+	- Add collapsible components in device config view
 
 21-06-2023 (AKo): V0.6.26.0
 	- Restructuration du projet
diff --git a/src/core/pyros_django/obs_config/templates/obs_config/device_details.html b/src/core/pyros_django/obs_config/templates/obs_config/device_details.html
index d25bb84..9fa5fa5 100644
--- a/src/core/pyros_django/obs_config/templates/obs_config/device_details.html
+++ b/src/core/pyros_django/obs_config/templates/obs_config/device_details.html
@@ -1,8 +1,10 @@
 {% extends "base.html" %}
 {% load tags %}
-
+{% load static %}
+{% block head %}
+<link rel="stylesheet" type="text/css" href="{% static 'obs_config/css/config.css' %}">
+{% endblock  %}
 {% block content %}
-
 {# <textarea rows="80" cols="150"> {{config}}</textarea> #}
     {% comment %}
 <pre>{{ device_detail }}</pre>
@@ -82,78 +84,80 @@ th,td{
 
                 {% endfor %}
             {% endcomment %}
-            
-            <li> <h3> Component : {{capability.component}}  <input type="hidden" value="{{ capability.component }}"> <button  class="see_component_generic_file btn btn-light"><i class="fa-solid fa-eye"></i></button> </h3> 
             <br>
-            <b> attributes : </b>
-            <ul>
-            
-            {% for attribute in capability.attributes %}
-                {% with capability.attributes|get_item:attribute as attribute %}
-                {% if attribute.is_container %}
-                    <li><b>{{ attribute.label }} :</li></b> 
-                    <table class="table-bordered table-hover table-striped" >
+            <li> <h3 class="collapsible collapsible_category"> Component : {{capability.component}} </h3> 
+            <div class="content">
+                <br>
+                <p> View file :   <input type="hidden" value="{{ capability.component }}"> <button  class="see_component_generic_file btn btn-light"><i class="fa-solid fa-eye"></i></button> </p>
+                <b> attributes : </b>
+                <ul>
+                
+                {% for attribute in capability.attributes %}
+                    {% with capability.attributes|get_item:attribute as attribute %}
+                    {% if attribute.is_container %}
+                        <li><b>{{ attribute.label }} :</li></b> 
+                        <table class="table-bordered table-hover table-striped" >
+                            <thead>
+                                <tr>
+                                    <th> Variable </th>
+                                    <th> Unit </th>
+                                    <th colspan="20"> Values </th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                {% for val_name in attribute.value  %}
+                                <tr>
+                                    <td> {{ val_name }} </td>
+                                    <td>{{ attribute.unit|get_item:val_name}} </td>
+                                    {% for value in attribute.value|get_item:val_name %}
+                                    
+                                    {% if value|get_type == 'list' %}
+                                        <td>
+                                            <table class="table-bordered">    
+                                                <tbody>
+                                                    {% with value as values  %}
+                                                    <tr>
+                                                        {% for value in values %}
+                                                            <td> {{value}} </td>    
+                                                        {% endfor %}
+                                                    </tr>
+                                                </tbody>
+                                            </table>
+                                            {% endwith %}
+                                        </td>
+                                            
+                                    {% else %}
+                                        <td> {{value}} </td>
+                                    {% endif %}
+                                    {% endfor %}
+                                </tr>
+                                {% endfor %}
+                            </tbody>
+                        </table>
+                    {% elif attribute.is_enum %}
+                        <li><b>{{ attribute.label }} :</li></b> 
+                        <table class="table-bordered table-hover table-striped" >
                         <thead>
                             <tr>
+                                <tr>
                                 <th> Variable </th>
-                                <th> Unit </th>
-                                <th colspan="20"> Values </th>
+                                <th colspan="20"> Values (One of the following values)</th>
                             </tr>
                         </thead>
                         <tbody>
-                            {% for val_name in attribute.value  %}
                             <tr>
-                                <td> {{ val_name }} </td>
-                                <td>{{ attribute.unit|get_item:val_name}} </td>
-                                {% for value in attribute.value|get_item:val_name %}
-                                
-                                {% if value|get_type == 'list' %}
-                                    <td>
-                                        <table class="table-bordered">    
-                                            <tbody>
-                                                {% with value as values  %}
-                                                <tr>
-                                                    {% for value in values %}
-                                                        <td> {{value}} </td>    
-                                                    {% endfor %}
-                                                </tr>
-                                            </tbody>
-                                        </table>
-                                        {% endwith %}
-                                    </td>
-                                        
-                                {% else %}
-                                    <td> {{value}} </td>
-                                {% endif %}
-                                {% endfor %}
-                            </tr>
+                            <td> {{ attribute.label}} </td>
+                            {% for val in attribute.value  %}
+                                <td> {{ val }} </td>
                             {% endfor %}
+                            </tr>
                         </tbody>
-                    </table>
-                {% elif attribute.is_enum %}
-                    <li><b>{{ attribute.label }} :</li></b> 
-                    <table class="table-bordered table-hover table-striped" >
-                    <thead>
-                        <tr>
-                            <tr>
-                            <th> Variable </th>
-                            <th colspan="20"> Values (One of the following values)</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        <tr>
-                        <td> {{ attribute.label}} </td>
-                        {% for val in attribute.value  %}
-                            <td> {{ val }} </td>
-                        {% endfor %}
-                        </tr>
-                    </tbody>
-                    </table>
-                {% else %}
-                    <li>{{ attribute.label }} : {{ attribute.value}} {{ attribute.unit}} </li>
-                {% endif %}
-                {% endwith %}
-            {% endfor %}
+                        </table>
+                    {% else %}
+                        <li>{{ attribute.label }} : {{ attribute.value}} {{ attribute.unit}} </li>
+                    {% endif %}
+                    {% endwith %}
+                {% endfor %}
             </ul>
         {% endfor %}
     </ul>
@@ -212,6 +216,21 @@ $(document).ready(function() {
             $('#rawFileModal').modal('show');
         })
     });
+
+    var coll = document.getElementsByClassName("collapsible");
+    var i;
+
+    for (i = 0; i < coll.length; i++) {
+        coll[i].addEventListener("click", function() {
+            this.classList.toggle("active");
+            var content = this.nextElementSibling;
+            if (content.style.maxHeight){
+            content.style.maxHeight = null;
+            } else {
+            content.style.maxHeight = "max-content"
+            } 
+        });
+    }
 })
 </script>
 {% endblock %}
\ No newline at end of file
diff --git a/src/core/pyros_django/obs_config/templates/obs_config/obs_agents_config.html b/src/core/pyros_django/obs_config/templates/obs_config/obs_agents_config.html
index c36c82f..c90bd57 100644
--- a/src/core/pyros_django/obs_config/templates/obs_config/obs_agents_config.html
+++ b/src/core/pyros_django/obs_config/templates/obs_config/obs_agents_config.html
@@ -2,7 +2,7 @@
 {% load tags %}
 {% load static %}
 {% block content %}
-<link rel="stylesheet" type="text/css" href="{% static 'obsconfig/css/config.css' %}">
+<link rel="stylesheet" type="text/css" href="{% static 'obs_config/css/config.css' %}">
 
 <h1> Agents configuration</h1>
 <div class="unit">
diff --git a/src/core/pyros_django/obs_config/templates/obs_config/obs_astronomer_config.html b/src/core/pyros_django/obs_config/templates/obs_config/obs_astronomer_config.html
index 65ad358..d1e69c3 100644
--- a/src/core/pyros_django/obs_config/templates/obs_config/obs_astronomer_config.html
+++ b/src/core/pyros_django/obs_config/templates/obs_config/obs_astronomer_config.html
@@ -2,7 +2,7 @@
 {% load tags %}
 {% load static %}
 {% block content %}
-<link rel="stylesheet" type="text/css" href="{% static 'obsconfig/css/config.css' %}">
+<link rel="stylesheet" type="text/css" href="{% static 'obs_config/css/config.css' %}">
 
 
 
diff --git a/src/core/pyros_django/obs_config/templates/obs_config/obs_hardware_configuration.html b/src/core/pyros_django/obs_config/templates/obs_config/obs_hardware_configuration.html
index f297644..ca9dfbc 100644
--- a/src/core/pyros_django/obs_config/templates/obs_config/obs_hardware_configuration.html
+++ b/src/core/pyros_django/obs_config/templates/obs_config/obs_hardware_configuration.html
@@ -3,8 +3,9 @@
 
 {% block content %}
 <h1> Hardware configuration </h1>
+<br>
 <div class="devices">
-<h1> Devices </h1>
+<h2> Devices </h2>
 
     <table class="table table-bordered table-hover table-striped tablesorter" style="font-family: 'Montserra', sans-serif;">
         <thead>
@@ -49,7 +50,7 @@
 </div>
 
 <div class="computers">
-<h1> Computers </h1>
+<h2> Computers </h2>
     <table class="table table-bordered table-hover table-striped tablesorter" style="font-family: 'Montserra', sans-serif;">
         <thead>
             <tr>
diff --git a/src/core/pyros_django/obs_config/views.py b/src/core/pyros_django/obs_config/views.py
index 3c10a36..e95659b 100644
--- a/src/core/pyros_django/obs_config/views.py
+++ b/src/core/pyros_django/obs_config/views.py
@@ -369,7 +369,7 @@ def view_raw_component_config_file(request):
 @ csrf_exempt
 def view_raw_generic_device_config_file(request):
     GENERIC_DEVICES_PATH = os.path.join(
-        os.environ["DJANGO_PATH"], "../../../config/devices/")
+        os.environ["DJANGO_PATH"], "../../../config/observatory/general/devices/")
     if request.POST:
         yaml_file = open(GENERIC_DEVICES_PATH+request.POST["yaml_file"])
         content = yaml_file.readlines()
--
libgit2 0.21.2