Question

我正在开发一个使用NG-ZORRO作为组件的Angular应用程序。
我需要自定义按钮的外观，我想通过自定义预定义的Less函数/ mixins来实现。

例如，我需要覆盖此混入定义
node_modules/ng-zorro-antd/button/style/mixin.less

// Base styles of buttons
// --------------------------------------------------
.btn() {
  position: relative;
  display: inline-block;
  font-weight: @btn-font-weight;

  ...

  &.disabled,
  &[disabled] {
    cursor: not-allowed;
    > * {
      pointer-events: none;
    }
  }

特别是&.disabled部分。
我显然可以使用

导入

@import '~ng-zorro-antd/button/style/mixin';

但是我不知道如何覆盖它。也许这很简单！

Answer 1

也许这很简单！

好吧，显然就是这么简单

.btn() {
  &.disabled,
  &[disabled] {
    cursor: default;
  }
}

该文件位于您的自定义.less文件中，该文件也在angular.json内部声明，例如

"styles": [
   ...
   "src/main/webapp/assets/css/styles_zorro.less"
],

在Less中覆盖mixin

1 个答案: