fix list teachers courses and sessions footer

app/Resources/public/css/base.css

@@ -21,10 +21,10 @@ body{
     position: absolute;
     bottom: 0;
     width: 100%;
-    height: 120px;
+    
 }
 #content-section{
-    margin-bottom: 150px;
+    margin-bottom: 230px;
 }
 /* End Sticky footer style */
 select {
@@ -198,7 +198,6 @@ header{
 .panelSliders .ui-slider-handle {
   border-color: #000;
 }
-
 #panelSliders {
   width: 75%;
   margin: 25px auto;
@@ -4669,15 +4668,9 @@ div#chat-remote-video video {
   height: 100px;
 }
 /* list courses classic*/
-.classic-courses .teachers{
+.classic-courses .list-teachers{
-    margin: 0;
-    padding: 0;
-    display: inline-block;
     font-size: 12px;
 }
-.classic-courses .teachers li{
-    display: inline-block;
-}
 /* list my course user*/
 .session .info-session{
     margin-bottom: 10px;
@@ -4686,7 +4679,7 @@ div#chat-remote-video video {
 .session .info-session span{
     margin-right: 10px;
 }
-.session .teachers{
+.session .list-teachers{
     font-size: 12px;
 }
 .session .sessions-items .courses{

bower.json

@@ -27,7 +27,8 @@
     "cropper": "1.0.*",
     "jquery.scrollbar": "0.2.*",
     "jquery-file-upload": "*",
-    "pwstrength-bootstrap": "*"
+    "pwstrength-bootstrap": "*",
+    "readmore-js": "2.1.0"
   },
   "resolutions": {
     "jquery": "2.1.4"

main/inc/lib/template.lib.php

@@ -706,7 +706,8 @@ class Template
             'mediaelement/build/mediaelement-and-player.min.js',
             'jqueryui-timepicker-addon/dist/jquery-ui-timepicker-addon.min.js',
             'image-map-resizer/js/imageMapResizer.min.js',
-            'jquery.scrollbar/jquery.scrollbar.min.js'
+            'jquery.scrollbar/jquery.scrollbar.min.js',
+            'readmore-js/readmore.min.js'
         ];
         if (CHAMILO_LOAD_WYSIWYG == true) {
             $bowerJsFiles[] = 'ckeditor/ckeditor.js';

main/template/default/layout/footer.js.tpl

@@ -92,5 +92,14 @@
             placement: 'right'
         };
         $('.boot-tooltip').tooltip(tip_options);
+        var more = '{{ 'SeeMore' | get_lang }}';
+        var close = '{{ 'Close' | get_lang }}';
+        $('.list-teachers').readmore({
+            speed: 75,
+            moreLink: '<a href="#">' + more + '</a>',
+            lessLink: '<a href="#">' + close + '</a>',
+            collapsedHeight: 35,
+            blockCSS: 'display: block; width: 100%;'
+        });
     });
 </script>

main/template/default/user_portal/classic_courses_without_category.tpl

@@ -45,19 +45,18 @@
                                 {% endif %}
                             </h4>
                             <div class="course-items-session">
+                                
+                                <div class="list-teachers">
                                     {{ 'teacher.png' | img(16, 'Professor'|get_lang ) }}
-                                <ul class="teachers">
                                     {% for teacher in item.teachers %}
-                                        <li>
                                             {% set counter = counter + 1 %}
                                             {% if counter > 1 %} | {% endif %}
                                             <a href="{{ teacher.url }}" class="ajax"
                                                data-title="{{ teacher.firstname }} {{ teacher.lastname }}">
                                                 {{ teacher.firstname }} {{ teacher.lastname }}
                                             </a>
-                                        </li>
                                     {% endfor %}
-                                </ul>
+                                </div>
                             </div>
                         </div>
                     </div>

main/template/default/user_portal/classic_session.tpl

@@ -100,7 +100,7 @@
                                         </div>
                                         <div class="col-md-10">
                                             <h4>{{ item.title }}</h4>
-                                            <div class="teachers">
+                                            <div class="list-teachers">
                                                 {% if item.teachers|length > 0 %}
                                                     <img src="{{ 'teacher.png'|icon(16) }}" width="16" height="16">
                                                     {% for coach in item.teachers %}