fix css description sections et header

format.js

@@ -73,10 +73,35 @@ M.course.format.process_sections = function(Y, sectionlist, response, sectionfro
 };
 
 (function () {
+    $(".description-inner").each(function(index){
+        if(parseInt($( this ).css('height'))<=144){
+            $(this).parent().next().hide();
+        }
+    })
+    //Gère les animations sur les descriptions des sections pour agrandir/rétrecir les infos
     $('.section').find('a[href="#"].voir-plus').on('click', function (e) {
         e.preventDefault();
         this.expand = !this.expand;
         $(this).text(this.expand?"Réduire la description":"Voir la description complète");
-        $(this).closest('.section').find('.small, .big').toggleClass('small big');
+        //$(this).closest('.section').find('.small, .big').toggleClass('small big');
+        //
+     
+        if($(this).prev().hasClass('small')){
+            $(this).prev().toggleClass('small big');
+            var height= $(this).prev().find(".description-inner").css("height");
+            $(this).prev().animate({ "max-height": height }, "slow" );
+
+        } 
+        else if($(this).prev().hasClass('big')){
+
+            $(this).prev().toggleClass('small big');
+            $(this).prev().animate({ "max-height": '144px' }, "slow" );
+        }
+        else{
+            $(this).prev().addClass("big");
+            var height= $(this).prev().find(".description-inner").css("height");
+            $(this).prev().animate({ "max-height": height }, "slow" );
+        }
+        
     });
 }(jQuery));
\ No newline at end of file

styles.css

@@ -55,6 +55,12 @@ ul.iena-editing .voir-plus {
     border-bottom-right-radius: 7px;
 }
 
+
+.voir-plus{
+    margin-left: 3%;
+margin-top: 14px;
+}
+
 .iena-section .instancename {
     font-size: 1rem;
 }
@@ -272,13 +278,28 @@ ul.nav.navbar-nav.ml-auto {
 }
 
 .iena-description {
-	background: #EEE;
+	
 	color: #323232;
 	padding: 1rem;
 	clear: both;
-	margin-bottom: 0.5rem;
+    display: flex;
+    align-items: baseline;
+    flex-wrap: wrap;
+    border-top: 1px solid #dee2e6;
 }
 
+.iena-description i{
+    color:#2a657d;
+    flex-basis: 3%;
+}
+.course-description-item.summarytext{
+    flex-basis: 97%;
+    overflow:hidden;
+    max-height: 144px;
+}
+
+
+
 /* iENA course format header with progression */
 
 
@@ -354,7 +375,7 @@ ul.nav.navbar-nav.ml-auto {
 .iena-course-header > .iena-course-header-bottom {
 	margin-bottom: 40px;
     background: #eaeaea;
-    padding: 15px;
+    padding: 1.5rem;
     border-radius:10px;
 }
 

templates/courseformat/content/section/content.mustache

@@ -130,9 +130,18 @@
     {{/iscoursedisplaymultipage}}">
     <div class="{{#hasavailability}}description{{/hasavailability}} my-3" data-for="sectioninfo">
     {{#summary}}
-        {{$ core_courseformat/local/content/section/summary }}
-            {{> core_courseformat/local/content/section/summary }}
-        {{/ core_courseformat/local/content/section/summary }}
+        {{#summarytext}}
+        <div class="iena-summary">
+            <div class="iena-description">
+                <i class="fa fa-info-circle" aria-hidden="true"></i>
+                {{$ core_courseformat/local/content/section/summary }}
+                    {{> core_courseformat/local/content/section/summary }}
+                {{/ core_courseformat/local/content/section/summary }}
+                <a href="#" class="voir-plus">Voir la description complète</a>
+            </div>
+     
+        </div>
+        {{/summarytext}}
     {{/summary}}
     {{#availability}}
         {{$ core_courseformat/local/content/section/availability }}