Joomla Templates Club 406,261 posts

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#870430

Hi @upweb,

For background color, you cannot use opacity but have to convert rgb to rgba instead. For example the color code for navy is #000080, if you want to use this color with opacity 50, you must use this CSS rule instead :

div.acm-cta {
     background: rgba(0, 0, 128, 0.5);
}

where 0, 0, 128 is hex code and 0.5 is opacity.

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#870437

Hi Adam,

thank you very much. Unfortunately it is not working

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#870454

Hi @upweb,

Please make sure that you put the suggested code above in custom.css file first.

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#871364

Hi Adam,

yes, tried and not working.

But I can live with that. I wanted a video on the Home and I appreciate this is overriding the template , so that’s it (I hope in the future the CTA module will be able to render videos by default).

The actual problem now is that with the code we added for the video on the home page, the mobile android visualization is messed up and if we click on the menu, it is blacked out by a background.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#873228

Hi @upweb,

If you open the file here your_site.me/templates/ja_mono/css/custom.css you won’t see the code I suggested above :

div.acm-cta {
     background: rgba(0, 0, 128, 0.5);
}

Could you please provide a screenshot with the problem so I can check at my end ?

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#874258

Hi Adam,

that’s simply because I tried it directly in production.

Anyway, I did exactly the same now on the other website so you can check yourself.

you might also want to try with a mobile to verify what I was saying in my last comment,.

thank you

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#875271

Hi @upweb,

In this case, please stay tuned while I’m checking this matter for you and I will reply back shortly.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#876188

Hi @upweb,

Try adding this code to custom.css file :

.acm-cta {
     overflow: hidden;
}
.acm-cta .cta-btn-actions {
     position: relative;
     z-index: 1;
}
.search-open .mast-search {
     background: rgba(0, 0, 128, 0.5);
}
.two-blocks-wrapper .block-left {
     background: none;
}
@media (max-width: 1399px) {
     .search-open .mast-search {
          background: none;
     }
     div.acm-cta:after {
         content: "";
         position: absolute;
         left: 0;
         top: 0;
         width: 100%;
         height: 100%;
         background: rgba(0, 0, 128, 0.5);
     }
}

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#876190

Hi Adam,

thank you. Do I have to substitute the previous code? and if yes, which part?

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#876493

Hi @upweb,

No, just add them one after each other and let me know if you still need further assistance.

1 user says Thank You to Adam M for this useful post

1. upweb

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#877131

Hi Adam,

thanks… works OK on pre-prod but not on prod (for the mobile) 🙁

[upweb Friend upwebJoin date: November 2015Posts: 142Downloads:6Uploads:5 Thanks: 2]

#877628

sorry, my bad. it was delayed because of cloudflare: it works also in production.

The background changes and slides in together with the search question, but it’s OK.

thank you very much for your help.

[Adam M Moderator Adam MJoin date: May 2014Posts: 5159Downloads:33Uploads:66 Thanks: 95 Thanked: 1271 times in 1235 posts]

#878270

Hi @upweb,

Glad to be of assistance. If you still have any question, please don’t hesitate to let us know.

Best regards,

Adam.

[Author]

Posts