paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-10-23 04:52:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

two_pane_settings: Calculate body height from resize instead of fiddly CSS.

Browse Source 
Having a set height is necessary for simplebar to work, and the height
will change depending on whether the header is one or two lines.
This commit is contained in:
Evy Kassirer
2025-04-30 15:54:40 +02:00
committed by Tim Abbott
parent a5c77cc017
commit d82bd57cef
8 changed files with 32 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
web/src/resize.ts
View File

@@ -218,6 +218,27 @@ function resize_navbar_alerts(): void {
}
}
export function resize_settings_overlay(): void {
if ($(".two-pane-settings-overlay.show").length === 0) {
return;
}
$(".two-pane-settings-left-simplebar-container").css(
"height",
height_of($(".two-pane-settings-container")) -
height_of($(".two-pane-settings-header")) -
height_of($(".two-pane-settings-overlay .display-type")) -
height_of($(".two-pane-settings-search")),
);
$(".two-pane-settings-right-simplebar-container").css(
"height",
height_of($(".two-pane-settings-container")) -
height_of($(".two-pane-settings-header")) -
height_of($(".two-pane-settings-overlay .display-type")),
);
}
export function resize_settings_creation_overlay(): void {
if ($(".two-pane-settings-creation-simplebar-container").length === 0) {
return;
@@ -237,5 +258,6 @@ export function resize_page_components(): void {
resize_sidebars();
resize_bottom_whitespace();
resize_stream_subscribers_list();
resize_settings_overlay();
resize_settings_creation_overlay();
}

1
web/src/stream_settings_ui.ts
View File

@@ -1033,6 +1033,7 @@ export function launch(
}
}
}, 0);
resize.resize_settings_overlay();
});
}

1
web/src/user_group_edit.ts
View File

@@ -2128,6 +2128,7 @@ export function launch(
},
});
change_state(section, left_side_tab, right_side_tab);
resize.resize_settings_overlay();
});
if (!get_active_data().id) {
if (section === "new") {

7
web/styles/subscriptions.css
View File

@@ -520,7 +520,6 @@ h4.user_group_setting_subsection_title {
position: relative;
display: inline-block;
vertical-align: top;
height: calc(100% - var(--settings-overlay-header-height));
margin: 0 -2px;
}
@@ -654,11 +653,6 @@ h4.user_group_setting_subsection_title {
position: relative;
overflow: auto;
-webkit-overflow-scrolling: touch;
/* Calculated from several heights and padding/margin measurements
in .list-toggler-container and .stream_filter, with some added
fiddling to see what worked best at 12px - 20px font sizes.
When we redesign this area we should make this less brittle. */
height: calc(100% - 3.4em - 40px);
width: 100%;
}
@@ -1143,7 +1137,6 @@ h4.user_group_setting_subsection_title {
.settings {
position: relative;
height: calc(100% - var(--settings-overlay-header-height));
overflow-y: auto;
-webkit-overflow-scrolling: touch;

2
web/templates/stream_settings/stream_creation_form.hbs
View File

@@ -1,4 +1,4 @@
<div class="hide" id="stream-creation" tabindex="-1" role="dialog"
<div class="hide two-pane-settings-right-simplebar-container" id="stream-creation" tabindex="-1" role="dialog"
aria-label="{{t 'Channel creation' }}">
<form id="stream_creation_form">
<div class="two-pane-settings-creation-simplebar-container" data-simplebar data-simplebar-tab-index="-1">

6
web/templates/stream_settings/stream_settings_overlay.hbs
View File

@@ -19,7 +19,7 @@
<div class="float-clear"></div>
</div>
</div>
<div class="input-append stream_name_search_section" id="stream_filter">
<div class="input-append stream_name_search_section two-pane-settings-search" id="stream_filter">
<input type="text" name="stream_name" id="search_stream_name" class="filter_text_input" autocomplete="off"
placeholder="{{t 'Filter' }}" value=""/>
<button type="button" class="clear_search_button" id="clear_search_stream_name">
@@ -58,7 +58,7 @@
</span>
</div>
</div>
<div class="streams-list" data-simplebar data-simplebar-tab-index="-1">
<div class="streams-list two-pane-settings-left-simplebar-container" data-simplebar data-simplebar-tab-index="-1">
</div>
</div>
<div class="right">
@@ -76,7 +76,7 @@
{{/unless}}
</div>
</div>
<div id="stream_settings" class="settings" data-simplebar data-simplebar-tab-index="-1" data-simplebar-auto-hide="false">
<div id="stream_settings" class="two-pane-settings-right-simplebar-container settings" data-simplebar data-simplebar-tab-index="-1" data-simplebar-auto-hide="false">
{{!-- edit stream here --}}
</div>
{{> stream_creation_form . }}

2
web/templates/user_group_settings/user_group_creation_form.hbs
View File

@@ -1,4 +1,4 @@
<div class="hide" id="user-group-creation" tabindex="-1" role="dialog"
<div class="hide two-pane-settings-right-simplebar-container" id="user-group-creation" tabindex="-1" role="dialog"
aria-label="{{t 'User group creation' }}">
<form id="user_group_creation_form">
<div class="two-pane-settings-creation-simplebar-container" data-simplebar data-simplebar-tab-index="-1">

6
web/templates/user_group_settings/user_group_settings_overlay.hbs
View File

@@ -19,7 +19,7 @@
<div class="float-clear"></div>
</div>
</div>
<div class="input-append group_name_search_section" id="group_filter">
<div class="input-append group_name_search_section two-pane-settings-search" id="group_filter">
<input type="text" name="group_name" id="search_group_name" class="filter_text_input" autocomplete="off"
placeholder="{{t 'Filter' }}" value=""/>
<button type="button" class="clear_search_button" id="clear_search_group_name">
@@ -33,7 +33,7 @@
</div>
<div class="no-groups-to-show">
</div>
<div class="user-groups-list" data-simplebar data-simplebar-tab-index="-1">
<div class="user-groups-list two-pane-settings-left-simplebar-container" data-simplebar data-simplebar-tab-index="-1">
</div>
</div>
<div class="right">
@@ -53,7 +53,7 @@
{{/unless}}
</div>
</div>
<div id="user_group_settings" class="settings" data-simplebar data-simplebar-tab-index="-1" data-simplebar-auto-hide="false">
<div id="user_group_settings" class="two-pane-settings-right-simplebar-container settings" data-simplebar data-simplebar-tab-index="-1" data-simplebar-auto-hide="false">
{{!-- edit user group here --}}
</div>
{{> user_group_creation_form . }}