Skip to main content
Solved

How can I change the look and feel of the busy spinner?

  • 13 June 2019
  • 3 replies
  • 156 views

My WebUI app is looking mighty spiffy. However, whenever AIMMS takes an extra second or two, I see this blue busy spinner.



Alas, that is not in my color scheme.



How can I change either the color of the spinner or the .gif itself so that the spinner matches my look and feel?



Thanks!

3 replies

Userlevel 5
Badge +6
Hey MathFour,

The busy icon is an gif located in C:\Users\...\AppData\Local\AIMMS\IFA\Aimms\4.67.5.0-x64-VS2017\WebUIDev\www\resources\images depending on which AIMMS version you are using.

The default for the AIMMS version I'm currently using is busy_610467c49e28b4e0fc620c1e8336555b.gif which is blue. To change this, I suggest you to download something in your system's color scheme and change the referenced gif in the css class below.

.theme-aimms .veil-msg {
opacity: 1;
height: 50px;
background: #f5f6fa url(../../resources/images/throbber_5e55c38….gif) no-repeat 25px;
text-align: left;
padding-left: 74px;
color: #505767;
}
Userlevel 4
Badge
Thanks @gabiservidone, however it doesn't work. I even tried changing the name of my gif to the name of the blue one, but it still picks up a runtime gif somehow.

Other ideas?
Userlevel 4
Badge +2
Hi @MathFour ,

Please try the following style:

/* to change the color of the busy text */
.theme-aimms .veil-msg .msg-body {
color: red;
}

/* to change the loader image */
.theme-aimms .veil-msg{
background: grey url("../images/dotloader.gif") no-repeat 25px;
height: 150px; /* if you want to change the height of the busy bar. */
}

/* to change the color of the cancel button on the right */
.theme-aimms .tag-veil .veil-msg.state-busy .ui-button{
background:green;
}


the image needs to be in the /resources/css/images folder.

The current loading image is a 50x50 px image.

Do let me know if this helped.

Thanks.

Reply


Didn't find what you were looking for? Try searching on our documentation pages:

AIMMS Developer & PRO | AIMMS How-To | AIMMS SC Navigator