From c492ba72456a2b7a96b44acce8668b246757d821 Mon Sep 17 00:00:00 2001
From: Ivan Nieto <inietov@gmail.com>
Date: Wed, 1 Apr 2020 06:24:05 -0600
Subject: [PATCH] Adding changes to 'upload-table' for being painted in CSS
 (#7934)

---
 resources/views/importer/import.blade.php | 68 ++++++++++++++---------
 1 file changed, 42 insertions(+), 26 deletions(-)

diff --git a/resources/views/importer/import.blade.php b/resources/views/importer/import.blade.php
index 6212726e8e..b140f9204c 100644
--- a/resources/views/importer/import.blade.php
+++ b/resources/views/importer/import.blade.php
@@ -16,6 +16,21 @@
         [v-cloak] {
             display:none;
         }
+
+        /* Rules for the div table */
+        .tbl_head {
+            font-weight: bold
+        }
+        .div_tbl {
+            display: table
+        }
+        .div_tbl_row {
+            display: table-row
+        }
+        .div_tbl_cell {
+            display: table-cell;
+            padding: 2px
+        }
     </style>
 
 <div id="app">
@@ -52,33 +67,34 @@
                         </div>
                         <div class="row">
                             <div class="col-md-12" style="padding-top: 30px;">
-                                <table class="table table-striped" id="upload-table">
-                                    <thead>
-                                        <th>File</th>
-                                        <th>Created</th>
-                                        <th>Size</th>
-                                        <th></th>
-                                    </thead>
-                                    <tbody>
-                                    	<template v-for="currentFile in files">
-                                    		<tr>
-                                    			<td>@{{ currentFile.file_path }}</td>
-                                    			<td>@{{ currentFile.created_at }} </td>
-                                    			<td>@{{ currentFile.filesize }}</td>
-                                    			<td>
-                                    			<button class="btn btn-sm btn-info" @click="toggleEvent(currentFile.id)">Process</button>
+                                <div class="table table-striped" id="upload-table">
+                                    <div class="div_tbl_row">
+                                        <div class="tbl_head">File</div>
+                                        <div class="tbl_head">Created</div>
+                                        <div class="tbl_head">Size</div>
+                                        <div class="tbl_head"></div>
+                                    </div>
+
+                                    <template v-for="currentFile in files">
+                                    		<div class="div_tbl_row">
+                                    			<div class="div_tbl_cell">@{{ currentFile.file_path }}</div>
+                                    			<div class="div_tbl_cell">@{{ currentFile.created_at }} </div>
+                                    			<div class="div_tbl_cell">@{{ currentFile.filesize }}</div>
+
+                                                <div class="div_tbl_cell">
+                                    			    <button class="btn btn-sm btn-info" @click="toggleEvent(currentFile.id)">Process</button>
                                                     <button class="btn btn-sm btn-danger" @click="deleteFile(currentFile)"><i class="fa fa-trash icon-white"></i></button>
-                                    			</td>
-                                    		</tr>
-                                    			<import-file
-                                                    :key="currentFile.id"
-                                                    :file="currentFile"
-                                                    :custom-fields="customFields"
-                                                    @alert="updateAlert(alert)">
-                                    			</import-file>
-                                    	</template>
-                                    </tbody>
-                                </table>
+                                    			</div>
+                                    		</div>
+
+                                            <import-file
+                                                :key="currentFile.id"
+                                                :file="currentFile"
+                                                :custom-fields="customFields"
+                                                @alert="updateAlert(alert)">
+                                            </import-file>
+                                    </template>
+                                </div>
                             </div>
                         </div>
                     </div>