Modal from an Image

[andy_lymeterrace]

Hello guys,

Is it possible to make an image trigger a modal box to appear?

[Kyle – SUPPORT]

Hi

Not currently, but something that has been requested a lot. Will let the developer know

– Kyle

[andy_lymeterrace]

Ok thanks

[Kyle – SUPPORT]

No problem 🙂

[andy_lymeterrace]

Hi Kyle,

Another question on Modals – I would like to change the background colour of a modal to black. Is this possible?

[Kyle – SUPPORT]

Add this to your custom css:

.modal-body {
  background-color: #000;
  color: #fff;
}

– Kyle

[Mohammad – SUPPORT]

Hi,
Please use this code:-

.modal-header,.modal-content{
background:#000 !important;
color:#fff !important;
}

Thanks
Mohammad

[andy_lymeterrace]

Hey guys,

Any difference between the two? What does the important tag mean out of interest?

[andy_lymeterrace]

There is also a padding around the content (and image in this case) in the modal, can I remove that?

[Kyle – SUPPORT]

If you use all of this it should work:

.modal-body {
  background-color: #000;
  color: #fff;
  padding:0;
}
.modal-header{
background:#000 !important;
color:#fff !important;
}

!important just forces the rule

– Kyle

[Rui Guerreiro – SUPPORT]

Hi,

The same elements can be target in different ways, so both can be correct.

The important is used to give a kind of priority in that property if exists another rule that targets the same property.
We have to use the important so our rule can be applied instead other existing rule, if our rule is the only one that targets a specific property then you don’t have to use the important.

You can try first without the important to see if it works and then try with the important.

-Rui