If there is an `\e` modifier inside a `<bg=#bada55>` it closes the background color

[xiCO2k]

Code:

render(<<<'HTML'
    <div class="my-1 ml-3 px-2 bg-green-300 text-black">
        🍃 Termwind now have the capability to <b>extend</b> colors!
    </div>
HTML);

Result:

Posible Solution:

• Change <bg> to and \e code
• Or, find if there is any way to only remove the escape code added from <b>.

[xiCO2k]

Another issue related to this one is this:

Code:

<div class="my-1 ml-3 px-2 bg-green-300 text-black">
    🍃 Termwind <b><i>now <s>have</s> the</i> capability</b> to extend colors!
</div>

It renders:

\e[30;48;2;186;218;85m  🍃 Termwind \e[1m\e[3mnow \e[9mhave\e[0m the\e[0m capability\e[0m to extend colors!  \e[39;49m\n

So what happens, is the \e[0m cancels all the escape codes added before and to have it working properly it need to be re-added.

[xiCO2k]

@butschster I think this could be a related thing to the #64. Any ideas about this?

Thanks

[butschster]

@butschster I think this could be a related thing to the #64. Any ideas about this?

Thanks

Hy, yes! #64 will solve the problem. I'll try to finish this PR on this weekend!

[xiCO2k]

That would be awesome, really thanks for your help.

[butschster]

@xiCO2k Hm, I've just discovered the problem and I think my PR can't fix it)

I think the best way is to replace \e with options and fix tests and then style inheritance will fix colors.

<bg=#86efac;fg=black>  🍃 Termwind now have the capability to <bg=#86efac;fg=black;options=bold>extend</> colors!  </>

[xiCO2k]

Yes, the probably is some of the \e we don't have the options, so we may need another way.

Style Inheritance is the first step 😄

[HitanshuGupta]

I agree, Style Inheritance is the first step

[butschster]

I agree, Style Inheritance is the first step

You can try style inheritance right now with my last PR #102

[xiCO2k]

After giving this a try, I found no issue anymore.