Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

No prefixes are added for space-y-* and space-x-*

See original GitHub issue

See the “Avatar group stacked bottom to top” component at http://localhost:5000/components/application-ui/elements/avatars

Notice that no prefixes are added for: space-y-6 sm:space-y-0

            <div class="space-y-6 sm:space-y-0 sm:tw-flex tw-justify-around tw-items-end tw-w-full tw-max-w-lg tw-mx-auto">
              <div class="tw-flex tw-relative tw-z-0 tw-overflow-hidden">
                <img class="tw-relative tw-z-30 tw-inline-block tw-h-8 tw-w-8 tw-rounded-full tw-text-white tw-shadow-solid" src="https://images.unsplash.com/photo-1491528323818-fdd1faba62cc?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=facearea&amp;facepad=2&amp;w=256&amp;h=256&amp;q=80" alt="">
                <img class="tw-relative tw-z-20 tw--ml-2 tw-inline-block tw-h-8 tw-w-8 tw-rounded-full tw-text-white tw-shadow-solid" src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&amp;auto=format&amp;fit=facearea&amp;facepad=2&amp;w=256&amp;h=256&amp;q=80" alt="">
                <img class="tw-relative tw-z-10 tw--ml-2 tw-inline-block tw-h-8 tw-w-8 tw-rounded-full tw-text-white tw-shadow-solid" src="https://images.unsplash.com/photo-1500648767791-00dcc994a43e?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=facearea&amp;facepad=2.25&amp;w=256&amp;h=256&amp;q=80" alt="">
                <img class="tw-relative tw-z-0 tw--ml-2 tw-inline-block tw-h-8 tw-w-8 tw-rounded-full tw-text-white tw-shadow-solid" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=facearea&amp;facepad=2&amp;w=256&amp;h=256&amp;q=80" alt="">
              </div>
            </div>

This probably also is an issue with https://github.com/vesper8/vue-tailwind-prefix-applicator/

Issue Analytics

State:
Created 3 years ago
Comments:13 (6 by maintainers)

Top GitHub Comments

1reaction

vesper8commented, May 1, 2020

Currently, the way I extract the list of all possible tailwind classes is by manually downloading https://cdn.jsdelivr.net/npm/@tailwindcss/ui@latest/dist/tailwind-ui.css and https://unpkg.com/tailwindcss@^1.0/dist/tailwind.css and then manually editing each of those files to remove the normalize.css as well as a few other things. And then I feed it to my PHP extractor file which cleans out a whole lot of suffixes and prefixes and other CSS artifacts and produces a clean list of tailwind classes. I’m not sure how you could do that at build time but I’d be interested to know!

1reaction

kilimancommented, May 1, 2020

Once I finish #16 and generate the CSS from the tailwind config, we can also generate the class list for the prefix transformer at build time. This way it’s as current as their config is.