Issue Since Update To Version 1.1.3: Colors Not Managed Correctly When Compiling Scss! - Question | JoomShaper

Issue Since Update To Version 1.1.3: Colors Not Managed Correctly When Compiling Scss!

Marc Dechèvre

Marc Dechèvre

Helix Framework 2 years ago

Hi,

I have the following in my scss file, which was working great until the update to Helix Ultimate 1.1.3

$color: #96866f;

body.neutral .article-list .article { background: rgba($color, 0.1); }

Looking at the console, I now have an error in the background color: now it does not work any more bc Ultimate "converts" it to the following, which can not be interpreted :

body.neutral .article-list .article { background: rgba(#96866f, 0.1); }

The same issue applies when using rgb for $color: then it is compiled as "rgba(rgb(...), 0.1)" which does not work either of course

Txs for your help / the fix.

Marc

0
12 Answers
Toufiq
Toufiq
Accepted Answer
Senior Staff 2 years ago #19771

Please check the latest update. Thanks

0
Ariba
Ariba
Accepted Answer
Support Agent 2 years ago #18345

Hello

Could you kindly provide me the URL of your site?

0
Marc Dechèvre
Marc Dechèvre
Accepted Answer
2 years ago #18348

Sure !

You can see it here: https://www.healthybelgium.be/en/

Actually, it is not just one line of CSS : body.neutral .article-list .article { background: rgba(#96866f, 0.1); }

There are litterally hundreds of lines which are impacted exactly the same way.

0
Ariba
Ariba
Accepted Answer
Support Agent 2 years ago #18350

Thank you for the URL. Actually, i am not able to see any error from my end and it seems alright. Just to confirm, as you updated recently, have you tried clearing the joomla & browser cache? If the error still persists, can you kindly provide me a screenshot?

0
Marc Dechèvre
Marc Dechèvre
Accepted Answer
2 years ago #18375

You can see it very easily : as you can read from the css above, each article in the blog view is supposed to have a light background color.

Select the element called <div class="article " itemprop="blogPost" itemscope="" itemtype="https://schema.org/BlogPosting"> in the HTML and see in the browser Console : there you see how Helix Ultimate compiled the scss into css (template.css)

0
Ariba
Ariba
Accepted Answer
Support Agent 2 years ago #18747

Hello

Our Senior Agent is looking into the issue, kindly allow us some time. Thank you for your patience and cooperation.

0
Marc Dechèvre
Marc Dechèvre
Accepted Answer
2 years ago #18819

Txs a lot @Ariba for your kind follow-up.

I have investigated further on my side. And I do confirm that there is some kinf of issue when Helix Ultimate compiles SCSS (when using for example rgba and lighten).

See the following example (which I have added on my live website mentioned above so that you can see for yourself) :

$joomshaper: #69aa41;
$joomshaper-rgba: rgba($joomshaper, 0.5);
$joomshaper-lighten: lighten($joomshaper,20%);

.joomshaper {background: $joomshaper};
.joomshaper-rgba {background: $joomshaper-rgba};
.joomshaper-lighten {background: $joomshaper-lighten};

Test it with https://www.sassmeister.com/, it compiles nicely into

.joomshaper {background: #69aa41;}
.joomshaper-rgba {background: rgba(105, 170, 65, 0.5);}
.joomshaper-lighten {background: #9fcf82;}

But in https://www.healthybelgium.be/templates/shaper_helixultimate/css/template.css?2105275327 it compiles into

.joomshaper {background: #69aa41;}
.joomshaper-rgba {background: rgba(#69aa41, 0.5);}
.joomshaper-lighten { background: lighten(#69aa41, 20%);}

So I guess there is a problem somewhere in the SCSS/SAAS compiler coming along with Helix Ultimate :)

0
Toufiq
Toufiq
Accepted Answer
Senior Staff 2 years ago #18954

Hi there, Please create an issue here.

https://github.com/JoomShaper/helix-ultimate

-Thanks

0
Marc Dechèvre
Marc Dechèvre
Accepted Answer
2 years ago #18956
0
Toufiq
Toufiq
Accepted Answer
Senior Staff 2 years ago #18960

Thanks @Marc Dechèvre

I hope the developer team will check your issue. Thanks

1
Marc Dechèvre
Marc Dechèvre
Accepted Answer
2 years ago #19800

Txs @Toufiq,

I had yesterday the notification of the fix on Github. I updated Helix and as I mentioned already on Github it does work.

Txs a lot to everyone who contributed to solving this.

0
Toufiq
Toufiq
Accepted Answer
Senior Staff 2 years ago #19814

You are most welcome & Thanks

0