MindWorkAI/AI-Studio
MindWorkAI/AI-Studio
1
0
Fork 0
mirror of https://github.com/MindWorkAI/AI-Studio.git synced 2025-05-02 20:19:47 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Added parameters to fill the entire space & to add a header

Browse Source
This commit is contained in:
Thorsten Sommer 2024-11-02 22:45:02 +01:00
parent bd97c0fb4b
commit 71634ea566
Signed by: tsommer
GPG Key ID: 371BBA77A02C0108
2 changed files with 19 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/MindWork AI Studio/Components/InnerScrolling.razor
View File

@ -1,6 +1,12 @@
@inherits MSGComponentBase @inherits MSGComponentBase
<div class="d-flex flex-column" style="@this.Height"> <div class="@this.Classes" style="@this.Styles">
@if (this.HeaderContent is not null)
{
<div>
@this.HeaderContent
</div>
}
<div class="flex-auto overflow-auto"> <div class="flex-auto overflow-auto">
@this.ChildContent @this.ChildContent

13
app/MindWork AI Studio/Components/InnerScrolling.razor.cs
View File

@ -6,6 +6,9 @@ namespace AIStudio.Components;
public partial class InnerScrolling : MSGComponentBase public partial class InnerScrolling : MSGComponentBase
{ {
[Parameter]
public bool FillEntireHorizontalSpace { get; set; } = false;
/// <summary> /// <summary>
/// Set the height of anything above the scrolling content; usually a header. /// 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 /// What we do is calc(100vh - HeaderHeight). Means, you can use multiple measures like
@ -14,6 +17,9 @@ public partial class InnerScrolling : MSGComponentBase
[Parameter] [Parameter]
public string HeaderHeight { get; set; } = "3em"; public string HeaderHeight { get; set; } = "3em";
[Parameter]
public RenderFragment? HeaderContent { get; set; }
[Parameter] [Parameter]
public RenderFragment? ChildContent { get; set; } public RenderFragment? ChildContent { get; set; }
@ -22,6 +28,9 @@ public partial class InnerScrolling : MSGComponentBase
/// </summary> /// </summary>
[Parameter] [Parameter]
public RenderFragment? FooterContent { get; set; } public RenderFragment? FooterContent { get; set; }
[Parameter]
public string Class { get; set; } = string.Empty;
[CascadingParameter] [CascadingParameter]
private MainLayout MainLayout { get; set; } = null!; private MainLayout MainLayout { get; set; } = null!;
@ -62,7 +71,9 @@ public partial class InnerScrolling : MSGComponentBase
#endregion #endregion
private string Height => $"height: calc(100vh - {this.HeaderHeight} - {this.MainLayout.AdditionalHeight});"; private string Styles => this.FillEntireHorizontalSpace ? $"height: calc(100vh - {this.HeaderHeight} - {this.MainLayout.AdditionalHeight}); overflow-x: auto; min-width: 0;" : $"height: calc(100vh - {this.HeaderHeight} - {this.MainLayout.AdditionalHeight}); flex-shrink: 0;";
private string Classes => this.FillEntireHorizontalSpace ? $"{this.Class} d-flex flex-column flex-grow-1" : $"{this.Class} d-flex flex-column";
public async Task ScrollToBottom() public async Task ScrollToBottom()
{ {