diff --git a/src/main/resources/static/css/accounts.css b/src/main/resources/static/css/accounts.css index 4b04405b3423c8603c008285aa711b16bab47563..6c7d94952f9e5b8813493f4ce15bfe8840c88b43 100644 --- a/src/main/resources/static/css/accounts.css +++ b/src/main/resources/static/css/accounts.css @@ -6,11 +6,13 @@ .account-icon-big { height: 4rem !important; width: 4rem !important; + min-width: 4rem; } .account-icon-big .account-select-icon { height: 4rem !important; width: 4rem !important; + min-width: 4rem; } .account-square-border { diff --git a/src/main/resources/static/css/style.css b/src/main/resources/static/css/style.css index d0e2a4962cfe71361a381811a964760785233455..11ee274ef3b40edaa8249d4e874f5c2d3863ed0a 100644 --- a/src/main/resources/static/css/style.css +++ b/src/main/resources/static/css/style.css @@ -336,10 +336,25 @@ input[type="radio"]:checked + span::after, [type="radio"].with-gap:checked + spa font-size: 1.1rem; } +.global-account-select-name { + max-width: 200px; +} + .global-account-select-budget { font-size: 1.8rem; } +.global-account-select-option { + display: flex; + flex-direction: row; + align-items: center; +} + +.global-account-select-option-name { + font-size: 1.4rem; + margin-left: 2rem; +} + .login-button { text-transform: none; } diff --git a/src/main/resources/templates/helpers/navbar.ftl b/src/main/resources/templates/helpers/navbar.ftl index 50b4d02c1db5a316efca730e0283b0d165c8dcf6..87d700e53fbbd496872febf410605669336ecc3b 100644 --- a/src/main/resources/templates/helpers/navbar.ftl +++ b/src/main/resources/templates/helpers/navbar.ftl @@ -100,7 +100,7 @@ <@customSelectMacros.accountIcon selectedAccount accountName "category-circle-preview account-icon-big"/> <div class="global-account-select-right"> - <div>${accountName}</div> + <div class="truncate global-account-select-name">${accountName}</div> <div> <#assign accountBudget = helpers.getAccountBudget()/>