user_group_creation: Add simplebar to user group creation form.

This commit adds simplebar to user group creation form and makes
it consistent with stream creation form.

This also fixes transparency issue in footer of group creation
form dark theme.

Fixes #24443.
This commit is contained in:
Sahil Batra 2023-09-19 15:58:04 +05:30 committed by Tim Abbott
parent 5a6a8a63e1
commit f6d3b2667f
2 changed files with 29 additions and 26 deletions

View File

@ -687,7 +687,8 @@ h4.user_group_setting_subsection_title {
outline: none;
-webkit-overflow-scrolling: touch;
.stream-creation-simplebar-container {
.stream-creation-simplebar-container,
.user-group-creation-simplebar-container {
height: calc(
var(--modal-container-height) -
var(--modal-container-subscriptions-header-height) -

View File

@ -1,31 +1,33 @@
<div class="hide" id="user-group-creation" tabindex="-1" role="dialog"
aria-label="{{t 'User group creation' }}">
<form id="user_group_creation_form">
<div class="alert user_group_create_info"></div>
<div id="user_group_creating_indicator"></div>
<div class="user-group-creation-body">
<section class="block">
<label for="create_user_group_name">
{{t "User group name" }}
</label>
<input type="text" name="user_group_name" id="create_user_group_name" class="settings_text_input"
placeholder="{{t 'User group name' }}" value="" autocomplete="off" maxlength="{{ max_user_group_name_length }}"/>
<div id="user_group_name_error" class="user_group_creation_error"></div>
</section>
<section class="block">
<label for="create_user_group_description">
{{t "User group description" }}
</label>
<input type="text" name="user_group_description" id="create_user_group_description" class="settings_text_input"
placeholder="{{t 'User group description' }}" value="" autocomplete="off" />
</section>
<section class="block">
<label for="people_to_add_in_group">
<h4 class="user_group_setting_subsection_title">{{t "Choose members" }}</h4>
</label>
<div id="user_group_membership_error" class="user_group_creation_error"></div>
<div class="controls" id="people_to_add_in_group"></div>
</section>
<div class="user-group-creation-simplebar-container" data-simplebar>
<div class="alert user_group_create_info"></div>
<div id="user_group_creating_indicator"></div>
<div class="user-group-creation-body">
<section class="block">
<label for="create_user_group_name">
{{t "User group name" }}
</label>
<input type="text" name="user_group_name" id="create_user_group_name" class="settings_text_input"
placeholder="{{t 'User group name' }}" value="" autocomplete="off" maxlength="{{ max_user_group_name_length }}"/>
<div id="user_group_name_error" class="user_group_creation_error"></div>
</section>
<section class="block">
<label for="create_user_group_description">
{{t "User group description" }}
</label>
<input type="text" name="user_group_description" id="create_user_group_description" class="settings_text_input"
placeholder="{{t 'User group description' }}" value="" autocomplete="off" />
</section>
<section class="block">
<label for="people_to_add_in_group">
<h4 class="user_group_setting_subsection_title">{{t "Choose members" }}</h4>
</label>
<div id="user_group_membership_error" class="user_group_creation_error"></div>
<div class="controls" id="people_to_add_in_group"></div>
</section>
</div>
</div>
<div class="modal-footer">
<button class="button small white rounded" data-dismiss="modal">{{t "Cancel" }}</button>