MindWorkAI/AI-Studio
1
0 Fork 0
mirror of https://github.com/MindWorkAI/AI-Studio.git synced 2026-10-17 14:18:00 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improved the inner content scrolling to use the entire space available (#263)

Browse Source
This commit is contained in:
Thorsten Sommer authored and GitHub committed 2025-01-21 13:40:47 +01:00
1 parent f50e041640
commit 14caf550ec
14 files changed
+509 -486
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/MindWork AI Studio/Components/ChatComponent.razor
+1 -1
View File
@@ -3,7 +3,7 @@
@inherits MSGComponentBase
<InnerScrolling FillEntireHorizontalSpace="@true" @ref="@this.scrollingArea" HeaderHeight="12.3em" MinWidth="36em">
<InnerScrolling FillEntireHorizontalSpace="@true" @ref="@this.scrollingArea" MinWidth="36em" Style="height: 100%">
<ChildContent>
@if (this.ChatThread is not null)
{
app/MindWork AI Studio/Components/InnerScrolling.razor
+3 -3
View File
@@ -7,17 +7,17 @@
@this.HeaderContent
</div>
}
<div class="flex-auto overflow-auto">
<div class="flex-auto overflow-auto mb-3">
@this.ChildContent
<div @ref="@this.AnchorAfterChildContent">
<div style="max-height: 0.1em;" @ref="@this.AnchorAfterChildContent">
&nbsp;
</div>
</div>
@if (this.FooterContent is not null)
{
<MudPaper Class="pa-3 border-solid border rounded-lg">
<MudPaper Class="pa-3 mb-3 border-solid border rounded-lg">
@this.FooterContent
</MudPaper>
}
app/MindWork AI Studio/Components/InnerScrolling.razor.cs
+8 -11
View File
@@ -9,14 +9,6 @@ public partial class InnerScrolling : MSGComponentBase
[Parameter]
public bool FillEntireHorizontalSpace { get; set; }
/// <summary>
/// Set the height of anything above the scrolling content; usually a header.
/// What we do is calc(100vh - HeaderHeight). Means, you can use multiple measures like
/// 230px - 3em. Default is 3em.
/// </summary>
[Parameter]
public string HeaderHeight { get; set; } = "3em";
[Parameter]
public RenderFragment? HeaderContent { get; set; }
@@ -34,6 +26,9 @@ public partial class InnerScrolling : MSGComponentBase
[Parameter]
public string? MinWidth { get; set; }
[Parameter]
public string Style { get; set; } = string.Empty;
[CascadingParameter]
private MainLayout MainLayout { get; set; } = null!;
@@ -74,12 +69,14 @@ public partial class InnerScrolling : MSGComponentBase
#endregion
private string MinWidthStyle => string.IsNullOrWhiteSpace(this.MinWidth) ? string.Empty : $"min-width: {this.MinWidth};";
private string MinWidthStyle => string.IsNullOrWhiteSpace(this.MinWidth) ? string.Empty : $"min-width: {this.MinWidth}; ";
private string TerminatedStyles => string.IsNullOrWhiteSpace(this.Style) ? string.Empty : $"{this.Style}; ";
private string Styles => this.FillEntireHorizontalSpace ? $"height: calc(100vh - {this.HeaderHeight} - {this.MainLayout.AdditionalHeight}); overflow-x: auto; min-width: 0; {this.MinWidthStyle}" : $"height: calc(100vh - {this.HeaderHeight} - {this.MainLayout.AdditionalHeight}); flex-shrink: 0; {this.MinWidthStyle}";
private string Classes => this.FillEntireHorizontalSpace ? $"{this.Class} d-flex flex-column flex-grow-1" : $"{this.Class} d-flex flex-column";
private string Styles => $"flex-grow: 1; overflow: hidden; {this.TerminatedStyles}{this.MinWidthStyle}";
public async Task ScrollToBottom()
{
await this.AnchorAfterChildContent.ScrollIntoViewAsync(this.JsRuntime);