left_sidebar: Place unread count right of stream controls.

Fixes: #27380
This commit is contained in:
Karl Stolley
2023-11-15 10:47:59 -06:00
committed by Tim Abbott
parent 335790dae8
commit 614abd58be
2 changed files with 9 additions and 12 deletions

View File

@@ -1184,27 +1184,23 @@ li.topic-list-item {
.heading-markers-and-controls { .heading-markers-and-controls {
grid-area: markers-and-controls; grid-area: markers-and-controls;
height: 100%; height: 100%;
display: flex;
align-items: center;
grid-gap: 5px;
} }
#filter_streams_tooltip { #filter_streams_tooltip {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
/* Filter streams tooltip is just a block, width: 15px;
not a flex or grid item at present,
so we fill the row height this way. */
height: 100%;
} }
/* TODO: In the redesign, the streams icons will
be grouped and placed to the left of a new
unread count on Streams. */
#add_streams_tooltip { #add_streams_tooltip {
grid-area: ending-anchor-element;
align-self: stretch;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
width: 15px;
} }
.input-append { .input-append {

View File

@@ -161,11 +161,12 @@
<h4 class="left-sidebar-title"><span class="streams-tooltip-target" data-tooltip-template-id="filter-streams-tooltip-template">{{t 'STREAMS' }}</span></h4> <h4 class="left-sidebar-title"><span class="streams-tooltip-target" data-tooltip-template-id="filter-streams-tooltip-template">{{t 'STREAMS' }}</span></h4>
<div class="heading-markers-and-controls"> <div class="heading-markers-and-controls">
<i id="filter_streams_tooltip" class="streams_filter_icon fa fa-filter" aria-hidden="true" data-tooltip-template-id="filter-streams-tooltip-template"></i> <i id="filter_streams_tooltip" class="streams_filter_icon fa fa-filter" aria-hidden="true" data-tooltip-template-id="filter-streams-tooltip-template"></i>
<span id="add_streams_tooltip" class="hidden-for-spectators" data-tippy-content="{{t 'Add streams' }}">
<i id="streams_inline_icon" class='fa fa-plus' aria-hidden="true" ></i>
</span>
<span class="unread_count"></span> <span class="unread_count"></span>
</div> </div>
<span id="add_streams_tooltip" class="hidden-for-spectators" data-tippy-content="{{t 'Add streams' }}">
<i id="streams_inline_icon" class='fa fa-plus' aria-hidden="true" ></i>
</span>
<div class="input-append notdisplayed stream_search_section"> <div class="input-append notdisplayed stream_search_section">
<input class="stream-list-filter home-page-input filter_text_input" type="text" autocomplete="off" placeholder="{{t 'Filter streams' }}" /> <input class="stream-list-filter home-page-input filter_text_input" type="text" autocomplete="off" placeholder="{{t 'Filter streams' }}" />
<button type="button" class="btn clear_search_button" id="clear_search_stream_button"> <button type="button" class="btn clear_search_button" id="clear_search_stream_button">