1
0

Fix header layout for long list titles

This commit is contained in:
kolaente
2021-06-23 22:08:20 +02:00
parent f58a48bc1f
commit 543df91aba
6 changed files with 34 additions and 14 deletions

View File

@ -24,9 +24,17 @@
align-items: center;
justify-content: center;
$edit-icon-width: 1rem;
@media screen and (min-width: $tablet) {
// We need a fixed width for overflowing ellipsis to work
--nav-username-width: 0;
width: calc(100vw - #{$user-dropdown-width-mobile} - #{2 * $hamburger-menu-icon-spacing} - #{$hamburger-menu-icon-width} - #{$edit-icon-width} - #{2 * $navbar-icon-width} - #{$vikunja-nav-logo-full-width} - var(--nav-username-width));
}
@media screen and (max-width: $tablet) {
// We need a fixed width for overflowing ellipsis to work
width: calc(100vw - #{$user-dropdown-width-mobile} - #{2 * $hamburger-menu-icon-spacing} - #{$hamburger-menu-icon-width} - 1rem); // -1rem for the edit icon
width: calc(100vw - #{$user-dropdown-width-mobile} - #{2 * $hamburger-menu-icon-spacing} - #{$hamburger-menu-icon-width} - #{$edit-icon-width} - #{2 * $navbar-icon-width});
}
h1 {

View File

@ -1,5 +1,5 @@
.notifications {
width: 50px;
width: $navbar-icon-width;
.unread-indicator {
position: absolute;