mudblazor / templates Goto Github PK
View Code? Open in Web Editor NEWReady to use Blazor Templates in different styles and layout with all the basic setup already done for MudBlazor.
License: MIT License
Ready to use Blazor Templates in different styles and layout with all the basic setup already done for MudBlazor.
License: MIT License
Other
No response
When attempting to have multiple solutions based off MudBlazor open at the same time all the IISExpress ports seem to be set to 61949. Reading this SO article suggests removing the launchSettings.json before creating the template so that random numbers are generated. It has no votes though so not 100% this is the true answer or not. https://stackoverflow.com/questions/52818765/visual-studio-custom-project-template-applicationurl-port-number
The applicationUrl in the launchSettings.json has a randomly assigned port number.
https://github.com/MudBlazor/MudBlazor
dotnet new --install MudBlazor.Templates
dotnet new mudblazor --host server --name App1
in App1 and dotnet new mudblazor --host server --name App2
in App2No response
0.6.2
No response
Other
Windows
Hi everyone,
I'm kind of new to blazor and MudBlazor.
But on this page from microsoft: here, there is a warning to use static files for non development environments.
So, is adding this in any environment, like in this template, not an security issue?
And, if so, is there an alternative way to make this work?
Regards
abgenullt
Not sure if this is the right place to file this issue but while looking for the ThemeManager package, I could not find it through Nuget package manager. However, adding it through PackageReference via .csproj file does pull the correct package.
Hi, I am new to Blazor and I love MudBlazor.
Can someone modify this template with asp.net core authentication?
Thanks in Advance.
Created a new project with Mudblazor template, wasm hosted. Clicked build. Clicked on "Fetch Data " page. Headers appear but not the usual table data. I have not made any changes at all, just create and build. Tried with brave and firefox browsers. Tried creating a new normal Blazor app works fine.
This is the console error message :
crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: '<' is an invalid start of a value. Path: $ | LineNumber: 0 | BytePositionInLine: 0.
System.Text.Json.JsonException: '<' is an invalid start of a value. Path: $ | LineNumber: 0 | BytePositionInLine: 0.
---> System.Text.Json.JsonReaderException: '<' is an invalid start of a value. LineNumber: 0 | BytePositionInLine: 0.
at System.Text.Json.ThrowHelper.ThrowJsonReaderException(Utf8JsonReader& json, ExceptionResource resource, Byte nextByte, ReadOnlySpan`1 bytes)
at System.Text.Json.Utf8JsonReader.ConsumeValue(Byte marker)
at System.Text.Json.Utf8JsonReader.ReadFirstToken(Byte first)
at System.Text.Json.Utf8JsonReader.ReadSingleSegment()
at System.Text.Json.Utf8JsonReader.Read()
at System.Text.Json.Serialization.JsonConverter`1[[MudBlogor.Shared.WeatherForecast[], MudBlogor.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].ReadCore(Utf8JsonReader& reader, JsonSerializerOptions options, ReadStack& state)
--- End of inner exception stack trace ---
at System.Text.Json.ThrowHelper.ReThrowWithPath(ReadStack& state, JsonReaderException ex)
at System.Text.Json.Serialization.JsonConverter`1[[MudBlogor.Shared.WeatherForecast[], MudBlogor.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].ReadCore(Utf8JsonReader& reader, JsonSerializerOptions options, ReadStack& state)
at System.Text.Json.JsonSerializer.ReadCore[WeatherForecast[]](JsonConverter jsonConverter, Utf8JsonReader& reader, JsonSerializerOptions options, ReadStack& state)
at System.Text.Json.JsonSerializer.ReadCore[WeatherForecast[]](JsonReaderState& readerState, Boolean isFinalBlock, ReadOnlySpan`1 buffer, JsonSerializerOptions options, ReadStack& state, JsonConverter converterBase)
at System.Text.Json.JsonSerializer.ContinueDeserialize[WeatherForecast[]](ReadBufferState& bufferState, JsonReaderState& jsonReaderState, ReadStack& readStack, JsonConverter converter, JsonSerializerOptions options)
at System.Text.Json.JsonSerializer.<ReadAllAsync>d__65`1[[MudBlogor.Shared.WeatherForecast[], MudBlogor.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext()
at System.Net.Http.Json.HttpContentJsonExtensions.<ReadFromJsonAsyncCore>d__4`1[[MudBlogor.Shared.WeatherForecast[], MudBlogor.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext()
at System.Net.Http.Json.HttpClientJsonExtensions.<GetFromJsonAsyncCore>d__13`1[[MudBlogor.Shared.WeatherForecast[], MudBlogor.Shared, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext()
at MudBlogor.Client.Pages.FetchData.OnInitializedAsync()
at Microsoft.AspNetCore.Components.ComponentBase.RunInitAndSetParametersAsync()
at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState) [blazor.webassembly.js:1:35572](https://localhost:44342/_framework/blazor.webassembly.js)
Firefox can’t establish a connection to the server at wss://localhost:44352/MudBlogor.Client/.
Can't seem to install templates of any version. Is there a specific project type or dependencies that must be installed to use the templates? (besides MudBlazor)
An example of the error:
Severity Code Description Project File Line Suppression State
Error Package 'MudBlazor.Templates 0.1.6' has a package type 'Template' that is not supported by project 'MudBlazorTest'.
Good Morning.
If you try editing a table and you press tab to pass from a field to another the row disappear causing unconsistent behaviour disappearing.
I think there is a big problem in inline editing. You can try with your own example:
https://try.mudblazor.com/snippet/maQlkVlndBPffYxw
Thank you
CSS isolation doesn't work with this template.
Creating a new Blazor application it works fine, but with this I just can't seem to make it work.
I have put this manually at the end of the index.html head:
<link href="ApplicationName.Client.styles.css" rel="stylesheet" />
Still when I start the page I get an error: 404 Application.Client.styles.css
It's not being generated anywhere in the project, however, in a new vanilla Blazor app I can find it in "obj\Debug\net5.0\scopedcss\bundle"
EDIT: Turns out the file is not there, because there is no component specific .css file.
Adding one results the file being created, and the 404 error going away, but still, the styles in it aren't applied at all
In our project, we have multi environment configs, each of them has a appsettings file.for example:
When I change the default ASPNETCORE_ENVIRONMENT to custom name, like "2020test" the MudBlazor got some error after start the project.
os: win11
IDE: VS2022 Version 17.0.0 Preview 4.1
local dotnet version : 5.0 latest /6.0 RC2
local MudBlazor version: 5.1.5 + lastest rc
Create a startup Blazor Server project using the MudBlazor template
Open the launch setting file, change the env name from Development to a custome env
Start the server project, when the browser launch, the UI is a crazy large icon!
some static file was 404 when start not as a dev environment.
The "Project Type" drop-down has a (i)
button, but it doesn't actually do anything. Nor is there any other descriptions for the different project types on the page.
The information on https://github.com/MudBlazor/Templates likewise doesn't describe the different hosting models.
Sorry, I posted this issue in the wrong place.
Moved to MudBlazor/MudBlazor#7786.
What is the easiest way to combine a Text Input and a Radio ButtonGroup (2 Choices)
on the same line for targetting mobile devices (=sm breakpoints)?
I know they are several ways with css to do so but
what is the "mudblazor" way ?
Other
No response
When I create new project using MudBlazor template: wasm pwa aspnet core hosted.
Then there is one project unnecesarry. But major problem is that this project cannot be used offline. It says 404 error when trying. I'm using ofcoarse published release version.
But when I use standard blazor wasm project and add MudBlazor to project manually, then everything works. I couldn't find out where is the problem.
When I create Mudblazor wasm project and publish it. Load it for the first time and then stop the server. It should work.
create empty mudblazor project. thats it.
No response
6.0.9
No response
Firefox, Chrome
Windows
I think there'd be great value in being able to set the width of the filtered list independently of the MudAutoComplete component.
Maybe the component only displays 50 characters and truncates the rest.
But as I type, I want to see 100 or 150 characters or so, in order to see the entire value so I can select the right one.
Hey!
In your latest release is the Info that the Admin Dahsboard Template will get it's own Repo.
Any Link to that Repo, or any info?
Greetings,
Luis
The Error.cshtml file references the now removed ~/css/bootstrap/bootstrap.min.css and ~/css/app.css files. Would be nice to have these use MudBlazor css classes to keep some styling.
Hi, thanks for amazing yours.
I have carefully tried the sample code in the below link
https://mudblazor.com/components/table
<MudTable ServerData="@(new Func<TableState, Task<TableData<Element>>>(ServerReload))"
Dense="true" Hover="true" @ref="table">
I am getting callback events to my ServerLoad() method except for page navigation.
I have total of 100 records and per page, I am showing 10 and when I try to move to page number 2 ( 11-20) I am not getting a callback event to ServerLoad mehod.
please advise.
https://templates.mudblazor.com/ doesn't seem to be working anymore.
The MudBlazor Files could not be fetched from the aspnet backend 404:
Steps to reproduce:
dotnet new blazorserver
dotnet run --environment Production
After this easy steps i get this strange behavior (see Screenshot). It seems MudBlazor could not be served from the virtual _content
folder.
Edit: When i'm running dotnet run --environment Development
everthing is fine.
Any plans on publishing this template on NuGet?
This will allow us to run dotnet new -i "MudBlazor.Templates::*"
See docs for more info, https://docs.microsoft.com/en-us/dotnet/core/tools/custom-templates#packing-a-template-into-a-nuget-package-nupkg-file
Is there a location where the Admin Dashboard Template is available?
I just tried the vary basic CSS Isolation example from here in my project using MudBlazor Template for Server. The Administrator version.
The isolated CSS does not update the H1.
But if I create a new default Blazor app and do the exact same example, it works. H1 color updates.
Others have assured me that CSS Isolation works with the MudBlazor library, so the only variable I can think of is something in Templates is blocking it.
Anyone?
EDIT: I guess the follow up question would be: How can I get CSS Isolation to work in the Template?
Hi new to blazor noticed that there used to be an admin template. I think that is a very good addition, not sure why removed.
Where can I find a MudBlazor admin template?
thanks
I have an existing project created with "blazorwasm" template included in Visual Studio 2022, and i'd like to include MudBlazor in it but i always encounter an error message that says:
"the package 'MudBlazor.Templates 0.6.3' conteins a package type 'Template' that is not supported by the project .
The same if i create a new project by "blazorwasm" and i try to add Mudblazor as second step.
On the contrary, after installing the MudBlazor template in Visual Studio, if a create a new project with that template (wasm-PWA) the project is correctly created and it correctly runs.
I'm new on Mudblazor but looking into .cprj files and dependancies i noticed that in Mudblazor by template project i read:
PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.2"
PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.2" PrivateAssets="all"
PackageReference Include="MudBlazor" Version="6.0.6"
while in my previous blazorwasm template project:
PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="6.0.9"
PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="6.0.9" PrivateAssets="all"
Even upgrading these two files to 6.0.10 version of WebAssembly nothing change.
Is this the problem ? How can i overcome it ? Or do i have to stay with 6.0.2 release of WebAssembly files ?
Templates is a great way to communicate best practises and project setup, however these templates use the v6 runtimes of MudBlazor (and .Net) and the upgrade to .net 7 leaves a bit of a mess. Can we please have updated versions of the templates for the current runtimes?
I have a mudtable linked to a ICollectionList:
<MudTable Elevation=10 Height="200px" Items="@deprULs" T="DeprUL" @bind-SelectedItem="TabSelectedItem" Hover="true" FixedHeader="true" Breakpoint="Breakpoint.None" ReadOnly="true" Dense="true">
and mapped to a var TabSelectedItem. If i click on a row on any of the table´s column the row
gets selected and that specific row is in TabSelectedItem.
Inside that table i have also created a button
Problem here is that if i click that button the row does not get selected and TabSelectedItem remains
null;
Question: How do it get the selected row into TabSelectedItem?
Do i need to manually select the row and how is that possible?
I am trying to deploy your awesome template on AWS Amplify. I am using this tutorial to for that https://swimburger.net/blog/dotnet/how-to-deploy-blazor-webassembly-to-aws-amplify
For pure Blazor Wasm it works fine, as well as for pure MudBlazor template. But on your template I get web assembly exception when navigating from login to Dashboard. Same when navigating to any other page. Am I missing something is there any difference or change in hosting redirects I need to make ?
Here is the hosted example:https://dev.d2p39p1v1zkoec.amplifyapp.com/
Hi guys,
Great work with the mud theme. Also love the work done on the mudthememanager. Was wondering if we could get the source of the manager as we are looking to integrate that into a more generic right side panel. Also hoping to learn more about it and maybe the community can help with the implementation of the missing elements.
Thanks,
Rakesh
Are MainLayout.razor.css and NavMenu.razor.css needed in DefaultBlazor.Wasm
?
DefaultBlazor.Server
template does not use those.
And I do not see any differences after removing from DefaultBlazor.Wasm
, too.
Templates need to be updated to .Net core 6, without startup and with new _host/layout...
Not up to speed with templating, but the launchsettings.json for wasm
doesn't become replaced with project name.
Not sure if it's a casing issue "Mudblazor.Template" != "MudBlazor.Template"
:
Hi, Where can I get the Admin Dashboard template?
Thanks a lot
Out of the box the wasm-pwa
template the app can not be installed once launched in a web browser. Looking through chrome console errors I found the manifest specifies two different icons, but only one icon is provided in the wwwroot assets folder.
By removing the 192x192 icon entry from the manifest I cleared up the errors and the download and install option was available.
Anything special we need to do to get this working with the blazorhybrid template?
I followed the standard installation details for mudblazor:
https://mudblazor.com/getting-started/installation
but made adjustments as per the syncfusion blog post about setting up on the hybrid template.
https://www.syncfusion.com/blogs/post/blazor-hybrid-apps-using-mobile-blazor-bindings.aspx
Error: Severity Code Description Project File Line Suppression State
Error Package 'MudBlazor.Templates 0.6.3' has a package type 'Template' that is not supported by project 'src\Presentation\TradingViewWebHook.WebApp'.
On the sample website.
In the get Getting Started > Installation page (https://mudblazor.com/getting-started/installation), there is a note about pre-configured templates, with a link to https://mudblazor.com/getting-started/templates.
I tried packing them with nuget and installing them, but that didn't work. I tired creating a template via Visual Studio, but only the individual projects ever show up, not the solution, as a new project option. I'm left with just coping the the solution file and the folders when I want to make a new project, but that seems like a very inefficient way to use these templates.
is this server side or client side template?
Where do we get the admin dashboard template?
The admin dashboard with mudblazor looks like this,
Is this not available now? Is it deprecated?
Please throw some ideas
Thanks
I experienced the problem that CSS isolation was not working after I created an app using MudBlazor templates, by running dotnet new mudblazor --host server--name MyApplication
as described in the getting started guide.
As I have not much experience with Blazor, it took a too much time finding out that the line <link href="MyApplication.styles.css" rel="stylesheet" />
is "missing", compared to what the dotnet new blazorserver
command does.
I guess to add the stylesheet link statement in the head section in the _Layout.cshtml for Blazor Server apps should be fairly easy. If I find some time, I'd be happy to see if I can provide a PR.
MudBlazor is just awesome!
Followed https://www.mudblazor.com/getting-started/installation#using-our-dotnet-templates to create a new project but had an error on this command:
dotnet new mudblazor --host wasm --name dashboard-demo
The template "MudBlazor Templates" was created successfully.
Processing post-creation actions...
Running 'dotnet restore' on C:\Source\repos\Dud...
C:\Program Files\dotnet\sdk\6.0.202\NuGet.targets(289,5): error MSB3202: The project file "C:\Source\repos\Dud\dashboard_demo.csproj" was not found. [C:\Source\repos\Dud\dashboard-demo.sln]
Restore failed.
Post action failed.
Manual instructions: Run 'dotnet restore'
The solution file has:
Project("{9A19103F-16F7-4668-BE54-9A1E7A4F7556}") = "dashboard_demo", "dashboard_demo.csproj", "{31840BA8-8B37-4929-9BCF-414518ACB738}"
but the project file is called
dashboard-demo.csproj
I've found a workaround by setting the left margin to 56px on mud-main-content
css class but was wondering if there was something else I could do? Is there a better solution?
.mud-main-content {
margin: 0 0 0 56px;
flex: 1 1 auto;
padding-top: var(--mud-appbar-min-height);
transition: margin 225ms cubic-bezier(0,0,.2,1) 0ms;
}
Hi.
A new server-based project was created using this template.
When I start building and debugging (without any editing !),
the sample website appears fine and appears to be working as expected.
However, when I look at the output window of the integrated development environment, I see the following error messages
Exception thrown: 'System.InvalidOperationException' in Microsoft.AspNetCore.Components.Server.dll
Exception thrown: 'System.InvalidOperationException' in Microsoft.JSInterop.dll
Exception thrown: 'System.InvalidOperationException' in System.Private.CoreLib.dll
Exception thrown: 'System.InvalidOperationException' in System.Private.CoreLib.dll
I get:
System.NullReferenceException: 'Object reference not set to an instance of an object.'
on this line of code:
<component type="typeof(HeadOutlet)" render-mode="ServerPrerendered" />
This happens when I try and redirect from one of my components:
@using System.Web;
@inject NavigationManager Navigation
@code {
[Parameter]
public string ReturnUrl { get; set; } = null!;
protected override async Task OnInitializedAsync()
{
var loginEndpoint = "Login?redirectUri=" + HttpUtility.UrlEncode(ReturnUrl);
Navigation.NavigateTo(loginEndpoint, forceLoad: true);
await base.OnInitializedAsync();
}
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.