Improve code for hide/show button on LP view - refs #7972

app/Resources/public/css/base.css

@@ -205,15 +205,6 @@ ul#navigation li a {
   -moz-border-radius-bottomright: 5px;
   border-top-right-radius: 5px;
   border-bottom-right-radius: 5px;
-  background-image: url('../../main/img/touch-left.png');
-  background-repeat: no-repeat;
-  background-position: center center;
-  border: 1px solid #DDD;
-  width: 40px;
-  height: 40px;
-}
-#touch-button.show-touch{
-  background-image: url('../../main/img/touch-right.png');
 }
 
 ul#navigation .help a {

app/Resources/public/css/scorm.css

@@ -267,17 +267,10 @@ See https://support.chamilo.org/issues/6976
 }
 
 #touch-button{
-  text-decoration: none;
   position: fixed;
   top: 40px;
   left: -5px;
-  overflow: hidden;
-  width: 51px;
-  height: 51px;
-  border: none;
-  opacity: 50;
-  z-index: 2;
-  font-size: 26px;
+  z-index: 2
 }
 
 .inner_lp_toc{

main/inc/lib/javascript/jquery.lp_minipanel.js

@@ -21,9 +21,19 @@ $(document).ready(function() {
 
             });
         });
-        $(this).toggleClass('show-touch');
+
         $('#learning_path_right_zone').slideToggle(300);
 
+        var self = $(this);
+        self.toggleClass('show-touch');
+
+        var icon = self.children('span.fa');
+
+        if (icon.is('.fa-chevron-left')) {
+            icon.removeClass('fa-chevron-left').addClass('fa-chevron-right');
+        } else {
+            icon.removeClass('fa-chevron-right').addClass('fa-chevron-left');
+        }
     });
 
     // effects items scorm content

main/template/default/learnpath/view.tpl

@@ -6,7 +6,9 @@
             </div>
         </div>
     {% endif %}
-    <button id="touch-button" class="btn-touch"></button>
+    <button id="touch-button" class="btn btn-default btn-lg btn-touch">
+        <span class="fa fa-chevron-left fa-2x" aria-hidden="true"></span><span class="sr-only">{{ 'Hide'|get_lang }}</span>
+    </button>
     <div class="container-fluid">
         <div class="row">
             <div id="learning_path_left_zone" class="sidebar-scorm">