Change the width of a panel

[madcoda9000]

Hello,

is here anyone who can tell me how to change the width of a panel?

I've tried that already, but it seems to have no effect:

private async Task ShowAccount(int accountId) {
        var res = await _acc.GetSecret(new GetSecretModel { secretId=accountId, });
        if(res.Success && res.Data!=null) {
            UpdateSecretModel acc = res.Data;
            _dialog = await DialogService.ShowPanelAsync<SecretPanel, UpdateSecretModel>(new DialogParameters<UpdateSecretModel>()
            {
                Content = acc,
                Alignment = HorizontalAlignment.Right,
                Title = "Edit / view Account",
                PrimaryAction = "Update Account",
                SecondaryAction = "Close",
                Width = "500px",
            });
            DialogResult result = await _dialog.Result;
            //await HandleAccountPanleClose(result); 
            await _js.InvokeVoidAsync("logData", result);
        }        
    }

Best Regards
Sascha

[vnbaaij]

Hi Sascha,

Congrats. You've found a bug! :)

Did you happen to copy the css from the demo site? Because in there we set the panel width to 340px if the screen width is > 800px. Short term fix can probably be made there.

In the Dialog component the --dialog-width was only set when Alignment of the dialog was set to `Center'. For 3.1 that will be changed so width can also be set when aligned left or right.

[madcoda9000]

Hi Vincent,

no, i did'nt copy the css from the demo site as i did not find the css you're using there :-). I've looked here https://www.fluentui-blazor.net/Panel.

Could you maybe be so kind and tell me where i can the find the css you're using for adjusting the size?

[vnbaaij]

If you did not copy, then it doesn't apply. You'll need to wait for the 3.1 release...