#765 - show description for each account

BudgetMasterServer/src/main/resources/static/css/style.css

@@ -605,6 +605,11 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa
     background-color: var(--color-blue);
 }
 
+/* overridden by media queries*/
+.account-description {
+    max-width: 12ch;
+}
+
 .invisible {
     opacity: 0;
 }
@@ -631,6 +636,10 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa
     .fixed-action-btn {
         right: 53px;
     }
+
+    .account-description {
+        max-width: 40ch;
+    }
 }
 
 /* medium screens */
@@ -651,6 +660,10 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa
     .template-header-name {
         max-width: 40% !important;
     }
+
+    .account-description {
+        max-width: 20ch;
+    }
 }
 
 /* small screens */
@@ -688,6 +701,10 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa
     .hint-clear i {
         font-size: 4vmin;
     }
+
+    .account-description {
+        max-width: 12ch;
+    }
 }
 
 /* dark theme */

BudgetMasterServer/src/main/resources/templates/accounts/accounts.ftl

@@ -42,6 +42,11 @@
                                     </td>
                                     <td><@customSelectMacros.accountIcon account account.getName() "text-blue"/></td>
                                     <td>${account.getName()}</td>
+                                    <td>
+                                        <div class="truncate account-description">
+                                            ${account.getDescription()}
+                                        </div>
+                                    </td>
                                     <td>
                                         <a href="<@s.url '/accounts/${account.getID()?c}/edit'/>" class="btn-flat no-padding text-default"><i class="material-icons left">edit</i></a>
                                         <@header.buttonFlat url='/accounts/' + account.ID?c + '/requestDelete' icon='delete' localizationKey='' classes="no-padding text-default button-request-delete-account" isDataUrl=true/>