navbar: Add Ionic search icon and use for navbar search.

This adds a new search icon which we prefer over the one made
available from bootstrap, and replaces search icons in navbar
search with the Ionic icon.
This commit is contained in:
YashRE42 2022-05-30 06:10:21 +05:30 committed by Tim Abbott
parent e029fe6249
commit e3ad9c10bb
6 changed files with 15 additions and 9 deletions

View File

@ -114,6 +114,10 @@ Source: https://github.com/ionic-team/ionicons/blob/v5.5.2/src/svg/earth.svg, mo
Copyright: 2015-present Ionic (http://ionic.io/)
License: Expat
Files: web/images/icons/search.svg
Copyright: 2015-present Ionic (http://ionic.io/)
License: Expat
Files: tools/check-thirdparty
Copyright: 2020 Kandra Labs, Inc.
License: GPL-2.0+

BIN
web/images/icons/search.svg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 391 B

View File

@ -37,7 +37,7 @@
width: max-content;
min-width: 100%;
.fa-search {
.zulip-icon-search {
padding: 0;
font-size: 20px;
position: absolute;
@ -50,7 +50,7 @@
}
}
.fa-search:not(.deactivated) {
.zulip-icon-search:not(.deactivated) {
cursor: pointer;
}
}

View File

@ -2652,7 +2652,7 @@ select.invite-as {
width: calc(100% - 84px);
}
.search_closed .fa-search {
.search_closed .zulip-icon-search {
right: 115px;
}
}
@ -2725,7 +2725,7 @@ select.invite-as {
width: calc(100% - 108px);
}
.search_closed .fa-search {
.search_closed .zulip-icon-search {
right: 115px;
}
}
@ -2750,8 +2750,10 @@ select.invite-as {
}
}
.search_closed .fa-search {
top: 5px;
/* Usually the styling is applied directly to the icon, but here
the icon is `position: static`, so we can't. */
.search_closed {
top: 4px;
}
#streamlist-toggle,

View File

@ -18,4 +18,4 @@
{{> navbar_icon_and_title }}
</span>
{{/if}}
<span class="search_icon search_closed" role="button"><i class="fa fa-search" aria-hidden="true"></i></span>
<span class="search_icon search_closed" role="button"><i class="zulip-icon zulip-icon-search" aria-hidden="true"></i></span>

View File

@ -19,7 +19,7 @@
<div id="searchbox">
<form id="searchbox_form" class="navbar-search">
<div id="search_arrows" class="pill-container input-append">
<span class="search_icon search_open" ><i class="fa fa-search" aria-hidden="true"></i></span>
<span class="search_icon search_open" ><i class="zulip-icon zulip-icon-search"></i></span>
<div contenteditable="true" class="input search-query input-block-level" id="search_query" type="text" placeholder="{{t 'Search' }}"
autocomplete="off" aria-label="{{t 'Search' }}" title="{{t 'Search' }} (/)">
</div>
@ -33,7 +33,7 @@
<div id="searchbox_legacy">
<form id="searchbox_form" class="navbar-search">
<div id="search_arrows" class="input-append">
<span class="search_icon search_open" ><i class="fa fa-search" aria-hidden="true"></i></span>
<span class="search_icon search_open" ><i class="zulip-icon zulip-icon-search"></i></span>
<input class="search-query input-block-level home-page-input" id="search_query" type="text" placeholder="{{t 'Search' }}"
autocomplete="off" aria-label="{{t 'Search' }}" title="{{t 'Search' }} (/)"/>
<button class="btn search_close_button" type="button" id="search_exit" aria-label="{{t 'Exit search' }}"><i class="fa fa-remove" aria-hidden="true"></i></button>