diff --git a/src/main/resources/static/css/dark/templates.css b/src/main/resources/static/css/dark/templates.css index 4f56a863e34b42c78020d34321ff815ab2b33193..9e2b1904902c700b06a7d91bb83bf76dfb4f4101 100644 --- a/src/main/resources/static/css/dark/templates.css +++ b/src/main/resources/static/css/dark/templates.css @@ -2,6 +2,10 @@ font-weight: 600; } +.template-header-name { + max-width: 60%; +} + .collapsible-header-button { position: absolute; right: 15px; diff --git a/src/main/resources/static/css/templates.css b/src/main/resources/static/css/templates.css index 4f56a863e34b42c78020d34321ff815ab2b33193..2a9b1342932341fef8bd25f5b1e262d2e2edf3c5 100644 --- a/src/main/resources/static/css/templates.css +++ b/src/main/resources/static/css/templates.css @@ -2,9 +2,14 @@ font-weight: 600; } +.template-header-name { + max-width: 60%; +} + .collapsible-header-button { position: absolute; right: 15px; top: 8px; font-weight: bold; -} \ No newline at end of file +} + diff --git a/src/main/resources/templates/templates/selectTemplate.ftl b/src/main/resources/templates/templates/selectTemplate.ftl index 7b14cc19df938ec1e1d9d98134fb5752b809d463..d5dfc3b4d2c859d864abbb7b04039a3da26149dd 100644 --- a/src/main/resources/templates/templates/selectTemplate.ftl +++ b/src/main/resources/templates/templates/selectTemplate.ftl @@ -28,7 +28,7 @@ <div class="headline center-align">${locale.getString("placeholder")}</div> </div> <#else> - <@templateFunctions.listTemplates templates/> + <@templateFunctions.listTemplates templates false/> </#if> </div> </main> diff --git a/src/main/resources/templates/templates/templateFunctions.ftl b/src/main/resources/templates/templates/templateFunctions.ftl index 6eaabb2c116e40c7e598b259a7d98f4c8e09b54e..aafd6cb0bd511122237f0bce9332ea42c8fc7367 100644 --- a/src/main/resources/templates/templates/templateFunctions.ftl +++ b/src/main/resources/templates/templates/templateFunctions.ftl @@ -13,7 +13,7 @@ </div> </#macro> -<#macro listTemplates templates> +<#macro listTemplates templates isEditable> <div class="container"> <div class="row"> <div class="col s12"> @@ -22,6 +22,14 @@ <li> <div class="collapsible-header bold"> <@templateHeader template/> + <div class="collapsible-header-button"> + <#if isEditable> + <a href="<@s.url '/templates/${template.ID?c}/edit'/>" class="btn-flat no-padding text-color"><i class="material-icons left">edit</i></a> + <a href="<@s.url '/templates/${template.ID?c}/requestDelete'/>" class="btn-flat no-padding text-color"><i class="material-icons left">delete</i></a> + <#else> + <a href="<@s.url '/templates/${template.ID?c}/select'/>" class="waves-effect waves-light btn budgetmaster-blue"><i class="material-icons left">note_add</i>${locale.getString("title.transaction.new", locale.getString("title.transaction.new.normal"))}</a> + </#if> + </div> </div> <div class="collapsible-body"> <div class="row no-margin-bottom"> @@ -50,10 +58,7 @@ <#else> <i class="material-icons">payment</i> </#if> - ${template.getTemplateName()} - <div class="collapsible-header-button"> - <a href="<@s.url '/templates/${template.ID?c}/select'/>" class="waves-effect waves-light btn budgetmaster-blue"><i class="material-icons left">note_add</i>${locale.getString("title.transaction.new", locale.getString("title.transaction.new.normal"))}</a> - </div> + <div class="truncate template-header-name">${template.getTemplateName()}</div> </#macro> <#macro templateName template> diff --git a/src/main/resources/templates/templates/templates.ftl b/src/main/resources/templates/templates/templates.ftl index b26185673b6274b3c6f9ccc2fbb59c49e3076870..5dd39950459095e74c3654bd9d492ced311f3646 100644 --- a/src/main/resources/templates/templates/templates.ftl +++ b/src/main/resources/templates/templates/templates.ftl @@ -2,6 +2,8 @@ <head> <#import "../helpers/header.ftl" as header> <@header.header "BudgetMaster"/> + <@header.style "collapsible"/> + <@header.style "templates"/> <#import "/spring.ftl" as s> </head> <body class="budgetmaster-blue-light"> @@ -9,6 +11,7 @@ <@navbar.navbar "templates" settings/> <#import "templateFunctions.ftl" as templateFunctions> + <#import "../categories/categoriesFunctions.ftl" as categoriesFunctions> <main> <div class="card main-card background-color"> @@ -20,29 +23,13 @@ <br> <@templateFunctions.buttons/> <br> - <div class="container"> - <#if templates?size == 0> + <#if templates?size == 0> + <div class="container"> <div class="headline center-align">${locale.getString("placeholder")}</div> - <#else> - <table class="bordered"> - <thead> - <tr> - <th>${locale.getString("chart.new.label.name")}</th> - <th>${locale.getString("chart.actions")}</th> - </tr> - </thead> - <#list templates as template> - <tr> - <td>${template.getTemplateName()}</td> - <td> - <a href="<@s.url '/templates/${template.ID?c}/edit'/>" class="btn-flat no-padding text-color"><i class="material-icons left">edit</i></a> - <a href="<@s.url '/templates/${template.ID?c}/requestDelete'/>" class="btn-flat no-padding text-color"><i class="material-icons left">delete</i></a> - </td> - </tr> - </#list> - </table> - </#if> - </div> + </div> + <#else> + <@templateFunctions.listTemplates templates true/> + </#if> </div> <#if currentTemplate??> @@ -53,7 +40,7 @@ <p>${locale.getString("info.text.template.delete", currentTemplate.getName())}</p> </div> <div class="modal-footer background-color"> - <a href="<@s.url '/templates/manage'/>" class="modal-action modal-close waves-effect waves-light red btn-flat white-text">${locale.getString("cancel")}</a> + <a href="<@s.url '/templates'/>" class="modal-action modal-close waves-effect waves-light red btn-flat white-text">${locale.getString("cancel")}</a> <a href="<@s.url '/templates/${currentTemplate.getID()?c}/delete'/>" class="modal-action modal-close waves-effect waves-light green btn-flat white-text">${locale.getString("info.title.template.delete")}</a> </div> </div>