Fix responsive of boxes

htdocs/core/boxes/modules_boxes.php

@@ -231,8 +231,8 @@ class ModeleBoxes    // Can't be abtract as it is instantiated to build "empty"
             $nblines=count($contents);
 
             $out.= "\n<!-- Box ".get_class($this)." start -->\n";
-            //$out.= '<div class="div-table-responsive-no-min">';		// Does not work on home page. TODO Try to fix this.
-            $out.= '<div class="box" id="boxto_'.$this->box_id.'">'."\n";
+
+            $out.= '<div class="box boxdraggable" id="boxto_'.$this->box_id.'">'."\n";
 
             if (! empty($head['text']) || ! empty($head['sublink']) || ! empty($head['subpicto']) || $nblines)
             {
@@ -361,7 +361,7 @@ class ModeleBoxes    // Can't be abtract as it is instantiated to build "empty"
             if (empty($head['text']) && empty($head['sublink']) && empty($head['subpicto']) && ! $nblines) $out.= "<br>\n";
 
             $out.= "</div>\n";
-            //$out.= "</div>\n";
+
             $out.= "<!-- Box ".get_class($this)." end -->\n\n";
             if (! empty($conf->global->MAIN_ACTIVATE_FILECACHE)) {
                 dol_filecache($cachedir, $filename, $out);

htdocs/core/class/html.formother.class.php

@@ -1042,8 +1042,8 @@ class FormOther
 
 	        // To update list of activated boxes
 	        function updateBoxOrder(closing) {
-	        	var left_list = cleanSerialize(jQuery("#left").sortable("serialize"));
-	        	var right_list = cleanSerialize(jQuery("#right").sortable("serialize"));
+	        	var left_list = cleanSerialize(jQuery("#boxhalfleft").sortable("serialize"));
+	        	var right_list = cleanSerialize(jQuery("#boxhalfright").sortable("serialize"));
 	        	var boxorder = \'A:\' + left_list + \'-B:\' + right_list;
 	        	if (boxorder==\'A:A-B:B\' && closing == 1)	// There is no more boxes on screen, and we are after a delete of a box so we must hide title
 	        	{
@@ -1067,8 +1067,8 @@ class FormOther
 	        	jQuery("#boxcombo").change(function() {
 	        	var boxid=jQuery("#boxcombo").val();
 	        		if (boxid > 0) {
-	            		var left_list = cleanSerialize(jQuery("#left").sortable("serialize"));
-	            		var right_list = cleanSerialize(jQuery("#right").sortable("serialize"));
+	            		var left_list = cleanSerialize(jQuery("#boxhalfleft").sortable("serialize"));
+	            		var right_list = cleanSerialize(jQuery("#boxhalfright").sortable("serialize"));
 	            		var boxorder = \'A:\' + left_list + \'-B:\' + right_list;
 	    				jQuery.ajax({
 	    					url: \''.DOL_URL_ROOT.'/core/ajax/box.php?boxorder=\'+boxorder+\'&boxid=\'+boxid+\'&zone='.$areacode.'&userid='.$user->id.'\',
@@ -1080,13 +1080,12 @@ class FormOther
 	        	if (! count($arrayboxtoactivatelabel)) $selectboxlist.='jQuery("#boxcombo").hide();';
 	        	$selectboxlist.='
 
-	        	jQuery("#left, #right").sortable({
-		        	/* placeholder: \'ui-state-highlight\', */
+	        	jQuery("#boxhalfleft, #boxhalfright").sortable({
 	    	    	handle: \'.boxhandle\',
 	    	    	revert: \'invalid\',
-	       			items: \'.box\',
-	        		containment: \'.fiche\',
-	        		connectWith: \'.connectedSortable\',
+	       			items: \'.boxdraggable\',
+					containment: \'document\',
+	        		connectWith: \'#boxhalfleft, #boxhalfright\',
 	        		stop: function(event, ui) {
 	        			updateBoxOrder(1);  /* 1 to avoid message after a move */
 	        		}
@@ -1118,7 +1117,6 @@ class FormOther
         	$emptybox=new ModeleBoxes($db);
 
             $boxlista.="\n<!-- Box left container -->\n";
-            $boxlista.='<div id="left" class="connectedSortable">'."\n";
 
             // Define $box_max_lines
             $box_max_lines=5;
@@ -1147,11 +1145,9 @@ class FormOther
             	$emptybox->info_box_contents=array();
             	$boxlista.= $emptybox->outputBox(array(),array());
             }
-            $boxlista.= "</div>\n";
             $boxlista.= "<!-- End box left container -->\n";
 
             $boxlistb.= "\n<!-- Box right container -->\n";
-            $boxlistb.= '<div id="right" class="connectedSortable">'."\n";
 
             $ii=0;
             foreach ($boxactivated as $key => $box)
@@ -1176,7 +1172,7 @@ class FormOther
             	$emptybox->info_box_contents=array();
             	$boxlistb.= $emptybox->outputBox(array(),array());
             }
-            $boxlistb.= "</div>\n";
+
             $boxlistb.= "<!-- End box right container -->\n";
 
         }

htdocs/index.php

@@ -124,8 +124,6 @@ if (empty($user->societe_id))
     $boxstat.='</tr>';
     $boxstat.='<tr class="impair"><td class="tdboxstats nohover flexcontainer">';
 
-    $var=true;
-
     $object=new stdClass();
     $parameters=array();
     $action='';
@@ -510,7 +508,6 @@ if ($reshook == 0) {
 
 // Calculate total nb of late
 $totallate=$totaltodo=0;
-$var=true;
 
 //Remove any invalid response
 //load_board can return an integer if failed or WorkboardResponse if OK
@@ -617,25 +614,27 @@ print '<div class="fichecenter fichecenterbis">';
  * Show boxes
  */
 
-$boxlist.='<table width="100%" class="notopnoleftnoright">';
-$boxlist.='<tr><td class="notopnoleftnoright">'."\n";
+$boxlist.='<div class="twocolumns">';
 
-$boxlist.='<div class="fichehalfleft">';
+$boxlist.='<div class="fichehalfleft boxhalfleft" id="boxhalfleft">';
 
-//$boxlist.=$boxinfo;
 $boxlist.=$boxstat;
 $boxlist.=$resultboxes['boxlista'];
 
-$boxlist.= '</div><div class="fichehalfright"><div class="ficheaddleft">';
+$boxlist.= '</div>';
+
+$boxlist.= '<div class="fichehalfright boxhalfright" id="boxhalfright">';
+$boxlist.= '<div class="ficheaddleft">';
 
 $boxlist.=$boxwork;
 $boxlist.=$resultboxes['boxlistb'];
 
-$boxlist.= '</div></div>';
+$boxlist.= '</div>';
+$boxlist.= '</div>';
 $boxlist.= "\n";
 
-$boxlist.= "</td></tr>";
-$boxlist.= "</table>";
+$boxlist.='</div>';
+
 
 print $boxlist;
 

htdocs/theme/eldy/style.css.php

@@ -2931,6 +2931,10 @@ ul.noborder li:nth-child(even):not(.liste_titre) {
  *  Boxes
  */
 
+.box {
+    overflow-x: auto;
+    min-height: 40px;
+}
 .ficheaddleft div.boxstats {
     border: none;
 }

htdocs/theme/md/style.css.php

@@ -3005,6 +3005,10 @@ div .tdtop {
  *  Boxes
  */
 
+.box {
+    overflow-x: auto;
+    min-height: 40px;
+}
 .ficheaddleft div.boxstats {
     border: none;
 }