• This topic has 4 replies, 2 voices, and was last updated 1 year ago by admin.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #102266
    xyzzy
    Member
    Up
    0
    Down

    Is there some way to change the font-size of the text in the combo box?

    #102269
    admin
    Keymaster
    Up
    0
    Down

    Hi xyzzy,
    Have you tried the CSS font-size property?
    Best regards,
    Peter Stoev
    Smart UI Team
    https://www.htmlelements.com/

    #102277
    xyzzy
    Member
    Up
    0
    Down

    Yes I have.

    #102297
    xyzzy
    Member
    Up
    0
    Down

    Any code examples to show how this is done?
    I tried adding a class and id to the object and defining a font-size before creating this post without any joy. [Class is an undocumented property in your API documentation]
    <ComboBox Class=”vcs-combo”  Id=”idIlluminant” …
    and in style.css
    .vcs-combo {
    font-size: smaller;
    }
    #idIlluminant {
    font-size: xx-small;
    }
    ComboBox {
    font-size: x-small;
    }
    No joy with any of them.
     

    #102298
    admin
    Keymaster
    Up
    0
    Down

    Hi xyzzy,
    Here’s a Blazor example with the ComboBox. In order to set the font size you can either put a CSS selector using the combobox’s INPUT or use a CSS variable –smart-font-size which changes the font-size of the Blazor combobox and its dropdown items.

    @page "/combobox"
    @using Smart.Blazor.Demos.Data
    @inject WeatherForecastService ForecastService
    <style>
    .combo {
    --smart-font-size: 24px;
    }
    </style>
    <Example Name="ComboBox">
    @if (forecasts == null)
    {
    <p><em>Loading...</em></p>
    }
    else
    {
    <h2>Forecasts Summary</h2>
    <ComboBox Class="combo" SelectedIndexes="new int[] { 0 }">
    @foreach (var forecast in forecasts)
    {
    <ListItem Label="@forecast.Summary.Trim()"></ListItem>
    }
    </ComboBox>
    }
    </Example>
    @code {
    private WeatherForecast[] forecasts;
    protected override async Task OnInitializedAsync()
    {
    forecasts = await ForecastService.GetForecastAsync(DateTime.Now);
    }
    }

    Best regards,
    Peter Stoev
    Smart UI Team
    https://www.htmlelements.com/

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.