Font Size

[xyzzy]

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

[admin]

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

[xyzzy]

Yes I have.

[xyzzy]

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.
 

[admin]

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/

[Author]

Posts