Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CSS Isolation is broken #42

Open
Atee134 opened this issue Oct 20, 2021 · 2 comments
Open

CSS Isolation is broken #42

Atee134 opened this issue Oct 20, 2021 · 2 comments

Comments

@Atee134
Copy link

Atee134 commented Oct 20, 2021

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

@mnbob70
Copy link

mnbob70 commented Jan 5, 2022

I used the template for the first time yesterday and also had this issue for a Blazor server app. I'm using Blazor for the first time so everything is new and it took me a while to figure out what was wrong. The template should put the following line in the head section of _Layout.cshtml file. The name has to change to $(MSBuildProjectName) if the user doesn't use the default MudBlazorTemplates1.
<link href="MudBlazorTemplates1.styles.css" rel="stylesheet">

@kencherasaro
Copy link

kencherasaro commented Feb 10, 2022

I just tried this as well. Still no luck. The file is ProjectName.styles.css is generated but the styles do not apply. Appears that that the html generated by the MudBlazor components do not contain the attributes for isolating as seen in the css generated below:

MudBlazorWasm

.foo[b-p438hivbfs] {
color: red;
}

I did though find that if styles are included in the .razor file, they will be used. This does allow for things like the following:

<style> .bar { color: @(@Colors.Blue.Accent1); } </style>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants