MindWorkAI/AI-Studio
MindWorkAI/AI-Studio
1
0
Fork 0
mirror of https://github.com/MindWorkAI/AI-Studio.git synced 2026-09-27 02:53:38 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Added a compact form to the text switch

Browse Source
This commit is contained in:
Thorsten Sommer 2026-09-14 15:15:34 +02:00
parent b739e1a946
commit 1e4a5b4459
Signed by untrusted user who does not match committer: tsommer
GPG Key ID: 371BBA77A02C0108
3 changed files with 18 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -7,11 +7,11 @@
<MudTooltip Text="@T("Select the data you want to use here.")" Placement="Placement.Top"> <MudTooltip Text="@T("Select the data you want to use here.")" Placement="Placement.Top">
@if (this.PopoverTriggerMode is PopoverTriggerMode.ICON) @if (this.PopoverTriggerMode is PopoverTriggerMode.ICON)
{ {
<MudIconButton Icon="@AppIcons.DATABASE" Class="@this.PopoverButtonClasses" OnClick="@(() => this.ToggleDataSourceSelection())"/> <MudIconButton Icon="@AppIcons.DATABASE" Class="@this.PopoverButtonClasses" OnClick="@this.ToggleDataSourceSelection"/>
} }
else else
{ {
<MudButton Variant="Variant.Filled" StartIcon="@AppIcons.DATABASE" Class="@this.PopoverButtonClasses" OnClick="@(() => this.ToggleDataSourceSelection())"> <MudButton Variant="Variant.Filled" StartIcon="@AppIcons.DATABASE" Class="@this.PopoverButtonClasses" OnClick="@this.ToggleDataSourceSelection">
@T("Select data") @T("Select data")
</MudButton> </MudButton>
} }
@ -89,7 +89,7 @@
case false: case false:
<MudField Label="@T("Available Data Sources")" Variant="Variant.Outlined" Class="mb-2" Disabled="@this.aiBasedSourceSelection"> <MudField Label="@T("Available Data Sources")" Variant="Variant.Outlined" Class="mb-2" Disabled="@this.aiBasedSourceSelection">
<MudList T="IDataSource" Dense="@true" Class="data-source-rows" SelectionMode="@this.GetListSelectionMode()" @bind-SelectedValues:get="@this.selectedDataSources" @bind-SelectedValues:set="@(x => this.SelectionChanged(x))" Style="max-height: 14em;"> <MudList T="IDataSource" Dense="@true" Class="data-source-rows" SelectionMode="@this.GetListSelectionMode()" @bind-SelectedValues:get="@this.selectedDataSources" @bind-SelectedValues:set="@this.SelectionChanged" Style="max-height: 14em;">
@foreach (var source in this.availableDataSources) @foreach (var source in this.availableDataSources)
{ {
<MudListItem Value="@source"> <MudListItem Value="@source">
@ -200,7 +200,7 @@ else if (this.SelectionMode is DataSourceSelectionMode.CONFIGURATION_MODE)
@if (!string.IsNullOrWhiteSpace(this.ConfigurationHeaderMessage)) @if (!string.IsNullOrWhiteSpace(this.ConfigurationHeaderMessage))
{ {
<MudText Typo="Typo.body1"> <MudText Typo="Typo.body2">
@this.ConfigurationHeaderMessage @this.ConfigurationHeaderMessage
</MudText> </MudText>
} }

2
app/MindWork AI Studio/Components/MudTextSwitch.razor.cs
View File

@ -39,7 +39,7 @@ public partial class MudTextSwitch : ComponentBase
[Parameter] [Parameter]
public bool Dense { get; set; } public bool Dense { get; set; }
private string FieldClasses => this.Dense ? "mb-2" : "mb-3"; private string FieldClasses => this.Dense ? "mb-2 text-switch-dense" : "mb-3";
private Size SwitchSize => this.Dense ? Size.Small : Size.Medium; private Size SwitchSize => this.Dense ? Size.Small : Size.Medium;
} }

13
app/MindWork AI Studio/wwwroot/app.css
View File

@ -512,3 +512,16 @@ tr:has(> .provider-group-header) .mud-icon-button {
background-color: var(--mud-palette-background-gray); background-color: var(--mud-palette-background-gray);
border-radius: var(--mud-default-borderradius); border-radius: var(--mud-default-borderradius);
} }
/*
* The frame around a text switch in its compact form. MudBlazor pads the slot of an outlined field
* with 18.5px above and below, which is the right amount for the line of text such a field usually
* holds -- a switch of 24px is left swimming in the middle of it. Size.Small already took the switch
* down; this brings the frame with it, and it has to name the MudBlazor classes to outweigh their
* specificity. Only the two vertical values of that shorthand are replaced, so the 14px to the left
* and right stay as they are.
*/
.text-switch-dense .mud-input-slot.mud-input-root-outlined {
padding-top: 0.5rem;
padding-bottom: 0.5rem;
}