Problem/Motivation

On Artisan there are two folder which contains many .txt files with a lot of utility classes. Their purpose is to have Tailwind CSS Three Shaking to not clean these utilities, as these files are part of the @source directive.

This is because the might be some utility classes added on the content level, like for example, classes added vía Menu Link Attributes modules, so Tailwind is not aware of them.

The problem is that its increasing the CSS file size a lot, and probably most of these utilities will not be used in the same project.

We should remove these files and update the documentation informing about the Tailwind Three-Shaking, so developers are aware and can manually add the need classes.

Proposed resolution

Remove utilities-safelist folder.
Update documentation.

Issue fork artisan-3571000

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

alejandro cabarcos created an issue. See original summary.

frouco made their first commit to this issue’s fork.

frouco’s picture

frouco commented
Assigned: frouco » alejandro cabarcos
Status: Active » Needs review

The Tailwind utilities safe list has been moved to utilities-safelist-disabled. These are not available in the default CSS provided by the theme, but can easily be recovered if needed.

alejandro cabarcos changed the visibility of the branch 3571000-remove-utilities-safelist to hidden.

alejandro cabarcos opened merge request !41

alejandro cabarcos changed the visibility of the branch 3571000-remove-utilities-safelist to active.

alejandro cabarcos’s picture

alejandro cabarcos commented

When removing the safelist, several components from Artisan (contrib, not the starterkit) looks broken, since they might have utility classes that are not present on the starterkit.

alejandro cabarcos’s picture

alejandro cabarcos commented

Tailwind + DaisyUI safelist
dist/main.css | 354.61 kB │ gzip: 44.78 kB

DaisyUI safelist
dist/main.css |120.31 kB │ gzip: 17.77 kB

alejandro cabarcos’s picture

alejandro cabarcos commented
Status: Needs review » Fixed

Added a @source referencing the Artisan contrib components to address the problem on #7 and have a nice starting experience.

However I think that contrib components should be copied to the subtheme generated. This will allow devs to adapt their components to their needs and us to evolve these components without making breaking changes to current installations.

Im marking this as fixed and probably open up a new issue to discuss this.

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

alejandro cabarcos’s picture

alejandro cabarcos commented
Status: Fixed » Needs work

After removing DaisyUI safelist, several components break since their utility classes are calculated and not string.

Example:
'btn-' ~ color,.

alejandro cabarcos changed the visibility of the branch 3571000-remove-utilities-safelist to hidden.

alejandro cabarcos changed the visibility of the branch 3571000-remove-utilities-safelist to hidden.

alejandro cabarcos opened merge request !42

sandeshyadav’s picture

sandeshyadav commented

+ 1 for removing the safelist as it is increasing the CSS filesize a lot. 360 KB is more than that of Bootstrap, which defeats the purpose of using TailwindCSS.

alejandro cabarcos’s picture

alejandro cabarcos commented
Status: Needs work » Fixed

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.