Adding a logo to an AIMMS WebUI app

This article illustrates adding a logo to an AIMMS WebUI application, using AIMMS 4.85 and newer.

The example provided

Please download The AIMMS 4.85 sample application to experiment with the example. The top bar of this app looks as follows (snapshot taken with a browser zoom of 200%):

../../_images/appbespoke-logo-zoom200.png

The image file OurBusinessLogo.png is placed in the folder ./MainProject/WebUI/resources/images, and the css file icon.css is placed in the folder ./MainProject/WebUI/resources/css. This file has the following contents:

1:root {
2    --bg_app-logo: 8px 50% / 175px 35px no-repeat url(/app-resources/resources/images/OurBusinessLogo.png);
3    --spacing_app-logo_width: 190px;
4}

For an explanation of the above, please check the AIMMS WebUI documentation about adding a LOGO.

When you want to achieve similar results using AIMMS 4.84 or older, please check out the now deprecated how-to article: Adding a logo to an AIMMS WebUI app using AIMMS 4.84 and older

Logo attribution

The placeholder logo used in this article was created by Paul Wolfs from Total Design (http://www.totaldesign.com).