mirror of
https://github.com/MindWorkAI/AI-Studio.git
synced 2026-08-12 10:32:11 +00:00
Improved visual briefing layout
This commit is contained in:
parent
51ca046f97
commit
39aae9a923
@ -8,33 +8,37 @@
|
||||
<CascadingValue Value="@this.CurrentMediaOwner">
|
||||
<PreviewPrototype ApplyInnerScrollingFix="true"/>
|
||||
<div class="visual-briefing-shell">
|
||||
<MudPaper Class="visual-briefing-projects pa-3" Outlined="true">
|
||||
<MudText Typo="Typo.h5">@T("Visual Briefings")</MudText>
|
||||
<MudStack Row="true" Spacing="1" Class="my-3" Wrap="Wrap.Wrap">
|
||||
<MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="@this.CreateBriefingAsync">@T("New briefing")</MudButton>
|
||||
<MudButton Variant="Variant.Filled" StartIcon="@Icons.Material.Filled.FileUpload" OnClick="@this.ImportAsync">@T("Import")</MudButton>
|
||||
</MudStack>
|
||||
<MudList T="Guid" Dense="true">
|
||||
@foreach (var briefing in this.briefings)
|
||||
{
|
||||
<MudListItem T="Guid"
|
||||
Value="@briefing.BriefingId"
|
||||
Icon="@Icons.Material.Filled.Dashboard"
|
||||
OnClick="@(() => this.SelectBriefingAsync(briefing.BriefingId))"
|
||||
Class="@(this.selectedBriefing?.BriefingId == briefing.BriefingId ? "mud-theme-primary" : string.Empty)">
|
||||
<MudStack Spacing="0">
|
||||
<MudText Typo="Typo.body1">@briefing.Name</MudText>
|
||||
<MudText Typo="Typo.caption">@briefing.ModifiedAtUtc.ToLocalTime().ToString("g")</MudText>
|
||||
@if (this.IsGenerating(briefing.BriefingId))
|
||||
{
|
||||
<MudProgressLinear Indeterminate="true" Color="Color.Primary" Class="mt-1"/>
|
||||
}
|
||||
<MediaTranscriptionStatus Owner="@MediaImportOwner.ForVisualBriefing(briefing.BriefingId)" Compact="true"/>
|
||||
</MudStack>
|
||||
</MudListItem>
|
||||
}
|
||||
</MudList>
|
||||
</MudPaper>
|
||||
<MudText Typo="Typo.h4" Class="mb-3">@T("Visual Briefings")</MudText>
|
||||
|
||||
<MudList T="Guid"
|
||||
Color="Color.Primary"
|
||||
Class="mb-1"
|
||||
SelectedValue="@(this.selectedBriefing?.BriefingId ?? Guid.Empty)"
|
||||
SelectedValueChanged="@this.SelectBriefingAsync">
|
||||
@foreach (var briefing in this.briefings)
|
||||
{
|
||||
<MudListItem T="Guid"
|
||||
Value="@briefing.BriefingId"
|
||||
Icon="@Icons.Material.Filled.Dashboard">
|
||||
<MudStack Spacing="0">
|
||||
<MudText Typo="Typo.body1">@briefing.Name</MudText>
|
||||
<MudText Typo="Typo.caption">@briefing.ModifiedAtUtc.ToLocalTime().ToString("g")</MudText>
|
||||
@if (this.IsGenerating(briefing.BriefingId))
|
||||
{
|
||||
<MudProgressLinear Indeterminate="true" Color="Color.Primary" Class="mt-1"/>
|
||||
}
|
||||
<MediaTranscriptionStatus Owner="@MediaImportOwner.ForVisualBriefing(briefing.BriefingId)" Compact="true"/>
|
||||
</MudStack>
|
||||
</MudListItem>
|
||||
}
|
||||
</MudList>
|
||||
|
||||
<MudStack Row="true" Spacing="1" Class="mt-1" Wrap="Wrap.Wrap">
|
||||
<MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add" OnClick="@this.CreateBriefingAsync">@T("New briefing")</MudButton>
|
||||
<MudButton Variant="Variant.Filled" StartIcon="@Icons.Material.Filled.FileUpload" OnClick="@this.ImportAsync">@T("Import")</MudButton>
|
||||
</MudStack>
|
||||
|
||||
<MudDivider Style="height: 0.25ch; margin: 1rem 0;" Class="mt-6"/>
|
||||
|
||||
<main class="visual-briefing-main">
|
||||
@if (this.selectedBriefing is null)
|
||||
|
||||
@ -1,22 +1,10 @@
|
||||
.visual-briefing-shell {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(16rem, 22rem) minmax(0, 1fr);
|
||||
gap: 1rem;
|
||||
align-content: start;
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.visual-briefing-projects {
|
||||
align-self: start;
|
||||
max-height: calc(100vh - 7rem);
|
||||
overflow-y: auto;
|
||||
position: sticky;
|
||||
top: 1rem;
|
||||
}
|
||||
|
||||
.visual-briefing-main {
|
||||
min-width: 0;
|
||||
padding-bottom: 1rem;
|
||||
@ -51,14 +39,3 @@
|
||||
height: 72vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (max-width: 960px) {
|
||||
.visual-briefing-shell {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.visual-briefing-projects {
|
||||
max-height: none;
|
||||
position: static;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user