README

此插件允许您合并多个 Tailwind CSS 类，并自动解决它们之间的冲突。

功能

此插件提供

Antlers 修改器以合并 Tailwind CSS 类。
安装 tailwind-merge-laravel 包，该包在 Laravel 上下文中提供合并功能。

安装

从您的项目根目录运行以下命令

composer require marcorieser/tailwind-merge-statamic

使用方法

请注意：后来应用的类会覆盖之前的类。

像往常一样创建您的类字符串，并应用修改器，然后它会移除冲突的类

{{ varable_holding_classes = 'bg-blue-500 w-8' }}

<div class="{{ 'w-10 h-10 rounded-full bg-red-500 {varable_holding_classes}' | tw_merge }}"></div>

{{# output #}}
<div class="w-8 h-10 rounded-full bg-blue-500"></div>

或者，您可以将变量的名称作为参数传递给修改器，并在类字符串中省略它们

<div class="{{ 'w-10 h-10 rounded-full bg-red-500' | tw_merge('varable_holding_classes', 'another_variable') }}"></div>

可以将修改器应用于字符串、数组或两者的组合

{{ 'w-10 h-10 rounded-full bg-red-500 {variable}' | tw_merge }}
{{ ['w-10', 'h-10', 'rounded-full', 'bg-red-500',  '{variable}'] | tw_merge }}
{{ ['w-10', 'h-10', ['rounded-full', 'bg-red-500'], '{variable}'] | tw_merge }}

文档

目前该插件没有更多内容，如上所述，但底层 Laravel 包能够做更多。请查看其 GitHub 仓库。

致谢

非常感谢 Sandro Gehri 提供那个出色的 Laravel 包。

marcorieser / tailwind-merge-statamic

维护者

详细信息

README

功能

安装

使用方法

文档

致谢