JS: add check all subategory of a category

2 files changed, 23 insertions, 4 deletions

diff --git a/static/saclay/css/styles.css b/static/saclay/css/styles.css
index 8c82688..e3af021 100644
--- a/static/saclay/css/styles.css
+++ b/static/saclay/css/styles.css
@@ -1634,7 +1634,7 @@ ul#roadmap_toolbar, ul#roadmap_toolbar ul, ul#roadmap_toolbar li{
 #search-form input{
     border: 0;
     background-color: #eaeaea;
-    width: 228px;
+    width: 210px;
     font-size: 0.85em;
 }
 
@@ -2099,6 +2099,7 @@ select#id_categories{
 
 .main_category > span > label{
     width: 100%;
+    background-position: 247px center;
 }
 
 .main_category.toggle_plus > span > label,
@@ -2220,3 +2221,13 @@ select#id_categories{
     padding: 0;
 }
 
+.main-category-tick{
+    position: absolute;
+    margin-top: 12px;
+    left: 218px;
+    color: #CCC;
+}
+
+.main_category.full .main-category-tick{
+    color: #1db11d;
+}
diff --git a/templates/chimere/blocks/categories.html b/templates/chimere/blocks/categories.html
index 05115ef..bb72a78 100644
--- a/templates/chimere/blocks/categories.html
+++ b/templates/chimere/blocks/categories.html
@@ -2,11 +2,19 @@
     <ul id='ul_categories'>
         {% for category, lst_sub_categories in sub_categories %}
         <li class='main_category {% if category.selected %}toggle_minus{%else%}toggle_plus{%endif%}'>
-            <span id='main_category_{{category.pk}}'><label>{% trans category.name %}</label>
-            <img class="control_image toggle_category" id="maincategory_img_{{category.id}}" alt="control" src="{{ STATIC_URL }}saclay/images/{% if category.selected %}minus.png{% else %}plus.png{% endif %}" /></span>
+            <span id='main_category_{{category.pk}}'>
+                <label>
+                    {% trans category.name %}
+                    <i class="fa fa-check main-category-tick"
+                       data-category="{{category.pk}}"
+                       aria-hidden="true"></i>
+                </label>
+                <img class="control_image toggle_category" id="maincategory_img_{{category.id}}" alt="control" src="{{ STATIC_URL }}saclay/images/{% if category.selected %}minus.png{% else %}plus.png{% endif %}" />
+            </span>
             <ul class='subcategories' id='maincategory_{{category.id}}'{% if not category.selected %} style='display:None'{% endif %}>
                 {% for sub_category in lst_sub_categories %}
-                <li id='li_sub_{{sub_category.id}}' class='subcategory'>
+                <li id='li_sub_{{sub_category.id}}' class='subcategory'
+                    data-subcategory="{{sub_category.id}}">
                     <span>
                     <label for='category_{{sub_category.id}}'>
                         {% trans sub_category.name %}