Predictable stack layout heights

[Joel]

Can you tell me how to get a consistent height for my huge "Create New" button?  I expected it to just use the space it needed instead of being 5X the size it is.

.gsi-height-32px{
    height: 32px !important;
}

<TelerikStackLayout Height="100%"
                    Width="100%"
                    Orientation="StackLayoutOrientation.Vertical">

    <TelerikButton OnClick="@OnCreate"
                   Class="gsi-width-100pct gsi-height-32px">
        Create New
    </TelerikButton>

    <TelerikGrid Data=@Patients
                 SelectedItems="SelectedPatients"
                 Pageable=true
                 PageSize="20"
                 Height="100%"
                 SelectionMode=GridSelectionMode.Single
                 SelectedItemsChanged="@((IEnumerable<Gsi.Customer.Models.Person> m) => OnPatientSelected(m))">

        <GridColumns>
            <GridColumn Field=@nameof(Person.FirstName) Title="First Name" />
            <GridColumn Field=@nameof(Person.LastName) Title="Last Name" />
            <GridColumn Field=@($"{nameof(Patient)}.{nameof(Patient.DateOfBirthDisplay)}") Title="Date of Birth" Width="125px" />
            <GridColumn Field=@($"{nameof(Patient)}.{nameof(Patient.GenderDisplay)}") Title="Sex" Width="100px" />
            <GridColumn Field=@nameof(Person.LastSessionTimestampDisplay) Title="Last Session" />
        </GridColumns>
    </TelerikGrid>
</TelerikStackLayout>

[Dimo]

Hello Joel,

The Telerik StackLayout component relies on flexbox styles. You can get familiar with the mechanism, then inspect the currently applied styles, and make the desired changes:

https://blazorrepl.telerik.com/mfYUkxvu20rP5lmU35

Regards,
Dimo
Progress Telerik