changing colors ?

[bgasmartek]

any idea how to set the color e.g. primary, secondary, etc globally ?

[LucaCris]

Thanks to Bootswatch, you can:

MainLayout.razor

<HeadContent>
    @if (string.IsNullOrWhiteSpace(Global.Settings.Theme)) {
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
    } else {
        <link href=@($"https://cdn.jsdelivr.net/npm/bootswatch@5.3.0/dist/{Global.Settings.Theme}/bootstrap.min.css") rel="stylesheet" />
    }
    <link href="EagleEye.styles.css" rel="stylesheet" />
</HeadContent>

The Theme can be choosen like:

<InputSelect @bind-Value="Theme" class="form-control mb-2 w-25">
    <option value="">Default</option>
    <option value="cerulean">Cerulean</option>
    <option value="cosmo">Cosmo</option>
    <option value="cyborg">Cyborg (dark)</option>
    <option value="darkly">Darkly (dark)</option>
    <option value="flatly">Flatly</option>
    <option value="journal">Journal</option>
    <option value="litera">Litera</option>
    <option value="lumen">Lumen</option>
    <option value="lux">Lux</option>
    <option value="materia">Materia</option>
    <option value="minty">Minty</option>
    <option value="morph">Morph</option>
    <option value="pulse">Pulse</option>
    <option value="quartz">Quartz</option>
    <option value="sandstone">Sandstone</option>
    <option value="simplex">Simplex</option>
    <option value="slate">Slate (dark)</option>
    <option value="solar">Solar (dark)</option>
    <option value="spacelab">SpaceLab</option>
    <option value="superhero">Superhero (dark)</option>
    <option value="united">United</option>
    <option value="vapor">Vapor (dark)</option>
    <option value="yeti">Yeti</option>
    <option value="zephyr">Zephyr</option>
</InputSelect>