清晰度设计系统Datagrid - 是否可以隔离和仅使用Datagrid组件？

Question

我们希望使用数据网格，但我们所有网站中的按钮都存在问题。 一旦安装了Clarity，就不可能制作小方形按钮。 在某种程度上，每个按钮的最小宽度似乎被系统中的某些东西所覆盖。

有没有办法分离Clarity Design System的不同组件？或者可能排除其中一些？ 按钮最小宽度是否知道此问题？你知道一种防止这种行为的方法吗？

非常感谢。

Answer 1

Clarity的样式捆绑为一个单元，因此您必须自己构建样式，并且只构建Datagrid所需的部分。有关自定义主题https://vmware.github.io/clarity/documentation/v0.11/themes的主题文档底部附近可以找到一些详细信息。您必须通过尝试删除其他所有内容来进一步发展。然后，您只需将ClrDatagridModule从@clr/angular导入到Angular应用程序中即可。

但是，我无法保证您能够避免按钮问题，因为数据网格有按钮，我们不建议只构建一些孤立的Clarity（我们不知道它们有多好它将在实践中工作）。

您始终可以使用自己的CSS覆盖任何CSS，以重置按钮min-width属性。我们设置了一些这样的值，以确保用户可以正确访问这些内容，因此我不确定您的限制是什么，但最好的办法是在必要时覆盖Clarity样式。

Answer 2

感谢您的帮助。

我设法通过将以下代码添加到我的css文件来中和按钮行为。

.btn {
  min-width: unset;
  min-height: unset;
}