Skip to content

Commit

Permalink
Regression: Fix Unread bar design (#17750)
Browse files Browse the repository at this point in the history
Co-authored-by: Guilherme Gazzo <guilhermegazzo@gmail.com>
  • Loading branch information
dudizilla and ggazzo authored May 27, 2020
1 parent 499f245 commit 0d2723f
Show file tree
Hide file tree
Showing 3 changed files with 28 additions and 9 deletions.
2 changes: 1 addition & 1 deletion app/theme/client/imports/components/sidebar/rooms-list.css
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@

&__toolbar-search {
position: absolute;
z-index: 1;
z-index: 10;

left: 10px;

Expand Down
29 changes: 24 additions & 5 deletions app/theme/client/imports/components/sidebar/sidebar.css
Original file line number Diff line number Diff line change
Expand Up @@ -69,16 +69,35 @@

& .unread-rooms {
position: absolute;
top: 0;
right: 0;
left: 0;
left: 50%;

width: 100%;
padding: calc(var(--sidebar-small-default-padding) - 8px);
overflow: hidden;

min-width: 120px;
max-width: 100%;

padding: 8px var(--sidebar-small-default-padding);

-webkit-transform: translateX(-50%);
transform: translateX(-50%);

animation: fade 0.3s;

text-align: center;

white-space: nowrap;

text-overflow: ellipsis;

border-radius: 25px;

&.bottom-unread-rooms {
bottom: 0;
}

&.top-unread-rooms {
top: 0;
}
}
}
}
Expand Down
6 changes: 3 additions & 3 deletions app/ui-sidenav/client/sideNav.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,8 @@
{{> sidebarHeader }}
{{#if loggedInUser}}
<div class="wrapper-unread">
<div class="unread-rooms background-primary-action-color color-primary-action-contrast top-unread-rooms hidden" id="fade">
{{_ "More_unreads"}} <i class="icon-up-big"></i>
<div class="unread-rooms background-primary-action-color color-primary-action-contrast top-unread-rooms hidden">
<i class="icon-up-big"></i> {{_ "More_unreads"}}
</div>
</div>
<div class="rooms-list" aria-label="{{_ "Channels"}}" role="region">
Expand All @@ -14,7 +14,7 @@
</div>
<div class="wrapper-unread">
<div class="unread-rooms background-primary-action-color color-primary-action-contrast bottom-unread-rooms hidden">
{{_ "More_unreads"}} <i class="icon-down-big"></i>
<i class="icon-down-big"></i> {{_ "More_unreads"}}
</div>
</div>
<div class="flex-nav animated-hidden">
Expand Down

0 comments on commit 0d2723f

Please sign in to comment.