monty5811/postcss-elm-tailwind

CSS with round brackets "()" create non-valid elm-functions

Closed this issue · 2 comments

CamelCase:

buttonDefaultFocusNot(FocusVisible) : Html.Attribute msg
buttonDefaultFocusNot(FocusVisible) =
    A.class "button--default:focus:not(:focus-visible)"


buttonSecondaryFocusNot(FocusVisible) : Html.Attribute msg
buttonSecondaryFocusNot(FocusVisible) =
    A.class "button--secondary:focus:not(:focus-visible)"


buttonFocusNot(FocusVisible) : Html.Attribute msg
buttonFocusNot(FocusVisible) =
    A.class "button:focus:not(:focus-visible)"

Snake-case:

button__default__focus__not(__focus_visible) : Html.Attribute msg
button__default__focus__not(__focus_visible) =
    A.class "button--default:focus:not(:focus-visible)"


button__secondary__focus__not(__focus_visible) : Html.Attribute msg
button__secondary__focus__not(__focus_visible) =
    A.class "button--secondary:focus:not(:focus-visible)"


button__focus__not(__focus_visible) : Html.Attribute msg
button__focus__not(__focus_visible) =
    A.class "button:focus:not(:focus-visible)"

Is there a workaround for this?

An alternative could be to remove the brackets so that buttonFocusNot(FocusVisible) becomes buttonFocusNotFocusVisible

I think it should be easy to add support to this.

If you add a failing test. Then I think the place to add a fix is in fixClass here.

(I've made you a contributor too on the repo.)

Does not appear to be an issue after updating to Postcss 8.0.0 by merging #53 !