From ffedf1fd5709a666a601daf527eae5e806a8ea2f Mon Sep 17 00:00:00 2001
From: Laurent Destailleur <eldy@destailleur.fr>
Date: Fri, 3 Feb 2017 16:01:06 +0100
Subject: [PATCH] New demo page

---
 htdocs/public/demo/demo.css  | 27 +++++++++++++++++++++------
 htdocs/public/demo/index.php | 17 ++++++++---------
 2 files changed, 29 insertions(+), 15 deletions(-)

diff --git a/htdocs/public/demo/demo.css b/htdocs/public/demo/demo.css
index 486096ccdfa..dd1f7aad7b7 100644
--- a/htdocs/public/demo/demo.css
+++ b/htdocs/public/demo/demo.css
@@ -3,7 +3,21 @@
 /*  Demo                                                                          */
 /* ============================================================================== */
 
-
+a:hover {
+	text-decoration: none;
+}
+.demobox {
+	border: 1px solid #bbb;
+	border-radius: 8px;
+	-moz-border-radius: 8px;
+	min-height: 210px;
+}
+.demobox:hover {
+	border: 1px solid #bbb;
+	border-radius: 8px;
+	-moz-border-radius: 8px;
+	box-shadow: 2px 2px 8px #BBB; 
+}
 .CTable {
 	padding: 6px;
 	font-weight: normal;
@@ -18,7 +32,9 @@
 	background: -webkit-linear-gradient(bottom, rgb(255,255,255) 85%, rgb(255,255,255) 100%);
 }
 .csscolumns {
+    margin-left: 8px;
     margin-top: 6px;
+    margin-bottom: 5px;
     -webkit-column-count: 4; /* Chrome, Safari, Opera */
     -moz-column-count: 4; /* Firefox */
     column-count: 3;
@@ -85,10 +101,6 @@ img.demothumb {
     height: 140px;
     background-position-y: bottom;
 }
-div#tr1profdemoall {
-    margin-left: -40px;
-    margin-right: -40px;
-}
 
 
 @media only screen and (max-width: 767px)
@@ -97,8 +109,11 @@ div#tr1profdemoall {
     	line-height: 150% !important;
         font-size: 100% !important;
     }
+    .demobox {
+		min-height: 170px !important;
+	}
     img.demothumb {
-        box-shadow: 1px 1px 4px #BBB;
+        /* box-shadow: 1px 1px 4px #BBB; */
         margin-right: 6px;
         margin-left: 4px;
         width: 80px;
diff --git a/htdocs/public/demo/index.php b/htdocs/public/demo/index.php
index 800639be251..bcca53e9245 100644
--- a/htdocs/public/demo/index.php
+++ b/htdocs/public/demo/index.php
@@ -254,7 +254,7 @@ var openedId="";
 jQuery(document).ready(function () {
 jQuery("tr.moduleline").hide();
 // Enable this to allow personalized setup
-jQuery(".modulelineshow").attr("href","#");
+jQuery(".modulelineshow").attr("href","#a1profdemoall");
 jQuery(".cursorpointer").css("cursor","pointer");
 jQuery(".modulelineshow").click(function() {
 var idstring=$(this).attr("id");
@@ -328,22 +328,21 @@ foreach ($demoprofiles as $profilearray)
         print '<input type="hidden" name="dol_no_mouse_hover" value="'.$conf->dol_no_mouse_hover.'">'."\n";
         print '<input type="hidden" name="dol_use_jmobile" value="'.$conf->dol_use_jmobile.'">'."\n";
 
-        print '<div summary="Dolibarr online demonstration for profile '.$profilearray['label'].'" class="center inline-block CTable CTableRow'.($i%2==0?'1':'0').'" style="width: 400px">'."\n";
-        print '<div id="a1'.$profilearray['key'].'" class="'.(empty($profilearray['url'])?'modulelineshow cursorpointer':'nomodulelines').'">';
+        print '<div summary="Dolibarr online demonstration for profile '.$profilearray['label'].'" class="center inline-block CTable CTableRow'.($i%2==0?'1':'0').'" style="width: 400px;">'."\n";
 
-		print '<a href="'.$urlwithmod.'" class="'.(empty($profilearray['url'])?'modulelineshow':'nomodulelines').'">';
+        
+        print '<div id="a1'.$profilearray['key'].'" class="demobox '.(empty($profilearray['url'])?'modulelineshow cursorpointer':'nomodulelines').'">';
 
+        print '<a href="'.$urlwithmod.'" class="'.(empty($profilearray['url'])?'modulelineshow':'nomodulelines').'">';
 		print '<div style="padding: 10px;">';
         
 		print '<img class="demothumb" src="'.$profilearray['icon'].'" alt="Demo '.$profilearray['label'].'">';
 		
 		print '<div class="clearboth"></div>';
 	
-		print '<div style=""><div class="demothumbtext">';
-
+		print '<div class="demothumbtext">';
     	print $langs->trans($profilearray['label']);
-
-    	print '</div></div>';
+    	print '</div>';
     	
     	print '</div>';
     	print '</a>';
@@ -352,7 +351,7 @@ foreach ($demoprofiles as $profilearray)
         // Modules
         if (empty($profilearray['url']))
         {
-    		print '<div id="tr1'.$profilearray['key'].'" class="moduleline hidden" style="font-size:14px; line-height: 110%;">';
+    		print '<div id="tr1'.$profilearray['key'].'" class="moduleline hidden" style="font-size:14px; line-height: 110%; padding-bottom: 8px">';
     		
     		print $langs->trans("ThisIsListOfModules").'<br>';
     		print '<div class="csscolumns">';