Skip to content
Snippets Groups Projects
Commit 6011e56a authored by Robert Goldmann's avatar Robert Goldmann
Browse files

#770 - fix misaligned styling of datatable in csv import

parent 39998ba0
No related branches found
No related tags found
No related merge requests found
......@@ -24,6 +24,10 @@
opacity: 0.5;
}
#table-transaction-rows tr {
border-bottom: none !important;
}
#table-transaction-rows td {
padding: 5px;
}
......@@ -33,10 +37,10 @@
margin: auto;
}
#table-transaction-rows_filter input {
height: 1rem;
border: none;
border-radius: 0;
.dt-search input[type=search] {
height: 1rem !important;
border: none !important;
border-radius: 0 !important;
}
/* override custom select styling*/
......@@ -57,30 +61,30 @@
}
/* label focus color */
#table-transaction-rows_filter input[type=search]:focus + label {
.dt-search input[type=search]:focus + label {
color: var(--color-blue) !important;
}
/* label underline focus color */
#table-transaction-rows_filter input[type=search]:focus:not(.invalid) {
.dt-search input[type=search]:focus:not(.invalid) {
border-bottom: 1px solid var(--color-blue) !important;
box-shadow: 0 1px 0 0 #CCCCCC !important;
}
/* input text color */
[data-theme="dark"] #table-transaction-rows_filter input[type=search] {
color: var(--color-white);
border-bottom: 1px solid var(--color-white);
box-shadow: 0 1px 0 0 #CCCCCC;
[data-theme="dark"] .dt-search input[type=search] {
color: var(--color-white) !important;
border-bottom: 1px solid var(--color-white) !important;
box-shadow: 0 1px 0 0 #CCCCCC !important;
}
/* input label color */
[data-theme="dark"] #table-transaction-rows_filter input[type=search] + label {
[data-theme="dark"] .dt-search input[type=search] + label {
color: var(--color-white) !important;
}
/* label underline focus color */
[data-theme="dark"] #table-transaction-rows_filter input[type=search]:focus:not(.invalid) {
[data-theme="dark"] .dt-search input[type=search]:focus:not(.invalid) {
border-bottom: 1px solid var(--color-blue) !important;
box-shadow: 0 1px 0 0 var(--color-blue) !important;
}
\ No newline at end of file
......@@ -7,14 +7,23 @@ $(document).ready(function()
$('.collapsible').collapsible();
DataTable.type('date', 'className', 'dt-center');
$('#table-transaction-rows').DataTable({
paging: false,
order: [[2, 'desc']],
order: [[1, 'desc']],
info: false,
scrollX: true,
scrollY: false,
columnDefs: [
{ orderable: false, targets: 6}
{
className: "dt-head-center",
targets: [0, 1, 3, 4, 6]
},
{
// amount column
orderable: false,
targets: 5
}
],
language: {search: '', searchPlaceholder: localizedSearch},
});
......@@ -24,7 +33,10 @@ $(document).ready(function()
let nameElements = document.querySelectorAll('.autocomplete');
let autoCompleteInstances = M.Autocomplete.init(nameElements, {
data: transactionNameSuggestions,
sortFunction: function(a,b, inputString) {return false;}
sortFunction: function(a, b, inputString)
{
return false;
}
});
// prevent tab traversal for dropdown (otherwise "tab" needs to be hit twice to jump from name input to amount input)
......
......@@ -167,10 +167,9 @@
<#macro renderCsvTransactions>
<div id="transaction-import-list">
<table class="bordered centered" id="table-transaction-rows" style="width:100%">
<table class="centered" id="table-transaction-rows" style="width:100%">
<thead>
<tr>
<td class="hidden"></td>
<td class="bold">${locale.getString("transactions.import.status")}</td>
<td class="bold">${locale.getString("transaction.new.label.date")}</td>
<td class="bold">${locale.getString("transaction.new.label.category")}</td>
......@@ -187,6 +186,14 @@
</#list>
</tbody>
</table>
<div class="hidden">
<#list csvTransactions as csvTransaction>
<form name="NewTransactionInPlace" id="newTransactionInPlace_${csvTransaction?index}" method="POST" action="<@s.url '/transactionImport/' + csvTransaction?index + '/newTransactionInPlace'/>" data-index="${csvTransaction?index}">
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
</#list>
</div>
</div>
<@newTransactionMacros.insertNameSuggestions/>
......@@ -194,11 +201,6 @@
<#macro renderCsvTransaction csvTransaction index>
<tr class="transaction-import-row <#if csvTransaction.getStatus().name() == 'SKIPPED'>transaction-import-row-skipped</#if>" id="transaction-import-row-${index}">
<td class="hidden">
<form name="NewTransactionInPlace" id="newTransactionInPlace_${index}" method="POST" action="<@s.url '/transactionImport/' + index + '/newTransactionInPlace'/>" data-index="${index}">
<input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
</form>
</td>
<td data-order="${locale.getString(csvTransaction.getStatus().getLocalizationKey())}" data-search="${locale.getString(csvTransaction.getStatus().getLocalizationKey())}"><@statusBanner csvTransaction.getStatus()/></td>
<td data-order="${csvTransaction.getDate()}" data-search="${csvTransaction.getDate()}">${csvTransaction.getDate()}</td>
<td data-order="${csvTransaction.getCategory().getName()}" data-search="${csvTransaction.getCategory().getName()}">
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment