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

invite-user-modal: Add general class names for improved extensibility. 

Adds general class names in invite_user_modal.hbs for custom time
the input and unit so that these elements more easily be extended
for use in other modals with a user specified custom time.

Updates the listener in invite.ts that was using the removed
"custom-expiration-time" class to instead use the id for the
input and unit div, "custom-invite-expiration-time".

Corresponding updates have been made to the relevant CSS files to
ensure consistent styling and future scalability.

Co-authored-by: Ujjawal Modi <umodi2003@gmail.com>
Co-authored-by: Lauryn Menard <lauryn@zulip.com>
This commit is contained in:
opmkumar 2024-10-28 01:36:37 +05:30 committed by Tim Abbott
parent bc0f9c4876
commit 523dc7e2be
4 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/invite.ts
View File

@ -451,7 +451,7 @@ function open_invite_user_modal(e: JQuery.ClickEvent<Document, undefined>): void
}
});
$(".custom-expiration-time").on("change", () => {
$("#custom-invite-expiration-time").on("change", () => {
custom_expiration_time_input = util.check_time_input(
$<HTMLInputElement>("input#custom-expiration-time-input").val()!,
);

2
web/styles/dark_theme.css
View File

@ -342,7 +342,7 @@
select,
.pill-container,
.user-status-content-wrapper,
#custom-expiration-time-input,
.custom-time-input-value,
#organization-permissions .dropdown-widget-button,
#organization-settings .dropdown-widget-button,
#stream-advanced-configurations .dropdown-widget-button {

6
web/styles/zulip.css
View File

@ -1261,7 +1261,7 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
}
#custom-expiration-time-input,
.custom-time-input-value,
#invite-user-form {
margin: 0;
}
@ -1285,7 +1285,7 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
width: 100%;
}
#custom-expiration-time-input {
.custom-time-input-value {
width: 5ch;
margin-right: 15px;
@ -1307,7 +1307,7 @@ div.toggle_resolve_topic_spinner .loading_indicator_spinner {
}
}
#custom-expiration-time-unit {
.custom-time-input-unit {
width: auto;
}

4
web/templates/invite_user_modal.hbs
View File

@ -43,8 +43,8 @@
<p id="expires_on"></p>
<div id="custom-invite-expiration-time" class="dependent-settings-block">
<label for="expires_in" class="modal-field-label">{{t "Custom time" }}</label>
<input type="text" autocomplete="off" name="custom-expiration-time" id="custom-expiration-time-input" class="custom-expiration-time inline-block" value="" maxlength="3"/>
<select class="custom-expiration-time invite-user-select modal_select bootstrap-focus-style" id="custom-expiration-time-unit">
<input type="text" autocomplete="off" name="custom-expiration-time" id="custom-expiration-time-input" class="custom-time-input-value inline-block" value="" maxlength="3"/>
<select class="custom-time-input-unit invite-user-select modal_select bootstrap-focus-style" id="custom-expiration-time-unit">
{{#each time_choices}}
<option name="custom_time_choice" class="custom_time_choice" value="{{this.name}}">{{this.description}}</option>
{{/each}}