From b2f77ef0986e4ef0a3f858a11b5580c95d8e158a Mon Sep 17 00:00:00 2001 From: segfault Date: Thu, 6 Apr 2023 21:41:59 -0400 Subject: [PATCH 1/9] no message --- .../Components/Stepper/MudStep.razor.cs | 3 + .../Components/Stepper/MudStepper.razor | 73 ++++++++++++++++++- .../Components/Stepper/MudStepper.razor.cs | 51 +++++++++---- 3 files changed, 110 insertions(+), 17 deletions(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs index c0195c4a..7c949984 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs @@ -68,6 +68,9 @@ public StepStatus Status [Parameter] public EventCallback StatusChanged { get; set; } + [Parameter] + public RenderFragment Template { get; set; } + protected override void OnInitialized() { base.OnInitialized(); diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index b9ceef8e..7643bcf7 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -4,8 +4,74 @@ @*Row="Vertical"*@ - @*Row="!Vertical"*@ +
+
    + @foreach (MudStep step in _steps) + { +
  1. + + + @if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) + { + } + else + { + +
    + @{ + bool active = IsStepActive(step); + } + @if(step.Template != null) + { + @step.Template + } + else + { + + @if (step.Status == Enums.StepStatus.Completed) + { + + } + else if (step.Status == StepStatus.Skipped) + { + + } + else + { + @(Steps.IndexOf(step) + 1) + } + + @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.NewLine || (HeaderTextView == HeaderTextView.OnlyActiveText && active)) + { +
    + @step.Title + @if (step.Optional == true) + { + @LocalizedStrings.Optional + } +
    + } + } +
    + + if (_steps.Count - 1 != _steps.IndexOf(step) || MobileView == true) + { + + } + + @if (MobileView == true) + { + @(_steps?.IndexOf(step) + 1) / @(_steps?.Count) + } + } +
    2. + + } +
+ +
+ @*Row="!Vertical"*@ @foreach (MudStep step in _steps) { if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) @@ -49,10 +115,9 @@ { @(_steps?.IndexOf(step) + 1) / @(_steps?.Count) } - } - - + } + @if (Loading) { diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 3e52a40c..8ac3bb17 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -1,17 +1,9 @@ -using MudExtensions.Utilities; -using Microsoft.AspNetCore.Components; +using Microsoft.AspNetCore.Components; using MudBlazor; using MudBlazor.Extensions; using MudBlazor.Utilities; using MudExtensions.Enums; -using System; -using System.Collections.Generic; -using System.Linq; -using System.Security.Cryptography.X509Certificates; -using System.Text; -using System.Threading.Tasks; -using static MudBlazor.Colors; -using MudExtensions.Extensions; +using MudExtensions.Utilities; namespace MudExtensions { @@ -20,8 +12,7 @@ public partial class MudStepper : MudComponentBase MudAnimate _animate; Guid _animateGuid = Guid.NewGuid(); - protected string HeaderClassname => new CssBuilder("d-flex align-center mud-stepper-header gap-4 pa-2") - .AddClass("mud-ripple", !DisableRipple && !Linear) + protected string HeaderClassname => new CssBuilder("d-flex align-center gap-4 pa-2") .AddClass("cursor-pointer mud-stepper-header-non-linear", !Linear) .AddClass("flex-column", HeaderTextView == HeaderTextView.NewLine) .Build(); @@ -41,7 +32,41 @@ protected string GetDashClassname(MudStep step) .Build(); } - internal int ActiveIndex { get; set; } + protected string GetStepperStyle() + { + var count = Steps.Count * 2; + string style = $"display: grid;grid-template-columns: repeat({count}, 1fr);"; + return style; + } + + protected string GetStepPercent() + { + var dPercent = 100.0 / Steps.Count; + + string percent = $"width:{dPercent}%"; + + return percent; + } + + protected string GetProgressLinearStyle() + { + var colEnd = Steps.Count * 2; + string style = $"z-index: -10;grid-column-start: 2; grid-column-end: {colEnd};grid-row: 1 / -1;display: inline-grid;top:26px"; + return style; + } + + private int _activeIndex; + internal int ActiveIndex + { + get => _activeIndex; + set + { + _activeIndex = value; + ProgressValue = _activeIndex * (100.0 / (Steps.Count - 1)); + } + } + + internal double ProgressValue; /// /// Provides CSS classes for the step content. From 0166ddffc072859eff85626b5aeb29bbc6b037c0 Mon Sep 17 00:00:00 2001 From: segfault Date: Fri, 7 Apr 2023 08:32:45 -0400 Subject: [PATCH 2/9] no message --- .../Components/Stepper/MudStep.razor.cs | 21 +++++++++++++++++-- .../Components/Stepper/MudStepper.razor | 4 ++-- 2 files changed, 21 insertions(+), 4 deletions(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs index 7c949984..24d6cd95 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs @@ -8,6 +8,7 @@ using System.Text; using System.Threading.Tasks; using MudExtensions.Extensions; +using Microsoft.AspNetCore.Components.Rendering; namespace MudExtensions { @@ -20,7 +21,7 @@ public partial class MudStep : MudComponentBase, IDisposable .Build(); [CascadingParameter] - protected MudStepper MudStepper { get; set; } + public MudStepper MudStepper { get; set; } /// /// Step text to show on header. @@ -28,6 +29,16 @@ public partial class MudStep : MudComponentBase, IDisposable [Parameter] public string Title { get; set; } + + public bool IsActive + { + get + { + return MudStepper.ActiveIndex == this.Number; + } + } + + StepStatus _status = StepStatus.Continued; /// /// The step status flag to show step is continued, skipped or completed. Do not set it directly unless you know what you do exactly. @@ -69,7 +80,13 @@ public StepStatus Status public EventCallback StatusChanged { get; set; } [Parameter] - public RenderFragment Template { get; set; } + public int Number { get; set; } + + [Parameter] + public RenderFragment Template { get; set; } + + [Parameter] + public string Icon { get; set; } protected override void OnInitialized() { diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 7643bcf7..2447d52a 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -24,7 +24,7 @@ } @if(step.Template != null) { - @step.Template + @step.Template(step) } else { @@ -69,7 +69,7 @@ } - + @*Row="!Vertical"*@ @foreach (MudStep step in _steps) From b98f4335b817a60596e8ec488ad86b31c6464c8b Mon Sep 17 00:00:00 2001 From: segfault Date: Mon, 17 Apr 2023 11:58:13 -0400 Subject: [PATCH 3/9] mudstepper ux updates --- .../Components/Stepper/MudStep.razor.cs | 22 +++++- .../Components/Stepper/MudStepper.razor | 69 +++++++++++-------- .../Components/Stepper/MudStepper.razor.cs | 34 ++++++++- 3 files changed, 94 insertions(+), 31 deletions(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs index c0195c4a..24d6cd95 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs @@ -8,6 +8,7 @@ using System.Text; using System.Threading.Tasks; using MudExtensions.Extensions; +using Microsoft.AspNetCore.Components.Rendering; namespace MudExtensions { @@ -20,7 +21,7 @@ public partial class MudStep : MudComponentBase, IDisposable .Build(); [CascadingParameter] - protected MudStepper MudStepper { get; set; } + public MudStepper MudStepper { get; set; } /// /// Step text to show on header. @@ -28,6 +29,16 @@ public partial class MudStep : MudComponentBase, IDisposable [Parameter] public string Title { get; set; } + + public bool IsActive + { + get + { + return MudStepper.ActiveIndex == this.Number; + } + } + + StepStatus _status = StepStatus.Continued; /// /// The step status flag to show step is continued, skipped or completed. Do not set it directly unless you know what you do exactly. @@ -68,6 +79,15 @@ public StepStatus Status [Parameter] public EventCallback StatusChanged { get; set; } + [Parameter] + public int Number { get; set; } + + [Parameter] + public RenderFragment Template { get; set; } + + [Parameter] + public string Icon { get; set; } + protected override void OnInitialized() { base.OnInitialized(); diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 3ef60e8e..851b6bf6 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -4,16 +4,30 @@ @*Row="Vertical"*@ - @*Row="!Vertical"*@ - - @foreach (MudStep step in _steps) +
+
+ @{ + MudStep currentStep = null; + } + @foreach (MudStep step in _steps) { - if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) + @if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) { + currentStep = step; continue; } - bool active = IsStepActive(step); -
+ +
+
+ @{ + bool active = IsStepActive(step); + } + @if(step.Template != null) + { + @step.Template(step) + } + else + { @if (step.Status == Enums.StepStatus.Completed) { @@ -28,31 +42,28 @@ @(Steps.IndexOf(step) + 1) } - @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.NewLine || (HeaderTextView == HeaderTextView.OnlyActiveText && active)) - { -
- @step.Title - @if (step.Optional == true) - { - @LocalizedStrings.Optional - } -
+ @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.NewLine || (HeaderTextView == HeaderTextView.OnlyActiveText && active)) + { +
+ @step.Title + @if (step.Optional == true) + { + @LocalizedStrings.Optional + } +
+ } } -
- - if (_steps.Count - 1 != _steps.IndexOf(step) || MobileView == true) - { - - } - - @if (MobileView == true) - { - @(_steps?.IndexOf(step) + 1) / @(_steps?.Count) - } +
+
+ } +
+ @if (MobileView == true) + { + @(_steps?.IndexOf(currentStep) + 1) / @(_steps?.Count) } - - - + + +
@if (Loading) { diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 09d8f9cc..e0e24f8c 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -33,7 +33,39 @@ protected string GetDashClassname(MudStep step) .Build(); } - internal int ActiveIndex { get; set; } + protected string GetStepperStyle() + { + var count = Steps.Count * 2; + string style = $"display:grid;grid-template-columns:repeat({count}, 1fr);"; + return style; + } + + protected string GetStepPercent() + { + var dPercent = 100.0 / Steps.Count; + string percent = $"width:{dPercent}%"; + return percent; + } + + protected string GetProgressLinearStyle() + { + var colEnd = Steps.Count * 2; + string style = $"z-index:-10;grid-column-start:2;grid-column-end:{colEnd};grid-row:1/-1;display:inline-grid;top:26px"; + return style; + } + + private int _activeIndex; + internal int ActiveIndex + { + get => _activeIndex; + set + { + _activeIndex = value; + ProgressValue = _activeIndex * (100.0 / (Steps.Count - 1)); + } + } + + internal double ProgressValue; /// /// Provides CSS classes for the step content. From ab2b831c70dac4ced683d6ed90cf67a3a30bd9d5 Mon Sep 17 00:00:00 2001 From: segfault Date: Wed, 19 Apr 2023 14:53:17 -0400 Subject: [PATCH 4/9] mudstepper updates for pr --- .../SelectExtended/StepperTest1.razor | 6 -- .../Components/Stepper/MudStep.razor.cs | 2 +- .../Components/Stepper/MudStepTemplate.razor | 44 ++++++++++ .../Stepper/MudStepTemplate.razor.cs | 15 ++++ .../Components/Stepper/MudStepper.razor | 9 ++- .../Components/Stepper/MudStepper.razor.cs | 12 +-- .../Pages/Examples/StepperExample1.razor | 81 +++++++++++-------- 7 files changed, 117 insertions(+), 52 deletions(-) create mode 100644 CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor create mode 100644 CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor.cs diff --git a/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor b/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor index 314f3113..285133ab 100644 --- a/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor +++ b/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor @@ -95,12 +95,6 @@ @item.ToDescriptionString() } - - @foreach (HeaderTextView item in Enum.GetValues()) - { - @item.ToDescriptionString() - } - Reset diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs index 24d6cd95..bef07497 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStep.razor.cs @@ -34,7 +34,7 @@ public bool IsActive { get { - return MudStepper.ActiveIndex == this.Number; + return MudStepper?.ActiveIndex == this.Number; } } diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor new file mode 100644 index 00000000..e0a840ef --- /dev/null +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor @@ -0,0 +1,44 @@ +@namespace MudExtensions +@inherits ComponentBase + +@if (Step != null) +{ + @if (Step.Status == MudExtensions.Enums.StepStatus.Completed) + { + + + + + + + + @if (Step.MudStepper.GetActiveIndex() == @Step.MudStepper.Steps.IndexOf(@Step)) + { + + @Step.Title + } + else + { + @Step.Title + } + + } + else + { + + + + + + @if (Step.MudStepper.GetActiveIndex() == @Step.MudStepper.Steps.IndexOf(@Step)) + { + + @Step.Title + } + else + { + @Step.Title + } + + } +} \ No newline at end of file diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor.cs new file mode 100644 index 00000000..0b2bb83c --- /dev/null +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor.cs @@ -0,0 +1,15 @@ +using Microsoft.AspNetCore.Components; + +namespace MudExtensions +{ + public partial class MudStepTemplate : ComponentBase + { + [Parameter] + public MudStep? Step { get; set; } + public MudStepTemplate() + : base() + { + + } + } +} diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 851b6bf6..83dc96b5 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -11,9 +11,12 @@ } @foreach (MudStep step in _steps) { - @if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) + @if(IsStepActive(step)) { currentStep = step; + } + @if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) + { continue; } @@ -42,13 +45,13 @@ @(Steps.IndexOf(step) + 1) } - @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.NewLine || (HeaderTextView == HeaderTextView.OnlyActiveText && active)) + @if (active) {
@step.Title @if (step.Optional == true) { - @LocalizedStrings.Optional + @LocalizedStrings.Optional }
} diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index e0e24f8c..fb977879 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -15,7 +15,7 @@ public partial class MudStepper : MudComponentBase protected string HeaderClassname => new CssBuilder("d-flex align-center mud-stepper-header gap-4 pa-2") .AddClass("mud-ripple", !DisableRipple && !Linear) .AddClass("cursor-pointer mud-stepper-header-non-linear", !Linear) - .AddClass("flex-column", HeaderTextView == HeaderTextView.NewLine) + .AddClass("flex-column") .Build(); protected string ContentClassname => new CssBuilder($"mud-stepper-ani-{_animateGuid.ToString()}") @@ -27,7 +27,7 @@ protected string GetDashClassname(MudStep step) return new CssBuilder("mud-stepper-header-dash flex-grow-1 mx-auto") .AddClass("mud-stepper-header-dash-completed", step.Status != StepStatus.Continued) //.AddClass("mud-stepper-header-dash-vertical", Vertical) - .AddClass("mt-5", HeaderTextView == HeaderTextView.NewLine) + .AddClass("mt-5") //.AddClass("dash-tiny", Vertical && ActiveIndex != Steps.IndexOf(step)) .AddClass($"mud-stepper-border-{Color.ToDescriptionString()}") .Build(); @@ -50,7 +50,7 @@ protected string GetStepPercent() protected string GetProgressLinearStyle() { var colEnd = Steps.Count * 2; - string style = $"z-index:-10;grid-column-start:2;grid-column-end:{colEnd};grid-row:1/-1;display:inline-grid;top:26px"; + string style = $"grid-column-start:2;grid-column-end:{colEnd};grid-row:1/-1;display:inline-grid;top:26px"; return style; } @@ -157,12 +157,6 @@ internal int ActiveIndex [Parameter] public Variant Variant { get; set; } - /// - /// Choose header text view. Default is all. - /// - [Parameter] - public HeaderTextView HeaderTextView { get; set; } = HeaderTextView.All; - // TODO //[Parameter] //public bool Vertical { get; set; } diff --git a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor index 2fb2342d..f5a57ba7 100644 --- a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor +++ b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor @@ -5,7 +5,7 @@ - - - - - - - - - + + + + + + + + + + + - - - - + + + + + + + - - - - - - - + + + + + + + + + + - - + + @if (_addResultStep) { - -
- - Your reservation succesfully completed. -
+ + + +
+ + Your reservation succesfully completed. +
+ } @@ -93,12 +113,6 @@ @item.ToDescriptionString() } - - @foreach (HeaderTextView item in Enum.GetValues()) - { - @item.ToDescriptionString() - } - Reset @@ -125,6 +139,7 @@ int _activeIndex = 0; bool _loading; bool _showStaticContent = false; + bool _vertical = false; private async Task CheckChange(StepChangeDirection direction) { From 8d65a105fbe9162a2d3d19bd946ba643332f5490 Mon Sep 17 00:00:00 2001 From: segfault Date: Mon, 24 Apr 2023 10:54:44 -0400 Subject: [PATCH 5/9] bug fixes and updates for vertical --- .../Components/Stepper/MudStepTemplate.razor | 8 ++- .../Components/Stepper/MudStepper.razor | 55 +++++++------- .../Components/Stepper/MudStepper.razor.cs | 71 +++++++++++++++---- .../Enums/HeaderTextView.cs | 2 - .../Pages/Examples/StepperExample1.razor | 21 +++--- 5 files changed, 100 insertions(+), 57 deletions(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor index e0a840ef..34a5c310 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepTemplate.razor @@ -6,8 +6,11 @@ @if (Step.Status == MudExtensions.Enums.StepStatus.Completed) { - + + @if(!string.IsNullOrWhiteSpace(Step.Icon)) + { + } @@ -25,14 +28,13 @@ } else { - + @if (Step.MudStepper.GetActiveIndex() == @Step.MudStepper.Steps.IndexOf(@Step)) { - @Step.Title } else diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 83dc96b5..713bf81a 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -3,9 +3,9 @@ @using MudExtensions.Enums - @*Row="Vertical"*@ +
-
+
@{ MudStep currentStep = null; } @@ -21,7 +21,7 @@ }
-
+
@{ bool active = IsStepActive(step); } @@ -31,29 +31,36 @@ } else { - - @if (step.Status == Enums.StepStatus.Completed) - { - - } - else if (step.Status == StepStatus.Skipped) - { - - } - else - { - @(Steps.IndexOf(step) + 1) - } - - @if (active) + @if (step.Status == MudExtensions.Enums.StepStatus.Completed) { -
- @step.Title - @if (step.Optional == true) + + + @if (!string.IsNullOrWhiteSpace(step.Icon)) + { + + } + + + } + else + { + + + + } + @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.OnlyActiveText) + { + + @if (step.MudStepper.GetActiveIndex() == @step.MudStepper.Steps.IndexOf(@step)) + { + + @step.Title + } + else if(HeaderTextView != HeaderTextView.OnlyActiveText) { - @LocalizedStrings.Optional + @step.Title } -
+ } }
@@ -64,7 +71,7 @@ { @(_steps?.IndexOf(currentStep) + 1) / @(_steps?.Count) } - +
@if (Loading) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index fb977879..94ccfa83 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -12,10 +12,13 @@ public partial class MudStepper : MudComponentBase MudAnimate _animate; Guid _animateGuid = Guid.NewGuid(); - protected string HeaderClassname => new CssBuilder("d-flex align-center mud-stepper-header gap-4 pa-2") + + + protected string HeaderClassname => new CssBuilder("d-flex align-center mud-stepper-header gap-4 pa-3") .AddClass("mud-ripple", !DisableRipple && !Linear) .AddClass("cursor-pointer mud-stepper-header-non-linear", !Linear) - .AddClass("flex-column") + .AddClass("flex-column", !Vertical) + .AddClass("flex-row", Vertical) .Build(); protected string ContentClassname => new CssBuilder($"mud-stepper-ani-{_animateGuid.ToString()}") @@ -36,28 +39,58 @@ protected string GetDashClassname(MudStep step) protected string GetStepperStyle() { var count = Steps.Count * 2; - string style = $"display:grid;grid-template-columns:repeat({count}, 1fr);"; - return style; + if (Vertical) + { + return $"display:grid;grid-template-rows:repeat({count}, 1fr);"; + } + else + { + return $"display:grid;grid-template-columns:repeat({count}, 1fr);"; + } + } + + protected string GetStepperSubStyle() + { + if (Vertical) + { + return "grid-row-start:1;grid-row-end:-1;flex-direction:column;grid-column:1;list-style:none;display:flex;"; + } + else + { + return "grid-column-start:1;grid-column-end:-1;flex-direction:row;grid-row:1;list-style:none;display:flex;"; + } } protected string GetStepPercent() { var dPercent = 100.0 / Steps.Count; - string percent = $"width:{dPercent}%"; - return percent; + if (Vertical) + { + return $"height:{dPercent}%"; + } + else + { + return $"width:{dPercent}%"; + } } protected string GetProgressLinearStyle() { - var colEnd = Steps.Count * 2; - string style = $"grid-column-start:2;grid-column-end:{colEnd};grid-row:1/-1;display:inline-grid;top:26px"; - return style; + var end = Steps.Count * 2; + if (Vertical) + { + return $"grid-row-start:2;grid-row-end:{end};grid-column:1/-1;display:inline-grid;left:30px;top:-30px;z-index:10;transform:rotateX(180deg);"; + } + else + { + return $"grid-column-start:2;grid-column-end:{end};grid-row:1/-1;display:inline-grid;top:30px;z-index:10"; + } } private int _activeIndex; - internal int ActiveIndex + internal int ActiveIndex { - get => _activeIndex; + get => _activeIndex; set { _activeIndex = value; @@ -157,9 +190,17 @@ internal int ActiveIndex [Parameter] public Variant Variant { get; set; } - // TODO - //[Parameter] - //public bool Vertical { get; set; } + /// + /// Choose header text view. Default is all. + /// + [Parameter] + public HeaderTextView HeaderTextView { get; set; } = HeaderTextView.None; + + /// + /// Choose header alignment + /// + [Parameter] + public bool Vertical { get; set; } /// /// A class for provide all local strings at once. @@ -261,7 +302,7 @@ public async Task SetActiveIndex(int count, bool firstCompleted = false, bool sk return; } } - + int backupActiveIndex = ActiveIndex; if (_animate != null) diff --git a/CodeBeam.MudBlazor.Extensions/Enums/HeaderTextView.cs b/CodeBeam.MudBlazor.Extensions/Enums/HeaderTextView.cs index 334ab6a3..d712d5df 100644 --- a/CodeBeam.MudBlazor.Extensions/Enums/HeaderTextView.cs +++ b/CodeBeam.MudBlazor.Extensions/Enums/HeaderTextView.cs @@ -8,8 +8,6 @@ public enum HeaderTextView None, [Description("only-active-text")] OnlyActiveText, - [Description("new-line")] - NewLine, [Description("all")] All, } diff --git a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor index f5a57ba7..04d7ca1d 100644 --- a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor +++ b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor @@ -21,9 +21,6 @@ - @@ -34,10 +31,7 @@ - - + @@ -45,9 +39,6 @@ - @@ -64,9 +55,6 @@ @if (_addResultStep) { -
@@ -89,6 +77,7 @@ + @@ -113,6 +102,12 @@ @item.ToDescriptionString() } + + @foreach (HeaderTextView item in Enum.GetValues()) + { + @item.ToDescriptionString() + } + Reset From 817fe899d5f1f55e0569d9a3e92800ebfb66291a Mon Sep 17 00:00:00 2001 From: segfault Date: Mon, 24 Apr 2023 11:02:51 -0400 Subject: [PATCH 6/9] mobile vertical updates --- .../TestComponents/SelectExtended/StepperTest1.razor | 1 + .../Components/Stepper/MudStepper.razor | 2 +- .../Components/Stepper/MudStepper.razor.cs | 11 +++++++++++ 3 files changed, 13 insertions(+), 1 deletion(-) diff --git a/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor b/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor index 285133ab..89c0567e 100644 --- a/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor +++ b/CodeBeam.MudBlazor.Extensions.UnitTests.Viewer/TestComponents/SelectExtended/StepperTest1.razor @@ -121,6 +121,7 @@ int _activeIndex = 0; bool _loading; bool _showStaticContent = false; + bool _vertical = false; [Parameter] public int CheckChangeCount { get; set; } diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 713bf81a..98769270 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -69,7 +69,7 @@
@if (MobileView == true) { - @(_steps?.IndexOf(currentStep) + 1) / @(_steps?.Count) + @(_steps?.IndexOf(currentStep) + 1) / @(_steps?.Count) } diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 94ccfa83..20d45ab6 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -36,6 +36,17 @@ protected string GetDashClassname(MudStep step) .Build(); } + protected string GetMobileStyle() + { + if(Vertical) + { + return "grid-column:1;"; + } + else + { + return "grid-row:1;"; + } + } protected string GetStepperStyle() { var count = Steps.Count * 2; From 2b74897e1a09dcb08a6001c7853d8fb1d996698c Mon Sep 17 00:00:00 2001 From: segfault Date: Tue, 25 Apr 2023 20:00:32 -0400 Subject: [PATCH 7/9] localization --- .../Components/Stepper/MudStepper.razor.cs | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 20d45ab6..2d747ad9 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -74,7 +74,7 @@ protected string GetStepperSubStyle() protected string GetStepPercent() { - var dPercent = 100.0 / Steps.Count; + var dPercent = (100.0 / Steps.Count).ToInvariantString(); if (Vertical) { return $"height:{dPercent}%"; From 71dc049c8a079ad002f89039ce770994d3709dd8 Mon Sep 17 00:00:00 2001 From: mckaragoz <78308169+mckaragoz@users.noreply.github.com> Date: Wed, 26 Apr 2023 13:52:36 +0300 Subject: [PATCH 8/9] Cleanup --- .../Components/Stepper/MudStepper.razor | 107 +++++++++--------- .../Components/Stepper/MudStepper.razor.cs | 30 +++-- .../Styles/Components/_stepper.scss | 29 +---- .../Styles/MudExtensions.css | 33 +----- .../Styles/MudExtensions.min.css | 2 +- .../wwwroot/MudExtensions.min.css | 2 +- .../Pages/Examples/StepperExample1.razor | 50 ++++---- 7 files changed, 100 insertions(+), 153 deletions(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 98769270..5a351a42 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -10,68 +10,67 @@ MudStep currentStep = null; } @foreach (MudStep step in _steps) - { - @if(IsStepActive(step)) - { - currentStep = step; - } - @if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) { - continue; - } - -
-
- @{ - bool active = IsStepActive(step); - } - @if(step.Template != null) + if (IsStepActive(step)) { - @step.Template(step) + currentStep = step; } - else + if (step.IsResultStep || (MobileView == true && IsStepActive(step) == false)) { - @if (step.Status == MudExtensions.Enums.StepStatus.Completed) - { - - - @if (!string.IsNullOrWhiteSpace(step.Icon)) - { - - } - - - } - else - { - - - - } - @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.OnlyActiveText) - { - - @if (step.MudStepper.GetActiveIndex() == @step.MudStepper.Steps.IndexOf(@step)) - { + continue; + } - @step.Title +
+
+ @{ + bool active = IsStepActive(step); + } + @if (step.Template != null) + { + @step.Template(step) + } + else + { + @if (step.Status == MudExtensions.Enums.StepStatus.Completed) + { + + + @if (!string.IsNullOrWhiteSpace(step.Icon)) + { + + } + + } - else if(HeaderTextView != HeaderTextView.OnlyActiveText) + else { - @step.Title + + + } - - } - } + @if (HeaderTextView == HeaderTextView.All || HeaderTextView == HeaderTextView.OnlyActiveText) + { + + @if (step.MudStepper.GetActiveIndex() == @step.MudStepper.Steps.IndexOf(@step)) + { + @step.Title + } + else if (HeaderTextView != HeaderTextView.OnlyActiveText) + { + @step.Title + } + + } + } +
-
- } + }
@if (MobileView == true) { @(_steps?.IndexOf(currentStep) + 1) / @(_steps?.Count) } - +
@if (Loading) @@ -83,9 +82,9 @@
@ChildContent
- +
- + @{ bool showResultStep = ShowResultStep(); } @@ -120,7 +119,7 @@ { if (!DisableStepResultIndicator && MobileView == false) { - @(Steps[ActiveIndex].Status == StepStatus.Completed ? LocalizedStrings.Completed : LocalizedStrings.Skipped) + @(Steps[ActiveIndex].Status == StepStatus.Completed ? LocalizedStrings.Completed : LocalizedStrings.Skipped) } } else if (ActiveIndex < Steps.Count && Steps[ActiveIndex].Optional == true) @@ -137,7 +136,7 @@ { @LocalizedStrings.Skip } - + } } } @@ -149,7 +148,7 @@ if (IconActionButtons || MobileView) { - + } else @@ -169,7 +168,7 @@ { @GetNextButtonString() } - + } } diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs index 2d747ad9..d1c86c89 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor.cs @@ -12,8 +12,6 @@ public partial class MudStepper : MudComponentBase MudAnimate _animate; Guid _animateGuid = Guid.NewGuid(); - - protected string HeaderClassname => new CssBuilder("d-flex align-center mud-stepper-header gap-4 pa-3") .AddClass("mud-ripple", !DisableRipple && !Linear) .AddClass("cursor-pointer mud-stepper-header-non-linear", !Linear) @@ -25,26 +23,20 @@ public partial class MudStepper : MudComponentBase .AddClass(ContentClass) .Build(); - protected string GetDashClassname(MudStep step) - { - return new CssBuilder("mud-stepper-header-dash flex-grow-1 mx-auto") - .AddClass("mud-stepper-header-dash-completed", step.Status != StepStatus.Continued) - //.AddClass("mud-stepper-header-dash-vertical", Vertical) - .AddClass("mt-5") - //.AddClass("dash-tiny", Vertical && ActiveIndex != Steps.IndexOf(step)) - .AddClass($"mud-stepper-border-{Color.ToDescriptionString()}") - .Build(); - } + protected string AvatarStylename => new StyleBuilder() + .AddStyle("z-index: 20") + .AddStyle("background-color", "var(--mud-palette-background)", Variant == Variant.Outlined) + .Build(); protected string GetMobileStyle() { if(Vertical) { - return "grid-column:1;"; + return "grid-column:1;margin-inline-start:22px;"; } else { - return "grid-row:1;"; + return "grid-row:1;margin-top:22px;"; } } protected string GetStepperStyle() @@ -90,11 +82,11 @@ protected string GetProgressLinearStyle() var end = Steps.Count * 2; if (Vertical) { - return $"grid-row-start:2;grid-row-end:{end};grid-column:1/-1;display:inline-grid;left:30px;top:-30px;z-index:10;transform:rotateX(180deg);"; + return $"grid-row-start:2;grid-row-end:{end};grid-column:1/-1;display:inline-grid;left:{(HeaderSize == Size.Medium ? 30 : HeaderSize == Size.Large ? 38 : 22)}px;top:-34px;z-index:10;transform:rotateX(180deg);"; } else { - return $"grid-column-start:2;grid-column-end:{end};grid-row:1/-1;display:inline-grid;top:30px;z-index:10"; + return $"grid-column-start:2;grid-column-end:{end};grid-row:1/-1;display:inline-grid;top:{(HeaderSize == Size.Medium ? 30 : HeaderSize == Size.Large ? 38 : 22)}px;{(HeaderSize == Size.Small ? "height:2px;" : HeaderSize == Size.Medium ? "height:3px;" : null)}{(MobileView ? "margin-inline-start:40px;" : null)}z-index:10"; } } @@ -201,6 +193,12 @@ internal int ActiveIndex [Parameter] public Variant Variant { get; set; } + /// + /// Choose header text view. Default is all. + /// + [Parameter] + public Size HeaderSize { get; set; } = Size.Medium; + /// /// Choose header text view. Default is all. /// diff --git a/CodeBeam.MudBlazor.Extensions/Styles/Components/_stepper.scss b/CodeBeam.MudBlazor.Extensions/Styles/Components/_stepper.scss index 9dd9caa9..f66044b4 100644 --- a/CodeBeam.MudBlazor.Extensions/Styles/Components/_stepper.scss +++ b/CodeBeam.MudBlazor.Extensions/Styles/Components/_stepper.scss @@ -9,31 +9,6 @@ } } -.mud-stepper-header-dash { - min-width: 50px; - border-bottom: 1px solid; - border-left: none; - height: 50%; - border-color: var(--mud-palette-text-primary); - - &.mud-stepper-header-dash-vertical { - min-width: unset; - border-bottom: none; - border-left: 2px solid; - border-color: var(--mud-palette-primary); - - &.dash-tiny { - height: 20px; - } - } - - &.mud-stepper-header-dash-completed { - border-bottom: 2px solid; - - @each $color in $mud-palette-colors { - &.mud-stepper-border-#{$color} { - border-color: var(--mud-palette-#{$color}); - } - } - } +.mud-stepper-badge{ + z-index: 21; } diff --git a/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.css b/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.css index d636fe2d..9a2bf01d 100644 --- a/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.css +++ b/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.css @@ -240,37 +240,8 @@ .mud-stepper-header.mud-stepper-header-non-linear:hover { background-color: var(--mud-palette-action-default-hover); } -.mud-stepper-header-dash { - min-width: 50px; - border-bottom: 1px solid; - border-left: none; - height: 50%; - border-color: var(--mud-palette-text-primary); } - .mud-stepper-header-dash.mud-stepper-header-dash-vertical { - min-width: unset; - border-bottom: none; - border-left: 2px solid; - border-color: var(--mud-palette-primary); } - .mud-stepper-header-dash.mud-stepper-header-dash-vertical.dash-tiny { - height: 20px; } - .mud-stepper-header-dash.mud-stepper-header-dash-completed { - border-bottom: 2px solid; } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-primary { - border-color: var(--mud-palette-primary); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-secondary { - border-color: var(--mud-palette-secondary); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-tertiary { - border-color: var(--mud-palette-tertiary); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-info { - border-color: var(--mud-palette-info); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-success { - border-color: var(--mud-palette-success); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-warning { - border-color: var(--mud-palette-warning); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-error { - border-color: var(--mud-palette-error); } - .mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-dark { - border-color: var(--mud-palette-dark); } +.mud-stepper-badge { + z-index: 21; } .mud-switch-m3 { cursor: pointer; diff --git a/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.min.css b/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.min.css index 9824f153..bb3be9be 100644 --- a/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.min.css +++ b/CodeBeam.MudBlazor.Extensions/Styles/MudExtensions.min.css @@ -1 +1 @@ -.mud-gallery-selected-toolbox{left:0;right:0;height:56px;width:100%;background-color:rgba(0,0,0,.6);}.mud-gallery-selected-toolbox.gallery-toolbox-top{top:0;}.mud-gallery-selected-toolbox.gallery-toolbox-bottom{bottom:0;}.mud-page{display:grid;box-sizing:border-box;width:100%;}.mud-page.mud-page-height-full{min-height:100vh;}.mud-page.mud-page-height-full-without-appbar{min-height:calc(100vh - var(--mud-appbar-height));}.mud-page.mud-page-column-2{grid-template-columns:repeat(2,50%);}.mud-page.mud-page-column-3{grid-template-columns:repeat(3,33.33333%);}.mud-page.mud-page-column-4{grid-template-columns:repeat(4,25%);}.mud-page.mud-page-column-5{grid-template-columns:repeat(5,20%);}.mud-page.mud-page-column-6{grid-template-columns:repeat(6,16.66667%);}.mud-page.mud-page-column-7{grid-template-columns:repeat(7,14.28571%);}.mud-page.mud-page-column-8{grid-template-columns:repeat(8,12.5%);}.mud-page.mud-page-column-9{grid-template-columns:repeat(9,11.11111%);}.mud-page.mud-page-column-10{grid-template-columns:repeat(10,10%);}.mud-page.mud-page-column-11{grid-template-columns:repeat(11,9.09091%);}.mud-page.mud-page-column-12{grid-template-columns:repeat(12,8.33333%);}.mud-page.mud-page-row-2{grid-template-rows:repeat(2,50%);}.mud-page.mud-page-row-3{grid-template-rows:repeat(3,33.33333%);}.mud-page.mud-page-row-4{grid-template-rows:repeat(4,25%);}.mud-page.mud-page-row-5{grid-template-rows:repeat(5,20%);}.mud-page.mud-page-row-6{grid-template-rows:repeat(6,16.66667%);}.mud-page.mud-page-row-7{grid-template-rows:repeat(7,14.28571%);}.mud-page.mud-page-row-8{grid-template-rows:repeat(8,12.5%);}.mud-page.mud-page-row-9{grid-template-rows:repeat(9,11.11111%);}.mud-page.mud-page-row-10{grid-template-rows:repeat(10,10%);}.mud-page.mud-page-row-11{grid-template-rows:repeat(11,9.09091%);}.mud-page.mud-page-row-12{grid-template-rows:repeat(12,8.33333%);}.mud-section{display:inline-grid;overflow:auto;}.mud-section.mud-section-col-start-1{grid-column-start:1;}.mud-section.mud-section-col-start-2{grid-column-start:2;}.mud-section.mud-section-col-start-3{grid-column-start:3;}.mud-section.mud-section-col-start-4{grid-column-start:4;}.mud-section.mud-section-col-start-5{grid-column-start:5;}.mud-section.mud-section-col-start-6{grid-column-start:6;}.mud-section.mud-section-col-start-7{grid-column-start:7;}.mud-section.mud-section-col-start-8{grid-column-start:8;}.mud-section.mud-section-col-start-9{grid-column-start:9;}.mud-section.mud-section-col-start-10{grid-column-start:10;}.mud-section.mud-section-col-start-11{grid-column-start:11;}.mud-section.mud-section-col-start-12{grid-column-start:12;}.mud-section.mud-section-col-end-1{grid-column-end:1;}.mud-section.mud-section-col-end-2{grid-column-end:2;}.mud-section.mud-section-col-end-3{grid-column-end:3;}.mud-section.mud-section-col-end-4{grid-column-end:4;}.mud-section.mud-section-col-end-5{grid-column-end:5;}.mud-section.mud-section-col-end-6{grid-column-end:6;}.mud-section.mud-section-col-end-7{grid-column-end:7;}.mud-section.mud-section-col-end-8{grid-column-end:8;}.mud-section.mud-section-col-end-9{grid-column-end:9;}.mud-section.mud-section-col-end-10{grid-column-end:10;}.mud-section.mud-section-col-end-11{grid-column-end:11;}.mud-section.mud-section-col-end-12{grid-column-end:12;}.mud-section.mud-section-row-start-1{grid-row-start:1;}.mud-section.mud-section-row-start-2{grid-row-start:2;}.mud-section.mud-section-row-start-3{grid-row-start:3;}.mud-section.mud-section-row-start-4{grid-row-start:4;}.mud-section.mud-section-row-start-5{grid-row-start:5;}.mud-section.mud-section-row-start-6{grid-row-start:6;}.mud-section.mud-section-row-start-7{grid-row-start:7;}.mud-section.mud-section-row-start-8{grid-row-start:8;}.mud-section.mud-section-row-start-9{grid-row-start:9;}.mud-section.mud-section-row-start-10{grid-row-start:10;}.mud-section.mud-section-row-start-11{grid-row-start:11;}.mud-section.mud-section-row-start-12{grid-row-start:12;}.mud-section.mud-section-row-end-1{grid-row-end:1;}.mud-section.mud-section-row-end-2{grid-row-end:2;}.mud-section.mud-section-row-end-3{grid-row-end:3;}.mud-section.mud-section-row-end-4{grid-row-end:4;}.mud-section.mud-section-row-end-5{grid-row-end:5;}.mud-section.mud-section-row-end-6{grid-row-end:6;}.mud-section.mud-section-row-end-7{grid-row-end:7;}.mud-section.mud-section-row-end-8{grid-row-end:8;}.mud-section.mud-section-row-end-9{grid-row-end:9;}.mud-section.mud-section-row-end-10{grid-row-end:10;}.mud-section.mud-section-row-end-11{grid-row-end:11;}.mud-section.mud-section-row-end-12{grid-row-end:12;}.mud-popup{z-index:2000;overflow:auto;background-color:var(--mud-palette-background);min-height:var(--mud-appbar-height);}.mud-popup.mud-popup-center{height:300px;left:50%;top:50%;transform:translate(-50%,-50%);width:320px;aspect-ratio:1/1;}.mud-splitter{display:grid;position:relative;width:100%;}.mud-splitter-content{overflow:auto;}.mud-splitter-thumb ::-webkit-slider-runnable-track{visibility:hidden !important;height:100% !important;}.mud-splitter-thumb ::-moz-range-track{visibility:hidden !important;height:100% !important;}.mud-splitter-track{position:absolute;top:50%;transform:translateY(-50%);height:100%;}.mud-splitter-track.mud-slider{visibility:hidden !important;}.mud-splitter-track.mud-slider .mud-slider-container{height:100% !important;}.mud-splitter-track.mud-slider .mud-slider-input{top:50%;}.mud-splitter-thumb ::-webkit-slider-thumb{visibility:visible !important;appearance:none !important;-webkit-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-webkit-slider-thumb{cursor:default !important;}.mud-splitter-thumb ::-moz-range-thumb{visibility:visible !important;appearance:none !important;-moz-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-moz-range-thumb{cursor:default !important;}.mud-stepper-header{min-height:62px;border-radius:var(--mud-default-borderradius);}.mud-stepper-header.mud-stepper-header-non-linear:hover{background-color:var(--mud-palette-action-default-hover);}.mud-stepper-header-dash{min-width:50px;border-bottom:1px solid;border-left:none;height:50%;border-color:var(--mud-palette-text-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-vertical{min-width:unset;border-bottom:none;border-left:2px solid;border-color:var(--mud-palette-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-vertical.dash-tiny{height:20px;}.mud-stepper-header-dash.mud-stepper-header-dash-completed{border-bottom:2px solid;}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-primary{border-color:var(--mud-palette-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-secondary{border-color:var(--mud-palette-secondary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-tertiary{border-color:var(--mud-palette-tertiary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-info{border-color:var(--mud-palette-info);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-success{border-color:var(--mud-palette-success);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-warning{border-color:var(--mud-palette-warning);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-error{border-color:var(--mud-palette-error);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-dark{border-color:var(--mud-palette-dark);}.mud-switch-m3{cursor:pointer;display:inline-flex;align-items:center;vertical-align:middle;-webkit-tap-highlight-color:transparent;}.mud-switch-m3.mud-disabled{color:var(--mud-palette-text-disabled) !important;cursor:default;}.mud-switch-m3.mud-readonly,.mud-switch-m3 .mud-readonly:hover{cursor:default;background-color:transparent !important;}.mud-switch-span-m3{width:52px;height:32px;display:inline-flex;z-index:0;position:relative;box-sizing:border-box;flex-shrink:0;vertical-align:middle;}.mud-switch-span-m3.mud-switch-child-content-m3{margin-inline-end:12px;}.mud-switch-span-m3 .mud-switch-track-m3{width:52px;height:32px;z-index:-1;transition:opacity 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;border-radius:30px;background-color:var(--mud-palette-background);border:2px solid;}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-default-m3{border-color:var(--mud-palette-text-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-primary-m3{border-color:var(--mud-palette-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-secondary-m3{border-color:var(--mud-palette-secondary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-tertiary-m3{border-color:var(--mud-palette-tertiary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-info-m3{border-color:var(--mud-palette-info);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-success-m3{border-color:var(--mud-palette-success);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-warning-m3{border-color:var(--mud-palette-warning);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-error-m3{border-color:var(--mud-palette-error);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-dark-m3{border-color:var(--mud-palette-dark);}.mud-switch-base-m3{padding-top:4px;padding-bottom:4px;padding-inline-start:8px;top:0;left:0;bottom:0;color:#fafafa;z-index:1;position:absolute;transition:left 150ms cubic-bezier(.4,0,.2,1) 0ms,transform 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 250ms cubic-bezier(.4,0,.2,1) 0ms,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-switch-base-m3.mud-switch-base-dense-m3{padding-inline-start:4px;}.mud-switch-base-m3.mud-checked{transform:translateX(20px);padding:4px;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3{opacity:1;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-default{background-color:var(--mud-palette-text-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-primary{background-color:var(--mud-palette-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-secondary{background-color:var(--mud-palette-secondary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-tertiary{background-color:var(--mud-palette-tertiary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-info{background-color:var(--mud-palette-info);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-success{background-color:var(--mud-palette-success);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-warning{background-color:var(--mud-palette-warning);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-error{background-color:var(--mud-palette-error);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-dark{background-color:var(--mud-palette-dark);}.mud-switch-base-m3.mud-checked .mud-switch-thumb-m3{width:24px;height:24px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;background-color:var(--mud-palette-background);}.mud-switch-base-m3:hover{background-color:var(--mud-palette-action-default-hover);}.mud-switch-base-m3.mud-switch-disabled{color:var(--mud-palette-grey-default) !important;}.mud-switch-base-m3.mud-switch-disabled+.mud-switch-track-m3{opacity:.12 !important;}.mud-switch-base-m3.mud-switch-disabled:hover,.mud-switch-base-m3.mud-switch-disabled:focus-visible{cursor:default;background-color:transparent !important;}.mud-switch-button-m3{display:flex;align-items:inherit;justify-content:inherit;}.mud-switch-button-m3 .mud-switch-input-m3{top:0;left:0;width:100%;cursor:inherit;height:100%;margin:0;opacity:0;padding:0;z-index:1;position:absolute;}.mud-switch-button-m3 .mud-switch-thumb-m3{width:16px;height:16px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-default-m3{background-color:var(--mud-palette-text-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-primary-m3{background-color:var(--mud-palette-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-secondary-m3{background-color:var(--mud-palette-secondary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-tertiary-m3{background-color:var(--mud-palette-tertiary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-info-m3{background-color:var(--mud-palette-info);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-success-m3{background-color:var(--mud-palette-success);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-warning-m3{background-color:var(--mud-palette-warning);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-error-m3{background-color:var(--mud-palette-error);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-dark-m3{background-color:var(--mud-palette-dark);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-off-icon-m3{width:24px;height:24px;}.mud-wheel{overflow:hidden;min-width:0;flex-grow:1;user-select:none;-webkit-user-select:none;}.mud-wheel-item{width:100%;display:flex;align-content:center;justify-content:center;color:var(--mud-palette-text-secondary);border-radius:var(--mud-default-borderradius);}.mud-wheel-item.mud-wheel-item:hover:not(.mud-disabled){background-color:var(--mud-palette-action-default-hover);}.mud-wheel-item.wheel-item-closest{color:var(--mud-palette-text);}.mud-wheel-item.wheel-item-empty{min-height:32px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty-dense{min-height:24px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty:hover{background-color:unset;}.mud-wheel-item.mud-disabled{color:var(--mud-palette-text-disabled);}.middle-item{transform:scale(1.2);}.middle-item.mud-disabled{color:var(--mud-palette-text-disabled);}.mud-wheel-border{min-height:2px !important;}.mud-wheel-border.mud-wheel-border-default{background-color:var(--mud-palette-text-primary);}.mud-wheel-border.mud-wheel-border-primary{background-color:var(--mud-palette-primary);}.mud-wheel-border.wheel-border-gradient-primary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-primary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-secondary{background-color:var(--mud-palette-secondary);}.mud-wheel-border.wheel-border-gradient-secondary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-secondary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-tertiary{background-color:var(--mud-palette-tertiary);}.mud-wheel-border.wheel-border-gradient-tertiary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-tertiary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-info{background-color:var(--mud-palette-info);}.mud-wheel-border.wheel-border-gradient-info{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-info),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-success{background-color:var(--mud-palette-success);}.mud-wheel-border.wheel-border-gradient-success{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-success),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-warning{background-color:var(--mud-palette-warning);}.mud-wheel-border.wheel-border-gradient-warning{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-warning),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-error{background-color:var(--mud-palette-error);}.mud-wheel-border.wheel-border-gradient-error{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-error),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-dark{background-color:var(--mud-palette-dark);}.mud-wheel-border.wheel-border-gradient-dark{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-dark),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.wheel-border-gradient-default{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-text-primary),rgba(255,0,0,0));background-color:unset;}.mud-list-extended{margin:0;padding:0;position:relative;list-style:none;}.mud-list-extended.mud-list-padding-extended{padding-top:8px;padding-bottom:8px;}.mud-list-item-extended{width:100%;display:flex;position:relative;box-sizing:border-box;text-align:start;align-items:center;padding-top:8px;padding-bottom:8px;justify-content:flex-start;text-decoration:none;outline:none;}.mud-list-item-extended.mud-list-item-dense-extended{padding-top:4px;padding-bottom:4px;}.mud-list-item-extended.mud-list-item-disabled-extended{color:var(--mud-palette-action-disabled) !important;cursor:default !important;pointer-events:none !important;}.mud-list-item-extended.mud-list-item-disabled-extended .mud-list-item-icon-extended{color:var(--mud-palette-action-disabled) !important;}.mud-list-item-clickable-extended{color:inherit;border:0;cursor:pointer;margin:0;outline:0;user-select:none;border-radius:0;vertical-align:middle;background-color:transparent;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;transition:background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-list-item-clickable-extended:hover:not(.mud-list-item-functional){background-color:var(--mud-palette-action-default-hover);}.mud-list-item-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-item-text-extended{flex:1 1 auto;min-width:0;margin-top:4px;margin-bottom:4px;padding-inline-start:8px;padding-inline-end:8px;}.mud-list-item-text-inset-extended{padding-left:56px;padding-inline-start:56px;padding-inline-end:unset;}.mud-list-item-icon-extended{color:var(--mud-palette-action-default);display:inline-flex;flex-shrink:0;padding-inline-start:8px;padding-inline-end:8px;margin-inline-start:-4px;margin-inline-end:4px;}.mud-list-item-multiselect-extended{max-height:32px;}.mud-list-item-multiselect-extended.mud-list-item-multiselect-checkbox-extended{padding-inline-end:16px;}.mud-list-subheader-extended{color:var(--mud-palette-action-default);background-color:var(--mud-palette-background);font-size:.875rem;box-sizing:border-box;list-style:none;font-weight:500;padding-top:16px;padding-bottom:16px;}.mud-list-subheader-secondary-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-subheader-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-subheader-inset-extended{padding-left:72px;padding-inline-start:72px;padding-inline-end:unset;}.mud-list-subheader-sticky-extended{top:-8px;z-index:1;position:sticky;}.mud-list-subheader-sticky-extended.mud-list-subheader-sticky-dense-extended{top:0;}.mud-list-item-hilight-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-nested-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-avatar-extended{min-width:56px;flex-shrink:0;}.mud-nested-list-extended>.mud-list-item-extended{padding-left:32px;padding-inline-start:32px;padding-inline-end:unset;}.mud-select-extended{display:flex;flex-grow:1;flex-basis:0;min-width:0;position:relative;}.mud-select-extended.mud-autocomplete{display:block;}.mud-select-extended.mud-autocomplete .mud-select-input-extended{cursor:text;}.mud-select-extended.mud-autocomplete .mud-input-adornment-extended{cursor:pointer;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended input{padding-right:3.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-input-adorned-end input{padding-right:4.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended .mud-icon-button{display:none !important;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular{position:absolute;width:100%;top:0;bottom:0;display:flex;align-items:center;justify-content:flex-end;padding-top:.25rem;padding-bottom:.25rem;padding-right:1rem;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular--with-adornment{padding-right:3rem;}.mud-select-extended.mud-autocomplete--with-progress .mud-progress-linear{position:absolute;bottom:-1px;height:2px;}.mud-select-extended .mud-select-input-extended{cursor:pointer;}.mud-select-extended .mud-select-input-extended .mud-input-slot{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.mud-select-extended .mud-select-input-extended .mud-input-adornment-end{margin-left:0;}.mud-select-extended .mud-select-input-extended:disabled{cursor:default;}.mud-select-extended .mud-disabled .mud-select-input{cursor:default;}.mud-select-extended>.mud-form-helpertext{margin-top:-21px;}.mud-select-all-extended{margin-top:10px;border-bottom:1px solid #d3d3d3;padding-bottom:18px;}.mud-input-adornment-start-extended:not(.mud-input-text-extended){margin-inline-start:12px;}.mud-input-adornment-start-extended.mud-input-filled-extended{margin-top:16px;}.mud-input-adornment-end-extended:not(.mud-input-text-extended){margin-inline-end:12px;} \ No newline at end of file +.mud-gallery-selected-toolbox{left:0;right:0;height:56px;width:100%;background-color:rgba(0,0,0,.6);}.mud-gallery-selected-toolbox.gallery-toolbox-top{top:0;}.mud-gallery-selected-toolbox.gallery-toolbox-bottom{bottom:0;}.mud-page{display:grid;box-sizing:border-box;width:100%;}.mud-page.mud-page-height-full{min-height:100vh;}.mud-page.mud-page-height-full-without-appbar{min-height:calc(100vh - var(--mud-appbar-height));}.mud-page.mud-page-column-2{grid-template-columns:repeat(2,50%);}.mud-page.mud-page-column-3{grid-template-columns:repeat(3,33.33333%);}.mud-page.mud-page-column-4{grid-template-columns:repeat(4,25%);}.mud-page.mud-page-column-5{grid-template-columns:repeat(5,20%);}.mud-page.mud-page-column-6{grid-template-columns:repeat(6,16.66667%);}.mud-page.mud-page-column-7{grid-template-columns:repeat(7,14.28571%);}.mud-page.mud-page-column-8{grid-template-columns:repeat(8,12.5%);}.mud-page.mud-page-column-9{grid-template-columns:repeat(9,11.11111%);}.mud-page.mud-page-column-10{grid-template-columns:repeat(10,10%);}.mud-page.mud-page-column-11{grid-template-columns:repeat(11,9.09091%);}.mud-page.mud-page-column-12{grid-template-columns:repeat(12,8.33333%);}.mud-page.mud-page-row-2{grid-template-rows:repeat(2,50%);}.mud-page.mud-page-row-3{grid-template-rows:repeat(3,33.33333%);}.mud-page.mud-page-row-4{grid-template-rows:repeat(4,25%);}.mud-page.mud-page-row-5{grid-template-rows:repeat(5,20%);}.mud-page.mud-page-row-6{grid-template-rows:repeat(6,16.66667%);}.mud-page.mud-page-row-7{grid-template-rows:repeat(7,14.28571%);}.mud-page.mud-page-row-8{grid-template-rows:repeat(8,12.5%);}.mud-page.mud-page-row-9{grid-template-rows:repeat(9,11.11111%);}.mud-page.mud-page-row-10{grid-template-rows:repeat(10,10%);}.mud-page.mud-page-row-11{grid-template-rows:repeat(11,9.09091%);}.mud-page.mud-page-row-12{grid-template-rows:repeat(12,8.33333%);}.mud-section{display:inline-grid;overflow:auto;}.mud-section.mud-section-col-start-1{grid-column-start:1;}.mud-section.mud-section-col-start-2{grid-column-start:2;}.mud-section.mud-section-col-start-3{grid-column-start:3;}.mud-section.mud-section-col-start-4{grid-column-start:4;}.mud-section.mud-section-col-start-5{grid-column-start:5;}.mud-section.mud-section-col-start-6{grid-column-start:6;}.mud-section.mud-section-col-start-7{grid-column-start:7;}.mud-section.mud-section-col-start-8{grid-column-start:8;}.mud-section.mud-section-col-start-9{grid-column-start:9;}.mud-section.mud-section-col-start-10{grid-column-start:10;}.mud-section.mud-section-col-start-11{grid-column-start:11;}.mud-section.mud-section-col-start-12{grid-column-start:12;}.mud-section.mud-section-col-end-1{grid-column-end:1;}.mud-section.mud-section-col-end-2{grid-column-end:2;}.mud-section.mud-section-col-end-3{grid-column-end:3;}.mud-section.mud-section-col-end-4{grid-column-end:4;}.mud-section.mud-section-col-end-5{grid-column-end:5;}.mud-section.mud-section-col-end-6{grid-column-end:6;}.mud-section.mud-section-col-end-7{grid-column-end:7;}.mud-section.mud-section-col-end-8{grid-column-end:8;}.mud-section.mud-section-col-end-9{grid-column-end:9;}.mud-section.mud-section-col-end-10{grid-column-end:10;}.mud-section.mud-section-col-end-11{grid-column-end:11;}.mud-section.mud-section-col-end-12{grid-column-end:12;}.mud-section.mud-section-row-start-1{grid-row-start:1;}.mud-section.mud-section-row-start-2{grid-row-start:2;}.mud-section.mud-section-row-start-3{grid-row-start:3;}.mud-section.mud-section-row-start-4{grid-row-start:4;}.mud-section.mud-section-row-start-5{grid-row-start:5;}.mud-section.mud-section-row-start-6{grid-row-start:6;}.mud-section.mud-section-row-start-7{grid-row-start:7;}.mud-section.mud-section-row-start-8{grid-row-start:8;}.mud-section.mud-section-row-start-9{grid-row-start:9;}.mud-section.mud-section-row-start-10{grid-row-start:10;}.mud-section.mud-section-row-start-11{grid-row-start:11;}.mud-section.mud-section-row-start-12{grid-row-start:12;}.mud-section.mud-section-row-end-1{grid-row-end:1;}.mud-section.mud-section-row-end-2{grid-row-end:2;}.mud-section.mud-section-row-end-3{grid-row-end:3;}.mud-section.mud-section-row-end-4{grid-row-end:4;}.mud-section.mud-section-row-end-5{grid-row-end:5;}.mud-section.mud-section-row-end-6{grid-row-end:6;}.mud-section.mud-section-row-end-7{grid-row-end:7;}.mud-section.mud-section-row-end-8{grid-row-end:8;}.mud-section.mud-section-row-end-9{grid-row-end:9;}.mud-section.mud-section-row-end-10{grid-row-end:10;}.mud-section.mud-section-row-end-11{grid-row-end:11;}.mud-section.mud-section-row-end-12{grid-row-end:12;}.mud-popup{z-index:2000;overflow:auto;background-color:var(--mud-palette-background);min-height:var(--mud-appbar-height);}.mud-popup.mud-popup-center{height:300px;left:50%;top:50%;transform:translate(-50%,-50%);width:320px;aspect-ratio:1/1;}.mud-splitter{display:grid;position:relative;width:100%;}.mud-splitter-content{overflow:auto;}.mud-splitter-thumb ::-webkit-slider-runnable-track{visibility:hidden !important;height:100% !important;}.mud-splitter-thumb ::-moz-range-track{visibility:hidden !important;height:100% !important;}.mud-splitter-track{position:absolute;top:50%;transform:translateY(-50%);height:100%;}.mud-splitter-track.mud-slider{visibility:hidden !important;}.mud-splitter-track.mud-slider .mud-slider-container{height:100% !important;}.mud-splitter-track.mud-slider .mud-slider-input{top:50%;}.mud-splitter-thumb ::-webkit-slider-thumb{visibility:visible !important;appearance:none !important;-webkit-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-webkit-slider-thumb{cursor:default !important;}.mud-splitter-thumb ::-moz-range-thumb{visibility:visible !important;appearance:none !important;-moz-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-moz-range-thumb{cursor:default !important;}.mud-stepper-header{min-height:62px;border-radius:var(--mud-default-borderradius);}.mud-stepper-header.mud-stepper-header-non-linear:hover{background-color:var(--mud-palette-action-default-hover);}.mud-stepper-badge{z-index:21;}.mud-switch-m3{cursor:pointer;display:inline-flex;align-items:center;vertical-align:middle;-webkit-tap-highlight-color:transparent;}.mud-switch-m3.mud-disabled{color:var(--mud-palette-text-disabled) !important;cursor:default;}.mud-switch-m3.mud-readonly,.mud-switch-m3 .mud-readonly:hover{cursor:default;background-color:transparent !important;}.mud-switch-span-m3{width:52px;height:32px;display:inline-flex;z-index:0;position:relative;box-sizing:border-box;flex-shrink:0;vertical-align:middle;}.mud-switch-span-m3.mud-switch-child-content-m3{margin-inline-end:12px;}.mud-switch-span-m3 .mud-switch-track-m3{width:52px;height:32px;z-index:-1;transition:opacity 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;border-radius:30px;background-color:var(--mud-palette-background);border:2px solid;}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-default-m3{border-color:var(--mud-palette-text-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-primary-m3{border-color:var(--mud-palette-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-secondary-m3{border-color:var(--mud-palette-secondary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-tertiary-m3{border-color:var(--mud-palette-tertiary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-info-m3{border-color:var(--mud-palette-info);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-success-m3{border-color:var(--mud-palette-success);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-warning-m3{border-color:var(--mud-palette-warning);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-error-m3{border-color:var(--mud-palette-error);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-dark-m3{border-color:var(--mud-palette-dark);}.mud-switch-base-m3{padding-top:4px;padding-bottom:4px;padding-inline-start:8px;top:0;left:0;bottom:0;color:#fafafa;z-index:1;position:absolute;transition:left 150ms cubic-bezier(.4,0,.2,1) 0ms,transform 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 250ms cubic-bezier(.4,0,.2,1) 0ms,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-switch-base-m3.mud-switch-base-dense-m3{padding-inline-start:4px;}.mud-switch-base-m3.mud-checked{transform:translateX(20px);padding:4px;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3{opacity:1;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-default{background-color:var(--mud-palette-text-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-primary{background-color:var(--mud-palette-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-secondary{background-color:var(--mud-palette-secondary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-tertiary{background-color:var(--mud-palette-tertiary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-info{background-color:var(--mud-palette-info);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-success{background-color:var(--mud-palette-success);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-warning{background-color:var(--mud-palette-warning);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-error{background-color:var(--mud-palette-error);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-dark{background-color:var(--mud-palette-dark);}.mud-switch-base-m3.mud-checked .mud-switch-thumb-m3{width:24px;height:24px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;background-color:var(--mud-palette-background);}.mud-switch-base-m3:hover{background-color:var(--mud-palette-action-default-hover);}.mud-switch-base-m3.mud-switch-disabled{color:var(--mud-palette-grey-default) !important;}.mud-switch-base-m3.mud-switch-disabled+.mud-switch-track-m3{opacity:.12 !important;}.mud-switch-base-m3.mud-switch-disabled:hover,.mud-switch-base-m3.mud-switch-disabled:focus-visible{cursor:default;background-color:transparent !important;}.mud-switch-button-m3{display:flex;align-items:inherit;justify-content:inherit;}.mud-switch-button-m3 .mud-switch-input-m3{top:0;left:0;width:100%;cursor:inherit;height:100%;margin:0;opacity:0;padding:0;z-index:1;position:absolute;}.mud-switch-button-m3 .mud-switch-thumb-m3{width:16px;height:16px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-default-m3{background-color:var(--mud-palette-text-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-primary-m3{background-color:var(--mud-palette-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-secondary-m3{background-color:var(--mud-palette-secondary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-tertiary-m3{background-color:var(--mud-palette-tertiary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-info-m3{background-color:var(--mud-palette-info);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-success-m3{background-color:var(--mud-palette-success);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-warning-m3{background-color:var(--mud-palette-warning);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-error-m3{background-color:var(--mud-palette-error);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-dark-m3{background-color:var(--mud-palette-dark);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-off-icon-m3{width:24px;height:24px;}.mud-wheel{overflow:hidden;min-width:0;flex-grow:1;user-select:none;-webkit-user-select:none;}.mud-wheel-item{width:100%;display:flex;align-content:center;justify-content:center;color:var(--mud-palette-text-secondary);border-radius:var(--mud-default-borderradius);}.mud-wheel-item.mud-wheel-item:hover:not(.mud-disabled){background-color:var(--mud-palette-action-default-hover);}.mud-wheel-item.wheel-item-closest{color:var(--mud-palette-text);}.mud-wheel-item.wheel-item-empty{min-height:32px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty-dense{min-height:24px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty:hover{background-color:unset;}.mud-wheel-item.mud-disabled{color:var(--mud-palette-text-disabled);}.middle-item{transform:scale(1.2);}.middle-item.mud-disabled{color:var(--mud-palette-text-disabled);}.mud-wheel-border{min-height:2px !important;}.mud-wheel-border.mud-wheel-border-default{background-color:var(--mud-palette-text-primary);}.mud-wheel-border.mud-wheel-border-primary{background-color:var(--mud-palette-primary);}.mud-wheel-border.wheel-border-gradient-primary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-primary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-secondary{background-color:var(--mud-palette-secondary);}.mud-wheel-border.wheel-border-gradient-secondary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-secondary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-tertiary{background-color:var(--mud-palette-tertiary);}.mud-wheel-border.wheel-border-gradient-tertiary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-tertiary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-info{background-color:var(--mud-palette-info);}.mud-wheel-border.wheel-border-gradient-info{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-info),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-success{background-color:var(--mud-palette-success);}.mud-wheel-border.wheel-border-gradient-success{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-success),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-warning{background-color:var(--mud-palette-warning);}.mud-wheel-border.wheel-border-gradient-warning{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-warning),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-error{background-color:var(--mud-palette-error);}.mud-wheel-border.wheel-border-gradient-error{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-error),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-dark{background-color:var(--mud-palette-dark);}.mud-wheel-border.wheel-border-gradient-dark{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-dark),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.wheel-border-gradient-default{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-text-primary),rgba(255,0,0,0));background-color:unset;}.mud-list-extended{margin:0;padding:0;position:relative;list-style:none;}.mud-list-extended.mud-list-padding-extended{padding-top:8px;padding-bottom:8px;}.mud-list-item-extended{width:100%;display:flex;position:relative;box-sizing:border-box;text-align:start;align-items:center;padding-top:8px;padding-bottom:8px;justify-content:flex-start;text-decoration:none;outline:none;}.mud-list-item-extended.mud-list-item-dense-extended{padding-top:4px;padding-bottom:4px;}.mud-list-item-extended.mud-list-item-disabled-extended{color:var(--mud-palette-action-disabled) !important;cursor:default !important;pointer-events:none !important;}.mud-list-item-extended.mud-list-item-disabled-extended .mud-list-item-icon-extended{color:var(--mud-palette-action-disabled) !important;}.mud-list-item-clickable-extended{color:inherit;border:0;cursor:pointer;margin:0;outline:0;user-select:none;border-radius:0;vertical-align:middle;background-color:transparent;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;transition:background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-list-item-clickable-extended:hover:not(.mud-list-item-functional){background-color:var(--mud-palette-action-default-hover);}.mud-list-item-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-item-text-extended{flex:1 1 auto;min-width:0;margin-top:4px;margin-bottom:4px;padding-inline-start:8px;padding-inline-end:8px;}.mud-list-item-text-inset-extended{padding-left:56px;padding-inline-start:56px;padding-inline-end:unset;}.mud-list-item-icon-extended{color:var(--mud-palette-action-default);display:inline-flex;flex-shrink:0;padding-inline-start:8px;padding-inline-end:8px;margin-inline-start:-4px;margin-inline-end:4px;}.mud-list-item-multiselect-extended{max-height:32px;}.mud-list-item-multiselect-extended.mud-list-item-multiselect-checkbox-extended{padding-inline-end:16px;}.mud-list-subheader-extended{color:var(--mud-palette-action-default);background-color:var(--mud-palette-background);font-size:.875rem;box-sizing:border-box;list-style:none;font-weight:500;padding-top:16px;padding-bottom:16px;}.mud-list-subheader-secondary-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-subheader-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-subheader-inset-extended{padding-left:72px;padding-inline-start:72px;padding-inline-end:unset;}.mud-list-subheader-sticky-extended{top:-8px;z-index:1;position:sticky;}.mud-list-subheader-sticky-extended.mud-list-subheader-sticky-dense-extended{top:0;}.mud-list-item-hilight-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-nested-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-avatar-extended{min-width:56px;flex-shrink:0;}.mud-nested-list-extended>.mud-list-item-extended{padding-left:32px;padding-inline-start:32px;padding-inline-end:unset;}.mud-select-extended{display:flex;flex-grow:1;flex-basis:0;min-width:0;position:relative;}.mud-select-extended.mud-autocomplete{display:block;}.mud-select-extended.mud-autocomplete .mud-select-input-extended{cursor:text;}.mud-select-extended.mud-autocomplete .mud-input-adornment-extended{cursor:pointer;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended input{padding-right:3.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-input-adorned-end input{padding-right:4.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended .mud-icon-button{display:none !important;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular{position:absolute;width:100%;top:0;bottom:0;display:flex;align-items:center;justify-content:flex-end;padding-top:.25rem;padding-bottom:.25rem;padding-right:1rem;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular--with-adornment{padding-right:3rem;}.mud-select-extended.mud-autocomplete--with-progress .mud-progress-linear{position:absolute;bottom:-1px;height:2px;}.mud-select-extended .mud-select-input-extended{cursor:pointer;}.mud-select-extended .mud-select-input-extended .mud-input-slot{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.mud-select-extended .mud-select-input-extended .mud-input-adornment-end{margin-left:0;}.mud-select-extended .mud-select-input-extended:disabled{cursor:default;}.mud-select-extended .mud-disabled .mud-select-input{cursor:default;}.mud-select-extended>.mud-form-helpertext{margin-top:-21px;}.mud-select-all-extended{margin-top:10px;border-bottom:1px solid #d3d3d3;padding-bottom:18px;}.mud-input-adornment-start-extended:not(.mud-input-text-extended){margin-inline-start:12px;}.mud-input-adornment-start-extended.mud-input-filled-extended{margin-top:16px;}.mud-input-adornment-end-extended:not(.mud-input-text-extended){margin-inline-end:12px;} \ No newline at end of file diff --git a/CodeBeam.MudBlazor.Extensions/wwwroot/MudExtensions.min.css b/CodeBeam.MudBlazor.Extensions/wwwroot/MudExtensions.min.css index 9824f153..bb3be9be 100644 --- a/CodeBeam.MudBlazor.Extensions/wwwroot/MudExtensions.min.css +++ b/CodeBeam.MudBlazor.Extensions/wwwroot/MudExtensions.min.css @@ -1 +1 @@ -.mud-gallery-selected-toolbox{left:0;right:0;height:56px;width:100%;background-color:rgba(0,0,0,.6);}.mud-gallery-selected-toolbox.gallery-toolbox-top{top:0;}.mud-gallery-selected-toolbox.gallery-toolbox-bottom{bottom:0;}.mud-page{display:grid;box-sizing:border-box;width:100%;}.mud-page.mud-page-height-full{min-height:100vh;}.mud-page.mud-page-height-full-without-appbar{min-height:calc(100vh - var(--mud-appbar-height));}.mud-page.mud-page-column-2{grid-template-columns:repeat(2,50%);}.mud-page.mud-page-column-3{grid-template-columns:repeat(3,33.33333%);}.mud-page.mud-page-column-4{grid-template-columns:repeat(4,25%);}.mud-page.mud-page-column-5{grid-template-columns:repeat(5,20%);}.mud-page.mud-page-column-6{grid-template-columns:repeat(6,16.66667%);}.mud-page.mud-page-column-7{grid-template-columns:repeat(7,14.28571%);}.mud-page.mud-page-column-8{grid-template-columns:repeat(8,12.5%);}.mud-page.mud-page-column-9{grid-template-columns:repeat(9,11.11111%);}.mud-page.mud-page-column-10{grid-template-columns:repeat(10,10%);}.mud-page.mud-page-column-11{grid-template-columns:repeat(11,9.09091%);}.mud-page.mud-page-column-12{grid-template-columns:repeat(12,8.33333%);}.mud-page.mud-page-row-2{grid-template-rows:repeat(2,50%);}.mud-page.mud-page-row-3{grid-template-rows:repeat(3,33.33333%);}.mud-page.mud-page-row-4{grid-template-rows:repeat(4,25%);}.mud-page.mud-page-row-5{grid-template-rows:repeat(5,20%);}.mud-page.mud-page-row-6{grid-template-rows:repeat(6,16.66667%);}.mud-page.mud-page-row-7{grid-template-rows:repeat(7,14.28571%);}.mud-page.mud-page-row-8{grid-template-rows:repeat(8,12.5%);}.mud-page.mud-page-row-9{grid-template-rows:repeat(9,11.11111%);}.mud-page.mud-page-row-10{grid-template-rows:repeat(10,10%);}.mud-page.mud-page-row-11{grid-template-rows:repeat(11,9.09091%);}.mud-page.mud-page-row-12{grid-template-rows:repeat(12,8.33333%);}.mud-section{display:inline-grid;overflow:auto;}.mud-section.mud-section-col-start-1{grid-column-start:1;}.mud-section.mud-section-col-start-2{grid-column-start:2;}.mud-section.mud-section-col-start-3{grid-column-start:3;}.mud-section.mud-section-col-start-4{grid-column-start:4;}.mud-section.mud-section-col-start-5{grid-column-start:5;}.mud-section.mud-section-col-start-6{grid-column-start:6;}.mud-section.mud-section-col-start-7{grid-column-start:7;}.mud-section.mud-section-col-start-8{grid-column-start:8;}.mud-section.mud-section-col-start-9{grid-column-start:9;}.mud-section.mud-section-col-start-10{grid-column-start:10;}.mud-section.mud-section-col-start-11{grid-column-start:11;}.mud-section.mud-section-col-start-12{grid-column-start:12;}.mud-section.mud-section-col-end-1{grid-column-end:1;}.mud-section.mud-section-col-end-2{grid-column-end:2;}.mud-section.mud-section-col-end-3{grid-column-end:3;}.mud-section.mud-section-col-end-4{grid-column-end:4;}.mud-section.mud-section-col-end-5{grid-column-end:5;}.mud-section.mud-section-col-end-6{grid-column-end:6;}.mud-section.mud-section-col-end-7{grid-column-end:7;}.mud-section.mud-section-col-end-8{grid-column-end:8;}.mud-section.mud-section-col-end-9{grid-column-end:9;}.mud-section.mud-section-col-end-10{grid-column-end:10;}.mud-section.mud-section-col-end-11{grid-column-end:11;}.mud-section.mud-section-col-end-12{grid-column-end:12;}.mud-section.mud-section-row-start-1{grid-row-start:1;}.mud-section.mud-section-row-start-2{grid-row-start:2;}.mud-section.mud-section-row-start-3{grid-row-start:3;}.mud-section.mud-section-row-start-4{grid-row-start:4;}.mud-section.mud-section-row-start-5{grid-row-start:5;}.mud-section.mud-section-row-start-6{grid-row-start:6;}.mud-section.mud-section-row-start-7{grid-row-start:7;}.mud-section.mud-section-row-start-8{grid-row-start:8;}.mud-section.mud-section-row-start-9{grid-row-start:9;}.mud-section.mud-section-row-start-10{grid-row-start:10;}.mud-section.mud-section-row-start-11{grid-row-start:11;}.mud-section.mud-section-row-start-12{grid-row-start:12;}.mud-section.mud-section-row-end-1{grid-row-end:1;}.mud-section.mud-section-row-end-2{grid-row-end:2;}.mud-section.mud-section-row-end-3{grid-row-end:3;}.mud-section.mud-section-row-end-4{grid-row-end:4;}.mud-section.mud-section-row-end-5{grid-row-end:5;}.mud-section.mud-section-row-end-6{grid-row-end:6;}.mud-section.mud-section-row-end-7{grid-row-end:7;}.mud-section.mud-section-row-end-8{grid-row-end:8;}.mud-section.mud-section-row-end-9{grid-row-end:9;}.mud-section.mud-section-row-end-10{grid-row-end:10;}.mud-section.mud-section-row-end-11{grid-row-end:11;}.mud-section.mud-section-row-end-12{grid-row-end:12;}.mud-popup{z-index:2000;overflow:auto;background-color:var(--mud-palette-background);min-height:var(--mud-appbar-height);}.mud-popup.mud-popup-center{height:300px;left:50%;top:50%;transform:translate(-50%,-50%);width:320px;aspect-ratio:1/1;}.mud-splitter{display:grid;position:relative;width:100%;}.mud-splitter-content{overflow:auto;}.mud-splitter-thumb ::-webkit-slider-runnable-track{visibility:hidden !important;height:100% !important;}.mud-splitter-thumb ::-moz-range-track{visibility:hidden !important;height:100% !important;}.mud-splitter-track{position:absolute;top:50%;transform:translateY(-50%);height:100%;}.mud-splitter-track.mud-slider{visibility:hidden !important;}.mud-splitter-track.mud-slider .mud-slider-container{height:100% !important;}.mud-splitter-track.mud-slider .mud-slider-input{top:50%;}.mud-splitter-thumb ::-webkit-slider-thumb{visibility:visible !important;appearance:none !important;-webkit-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-webkit-slider-thumb{cursor:default !important;}.mud-splitter-thumb ::-moz-range-thumb{visibility:visible !important;appearance:none !important;-moz-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-moz-range-thumb{cursor:default !important;}.mud-stepper-header{min-height:62px;border-radius:var(--mud-default-borderradius);}.mud-stepper-header.mud-stepper-header-non-linear:hover{background-color:var(--mud-palette-action-default-hover);}.mud-stepper-header-dash{min-width:50px;border-bottom:1px solid;border-left:none;height:50%;border-color:var(--mud-palette-text-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-vertical{min-width:unset;border-bottom:none;border-left:2px solid;border-color:var(--mud-palette-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-vertical.dash-tiny{height:20px;}.mud-stepper-header-dash.mud-stepper-header-dash-completed{border-bottom:2px solid;}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-primary{border-color:var(--mud-palette-primary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-secondary{border-color:var(--mud-palette-secondary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-tertiary{border-color:var(--mud-palette-tertiary);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-info{border-color:var(--mud-palette-info);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-success{border-color:var(--mud-palette-success);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-warning{border-color:var(--mud-palette-warning);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-error{border-color:var(--mud-palette-error);}.mud-stepper-header-dash.mud-stepper-header-dash-completed.mud-stepper-border-dark{border-color:var(--mud-palette-dark);}.mud-switch-m3{cursor:pointer;display:inline-flex;align-items:center;vertical-align:middle;-webkit-tap-highlight-color:transparent;}.mud-switch-m3.mud-disabled{color:var(--mud-palette-text-disabled) !important;cursor:default;}.mud-switch-m3.mud-readonly,.mud-switch-m3 .mud-readonly:hover{cursor:default;background-color:transparent !important;}.mud-switch-span-m3{width:52px;height:32px;display:inline-flex;z-index:0;position:relative;box-sizing:border-box;flex-shrink:0;vertical-align:middle;}.mud-switch-span-m3.mud-switch-child-content-m3{margin-inline-end:12px;}.mud-switch-span-m3 .mud-switch-track-m3{width:52px;height:32px;z-index:-1;transition:opacity 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;border-radius:30px;background-color:var(--mud-palette-background);border:2px solid;}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-default-m3{border-color:var(--mud-palette-text-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-primary-m3{border-color:var(--mud-palette-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-secondary-m3{border-color:var(--mud-palette-secondary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-tertiary-m3{border-color:var(--mud-palette-tertiary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-info-m3{border-color:var(--mud-palette-info);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-success-m3{border-color:var(--mud-palette-success);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-warning-m3{border-color:var(--mud-palette-warning);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-error-m3{border-color:var(--mud-palette-error);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-dark-m3{border-color:var(--mud-palette-dark);}.mud-switch-base-m3{padding-top:4px;padding-bottom:4px;padding-inline-start:8px;top:0;left:0;bottom:0;color:#fafafa;z-index:1;position:absolute;transition:left 150ms cubic-bezier(.4,0,.2,1) 0ms,transform 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 250ms cubic-bezier(.4,0,.2,1) 0ms,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-switch-base-m3.mud-switch-base-dense-m3{padding-inline-start:4px;}.mud-switch-base-m3.mud-checked{transform:translateX(20px);padding:4px;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3{opacity:1;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-default{background-color:var(--mud-palette-text-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-primary{background-color:var(--mud-palette-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-secondary{background-color:var(--mud-palette-secondary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-tertiary{background-color:var(--mud-palette-tertiary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-info{background-color:var(--mud-palette-info);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-success{background-color:var(--mud-palette-success);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-warning{background-color:var(--mud-palette-warning);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-error{background-color:var(--mud-palette-error);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-dark{background-color:var(--mud-palette-dark);}.mud-switch-base-m3.mud-checked .mud-switch-thumb-m3{width:24px;height:24px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;background-color:var(--mud-palette-background);}.mud-switch-base-m3:hover{background-color:var(--mud-palette-action-default-hover);}.mud-switch-base-m3.mud-switch-disabled{color:var(--mud-palette-grey-default) !important;}.mud-switch-base-m3.mud-switch-disabled+.mud-switch-track-m3{opacity:.12 !important;}.mud-switch-base-m3.mud-switch-disabled:hover,.mud-switch-base-m3.mud-switch-disabled:focus-visible{cursor:default;background-color:transparent !important;}.mud-switch-button-m3{display:flex;align-items:inherit;justify-content:inherit;}.mud-switch-button-m3 .mud-switch-input-m3{top:0;left:0;width:100%;cursor:inherit;height:100%;margin:0;opacity:0;padding:0;z-index:1;position:absolute;}.mud-switch-button-m3 .mud-switch-thumb-m3{width:16px;height:16px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-default-m3{background-color:var(--mud-palette-text-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-primary-m3{background-color:var(--mud-palette-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-secondary-m3{background-color:var(--mud-palette-secondary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-tertiary-m3{background-color:var(--mud-palette-tertiary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-info-m3{background-color:var(--mud-palette-info);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-success-m3{background-color:var(--mud-palette-success);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-warning-m3{background-color:var(--mud-palette-warning);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-error-m3{background-color:var(--mud-palette-error);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-dark-m3{background-color:var(--mud-palette-dark);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-off-icon-m3{width:24px;height:24px;}.mud-wheel{overflow:hidden;min-width:0;flex-grow:1;user-select:none;-webkit-user-select:none;}.mud-wheel-item{width:100%;display:flex;align-content:center;justify-content:center;color:var(--mud-palette-text-secondary);border-radius:var(--mud-default-borderradius);}.mud-wheel-item.mud-wheel-item:hover:not(.mud-disabled){background-color:var(--mud-palette-action-default-hover);}.mud-wheel-item.wheel-item-closest{color:var(--mud-palette-text);}.mud-wheel-item.wheel-item-empty{min-height:32px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty-dense{min-height:24px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty:hover{background-color:unset;}.mud-wheel-item.mud-disabled{color:var(--mud-palette-text-disabled);}.middle-item{transform:scale(1.2);}.middle-item.mud-disabled{color:var(--mud-palette-text-disabled);}.mud-wheel-border{min-height:2px !important;}.mud-wheel-border.mud-wheel-border-default{background-color:var(--mud-palette-text-primary);}.mud-wheel-border.mud-wheel-border-primary{background-color:var(--mud-palette-primary);}.mud-wheel-border.wheel-border-gradient-primary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-primary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-secondary{background-color:var(--mud-palette-secondary);}.mud-wheel-border.wheel-border-gradient-secondary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-secondary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-tertiary{background-color:var(--mud-palette-tertiary);}.mud-wheel-border.wheel-border-gradient-tertiary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-tertiary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-info{background-color:var(--mud-palette-info);}.mud-wheel-border.wheel-border-gradient-info{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-info),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-success{background-color:var(--mud-palette-success);}.mud-wheel-border.wheel-border-gradient-success{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-success),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-warning{background-color:var(--mud-palette-warning);}.mud-wheel-border.wheel-border-gradient-warning{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-warning),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-error{background-color:var(--mud-palette-error);}.mud-wheel-border.wheel-border-gradient-error{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-error),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-dark{background-color:var(--mud-palette-dark);}.mud-wheel-border.wheel-border-gradient-dark{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-dark),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.wheel-border-gradient-default{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-text-primary),rgba(255,0,0,0));background-color:unset;}.mud-list-extended{margin:0;padding:0;position:relative;list-style:none;}.mud-list-extended.mud-list-padding-extended{padding-top:8px;padding-bottom:8px;}.mud-list-item-extended{width:100%;display:flex;position:relative;box-sizing:border-box;text-align:start;align-items:center;padding-top:8px;padding-bottom:8px;justify-content:flex-start;text-decoration:none;outline:none;}.mud-list-item-extended.mud-list-item-dense-extended{padding-top:4px;padding-bottom:4px;}.mud-list-item-extended.mud-list-item-disabled-extended{color:var(--mud-palette-action-disabled) !important;cursor:default !important;pointer-events:none !important;}.mud-list-item-extended.mud-list-item-disabled-extended .mud-list-item-icon-extended{color:var(--mud-palette-action-disabled) !important;}.mud-list-item-clickable-extended{color:inherit;border:0;cursor:pointer;margin:0;outline:0;user-select:none;border-radius:0;vertical-align:middle;background-color:transparent;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;transition:background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-list-item-clickable-extended:hover:not(.mud-list-item-functional){background-color:var(--mud-palette-action-default-hover);}.mud-list-item-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-item-text-extended{flex:1 1 auto;min-width:0;margin-top:4px;margin-bottom:4px;padding-inline-start:8px;padding-inline-end:8px;}.mud-list-item-text-inset-extended{padding-left:56px;padding-inline-start:56px;padding-inline-end:unset;}.mud-list-item-icon-extended{color:var(--mud-palette-action-default);display:inline-flex;flex-shrink:0;padding-inline-start:8px;padding-inline-end:8px;margin-inline-start:-4px;margin-inline-end:4px;}.mud-list-item-multiselect-extended{max-height:32px;}.mud-list-item-multiselect-extended.mud-list-item-multiselect-checkbox-extended{padding-inline-end:16px;}.mud-list-subheader-extended{color:var(--mud-palette-action-default);background-color:var(--mud-palette-background);font-size:.875rem;box-sizing:border-box;list-style:none;font-weight:500;padding-top:16px;padding-bottom:16px;}.mud-list-subheader-secondary-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-subheader-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-subheader-inset-extended{padding-left:72px;padding-inline-start:72px;padding-inline-end:unset;}.mud-list-subheader-sticky-extended{top:-8px;z-index:1;position:sticky;}.mud-list-subheader-sticky-extended.mud-list-subheader-sticky-dense-extended{top:0;}.mud-list-item-hilight-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-nested-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-avatar-extended{min-width:56px;flex-shrink:0;}.mud-nested-list-extended>.mud-list-item-extended{padding-left:32px;padding-inline-start:32px;padding-inline-end:unset;}.mud-select-extended{display:flex;flex-grow:1;flex-basis:0;min-width:0;position:relative;}.mud-select-extended.mud-autocomplete{display:block;}.mud-select-extended.mud-autocomplete .mud-select-input-extended{cursor:text;}.mud-select-extended.mud-autocomplete .mud-input-adornment-extended{cursor:pointer;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended input{padding-right:3.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-input-adorned-end input{padding-right:4.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended .mud-icon-button{display:none !important;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular{position:absolute;width:100%;top:0;bottom:0;display:flex;align-items:center;justify-content:flex-end;padding-top:.25rem;padding-bottom:.25rem;padding-right:1rem;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular--with-adornment{padding-right:3rem;}.mud-select-extended.mud-autocomplete--with-progress .mud-progress-linear{position:absolute;bottom:-1px;height:2px;}.mud-select-extended .mud-select-input-extended{cursor:pointer;}.mud-select-extended .mud-select-input-extended .mud-input-slot{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.mud-select-extended .mud-select-input-extended .mud-input-adornment-end{margin-left:0;}.mud-select-extended .mud-select-input-extended:disabled{cursor:default;}.mud-select-extended .mud-disabled .mud-select-input{cursor:default;}.mud-select-extended>.mud-form-helpertext{margin-top:-21px;}.mud-select-all-extended{margin-top:10px;border-bottom:1px solid #d3d3d3;padding-bottom:18px;}.mud-input-adornment-start-extended:not(.mud-input-text-extended){margin-inline-start:12px;}.mud-input-adornment-start-extended.mud-input-filled-extended{margin-top:16px;}.mud-input-adornment-end-extended:not(.mud-input-text-extended){margin-inline-end:12px;} \ No newline at end of file +.mud-gallery-selected-toolbox{left:0;right:0;height:56px;width:100%;background-color:rgba(0,0,0,.6);}.mud-gallery-selected-toolbox.gallery-toolbox-top{top:0;}.mud-gallery-selected-toolbox.gallery-toolbox-bottom{bottom:0;}.mud-page{display:grid;box-sizing:border-box;width:100%;}.mud-page.mud-page-height-full{min-height:100vh;}.mud-page.mud-page-height-full-without-appbar{min-height:calc(100vh - var(--mud-appbar-height));}.mud-page.mud-page-column-2{grid-template-columns:repeat(2,50%);}.mud-page.mud-page-column-3{grid-template-columns:repeat(3,33.33333%);}.mud-page.mud-page-column-4{grid-template-columns:repeat(4,25%);}.mud-page.mud-page-column-5{grid-template-columns:repeat(5,20%);}.mud-page.mud-page-column-6{grid-template-columns:repeat(6,16.66667%);}.mud-page.mud-page-column-7{grid-template-columns:repeat(7,14.28571%);}.mud-page.mud-page-column-8{grid-template-columns:repeat(8,12.5%);}.mud-page.mud-page-column-9{grid-template-columns:repeat(9,11.11111%);}.mud-page.mud-page-column-10{grid-template-columns:repeat(10,10%);}.mud-page.mud-page-column-11{grid-template-columns:repeat(11,9.09091%);}.mud-page.mud-page-column-12{grid-template-columns:repeat(12,8.33333%);}.mud-page.mud-page-row-2{grid-template-rows:repeat(2,50%);}.mud-page.mud-page-row-3{grid-template-rows:repeat(3,33.33333%);}.mud-page.mud-page-row-4{grid-template-rows:repeat(4,25%);}.mud-page.mud-page-row-5{grid-template-rows:repeat(5,20%);}.mud-page.mud-page-row-6{grid-template-rows:repeat(6,16.66667%);}.mud-page.mud-page-row-7{grid-template-rows:repeat(7,14.28571%);}.mud-page.mud-page-row-8{grid-template-rows:repeat(8,12.5%);}.mud-page.mud-page-row-9{grid-template-rows:repeat(9,11.11111%);}.mud-page.mud-page-row-10{grid-template-rows:repeat(10,10%);}.mud-page.mud-page-row-11{grid-template-rows:repeat(11,9.09091%);}.mud-page.mud-page-row-12{grid-template-rows:repeat(12,8.33333%);}.mud-section{display:inline-grid;overflow:auto;}.mud-section.mud-section-col-start-1{grid-column-start:1;}.mud-section.mud-section-col-start-2{grid-column-start:2;}.mud-section.mud-section-col-start-3{grid-column-start:3;}.mud-section.mud-section-col-start-4{grid-column-start:4;}.mud-section.mud-section-col-start-5{grid-column-start:5;}.mud-section.mud-section-col-start-6{grid-column-start:6;}.mud-section.mud-section-col-start-7{grid-column-start:7;}.mud-section.mud-section-col-start-8{grid-column-start:8;}.mud-section.mud-section-col-start-9{grid-column-start:9;}.mud-section.mud-section-col-start-10{grid-column-start:10;}.mud-section.mud-section-col-start-11{grid-column-start:11;}.mud-section.mud-section-col-start-12{grid-column-start:12;}.mud-section.mud-section-col-end-1{grid-column-end:1;}.mud-section.mud-section-col-end-2{grid-column-end:2;}.mud-section.mud-section-col-end-3{grid-column-end:3;}.mud-section.mud-section-col-end-4{grid-column-end:4;}.mud-section.mud-section-col-end-5{grid-column-end:5;}.mud-section.mud-section-col-end-6{grid-column-end:6;}.mud-section.mud-section-col-end-7{grid-column-end:7;}.mud-section.mud-section-col-end-8{grid-column-end:8;}.mud-section.mud-section-col-end-9{grid-column-end:9;}.mud-section.mud-section-col-end-10{grid-column-end:10;}.mud-section.mud-section-col-end-11{grid-column-end:11;}.mud-section.mud-section-col-end-12{grid-column-end:12;}.mud-section.mud-section-row-start-1{grid-row-start:1;}.mud-section.mud-section-row-start-2{grid-row-start:2;}.mud-section.mud-section-row-start-3{grid-row-start:3;}.mud-section.mud-section-row-start-4{grid-row-start:4;}.mud-section.mud-section-row-start-5{grid-row-start:5;}.mud-section.mud-section-row-start-6{grid-row-start:6;}.mud-section.mud-section-row-start-7{grid-row-start:7;}.mud-section.mud-section-row-start-8{grid-row-start:8;}.mud-section.mud-section-row-start-9{grid-row-start:9;}.mud-section.mud-section-row-start-10{grid-row-start:10;}.mud-section.mud-section-row-start-11{grid-row-start:11;}.mud-section.mud-section-row-start-12{grid-row-start:12;}.mud-section.mud-section-row-end-1{grid-row-end:1;}.mud-section.mud-section-row-end-2{grid-row-end:2;}.mud-section.mud-section-row-end-3{grid-row-end:3;}.mud-section.mud-section-row-end-4{grid-row-end:4;}.mud-section.mud-section-row-end-5{grid-row-end:5;}.mud-section.mud-section-row-end-6{grid-row-end:6;}.mud-section.mud-section-row-end-7{grid-row-end:7;}.mud-section.mud-section-row-end-8{grid-row-end:8;}.mud-section.mud-section-row-end-9{grid-row-end:9;}.mud-section.mud-section-row-end-10{grid-row-end:10;}.mud-section.mud-section-row-end-11{grid-row-end:11;}.mud-section.mud-section-row-end-12{grid-row-end:12;}.mud-popup{z-index:2000;overflow:auto;background-color:var(--mud-palette-background);min-height:var(--mud-appbar-height);}.mud-popup.mud-popup-center{height:300px;left:50%;top:50%;transform:translate(-50%,-50%);width:320px;aspect-ratio:1/1;}.mud-splitter{display:grid;position:relative;width:100%;}.mud-splitter-content{overflow:auto;}.mud-splitter-thumb ::-webkit-slider-runnable-track{visibility:hidden !important;height:100% !important;}.mud-splitter-thumb ::-moz-range-track{visibility:hidden !important;height:100% !important;}.mud-splitter-track{position:absolute;top:50%;transform:translateY(-50%);height:100%;}.mud-splitter-track.mud-slider{visibility:hidden !important;}.mud-splitter-track.mud-slider .mud-slider-container{height:100% !important;}.mud-splitter-track.mud-slider .mud-slider-input{top:50%;}.mud-splitter-thumb ::-webkit-slider-thumb{visibility:visible !important;appearance:none !important;-webkit-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-webkit-slider-thumb{cursor:default !important;}.mud-splitter-thumb ::-moz-range-thumb{visibility:visible !important;appearance:none !important;-moz-appearance:none !important;top:50% !important;transform:translateY(-50%) !important;height:100% !important;width:8px !important;border:none !important;border-radius:0 !important;cursor:ew-resize !important;}.mud-splitter-thumb-disabled ::-moz-range-thumb{cursor:default !important;}.mud-stepper-header{min-height:62px;border-radius:var(--mud-default-borderradius);}.mud-stepper-header.mud-stepper-header-non-linear:hover{background-color:var(--mud-palette-action-default-hover);}.mud-stepper-badge{z-index:21;}.mud-switch-m3{cursor:pointer;display:inline-flex;align-items:center;vertical-align:middle;-webkit-tap-highlight-color:transparent;}.mud-switch-m3.mud-disabled{color:var(--mud-palette-text-disabled) !important;cursor:default;}.mud-switch-m3.mud-readonly,.mud-switch-m3 .mud-readonly:hover{cursor:default;background-color:transparent !important;}.mud-switch-span-m3{width:52px;height:32px;display:inline-flex;z-index:0;position:relative;box-sizing:border-box;flex-shrink:0;vertical-align:middle;}.mud-switch-span-m3.mud-switch-child-content-m3{margin-inline-end:12px;}.mud-switch-span-m3 .mud-switch-track-m3{width:52px;height:32px;z-index:-1;transition:opacity 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;border-radius:30px;background-color:var(--mud-palette-background);border:2px solid;}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-default-m3{border-color:var(--mud-palette-text-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-primary-m3{border-color:var(--mud-palette-primary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-secondary-m3{border-color:var(--mud-palette-secondary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-tertiary-m3{border-color:var(--mud-palette-tertiary);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-info-m3{border-color:var(--mud-palette-info);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-success-m3{border-color:var(--mud-palette-success);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-warning-m3{border-color:var(--mud-palette-warning);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-error-m3{border-color:var(--mud-palette-error);}.mud-switch-span-m3 .mud-switch-track-m3.mud-switch-track-dark-m3{border-color:var(--mud-palette-dark);}.mud-switch-base-m3{padding-top:4px;padding-bottom:4px;padding-inline-start:8px;top:0;left:0;bottom:0;color:#fafafa;z-index:1;position:absolute;transition:left 150ms cubic-bezier(.4,0,.2,1) 0ms,transform 150ms cubic-bezier(.4,0,.2,1) 0ms,background-color 250ms cubic-bezier(.4,0,.2,1) 0ms,box-shadow 250ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-switch-base-m3.mud-switch-base-dense-m3{padding-inline-start:4px;}.mud-switch-base-m3.mud-checked{transform:translateX(20px);padding:4px;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3{opacity:1;}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-default{background-color:var(--mud-palette-text-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-primary{background-color:var(--mud-palette-primary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-secondary{background-color:var(--mud-palette-secondary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-tertiary{background-color:var(--mud-palette-tertiary);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-info{background-color:var(--mud-palette-info);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-success{background-color:var(--mud-palette-success);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-warning{background-color:var(--mud-palette-warning);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-error{background-color:var(--mud-palette-error);}.mud-switch-base-m3.mud-checked+.mud-switch-track-m3.mud-dark{background-color:var(--mud-palette-dark);}.mud-switch-base-m3.mud-checked .mud-switch-thumb-m3{width:24px;height:24px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;background-color:var(--mud-palette-background);}.mud-switch-base-m3:hover{background-color:var(--mud-palette-action-default-hover);}.mud-switch-base-m3.mud-switch-disabled{color:var(--mud-palette-grey-default) !important;}.mud-switch-base-m3.mud-switch-disabled+.mud-switch-track-m3{opacity:.12 !important;}.mud-switch-base-m3.mud-switch-disabled:hover,.mud-switch-base-m3.mud-switch-disabled:focus-visible{cursor:default;background-color:transparent !important;}.mud-switch-button-m3{display:flex;align-items:inherit;justify-content:inherit;}.mud-switch-button-m3 .mud-switch-input-m3{top:0;left:0;width:100%;cursor:inherit;height:100%;margin:0;opacity:0;padding:0;z-index:1;position:absolute;}.mud-switch-button-m3 .mud-switch-thumb-m3{width:16px;height:16px;box-shadow:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);border-radius:50%;}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-default-m3{background-color:var(--mud-palette-text-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-primary-m3{background-color:var(--mud-palette-primary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-secondary-m3{background-color:var(--mud-palette-secondary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-tertiary-m3{background-color:var(--mud-palette-tertiary);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-info-m3{background-color:var(--mud-palette-info);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-success-m3{background-color:var(--mud-palette-success);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-warning-m3{background-color:var(--mud-palette-warning);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-error-m3{background-color:var(--mud-palette-error);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-dark-m3{background-color:var(--mud-palette-dark);}.mud-switch-button-m3 .mud-switch-thumb-m3.mud-switch-thumb-off-icon-m3{width:24px;height:24px;}.mud-wheel{overflow:hidden;min-width:0;flex-grow:1;user-select:none;-webkit-user-select:none;}.mud-wheel-item{width:100%;display:flex;align-content:center;justify-content:center;color:var(--mud-palette-text-secondary);border-radius:var(--mud-default-borderradius);}.mud-wheel-item.mud-wheel-item:hover:not(.mud-disabled){background-color:var(--mud-palette-action-default-hover);}.mud-wheel-item.wheel-item-closest{color:var(--mud-palette-text);}.mud-wheel-item.wheel-item-empty{min-height:32px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty-dense{min-height:24px !important;}.mud-wheel-item.wheel-item-empty.wheel-item-empty:hover{background-color:unset;}.mud-wheel-item.mud-disabled{color:var(--mud-palette-text-disabled);}.middle-item{transform:scale(1.2);}.middle-item.mud-disabled{color:var(--mud-palette-text-disabled);}.mud-wheel-border{min-height:2px !important;}.mud-wheel-border.mud-wheel-border-default{background-color:var(--mud-palette-text-primary);}.mud-wheel-border.mud-wheel-border-primary{background-color:var(--mud-palette-primary);}.mud-wheel-border.wheel-border-gradient-primary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-primary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-secondary{background-color:var(--mud-palette-secondary);}.mud-wheel-border.wheel-border-gradient-secondary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-secondary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-tertiary{background-color:var(--mud-palette-tertiary);}.mud-wheel-border.wheel-border-gradient-tertiary{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-tertiary),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-info{background-color:var(--mud-palette-info);}.mud-wheel-border.wheel-border-gradient-info{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-info),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-success{background-color:var(--mud-palette-success);}.mud-wheel-border.wheel-border-gradient-success{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-success),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-warning{background-color:var(--mud-palette-warning);}.mud-wheel-border.wheel-border-gradient-warning{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-warning),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-error{background-color:var(--mud-palette-error);}.mud-wheel-border.wheel-border-gradient-error{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-error),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.mud-wheel-border-dark{background-color:var(--mud-palette-dark);}.mud-wheel-border.wheel-border-gradient-dark{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-dark),rgba(255,0,0,0));background-color:unset;}.mud-wheel-border.wheel-border-gradient-default{background-image:linear-gradient(to right,rgba(255,0,0,0),var(--mud-palette-text-primary),rgba(255,0,0,0));background-color:unset;}.mud-list-extended{margin:0;padding:0;position:relative;list-style:none;}.mud-list-extended.mud-list-padding-extended{padding-top:8px;padding-bottom:8px;}.mud-list-item-extended{width:100%;display:flex;position:relative;box-sizing:border-box;text-align:start;align-items:center;padding-top:8px;padding-bottom:8px;justify-content:flex-start;text-decoration:none;outline:none;}.mud-list-item-extended.mud-list-item-dense-extended{padding-top:4px;padding-bottom:4px;}.mud-list-item-extended.mud-list-item-disabled-extended{color:var(--mud-palette-action-disabled) !important;cursor:default !important;pointer-events:none !important;}.mud-list-item-extended.mud-list-item-disabled-extended .mud-list-item-icon-extended{color:var(--mud-palette-action-disabled) !important;}.mud-list-item-clickable-extended{color:inherit;border:0;cursor:pointer;margin:0;outline:0;user-select:none;border-radius:0;vertical-align:middle;background-color:transparent;-webkit-appearance:none;-webkit-tap-highlight-color:transparent;transition:background-color 150ms cubic-bezier(.4,0,.2,1) 0ms;}.mud-list-item-clickable-extended:hover:not(.mud-list-item-functional){background-color:var(--mud-palette-action-default-hover);}.mud-list-item-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-item-text-extended{flex:1 1 auto;min-width:0;margin-top:4px;margin-bottom:4px;padding-inline-start:8px;padding-inline-end:8px;}.mud-list-item-text-inset-extended{padding-left:56px;padding-inline-start:56px;padding-inline-end:unset;}.mud-list-item-icon-extended{color:var(--mud-palette-action-default);display:inline-flex;flex-shrink:0;padding-inline-start:8px;padding-inline-end:8px;margin-inline-start:-4px;margin-inline-end:4px;}.mud-list-item-multiselect-extended{max-height:32px;}.mud-list-item-multiselect-extended.mud-list-item-multiselect-checkbox-extended{padding-inline-end:16px;}.mud-list-subheader-extended{color:var(--mud-palette-action-default);background-color:var(--mud-palette-background);font-size:.875rem;box-sizing:border-box;list-style:none;font-weight:500;padding-top:16px;padding-bottom:16px;}.mud-list-subheader-secondary-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-subheader-gutters-extended{padding-left:16px;padding-right:16px;}.mud-list-subheader-inset-extended{padding-left:72px;padding-inline-start:72px;padding-inline-end:unset;}.mud-list-subheader-sticky-extended{top:-8px;z-index:1;position:sticky;}.mud-list-subheader-sticky-extended.mud-list-subheader-sticky-dense-extended{top:0;}.mud-list-item-hilight-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-nested-background-extended{background-color:var(--mud-palette-background-grey);}.mud-list-item-avatar-extended{min-width:56px;flex-shrink:0;}.mud-nested-list-extended>.mud-list-item-extended{padding-left:32px;padding-inline-start:32px;padding-inline-end:unset;}.mud-select-extended{display:flex;flex-grow:1;flex-basis:0;min-width:0;position:relative;}.mud-select-extended.mud-autocomplete{display:block;}.mud-select-extended.mud-autocomplete .mud-select-input-extended{cursor:text;}.mud-select-extended.mud-autocomplete .mud-input-adornment-extended{cursor:pointer;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended input{padding-right:3.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-input-adorned-end input{padding-right:4.5rem !important;}.mud-select-extended.mud-autocomplete--with-progress .mud-select-input-extended .mud-icon-button{display:none !important;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular{position:absolute;width:100%;top:0;bottom:0;display:flex;align-items:center;justify-content:flex-end;padding-top:.25rem;padding-bottom:.25rem;padding-right:1rem;}.mud-select-extended.mud-autocomplete--with-progress .progress-indicator-circular--with-adornment{padding-right:3rem;}.mud-select-extended.mud-autocomplete--with-progress .mud-progress-linear{position:absolute;bottom:-1px;height:2px;}.mud-select-extended .mud-select-input-extended{cursor:pointer;}.mud-select-extended .mud-select-input-extended .mud-input-slot{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.mud-select-extended .mud-select-input-extended .mud-input-adornment-end{margin-left:0;}.mud-select-extended .mud-select-input-extended:disabled{cursor:default;}.mud-select-extended .mud-disabled .mud-select-input{cursor:default;}.mud-select-extended>.mud-form-helpertext{margin-top:-21px;}.mud-select-all-extended{margin-top:10px;border-bottom:1px solid #d3d3d3;padding-bottom:18px;}.mud-input-adornment-start-extended:not(.mud-input-text-extended){margin-inline-start:12px;}.mud-input-adornment-start-extended.mud-input-filled-extended{margin-top:16px;}.mud-input-adornment-end-extended:not(.mud-input-text-extended){margin-inline-end:12px;} \ No newline at end of file diff --git a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor index 04d7ca1d..c20c38ff 100644 --- a/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor +++ b/ComponentViewer.Docs/Pages/Examples/StepperExample1.razor @@ -4,12 +4,12 @@ @using MudExtensions.Utilities - - + + MobileView="_mobileView" IconActionButtons="_iconActionButtons" Loading="_loading" HeaderSize="_headerSize"> @if (_showStaticContent) { @@ -31,14 +31,14 @@ - + - + @@ -65,7 +65,7 @@ } - @if (!_stepper.IsAllStepsCompleted()) + @if (!_stepper.IsAllStepsCompleted() && _showCustomButton) { Cancel } @@ -76,38 +76,40 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + @foreach (Variant item in Enum.GetValues()) { @item.ToDescriptionString() } - + @foreach (Color item in Enum.GetValues()) { @item.ToDescriptionString() } - + @foreach (HeaderTextView item in Enum.GetValues()) { @item.ToDescriptionString() } + Reset @@ -134,7 +136,9 @@ int _activeIndex = 0; bool _loading; bool _showStaticContent = false; + bool _showCustomButton = false; bool _vertical = false; + Size _headerSize = Size.Medium; private async Task CheckChange(StepChangeDirection direction) { From a4c86ea761463a6e5baa4f9b053c6c26ca7235f9 Mon Sep 17 00:00:00 2001 From: mckaragoz <78308169+mckaragoz@users.noreply.github.com> Date: Wed, 26 Apr 2023 16:02:17 +0300 Subject: [PATCH 9/9] Last Cleanup --- .../Components/Stepper/MudStepper.razor | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor index 5a351a42..6f453042 100644 --- a/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor +++ b/CodeBeam.MudBlazor.Extensions/Components/Stepper/MudStepper.razor @@ -33,7 +33,7 @@ { @if (step.Status == MudExtensions.Enums.StepStatus.Completed) { - + @if (!string.IsNullOrWhiteSpace(step.Icon)) {