Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

giphy: Style search input same as dropdown widget. 

Fixes #26929
This commit is contained in:
Aman Agrawal 2024-06-28 10:15:25 +00:00 committed by Tim Abbott
parent 772969e68c
commit 469582a974
2 changed files with 2 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
web/styles/popovers.css
View File

@ -919,31 +919,6 @@ ul {
outline: 1px solid hsl(0deg 100% 50%);
}
.search-box {
display: flex;
position: sticky;
padding: 2px;
& input {
flex-grow: 1;
margin: 5px;
border-radius: 3px;
}
.clear_search_button {
position: absolute;
top: 5px;
right: 3px;
font-size: 16px;
&:focus {
.fa-remove {
outline: 2px solid var(--color-outline-focus);
}
}
}
}
.giphy-scrolling-container {
overflow: auto;
height: 200px;

7
web/templates/giphy_picker.hbs
View File

@ -1,11 +1,8 @@
<div id="giphy_grid_in_popover">
<div class="arrow"></div>
<div class="popover-inner">
<div class="search-box">
<input type="text" tabindex=0 id="giphy-search-query" class="search-query" placeholder="{{t 'Search GIFs' }}" />
<button type="button" class="btn clear_search_button" id="giphy_search_clear">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>
<div class="popover-filter-input-wrapper">
<input type="text" id="giphy-search-query" class="popover-filter-input filter_text_input" placeholder="{{t 'Filter' }}" autofocus/>
</div>
<div class="giphy-scrolling-container" data-simplebar data-simplebar-tab-index="-1">
{{! We need a container we can replace