Code indentation affecting the position of items in a table

Templates Reports
, ,
1

Hi there

I have run into the following issue:

I have been trying to use proper indentation to make my code more readable, however doing so causes my table and the elements in my table to become misaligned.

I would like my code to look like the below example for an unreconciled indicator:

<td class="usr-align-right">
   {% if interest_expenses_accounts_value-total_expenses_amount != 0 %}
      {% unreconciled interest_expenses_accounts_value-total_expenses_amount as:indicator unreconciled_text:unreconciled_text%}
   {% endif %}
</td>

But if I save my code like this, the resulting table looks as follows with the unreconciled indicator being misaligned:

image
image923×188 5.55 KB

On the other hand, if I change my code to look like the below snippet, the unreconciled indicator is in line with the text like it should be:

<td class="usr-align-right">
   {% if interest_expenses_accounts_value-total_expenses_amount != 0 %}{% unreconciled interest_expenses_accounts_value-total_expenses_amount as:indicator unreconciled_text:unreconciled_text%}{% endif %}
</td>

Result:

image
image925×146 5.34 KB

I have also noticed that the code indentation has an effect on the height of the rows:

Writing my code for each cell all in one line like below, results in the ideal row height, however my code is not very readable in this case.

<tr>
   <td>&nbsp;</td>
   <td><b>Total interest expense</b></td>
   <td>&nbsp;</td>
   <td class="usr-align-right">{% if interest_expenses_accounts_value-total_expenses_amount != 0 %}{% unreconciled interest_expenses_accounts_value-total_expenses_amount as:indicator unreconciled_text:unreconciled_text%}{% endif %}</td>
   <td>&nbsp;</td>
   <td class="usr-align-right"><b>{{ total_expenses_amount+interest_finance_leases | integer }}</b></td>
...
</tr>

Result:

image
image928×121 5.2 KB

Is this perhaps something that will be fixed in the near future? Or would you recommend that I stick to writing my code in one line to keep the formatting correct?

Thank you in advance!

2

Hi @NicoleP ,

Thank you for sharing this.

We highly support that you are trying to structure your code this way to keep the code readable and maintainable. This is definitely a good practice :+1: .

However, in our HTML table functionality it’s currently not possible to add new lines in your code without creating a new line in your template. We have this on our list of improvements, but as a workaround you could try to add the {% stripnewlines %} tag around your table.

More information on the use of the tag can be found here: Styling and CASE: make your code readable with stripnewlines and newline (note that the newline tag is deprecated for HTML table purposes).

Hope this helps! If not, do not hesitate to reach out.

Kind regards,
Robin

3

Hi Robin

Thank you very much! Adding the {% stripnewlines %} tag worked perfectly.