Vertically centering Ext.window.Toast

Asked Jun 21 '17 at 18:05

Active Nov 01 '21 at 18:22

Viewed 793 times

I can't seem to get the toast to vertically centre. I tried using css to centre it but the old top/translateY causes the text to become blurry. Anyone know how to vertically align a toast?

NOTE: We are only using classic

me.toastNotification = Ext.toast({
    html: toastMessage,
    anchor: anchorEl,
    ui: '',
    align: {
        type: 'vbox'
        align: 'center'
        pack: 'center'
    },
    bodyPadding: '10 20 10 20',
    width: anchorEl.getWidth() - 40,
    autoCloseDelay: 2500,
    cls: 'message-panel-toast-notification'
});

edited Nov 01 '21 at 18:22

Grant Humphries

2,696
2
23
24

asked Jun 21 '17 at 18:05

topched

Do you have a chance to add a non-visible component, so the result looks like this: https://fiddle.sencha.com/#view/editor&fiddle/21uu – Artem Stepin Jun 21 '17 at 19:35
Unfortunately I do not have that option. That is a neat idea though. – topched Jun 21 '17 at 20:22
Have you used 'align' config of toast? – Ronak Patel Jun 22 '17 at 06:32
None of the align values both vertically and horizontally centre the toast. Just used a css workaround for webkit to make sure the text doesnt blur – topched Jun 22 '17 at 17:57

Vertically centering Ext.window.Toast

0 Answers0