CODEWITHSUNDEEP
cssblazormudblazormudtextfield
kolek
kolek

Reputation: 699

Blazor cannot set style property

cannot set the style property of an element it's always empty. When I write out StyleString it says color: red

[Transposed verbatim from the comment]

AT(StyleString = ShouldBeError ? "color: red" : "") 
</div>
 @StyleString 
<MudCard> 
  <MudCardHeader> 
    <CardHeaderContent> 
      <MudText Typo="Typo.h6" Style="AT($"{StyleString}")"> 
       //..... 

ATcode { 
//... 
private bool ShouldBeError; 
private string StyleString = ""; 
private List<Location> Data = new List<Location>();

enter image description here

Upvotes: -4

Views: 416

Answers (3)

Akram Al-Qaifi
Akram Al-Qaifi

Reputation: 650

In MudBlazor you need to use theme Colors or Palette colors Like:

Color.Primary, Color.Secondary ...ets

for more, see this link

<MudText Typo="Typo.h6" Color="@(ShouldBeError ? Color.Primary : Color.Secondary)" > Some text </MudText>

@code {
    private bool ShouldBeError = true; 
}

Upvotes: 0

kolek
kolek

Reputation: 699

I put a div above MudText and it worked straight away.

Upvotes: 0

MrC aka Shaun Curtis
MrC aka Shaun Curtis

Reputation: 30310

I'm not a MudBlazor user, so here's a very simple example demonstrating how to set properties on any element/component. In this case the class of the button rather than the style on a component.

@page "/"

<PageTitle>Index</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<div class="m-2">
    <button class="@_btnCss" @onclick="this.Change">
        Switch
    </button>
</div>

<SurveyPrompt Title="How is Blazor working for you?" />

@code {
    private bool _enabled;
    private string _btnCss => _enabled ? "btn btn-success" : "btn  btn-secondary";

    private void Change()
        => _enabled = !_enabled;
}

[Personal] Note that I try to keep component logic out of the markup whenever I can. I think it's easier to read.

Upvotes: 0

Related Questions