SplitterFixes (#143)

mckaragoz · web-flow · commit dc7e7bf8a7e2 · 2023-02-26T15:49:41.000+03:00
diff --git a/CodeBeam.MudExtensions/Components/CsvMapper/MudCsvMapper.razor b/CodeBeam.MudExtensions/Components/CsvMapper/MudCsvMapper.razor
@@ -33,7 +33,7 @@
                             <MudFab HtmlTag="Button"
                                     Color="Color.Secondary"
                                     Label="@LocalizedStrings.ChooseFile"
-                                    Icon="@Icons.Outlined.CloudDownload" Size="Size.Large"/>@LocalizedStrings.OrDragAndDrop
+                                    Icon="@Icons.Material.Outlined.CloudDownload" Size="Size.Large"/>@LocalizedStrings.OrDragAndDrop
                         </h3>
                     </MudPaper>
                     <MudPaper Elevation="0" class="d-flex justify-center align-content-center mud-transparent m2">
@@ -94,11 +94,11 @@
                                 }
                                 @if (!matched && item.CreatingDefaultValue)
                                 {
-                                    <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>
+                                    <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>
                                 }
                                 else if(!matched && item.AllowDefaultValue)
                                 {
-                                    <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.Add" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>
+                                    <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.Add" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>
                                 }
                             </MudText>
                             @if (!matched && !confirmed)
@@ -122,7 +122,7 @@
                 {
                     <MudPaper Elevation="0" Width="180px" Class="rounded-lg mud-background-gray pa-2 my-1">
                         <EditForm Model="@_model" OnSubmit="OnSubmit">
-                            <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => _addSectionOpen = false)"></MudIconButton>
+                            <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => _addSectionOpen = false)"></MudIconButton>
                             <MudTextField @bind-Value="_model.Name" Label="Expected Header" Required="true" For="@(() => _model.Name)"></MudTextField>
                             <MudSwitch Color="Color.Primary" T="bool" @bind-Checked="_model.Required">Required</MudSwitch>
                             <MudSwitch Color="Color.Primary" T="bool" @bind-Checked="_model.AllowDefaultValue">Allow Default Value</MudSwitch>
diff --git a/CodeBeam.MudExtensions/Components/Gallery/MudGallery.razor b/CodeBeam.MudExtensions/Components/Gallery/MudGallery.razor
@@ -28,13 +28,13 @@
 
                 @if (ShowToolboxNavigationButtons == true)
                 {
-                    <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Outlined.ChevronLeft" Style="bottom: 0px; top: 0px; left: 4px;" OnClick="@(() => SetAdjacentImage(-1))" />
-                    <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Outlined.ChevronRight" Style="bottom: 0px; top: 0px; right: 4px;" OnClick="@(() => SetAdjacentImage(1))" />
+                    <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Material.Outlined.ChevronLeft" Style="bottom: 0px; top: 0px; left: 4px;" OnClick="@(() => SetAdjacentImage(-1))" />
+                    <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Material.Outlined.ChevronRight" Style="bottom: 0px; top: 0px; right: 4px;" OnClick="@(() => SetAdjacentImage(1))" />
                 }
 
                 @if (ShowToolboxCloseButton == true)
                 {
-                    <MudIconButton Class="absolute white-text" DisableRipple="true" Icon="@Icons.Outlined.Close" Style="top: 4px; right: 0px;" OnClick="@(() => ChangeMenu(false))" />
+                    <MudIconButton Class="absolute white-text" DisableRipple="true" Icon="@Icons.Material.Outlined.Close" Style="top: 4px; right: 0px;" OnClick="@(() => ChangeMenu(false))" />
                 }
             </MudContainer>
         </div>
diff --git a/CodeBeam.MudExtensions/Components/Splitter/MudSplitter.razor b/CodeBeam.MudExtensions/Components/Splitter/MudSplitter.razor
@@ -18,13 +18,13 @@
     @($".mud-splitter-generate-{_styleGuid} {{ grid-template-columns: {Dimension.ToInvariantString()}% {(100 - Dimension).ToInvariantString()}%; }}")
 
     .mud-splitter-thumb-@(_styleGuid) ::-webkit-slider-thumb {
-        @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;") @(StyleBar)
+        @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;")
         @(Height != null ? $"height: {Height} !important;" : null)
         @(StyleBar)
     }
 
     .mud-splitter-thumb-@(_styleGuid) ::-moz-range-thumb {
-        @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;") @(StyleBar)
+        @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;")
         @(Height != null ? $"height: {Height} !important;" : null)
         @(StyleBar)
     }
diff --git a/CodeBeam.MudExtensions/Components/Splitter/MudSplitter.razor.cs b/CodeBeam.MudExtensions/Components/Splitter/MudSplitter.razor.cs
@@ -23,6 +23,7 @@ public partial class MudSplitter : MudComponentBase
             .Build();
 
         protected string SliderClassname => new CssBuilder($"mud-splitter-thumb mud-splitter-thumb-{_styleGuid} mud-splitter-track")
+            .AddClass("mud-splitter-thumb-disabled", EnableSlide == false)
             .Build();
 
         /// <summary>
diff --git a/CodeBeam.MudExtensions/Styles/Components/_splitter.scss b/CodeBeam.MudExtensions/Styles/Components/_splitter.scss
@@ -49,7 +49,11 @@
     width: 8px !important;
     border: none !important;
     border-radius: 0 !important;
-    cursor: ew-resize !important;
+    cursor: ew-resize !important;   
+}
+
+.mud-splitter-thumb-disabled ::-webkit-slider-thumb {
+    cursor: not-allowed !important;
 }
 
 .mud-splitter-thumb ::-moz-range-thumb {
@@ -64,3 +68,7 @@
     border-radius: 0 !important;
     cursor: ew-resize !important;
 }
+
+.mud-splitter-thumb-disabled ::-moz-range-thumb {
+    cursor: not-allowed !important;
+}
diff --git a/CodeBeam.MudExtensions/Styles/MudExtensions.css b/CodeBeam.MudExtensions/Styles/MudExtensions.css
@@ -216,6 +216,9 @@
   border-radius: 0 !important;
   cursor: ew-resize !important; }
 
+.mud-splitter-thumb-disabled ::-webkit-slider-thumb {
+  cursor: not-allowed !important; }
+
 .mud-splitter-thumb ::-moz-range-thumb {
   visibility: visible !important;
   appearance: none !important;
@@ -228,6 +231,9 @@
   border-radius: 0 !important;
   cursor: ew-resize !important; }
 
+.mud-splitter-thumb-disabled ::-moz-range-thumb {
+  cursor: not-allowed !important; }
+
 .mud-stepper-header {
   min-height: 62px;
   border-radius: var(--mud-default-borderradius); }
diff --git a/CodeBeam.MudExtensions/Styles/MudExtensions.min.css b/CodeBeam.MudExtensions/Styles/MudExtensions.min.css
diff --git a/CodeBeam.MudExtensions/wwwroot/MudExtensions.min.css b/CodeBeam.MudExtensions/wwwroot/MudExtensions.min.css
diff --git a/ComponentViewer.Docs/Pages/Examples/GalleryExample1.razor b/ComponentViewer.Docs/Pages/Examples/GalleryExample1.razor
@@ -9,11 +9,11 @@
                 <MudText Class="white-text pa-4">Image @(_gallery.GetSelectedImageIndex() + 1) - Description</MudText>
             </ToolboxTopContent>
             <ToolboxBottomContent>
-                <MudIconButton Class="white-text" Icon="@Icons.Outlined.Edit" />
-                <MudIconButton Class="white-text" Icon="@Icons.Outlined.RotateRight" OnClick="ArrangeRotateValue" />
+                <MudIconButton Class="white-text" Icon="@Icons.Material.Outlined.Edit" />
+                <MudIconButton Class="white-text" Icon="@Icons.Material.Outlined.RotateRight" OnClick="ArrangeRotateValue" />
                 @if (_showToolboxCloseButton == false)
                 {
-                    <MudIconButton Class="white-text" Icon="@Icons.Outlined.Close" OnClick="@(() => _gallery.ChangeMenu(false))" />
+                    <MudIconButton Class="white-text" Icon="@Icons.Material.Outlined.Close" OnClick="@(() => _gallery.ChangeMenu(false))" />
                 }
             </ToolboxBottomContent>
         </MudGallery>
diff --git a/ComponentViewer.Docs/Pages/Examples/SelectExtendedExample4.razor b/ComponentViewer.Docs/Pages/Examples/SelectExtendedExample4.razor
@@ -16,7 +16,7 @@
                     <MudText><b>@context.Value.Item1</b></MudText>
                     <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                         <MudStack Row="true">
-                            <MudIcon Icon="@Icons.Outlined.Person" />
+                            <MudIcon Icon="@Icons.Material.Outlined.Person" />
                             <MudText>@(context.Value.Item3 == true ? "Retired" : "Active")</MudText>
                             </MudStack>
                             <MudChip Color="Color.Info" Variant="Variant.Outlined">Total Score: @context.Value.Item2</MudChip>
@@ -33,7 +33,7 @@
                         <MudText><b>@context.Value.Item1</b></MudText>
                         <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                             <MudStack Row="true">
-                                <MudIcon Icon="@Icons.Outlined.Person" />
+                                <MudIcon Icon="@Icons.Material.Outlined.Person" />
                                 <MudText>@(context.Value.Item3 == true ? "Retired" : "Active")</MudText>
                             </MudStack>
                             <MudChip Color="Color.Info" Variant="Variant.Outlined">Total Score: @context.Value.Item2</MudChip>
@@ -46,7 +46,7 @@
                         <MudText><b>@context.Value.Item1</b></MudText>
                         <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                             <MudStack Row="true">
-                                <MudIcon Icon="@Icons.Outlined.Person" />
+                                <MudIcon Icon="@Icons.Material.Outlined.Person" />
                                 @*<MudText>@(context.Value.Item3 == true ? "Retired" : "Active")</MudText>*@
                             </MudStack>
                             <MudChip Color="Color.Info" Variant="Variant.Outlined">Total Score: @context.Value.Item2</MudChip>
diff --git a/ComponentViewer.Docs/Pages/Index.razor b/ComponentViewer.Docs/Pages/Index.razor
@@ -137,7 +137,6 @@
         font-family: "Roboto";
         letter-spacing: 0;
         transition: all 1s;
-        cursor: pointer;
         user-select: none;
     }
 
@@ -152,7 +151,6 @@
         font-family: "Roboto";
         letter-spacing: 0;
         transition: all 1s;
-        cursor: pointer;
         user-select: none;
     }
 

Original file line number	Diff line number	Diff line change
`@@ -33,7 +33,7 @@`
`33`	`33`	`<MudFab HtmlTag="Button"`
`34`	`34`	`Color="Color.Secondary"`
`35`	`35`	`Label="@LocalizedStrings.ChooseFile"`
`36`		`- Icon="@Icons.Outlined.CloudDownload" Size="Size.Large"/>@LocalizedStrings.OrDragAndDrop`
	`36`	`+ Icon="@Icons.Material.Outlined.CloudDownload" Size="Size.Large"/>@LocalizedStrings.OrDragAndDrop`
`37`	`37`	`</h3>`
`38`	`38`	`</MudPaper>`
`39`	`39`	`<MudPaper Elevation="0" class="d-flex justify-center align-content-center mud-transparent m2">`
`@@ -94,11 +94,11 @@`
`94`	`94`	`}`
`95`	`95`	`@if (!matched && item.CreatingDefaultValue)`
`96`	`96`	`{`
`97`		`- <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>`
	`97`	`+ <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>`
`98`	`98`	`}`
`99`	`99`	`else if(!matched && item.AllowDefaultValue)`
`100`	`100`	`{`
`101`		`- <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.Add" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>`
	`101`	`+ <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.Add" Color="Color.Secondary" OnClick="@(() => item.CreatingDefaultValue = !item.CreatingDefaultValue)"></MudIconButton>`
`102`	`102`	`}`
`103`	`103`	`</MudText>`
`104`	`104`	`@if (!matched && !confirmed)`
`@@ -122,7 +122,7 @@`
`122`	`122`	`{`
`123`	`123`	`<MudPaper Elevation="0" Width="180px" Class="rounded-lg mud-background-gray pa-2 my-1">`
`124`	`124`	`<EditForm Model="@_model" OnSubmit="OnSubmit">`
`125`		`- <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => _addSectionOpen = false)"></MudIconButton>`
	`125`	`+ <MudIconButton Style="padding-left: 8px;" Icon="@Icons.Material.Outlined.ArrowBackIosNew" Color="Color.Secondary" OnClick="@(() => _addSectionOpen = false)"></MudIconButton>`
`126`	`126`	`<MudTextField @bind-Value="_model.Name" Label="Expected Header" Required="true" For="@(() => _model.Name)"></MudTextField>`
`127`	`127`	`<MudSwitch Color="Color.Primary" T="bool" @bind-Checked="_model.Required">Required</MudSwitch>`
`128`	`128`	`<MudSwitch Color="Color.Primary" T="bool" @bind-Checked="_model.AllowDefaultValue">Allow Default Value</MudSwitch>`
Original file line number	Diff line number	Diff line change
`@@ -28,13 +28,13 @@`
`28`	`28`
`29`	`29`	`@if (ShowToolboxNavigationButtons == true)`
`30`	`30`	`{`
`31`		`- <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Outlined.ChevronLeft" Style="bottom: 0px; top: 0px; left: 4px;" OnClick="@(() => SetAdjacentImage(-1))" />`
`32`		`- <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Outlined.ChevronRight" Style="bottom: 0px; top: 0px; right: 4px;" OnClick="@(() => SetAdjacentImage(1))" />`
	`31`	`+ <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Material.Outlined.ChevronLeft" Style="bottom: 0px; top: 0px; left: 4px;" OnClick="@(() => SetAdjacentImage(-1))" />`
	`32`	`+ <MudIconButton Class="absolute white-text" Size="Size.Large" DisableRipple="true" Icon="@Icons.Material.Outlined.ChevronRight" Style="bottom: 0px; top: 0px; right: 4px;" OnClick="@(() => SetAdjacentImage(1))" />`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`@if (ShowToolboxCloseButton == true)`
`36`	`36`	`{`
`37`		`- <MudIconButton Class="absolute white-text" DisableRipple="true" Icon="@Icons.Outlined.Close" Style="top: 4px; right: 0px;" OnClick="@(() => ChangeMenu(false))" />`
	`37`	`+ <MudIconButton Class="absolute white-text" DisableRipple="true" Icon="@Icons.Material.Outlined.Close" Style="top: 4px; right: 0px;" OnClick="@(() => ChangeMenu(false))" />`
`38`	`38`	`}`
`39`	`39`	`</MudContainer>`
`40`	`40`	`</div>`
Original file line number	Diff line number	Diff line change
`@@ -18,13 +18,13 @@`
`18`	`18`	`@($".mud-splitter-generate-{_styleGuid} {{ grid-template-columns: {Dimension.ToInvariantString()}% {(100 - Dimension).ToInvariantString()}%; }}")`
`19`	`19`
`20`	`20`	`.mud-splitter-thumb-@(_styleGuid) ::-webkit-slider-thumb {`
`21`		`- @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;") @(StyleBar)`
	`21`	`+ @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;")`
`22`	`22`	`@(Height != null ? $"height: {Height} !important;" : null)`
`23`	`23`	`@(StyleBar)`
`24`	`24`	`}`
`25`	`25`
`26`	`26`	`.mud-splitter-thumb-@(_styleGuid) ::-moz-range-thumb {`
`27`		`- @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;") @(StyleBar)`
	`27`	`+ @(Color == Color.Default ? "background-color: var(--mud-palette-action-default) !important;" : $"background-color: var(--mud-palette-{Color.ToDescriptionString()}) !important;")`
`28`	`28`	`@(Height != null ? $"height: {Height} !important;" : null)`
`29`	`29`	`@(StyleBar)`
`30`	`30`	`}`