Redesign - analize - multitabele

admin/survey/classes/class.SurveyStaticHtml.php

@@ -27,29 +27,44 @@ class SurveyStaticHtml
 
         $this->table_id = SurveyUserSetting:: getInstance()->getSettings('default_mc_table');
 
-        if (isset($this->table_id) && $this->table_id != '')
+        /*if (isset($this->table_id) && $this->table_id != '')
             $sql = sisplet_query("SELECT name FROM srv_mc_table WHERE id='$this->table_id' AND ank_id='$this->sid' AND usr_id='$global_user_id'");
         else
             $sql = sisplet_query("SELECT name FROM srv_mc_table WHERE ank_id='$this->sid' AND usr_id='$global_user_id' ORDER BY time_created ASC");
-        $row = mysqli_fetch_array($sql);
+        $row = mysqli_fetch_array($sql);*/
+
 
         echo '<div class="mc_settings_links">';
-        echo '<ul>';
 
-        // Izbiro tabele (popup) in dodajanje
-        echo '<li>';
-        echo '<span onClick="show_mc_tables();">' . $lang['srv_table'] . ': <span class="bold">' . $row['name'] . '</span></span>';
-        echo '<span id="mc_tables_plus" class="pointer spaceLeft faicon add icon-blue" title="' . $lang['srv_multicrosstabs_tables_add'] . '"></span></span>';
-        echo '</li>';
 
-        echo '<li class="space">&nbsp;</li>';
+        // Seznam tabel
+        echo '<div class="table_list">';
+
+        $sql = sisplet_query("SELECT id, name FROM srv_mc_table WHERE ank_id='$this->sid' AND usr_id='$global_user_id' ORDER BY time_created ASC");
+        while($row = mysqli_fetch_array($sql)){
+            echo '<div class="table_item '.($row['id'] == $this->table_id ? 'active' : '').'">';
+            echo '  <span onClick="switch_mc_table(\''.$row['id'].'\');">'.$row['name'].'</span>';
+            echo '</div>';
+        }
+
+        echo '</div>';
+
+
+        // Nastavtve, dodajanje tabele
+        echo '<div class="table_settings">';
+
+        // Urejanje
+        echo '  <span class="faicon edit" onClick="show_mc_tables();"></span>';
+
+        // Dodajanje
+        echo '  <span id="mc_tables_plus" class="faicon add" title="'.$lang['srv_multicrosstabs_tables_add'].'"></span>';
 
         // Nastavitve tabele (popup)
-        echo '<li>';
+        echo '  <span class="faicon wheel_32" onClick="showMCSettings();" title="'.$lang['srv_multicrosstabs_settings'].'"></span>';
-        echo '<span class="gray" onClick="showMCSettings();">' . $lang['srv_multicrosstabs_settings'] . '</span>';
+
-        echo '</li>';
+        echo '</div>';
+
 
-        echo '</ul>';
         echo '</div>';
     }
 

admin/survey/classes/surveyAnalysis/class.SurveyMultiCrosstabs.php

@@ -219,7 +219,7 @@ class SurveyMultiCrosstabs {
 			if($spr['canChoose'] && in_array($spr['tip'], array(1,3,6))){
 				
 				echo '<li class="draggable mc_draggable" id="'.$spr['spr_id'].'-'.$spr['sequence'].'">';		
-				echo '<span class="strong">'.$spr['variable'].'</span> - '.$this->snippet($spr['naslov'], 25);			
+				echo '  <span class="strong"><span class="faicon grip"></span>'.$spr['variable'].'</span> - '.$this->snippet($spr['naslov'], 25);			
 				echo '</li>';
 			}
 		}
@@ -255,8 +255,18 @@ class SurveyMultiCrosstabs {
 		// Napolnimo variable ki so ze izbrane
 		$this->getSelectedVars();
 
-		echo '<table id="'.$this->table_id.'" cellspacing="0" cellpadding="0" class="mc_table">';
+        // Zvezdica za creport - ce smo v custom reportu tega ne izpisemo
+		if($_GET['m'] != 'analysis_creport'){
 		
+            echo '<div class="mc_table_top_settings">';
+
+			// Zvezdica za vkljucitev v porocilo	
+			SurveyAnalysisHelper::getInstance()->addCustomReportElement($type=10, $sub_type=0, $spr1=$this->table_id);
+
+			echo '</div>';
+		}
+
+		echo '<table id="'.$this->table_id.'" cellspacing="0" cellpadding="0" class="mc_table">';
 
 		// Imamo 2 nivoja
 		if($this->colLevel2){
@@ -268,7 +278,9 @@ class SurveyMultiCrosstabs {
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';	
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';
+            
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $var){
 					
@@ -279,15 +291,17 @@ class SurveyMultiCrosstabs {
 					echo $this->snippet($this->variablesList[$var['spr']]['naslov'], 25);
 					
 					// Gumb za brisanje
-					echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';
+					echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';
 					
 					echo '</td>';
 				}
 			}
 			// Izrisemo se zadnjo prazno navpicno celico vrstico
 			echo '<td id="undefined" class="spr vertical droppable empty" rowspan="4">'.$lang['srv_multicrosstabs_add'].'</td>';		
+			
             echo '</tr>';
 			
+            
 			// Izrisemo VARIABLE za spremenljivko - 2. vrstica
 			if($this->rowSpan == 0)
 				$colspan = ' colspan="1"';
@@ -295,7 +309,9 @@ class SurveyMultiCrosstabs {
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';		
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';	
+
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $var){
 
@@ -315,15 +331,17 @@ class SurveyMultiCrosstabs {
 			}
 			echo '</tr>';
 
-			// Izris vrstic za 2. nivo - 3. in 4. vrstica
 			
+			// Izris vrstic za 2. nivo - 3. in 4. vrstica
 			if($this->rowSpan == 0)
 				$colspan = ' colspan="1"';
 			elseif(!$this->rowLevel2)
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';		
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';
+
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $parentVar){
 					
@@ -338,7 +356,7 @@ class SurveyMultiCrosstabs {
 								echo $this->snippet($this->variablesList[$var['spr']]['naslov'], 25);
 								
 								// Gumb za brisanje
-								echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';
+								echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';
 								
 								echo '</td>';
 							}
@@ -355,15 +373,19 @@ class SurveyMultiCrosstabs {
 					}
 				}
 			}
+
 			echo '</tr>';
 			
+
 			if($this->rowSpan == 0)
 				$colspan = ' colspan="1"';
 			elseif(!$this->rowLevel2)
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';		
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';
+
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $parentVar){
 					
@@ -378,7 +400,7 @@ class SurveyMultiCrosstabs {
 									echo $this->snippet($suboption, 25);
 									
 									// Gumb za brisanje
-									echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';
+									echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';
 									
 									echo '</td>';
 								}
@@ -387,10 +409,12 @@ class SurveyMultiCrosstabs {
 					}
 				}
 			}
+
 			echo '</tr>';
 		}
 		// Imamo samo 1 nivo
 		else{
+
 			// Izrisemo VERTIKALNO izbrane spremenljivkec - 1. vrstica	
 			if($this->rowSpan == 0)
 				$colspan = ' colspan="1"';
@@ -398,7 +422,9 @@ class SurveyMultiCrosstabs {
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';			
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';
+
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $var){
 					
@@ -408,7 +434,7 @@ class SurveyMultiCrosstabs {
 					echo $this->snippet($this->variablesList[$var['spr']]['naslov'], 25);
 					
 					// Gumb za brisanje
-					echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';
+					echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';
 					
 					echo '</td>';
 				}
@@ -420,8 +446,10 @@ class SurveyMultiCrosstabs {
 
 			// Izrisemo se zadnjo prazno navpicno celico vrstico
 			echo '<td id="undefined" class="spr vertical droppable empty" rowspan="2">'.$lang['srv_multicrosstabs_add'].'</td>';
+
 			echo '</tr>';
 			
+
 			// Izrisemo VARIABLE za spremenljivko - 2. vrstica
 			if($this->rowSpan == 0)
 				$colspan = ' colspan="1"';
@@ -429,7 +457,9 @@ class SurveyMultiCrosstabs {
 				$colspan = ' colspan="2"';
 			else
 				$colspan = ' colspan="4"';	
+
 			echo '<tr><td class="borderless" '.$colspan.'></td>';	
+            
 			if(count($this->selectedVars['ver'])){
 				foreach($this->selectedVars['ver'] as $var){
 
@@ -452,6 +482,7 @@ class SurveyMultiCrosstabs {
 					}
 				}
 			}
+
 			echo '</tr>';
 		}
 
@@ -489,7 +520,7 @@ class SurveyMultiCrosstabs {
 										echo $this->snippet($this->variablesList[$parentVar['spr']]['naslov'], 25);
 										
 										// Gumb za brisanje
-										echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';				
+										echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';				
 										echo '</td>';
 									}
 									
@@ -510,7 +541,7 @@ class SurveyMultiCrosstabs {
 										echo $this->snippet($this->variablesList[$var['spr']]['naslov'], 25);
 										
 										// Gumb za brisanje
-										echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';				
+										echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';				
 										echo '</td>';
 									}
 									
@@ -538,7 +569,7 @@ class SurveyMultiCrosstabs {
 									
 									echo '<tr>';
 									
-									echo '<td class="var sums">'.$lang['srv_analiza_crosstab_skupaj'].'</td>';
+									echo '<td class="var sums horizontal">'.$lang['srv_analiza_crosstab_skupaj'].'</td>';
 									
 									$crosstabs = $this->crosstabData[$parentVar['spr'].'-'.$var['spr']];
 								
@@ -564,7 +595,7 @@ class SurveyMultiCrosstabs {
 								echo $this->snippet($this->variablesList[$parentVar['spr']]['naslov'], 25);
 								
 								// Gumb za brisanje
-								echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';				
+								echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';				
 								echo '</td>';
 							}
 								
@@ -602,7 +633,7 @@ class SurveyMultiCrosstabs {
 							echo $this->snippet($this->variablesList[$var['spr']]['naslov'], 25);
 							
 							// Gumb za brisanje
-							echo '<div class="delete_var" onclick="deleteVariable(this);"></div>';				
+							echo '<div class="delete_var" onclick="deleteVariable(this);"><span class="faicon remove"></span></div>';				
 							echo '</td>';
 						}
 						
@@ -625,7 +656,7 @@ class SurveyMultiCrosstabs {
 					// Vrstica za sumo (ce jo imamo vklopljeno)
 					if($this->table_settings[$this->table_id]['sums'] == 1 && count($this->selectedVars['ver']) > 0 && !$this->colLevel2){
 						echo '<tr>';
-						echo '<td class="var sums">'.$lang['srv_analiza_crosstab_skupaj'].'</td>';
+						echo '<td class="var sums horizontal">'.$lang['srv_analiza_crosstab_skupaj'].'</td>';
 						
 						// Loop cez vse stolpce
 						foreach($this->selectedVars['ver'] as $spr2){
@@ -686,24 +717,16 @@ class SurveyMultiCrosstabs {
 		
 		echo '</tr>';
 		
-		
 		echo '</table>';
 		
 		
-		
-		echo '<div class="mc_table_bottom_settings">';
-		
 		// Izrisemo legendo
+		echo '<div class="mc_table_bottom_settings">';
 		$this->displayLegend();
+		echo '</div>';
 
 
-		// Ce smo v custom reportu tega ne izpisemo
+        // JS
-		if($_GET['m'] != 'analysis_creport'){
-		
-			// Zvezdica za vkljucitev v porocilo	
-			SurveyAnalysisHelper::getInstance()->addCustomReportElement($type=10, $sub_type=0, $spr1=$this->table_id);
-		
-		
         echo '<script type="text/javascript">';
 			
         // Nastavimo droppable (drugace po ajaxu ne dela)
@@ -716,9 +739,6 @@ class SurveyMultiCrosstabs {
         echo '</script>';
 	}
 	
-		echo '</div>';
-	}
-	
 	// Izpis celic v vrstici s podatki
 	function displayDataCells($spr1, $var1, $spr2='', $var2=''){
 	
@@ -1111,7 +1131,7 @@ class SurveyMultiCrosstabs {
 			// Numerus
 			if($this->table_settings[$this->table_id]['numerus'] == 1){
 				echo '<tr><td class="bold white">';
-				echo $crosstabs['sumaSkupna'];
+				echo ($crosstabs['sumaSkupna'] != '') ? $crosstabs['sumaSkupna'] : '0';
 				echo '</td></tr>';
 			}
 			

admin/survey/script/multiCrosstabs.js

@@ -190,6 +190,12 @@ function use_mc_table() {
 		location.reload();
 	});
 }
+function switch_mc_table(value) {
+
+	$.post('ajax.php?t=multicrosstabs&a=use_mc_table', {anketa:srv_meta_anketa_id, value:value}, function(){	
+		location.reload();
+	});
+}
 
 // popravljamo ime tabele...
 function mc_table_action(action){

resources/sass/admin_new/basic/icons/standard.scss

@@ -152,6 +152,10 @@ span.faicon.filter::before{
         content: "\f0b0";
 }
 
+span.faicon.grip::before{
+    content: "\f58e";
+}
+
 span.faicon.star::before,
 span.faicon.star_off::before{
 		font-size: 14px;

resources/sass/admin_new/components/popup/page_specific/analysis_multicrosstabs.scss

@@ -0,0 +1,94 @@
+
+/*table settings popup*/
+.mc_table_settings {
+    @include popup_general();
+
+	display: none;
+	position: fixed;
+	top: 200px;
+	left: calc(50% - 200px);
+	z-index: 999;
+	width: 400px;
+
+	#mcSettingsButtons {
+		position: absolute;
+		bottom: 15px;
+		right: 10px;
+	}
+	#delez {
+		width: 300px;
+		margin: 5px 10px 0px 60px;
+	}
+	form {
+		padding: 10px;
+	}
+	fieldset {
+		margin: 0px 0px 10px 0px;
+		border: 0;
+		border-top: 1px solid $blue;
+	}
+	legend {
+		color: $blue;
+		font-size: 13px;
+		font-weight: 500;
+		margin: 0;
+		padding: 0 10px;
+	}
+}
+
+@mixin small_popup_multicross(){
+    @include popup_general();
+
+    display: none;
+    position: fixed;
+	left: calc(50% - 275px);
+	top: 40vh;
+	z-index: 999;
+
+	margin: 10px;
+	width: 550px;
+	
+}
+
+/*new table popup*/
+#newMCTable {
+	@include small_popup_multicross();
+}
+
+/*rename table popup*/
+#renameMCTable {
+	@include small_popup_multicross();
+}
+
+/*delete table popup*/
+#deleteMCTable {
+	@include small_popup_multicross();
+}
+
+
+/*tables list popup*/
+#div_mc_tables {
+	display: none;
+
+	width: 350px;
+	height: 280px;
+
+	#mc_tables_left {
+		margin-bottom: 10px;
+	}
+}
+#mc_tables {
+	cursor: pointer;
+	width: 99%;
+	height: 160px;
+	display: inline-block;
+	border: 1px solid gray;
+	.option {
+		padding: 1px;
+	}
+	.active {
+		background-color: $blue;
+		color: white;
+		border-bottom: 1px solid $gray;
+	}
+}

resources/sass/admin_new/components/popup/page_specific/page_specific.scss

@@ -6,6 +6,7 @@
 @import "consulting";
 @import "dodeljeni_uporabniki";
 
+@import "analysis_multicrosstabs";
 @import "custom_report";
 
 @import "survey_edit";

resources/sass/admin_new/pages/survey_analysis/page_multicrosstab.scss

@@ -1,98 +1,178 @@
+#anketa_edit.subpage_multicrosstabs{
+    display: flex;
+    flex-direction: column;
+
+    // settings links in top left corner
+    .mc_settings_links {
+        align-self: center;
+        display: flex;
+
+        position: relative;
+        width: auto;
+        margin-bottom: 32px;
+
+        .table_list{
+            display: flex;
+
+            .table_item{
+                cursor: pointer;
+
+                padding: 4px 32px;
+                margin-right: 16px;
+
+                line-height: 20px;
+                color: $dark-gray;
+
+                border-bottom: 1px $dark-gray solid;
+
+                transition: 0.2s;
+
+                &.active,
+                &:hover{
+                    color: $blue;
+
+                    border-bottom: 1px $blue solid;
+                }
+            }
+
+            border-right: 1px $gray solid;
+        }
+
+        .table_settings{
+            display: flex;
+            align-items: center;
+
+            .faicon{
+
+                &:before{
+                    cursor: pointer;
+                    
+                    margin-left: 16px;
+                    
+                    font-size: 16px;
+                    color: $blue;
+
+                    transition: 0.2s;
+                }
+
+                &:hover{
+                    &:before{
+                        color: $dark-blue;
+                    }
+                }
+            }
+        }
+    }
+
 
     #mc_holder {
-	overflow: hidden;
+        display: flex;
-	margin-top: 20px;
+        flex-direction: column;
-	min-height: 500px;
+        
-	.mc_table_bottom_settings {
+        // drag list of questions
-		clear: none;
-		float: right;
-		border-collapse: collapse;
-		margin: 0 2% 15px 0;
-		width: 72%;
-	}
-	.custom_report_include {
-		clear: none;
-		float: left;
-		border-collapse: collapse;
-		margin: 0 2% 15px 0;
-	}
-}
-/*drag list of questions*/
         #spr_list {
-	float: left;
+            box-sizing: border-box;
-	overflow: auto;
+            margin-bottom: 50px;
-	position: fixed;
+            padding: 4px;
-	width: 20%;
+
-	max-height: 450px;
+            border: 1px solid $gray;
-	margin: 15px 0 15px 1%;
+            
-	background-color: white;
-	border: 1px solid silver;
-	border-radius: 7px;
-	-moz-border-radius: 7px 7px 7px 7px;
-	-webkit-border-radius: 7px;
             ul {
+                display: flex;
+                flex-wrap: wrap;
+
                 padding: 0;
-		padding: 5px 0;
+                margin: 0;
-		z-index: 1;
+
-	}
+                li.mc_draggable{
-}
+                    cursor: pointer;
-.mc_draggable {
+
-	width: 180px;
+                    box-sizing: border-box;
-	margin: 10px 15px;
+                    width: 210px;
+                    margin: 4px;
                     padding: 8px;
+
                     list-style: none;
-	border: 1px $gray dashed;
+                    
+                    background-color: $light-gray;
+
                     &:hover {
                         background-color: $gray;  
-		cursor: pointer;
+                    }
+
+                    .strong{
+                        font-weight: 600;
+
+                        .faicon:before{
+                            margin-right: 8px;
+
+                            color: $dark-gray;
+                            font-size: 14px;
                         }
                     }
-/*title of table*/
+                }
+            }   
+        }
+
+        // title of table
         .mc_table_title {
-	float: right;
+            display: none;
-	table-layout: fixed;
+            
             width: 70%;
             min-height: 15px;
-	margin: 15px 2% 15px 0;
+
-	padding: 5px 1%;
             font-size: 16px;
             font-weight: bold;
-	border-collapse: collapse;
+
+            &.mc_table_title.writing {
+                background-color: $gray;
+                outline: 1px dashed $gray;
+            }
+
             &:hover {
                 cursor: text;
                 background-color: $gray;
             }
+
             .multicrosstab_title_inline:focus {
                 outline: none;
             }
         }
-.mc_table_title.writing {
+        
-	background-color: $gray;
+
-	outline: 1px dashed $gray;
+        // multicrosstab table
-}
-/*multicrosstab table*/
         .mc_table {
-	float: right;
             table-layout: fixed;
-	width: 72%;
+            width: 100%;
-	margin: 15px 2% 15px 0;
+
-	border-collapse: collapse;
             tr {
                 height: 40px;
+
                 td {
-			border: 1px $gray solid;
                     text-align: center;
+                    font-size: 14px;
+
+                    padding: 8px;
+
+                    border: 1px $gray solid;
+
                     table.mc_inner_cell {
                         width: 100%;
                         height: 100%;
                         border-collapse: collapse;
+
+                        margin: 0;
+                        padding: 0;
+
                         tr {
                             width: 100%;
                             height: auto;
+
                             td {
+                                width: 100%;
+
                                 border: 0;
                                 border-top: 1px dashed $gray;
-						width: 100%;
                             }
                             &:first-child {
                                 td {
@@ -101,32 +181,56 @@
                             }
                         }
                     }
+
                     .delete_var {
                         display: none;
                         position: absolute;
+                        margin: -30px -8px;
+
                         width: 16px;
                         height: 16px;
-				margin: -25px 0 0 0;
+
-				background-image: url("../../../admin/survey/img_0/cross.png");
+                        .faicon:before{
+                            color: $blue;
+                            font-size: 14px;
                         }
                     }
+                }
+
                 td.borderless {
-			border: 0;
+                    background-color: $light-gray;
                 }
+
                 td.spr {
+                    //position: relative;
                     cursor: pointer;
-			font-weight: bold;
+
-			background-color: $gray;
+                    padding: 16px;
+
+                    font-weight: 600;
+                    font-size: 16px;
+
+                    background-color: $light-gray;
                 }
+
                 td.var {                    
-			background-color: $gray;
+                    background-color: $light-gray2;
+
+                    &.horizontal{
+                        background-color: $white;
                     }
+                }
+
                 td.sums {
-			color: $yellow;
+                    font-weight: 600;
                 }
+
                 td.data {
-			background-color: #F9F9F7;
+                    padding: 0;
+
+                    background-color: $white;
                 }
+
                 td.crossCheck_EC {
                     background-color: #FFFAE8;
                 }
@@ -169,143 +273,52 @@
                 td.blue {
                     background-color: #E8F1FF;
                 }
-		td.drophover {
+
-			background-color: $yellow !important;
+                
-		}
                 td.empty {
-			border: 1px dashed $gray;
+                    background-color: $light-gray;
-			font-weight: normal;
                 }
+
                 td.empty.droppable {
-			color: $yellow;
                     border: 1px dashed $yellow;
-			background-color: $yellow;
+                    background-color: rgba(255, 199, 0, 0.05);
                 }
-	}
-}
-/*settings links in top left corner*/
-.mc_settings_links {
-	float: none;
-	display: inline-block;
-	position: relative;
-	width: auto;
-	left: 200px;
-	padding: 3px 5px;
-	margin: 0 40px 0 0;
-	background-color: $gray;
-	border: 1px solid silver;
-	border-radius: 3px;
-	-moz-border-radius: 4px 4px 4px 4px;
-	-webkit-border-radius: 4px;
-	ul {
-		margin: 0 !important;
-		padding: 0;
-		li {
-			display: inline-block;
-			list-style: none outside none;
-			margin: 0 !important;
-			padding: 2px 1px;
-                        vertical-align: middle;
-			>span {
-                                vertical-align: middle;
-				cursor: pointer;
-			}
-		}
-		li.space {
-			background: url("../../../admin/survey/img_0/navigation/nav-control-bg.png") no-repeat scroll center top transparent;
-			line-height: 17px;
-			padding: 0 5px;
-			width: 7px;
-		}
-	}
-}
-/*table settings popup*/
-.mc_table_settings {
-    @include popup_general();
 
-	display: none;
+                td.drophover {
-	position: fixed;
+                    background-color: rgba(255, 199, 0, 0.2) !important;
-	top: 200px;
+                }
-	left: calc(50% - 200px);
+            }
-	z-index: 999;
+        }
-	width: 400px;
 
-	#mcSettingsButtons {
+        .mc_table_top_settings {
-		position: absolute;
+            display: flex;
-		bottom: 15px;
+            justify-content: end;
-		right: 10px;
-	}
-	#delez {
-		width: 300px;
-		margin: 5px 10px 0px 60px;
-	}
-	form {
-		padding: 10px;
-	}
-	fieldset {
-		margin: 0px 0px 10px 0px;
-		border: 0;
-		border-top: 1px solid $blue;
-	}
-	legend {
-		color: $blue;
-		font-size: 13px;
-		font-weight: 500;
-		margin: 0;
-		padding: 0 10px;
-	}
-}
-/*tables list popup*/
-#div_mc_tables {
-	display: none;
 
-	width: 350px;
+            margin-bottom: 8px;
-	height: 280px;
 
-	#mc_tables_left {
+            .custom_report_include {
-		margin-bottom: 10px;
+                a{
+                    text-decoration: none;
                 }
             }
-#mc_tables {
-	cursor: pointer;
-	width: 99%;
-	height: 160px;
-	display: inline-block;
-	border: 1px solid gray;
-	.option {
-		padding: 1px;
         }
-	.active {
-		background-color: $blue;
-		color: white;
-		border-bottom: 1px solid $gray;
-	}
-}
-@mixin small_popup_multicross(){
-    @include popup_general();
 
-    display: none;
+        .mc_table_bottom_settings {
-    position: fixed;
+
-	left: calc(50% - 275px);
+            .mc_table_legend {
-	top: 40vh;
+                border-collapse: collapse;
-	z-index: 999;
+                line-height: 18px;
+                border: 1px solid $gray;
+                background-color: #F9F9F7;
+            }
+        }
+    }
+}
+
+
+
 
-	margin: 10px;
-	width: 550px;
 
-}
-/*new table popup*/
-#newMCTable {
-	@include small_popup_multicross();
-}
-/*rename table popup*/
-#renameMCTable {
-	@include small_popup_multicross();
-}
-/*delete table popup*/
-#deleteMCTable {
-	@include small_popup_multicross();
-}
 .report_element_data {
 	table.mc_table {
 		float: left;
@@ -328,12 +341,5 @@
 		}
 	}
 }
-.mc_table_legend {
+
-	clear: none;
+
-	float: right;
-	border-collapse: collapse;
-	padding: 5px 10px;
-	line-height: 18px;
-	border: 1px solid $gray;
-	background-color: #F9F9F7;
-}