templates: Add filter_text_input class to inputs used for filtering.

This commit adds filter_text_input class to various search inputs
used across the app. This new class is used to re-add the bootstrap
CSS rules such that we can remove the CSS from bootstrap.css.
This commit is contained in:
Sahil Batra 2023-06-23 16:52:29 +05:30 committed by Tim Abbott
parent f5208a7db6
commit 5442bfb07c
25 changed files with 40 additions and 24 deletions

View File

@ -1026,3 +1026,19 @@ div.overlay {
top: -1px;
}
}
.filter_text_input {
padding: 4px 6px;
color: hsl(0deg 0% 33%);
border: 1px solid hsl(0deg 0% 80%);
transition: border linear 0.2s, box-shadow linear 0.2s;
box-shadow: inset 0 1px 1px hsl(0deg 0% 0% / 7.5%);
border-radius: 4px;
&:focus {
border-color: hsl(206deg 80% 62% / 80%);
outline: 0;
box-shadow: inset 0 1px 1px hsl(0deg 0% 0% / 7.5%),
0 0 8px hsl(206deg 80% 62% / 60%);
}
}

View File

@ -1,6 +1,6 @@
<div class="dropdown-list-container">
<div class="dropdown-list-search">
<input class="dropdown-list-search-input" type="text" placeholder="{{t 'Filter' }}" autofocus/>
<input class="dropdown-list-search-input filter_text_input" type="text" placeholder="{{t 'Filter' }}" autofocus/>
</div>
<div class="dropdown-list-wrapper" data-simplebar>
<ul class="dropdown-list"></ul>

View File

@ -1,6 +1,6 @@
<div class="emoji-popover">
<div class="emoji-popover-top">
<input class="emoji-popover-filter" type="text" autofocus placeholder="{{t 'Search' }}" />
<input class="emoji-popover-filter filter_text_input" type="text" autofocus placeholder="{{t 'Search' }}" />
<i class="fa fa-search" aria-hidden="true"></i>
</div>
<div class="emoji-popover-category-tabs">

View File

@ -1,5 +1,5 @@
<div class="input-append topic_search_section filter-topics">
<input class="topic-list-filter home-page-input" id="filter-topic-input" type="text" autocomplete="off" placeholder="{{t 'Filter topics'}}" />
<input class="topic-list-filter home-page-input filter_text_input" id="filter-topic-input" type="text" autocomplete="off" placeholder="{{t 'Filter topics'}}" />
<button type="button" class="btn clear_search_button" id="clear_search_topic_button">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>

View File

@ -97,7 +97,7 @@
</span>
<i id="filter_streams_tooltip" class="streams_filter_icon fa fa-filter" aria-hidden="true" data-tooltip-template-id="filter-streams-tooltip-template"></i>
<div class="input-append notdisplayed stream_search_section">
<input class="stream-list-filter home-page-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">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>

View File

@ -3,7 +3,7 @@
{{> recent_topics_filters}}
</div>
<div class="search_group" role="group">
<input type="text" id="recent_topics_search" value="{{ search_val }}" autocomplete="off" placeholder="{{t 'Filter topics (t)' }}" />
<input type="text" id="recent_topics_search" class="filter_text_input" value="{{ search_val }}" autocomplete="off" placeholder="{{t 'Filter topics (t)' }}" />
<button type="button" class="btn clear_search_button" id="recent_topics_search_clear">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>

View File

@ -12,7 +12,7 @@
</i>
</div>
<div class="input-append notdisplayed" id="user_search_section">
<input class="user-list-filter home-page-input" type="text" autocomplete="off" placeholder="{{t 'Search people' }}" />
<input class="user-list-filter home-page-input filter_text_input" type="text" autocomplete="off" placeholder="{{t 'Search people' }}" />
<button type="button" class="btn clear_search_button" id="clear_search_people_button">
<i class="fa fa-remove" aria-hidden="true"></i>
</button>

View File

@ -2,7 +2,7 @@
<div id="attachment-stats-holder"></div>
<div class="settings_panel_list_header">
<h3>{{t "Uploaded files"}}</h3>
<input id="upload_file_search" class="search" type="text" placeholder="{{t 'Filter uploaded files' }}" aria-label="{{t 'Filter uploads' }}"/>
<input id="upload_file_search" class="search filter_text_input" type="text" placeholder="{{t 'Filter uploaded files' }}" aria-label="{{t 'Filter uploads' }}"/>
</div>
<div class="clear-float"></div>
<div class="alert" id="delete-upload-status"></div>

View File

@ -8,7 +8,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Bots"}}</h3>
<div class="alert-notification" id="bot-field-status"></div>
<input type="text" class="search" placeholder="{{t 'Filter bots' }}" aria-label="{{t 'Filter bots' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter bots' }}" aria-label="{{t 'Filter bots' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -6,7 +6,7 @@
{{> ../help_link_widget link="/help/deactivate-or-reactivate-a-user" }}
</h3>
<div class="alert-notification" id="deactivated-user-field-status"></div>
<input type="text" class="search" placeholder="{{t 'Filter deactivated users' }}" aria-label="{{t 'Filter deactivated users' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter deactivated users' }}" aria-label="{{t 'Filter deactivated users' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -7,7 +7,7 @@
{{#if is_admin}}
<button type="submit" id="show-add-default-streams-modal" class="button rounded sea-green">{{t "Add stream" }}</button>
{{/if}}
<input type="text" class="search" placeholder="{{t 'Filter default streams' }}" aria-label="{{t 'Filter streams' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter default streams' }}" aria-label="{{t 'Filter streams' }}"/>
</div>
</div>

View File

@ -11,7 +11,7 @@
</button>
<ul class="dropdown-menu modal-bg" role="menu">
<li class="dropdown-search" role="presentation">
<input class="no-input-change-detection" type="text" role="menuitem" placeholder="{{list_placeholder}}" autofocus/>
<input class="no-input-change-detection filter_text_input" type="text" role="menuitem" placeholder="{{list_placeholder}}" autofocus/>
</li>
<div class="dropdown-list-wrapper" data-simplebar>
<span class="dropdown-list-body"></span>

View File

@ -11,7 +11,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Custom emoji"}}</h3>
<input type="text" class="search" placeholder="{{t 'Filter emoji' }}"
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter emoji' }}"
aria-label="{{t 'Filter emoji' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -10,7 +10,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Invites"}}</h3>
<div class="alert-notification" id="invites-field-status"></div>
<input type="text" class="search" placeholder="{{t 'Filter invites' }}" aria-label="{{t 'Filter invites' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter invites' }}" aria-label="{{t 'Filter invites' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -59,7 +59,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Linkifiers"}}</h3>
<div class="alert-notification edit-linkifier-status" id="linkifier-field-status"></div>
<input type="text" class="search" placeholder="{{t 'Filter linkifiers' }}" aria-label="{{t 'Filter linkifiers' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter linkifiers' }}" aria-label="{{t 'Filter linkifiers' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -1,7 +1,7 @@
<div id="muted-user-settings" class="settings-section" data-name="muted-users">
<div class="settings_panel_list_header">
<h3>{{t "Muted users"}}</h3>
<input id="muted_users_search" class="search" type="text" placeholder="{{t 'Filter muted users' }}" aria-label="{{t 'Filter muted users' }}"/>
<input id="muted_users_search" class="search filter_text_input" type="text" placeholder="{{t 'Filter muted users' }}" aria-label="{{t 'Filter muted users' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table">

View File

@ -65,7 +65,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Code playgrounds"}}</h3>
<input type="text" class="search" placeholder="{{t 'Filter code playgrounds' }}" aria-label="{{t 'Filter code playgrounds' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter code playgrounds' }}" aria-label="{{t 'Filter code playgrounds' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -5,7 +5,7 @@
<div class="settings_panel_list_header">
<h3>{{t "Users"}}</h3>
<div class="alert-notification" id="user-field-status"></div>
<input type="text" class="search" placeholder="{{t 'Filter users' }}" aria-label="{{t 'Filter users' }}"/>
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter users' }}" aria-label="{{t 'Filter users' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>

View File

@ -9,7 +9,7 @@
</p>
<div class="settings_panel_list_header">
<h3>{{t "Topic settings"}}</h3>
<input id="user_topics_search" class="search" type="text" placeholder="{{t 'Filter topics' }}" aria-label="{{t 'Filter topics' }}"/>
<input id="user_topics_search" class="search filter_text_input" type="text" placeholder="{{t 'Filter topics' }}" aria-label="{{t 'Filter topics' }}"/>
</div>
<div class="progressive-table-wrapper" data-simplebar>
<table class="table table-condensed table-striped wrapped-table">

View File

@ -13,7 +13,7 @@
<div class="create_stream_subscriber_list_header">
<h4 class="stream_setting_subsection_title">{{t 'Subscribers' }}</h4>
<input class="add-user-list-filter" name="user_list_filter" type="text"
<input class="add-user-list-filter filter_text_input" name="user_list_filter" type="text"
autocomplete="off" placeholder="{{t 'Filter subscribers' }}" />
</div>

View File

@ -13,7 +13,7 @@
<div>
<h4 class="inline-block stream_setting_subsection_title">{{t "Subscribers"}}</h4>
<span class="subscriber-search float-right">
<input type="text" class="search" placeholder="{{t 'Filter subscribers' }}" />
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter subscribers' }}" />
</span>
</div>
<div class="subscriber-list-box">

View File

@ -20,7 +20,7 @@
</div>
</div>
<div class="input-append stream_name_search_section" id="stream_filter">
<input type="text" name="stream_name" id="search_stream_name" autocomplete="off"
<input type="text" name="stream_name" id="search_stream_name" class="filter_text_input" autocomplete="off"
placeholder="{{t 'Filter streams' }}" value=""/>
<button type="button" class="btn clear_search_button" id="clear_search_stream_name">
<i class="fa fa-remove" aria-hidden="true"></i>

View File

@ -8,7 +8,7 @@
<div class="create_member_list_header">
<h4 class="user_group_setting_subsection_title">{{t 'Members' }}</h4>
<input class="add-user-list-filter" name="user_list_filter" type="text"
<input class="add-user-list-filter filter_text_input" name="user_list_filter" type="text"
autocomplete="off" placeholder="{{t 'Filter members' }}" />
</div>

View File

@ -12,7 +12,7 @@
<div>
<h4 class="inline-block user_group_setting_subsection_title">{{t "Members"}}</h4>
<span class="member-search float-right">
<input type="text" class="search" placeholder="{{t 'Filter subscribers' }}" />
<input type="text" class="search filter_text_input" placeholder="{{t 'Filter subscribers' }}" />
</span>
</div>
<div class="member-list-box">

View File

@ -10,7 +10,7 @@
</div>
<div class="left">
<div class="input-append group_name_search_section" id="group_filter">
<input type="text" name="group_name" id="search_group_name" autocomplete="off"
<input type="text" name="group_name" id="search_group_name" class="filter_text_input" autocomplete="off"
placeholder="{{t 'Filter groups' }}" value=""/>
<button type="button" class="btn clear_search_button" id="clear_search_group_name">
<i class="fa fa-remove" aria-hidden="true"></i>