diff --git a/src/main/resources/static/css/navbar.css b/src/main/resources/static/css/navbar.css index e0701953284a9fb1ce66a4776f508cafd25b859d..acd7c9a07f9e77236d2f14568e642ed6c846310d 100644 --- a/src/main/resources/static/css/navbar.css +++ b/src/main/resources/static/css/navbar.css @@ -48,7 +48,7 @@ ul.sidenav.sidenav-fixed > li:last-child { [data-theme="dark"] .sidenav, [data-theme="dark"] .sidenav-sub, [data-theme="dark"] .searchWrapper { - background-color: #444444; + background-color: var(--color-background); box-shadow: none; } diff --git a/src/main/resources/static/css/style.css b/src/main/resources/static/css/style.css index 11ee274ef3b40edaa8249d4e874f5c2d3863ed0a..de12240946b26557979845ff439db2cf41ff16a0 100644 --- a/src/main/resources/static/css/style.css +++ b/src/main/resources/static/css/style.css @@ -348,6 +348,12 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa display: flex; flex-direction: row; align-items: center; + background-color: var(--color-background); + border: 3px solid transparent; +} + +.global-account-select-option:hover { + border: 3px solid var(--color-grey); } .global-account-select-option-name { @@ -642,7 +648,11 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa } [data-theme="dark"] .background-color { - background-color: #444444 !important; + background-color: var(--color-background) !important; +} + +[data-theme="dark"] .background-color-light { + background-color: var(--color-background-light) !important; } [data-theme="dark"] .modal-footer .btn-flat { diff --git a/src/main/resources/templates/globalAccountSelectModal.ftl b/src/main/resources/templates/globalAccountSelectModal.ftl index 71189ce47491824c3b5483c42fc20615c6219656..d69df3d64bf0efc8be1e4bde14efd8a6979b49bb 100644 --- a/src/main/resources/templates/globalAccountSelectModal.ftl +++ b/src/main/resources/templates/globalAccountSelectModal.ftl @@ -1,12 +1,14 @@ <#global locale = static["de.thecodelabs.utils.util.Localization"]> <#import "/spring.ftl" as s> <#import "helpers/header.ftl" as header> +<#import "helpers/customSelectMacros.ftl" as customSelectMacros> -<div id="modalGlobalAccountSelect" class="modal modal-fixed-footer background-color"> + +<div id="modalGlobalAccountSelect" class="modal modal-fixed-footer background-color-light"> <div class="modal-content"> - <div class="row"> + <div class="row no-margin-bottom"> <div class="col s12"> - <h3>${locale.getString("account.select")}</h3> + <h4>${locale.getString("account.select")}</h4> </div> </div> @@ -17,14 +19,25 @@ </div> <div class="row"> - <div class="col s12"> - <#list accounts as account> - ${account.getName()}<br> - </#list> - </div> + <#list accounts as account> + <#if account.getType().name() == "ALL"> + <#assign accountName=locale.getString("account.all")/> + <#else> + <#assign accountName=account.getName()/> + </#if> + + <div class="col s12 m6 xl6"> + <a href="<@s.url '/accounts/${account.getID()?c}/select'/>" class="text-default"> + <div class="card-panel global-account-select-option"> + <@customSelectMacros.accountIcon account accountName "category-circle-preview account-icon-big"/> + <div class="global-account-select-option-name truncate">${accountName}</div> + </div> + </a> + </div> + </#list> </div> </div> - <div class="modal-footer background-color"> + <div class="modal-footer background-color-light"> <@header.buttonLink url='' icon='cancel' localizationKey='cancel' color='red' id='buttonCloseGlobalAccountSelect' classes='modal-action modal-close text-white' isDataUrl=false noUrl=true/> </div> </div>