School Icon Size and Colors backgroud

Administration
1

Hello Admin,

I got to have a couple of questions. The first one is about the school icon size, as the system upgraded, the old legacy theme had no longer supported. But the school icon is not a suitable size for the current theme, I tried to tune the size of the picture, looks like the size of 400x100ps is far not satisfactory to the suitable school icon.

The second question is, is that possible to change the background colors? Because so far there is no theme available to use?

Best regards,

Butters

2

Hi Butters,

For question 1, there is an override system for themes that lets you change a file in your installation. Do do this, you could copy the resources/templates/index.twig.html` file and place it in a themes/Default/templates folder (create the template folder if it doesn’t exit). Then, you could find and change the logo size, which is around lines 27-29 of the index.twig.html file.

For question 2, there is an interface and background colour system in the new non-legacy theme. Be sure to check out System Admin > Display Settings. You can choose one of the built in colour schemes for the interface colour, and then choose a background image. To set a specific colour, you can upload a small solid-colour image which will be stretched across the whole background.

Hope this helps!
3

Hi Sandra,

Thanks for your reply. for the question one. I followed up on your step when I opened the twig.html, I only found out the index for height(max-height:100px), any possibility to change the width as well? Also, is the folder either called “templates” or “template”?

The specific code is:

{{ organisationName }} Logo

Question 2 is fine.

Kind regards,

Butters

4 

                    <img class="block max-w-full {{ isLoggedIn ? 'h-12' : 'h-20 mt-4 mb-4' }}" alt="{{ organisationName }} Logo" src="{{ absoluteURL }}/{{ organisationLogo|default("themes/Default/img/logo.png")|trim('/', 'left') }}" style="max-height:100px;" />
                ### </a>

Sorry the code did not show up on the upper.
5

Hi Butters,

The folder is called “templates” plural. Yes, you could use some inline CSS here, if you add something like width: 200px !important;` this should override any other built-in css.

Hope this helps.
6

Hello Sandra,

Could you send me the completed CSS code for me, I am not a programmer good for CSS, sorry for my poor skill :).

Kind regards,

Butters

7

Sure, can you let me know the width and height you’re looking to change it to?

8

I am not sure if the size is suitable for the school. So I would test multiple times. You could initially set up the width and height randomly, and I could change it. just need the completed code. Thanks