CODEWITHSUNDEEP
cssextjssencha-touch
Fred A
Fred A

Reputation: 1764

Sencha Touch's loadmask customization

Example of Sencha Touch loadmask: here

Is there any way to customize the loadmask properties without needing to create a new one? I want to increase the size of the darker grey box (i think its the inner-mask right?) because i want to use html to make the loadmask looks better. But with box that has a size like that, there's little thing that you can do to make the loadmask looks better.

masked: {
          xtype: 'loadmask',
          message: 'Now Loading..',
        }

How would i set that darker grey box size? I tried with height and width but that one modifies the whole loadmask size, not the darker grey box area.

Upvotes: 3

Views: 2587

Answers (1)

Viswa
Viswa

Reputation: 3211

i tried some, here is the result.

Solution 1

{
   xtype: 'loadmask',
   id : 'testMask',
   message: 'Now Loading..'
}

CSS

div#testMask{
    font-size: 20.95px;
}

it's working but note that it will increases font size.

Solution 2

CSS

.x-mask .x-loading-spinner-outer {
    min-width: 20.5em !important;
    height: 19.5em !important;
}

it's also working, but it overrides the existing style.

Upvotes: 3

Related Questions