How can I increase loading screen title

Help & Support
1

I tried messing with the loadinscreen.js file. I am not a css guy, I tried setting the width at

'#application-splash img {',

            '    width: 300%;',

            '}',

and although it increased the size of the logo, it’s also not centered anymore. Is there an easy way to simply increase the size of the logo and keep it centered? Thanks!

2

Hi @Marks

Here is the one I use which is just editable from the original:

'#application-splash {',
    '    position: absolute;',
    '    top: calc(50% - 100px);',
    '    width: 501px;',
    '    left: calc(50% - 250px);',
    '}',

You can see that the sheet calculates the center point by taking half the size of the area and subtracting half the size of the image from both the top and the left. The values are hard coded, but the reason for that is so the image isn’t stretched on different sized screens. I hope this is helpful

1 Like
3

For some reason this is only affecting desktop, not mobile.The size is not changing on chrome on android.

4

I think I see why:

'#application-splash {',
    '    position: absolute;',
    '    top: calc(50% - 100px);',
    '    width: 501px;',
    '    left: calc(50% - 250px);',
    '}',

'#application-splash img {',
        '    width: 100%;',
        '}',

As you can see, there are two parts to the setup. You will want to keep #application-splash img's width at 100% and then hard code the size it should actually be in #application-splash

I hope that is helpful

5

It’s already like that man. On desktop it’s working fine, not on mobile though. Did you try?

6

I have tried my code on my projects, yes.

Unfortunately, without a link to yours, I would be unable to reproduce the behavior.

7

It’s because of this. To affect mobile, I need to mess with this part

@media (max-width: 480px) {',

            '    #application-splash {',

            '        width: 340px;',

            '        left: calc(50% - 85px);',

            '    }'
8

Would it be possible to post screenshots of the behavior you’re getting?

Or a link to the project?

9

I got it working messing with the part I told you about. Thanks!