feat(module:card): support nzBorderless (#5796)

NG-ZORRO · Sep 17, 2020 · 6e4419c · 6e4419c
1 parent 132e425
commit 6e4419c
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 3 deletions.
diff --git a/components/card/card.component.ts b/components/card/card.component.ts
@@ -65,7 +65,7 @@ const NZ_CONFIG_MODULE_NAME: NzConfigKey = 'card';
   host: {
     '[class.ant-card]': 'true',
     '[class.ant-card-loading]': 'nzLoading',
-    '[class.ant-card-bordered]': 'nzBordered',
+    '[class.ant-card-bordered]': 'nzBorderless === false && nzBordered',
     '[class.ant-card-hoverable]': 'nzHoverable',
     '[class.ant-card-small]': 'nzSize === "small"',
     '[class.ant-card-contain-grid]': 'listOfNzCardGridDirective && listOfNzCardGridDirective.length',
@@ -76,10 +76,12 @@ const NZ_CONFIG_MODULE_NAME: NzConfigKey = 'card';
 export class NzCardComponent implements OnDestroy {
   readonly _nzModuleName: NzConfigKey = NZ_CONFIG_MODULE_NAME;
   static ngAcceptInputType_nzBordered: BooleanInput;
+  static ngAcceptInputType_nzBorderless: BooleanInput;
   static ngAcceptInputType_nzLoading: BooleanInput;
   static ngAcceptInputType_nzHoverable: BooleanInput;
 
   @Input() @WithConfig() @InputBoolean() nzBordered: boolean = true;
+  @Input() @WithConfig() @InputBoolean() nzBorderless: boolean = false;
   @Input() @InputBoolean() nzLoading = false;
   @Input() @WithConfig() @InputBoolean() nzHoverable: boolean = false;
   @Input() nzBodyStyle: NgStyleInterface | null = null;

diff --git a/components/card/doc/index.en-US.md b/components/card/doc/index.en-US.md
@@ -28,7 +28,7 @@ import { NzCardModule } from 'ng-zorro-antd/card';
 | -------- | ----------- | ---- | ------- | ------------- |
 | `[nzActions]` | The action list, shows at the bottom of the Card. | `Array<TemplateRef<void>>` | - |
 | `[nzBodyStyle]` | Inline style to apply to the card content | `{ [key: string]: string }` | - |
-| `[nzBordered]` | Toggles rendering of the border around the card | `boolean` | `true` | ✅ |
+| `[nzBorderless]` | Remove border around the card | `boolean` | `false` | ✅ |
 | `[nzCover]` | Card cover | `TemplateRef<void>` | - |
 | `[nzExtra]` | Content to render in the top-right corner of the card | `string\|TemplateRef<void>` | - |
 | `[nzHoverable]` | Lift up when hovering card | `boolean` | `false` | ✅ |

diff --git a/components/card/doc/index.zh-CN.md b/components/card/doc/index.zh-CN.md
@@ -29,7 +29,7 @@ import { NzCardModule } from 'ng-zorro-antd/card';
 | --- | --- | --- | --- | --- |
 | `[nzActions]` | 卡片操作组，位置在卡片底部 | `Array<TemplateRef<void>>` | - |
 | `[nzBodyStyle]` | 内容区域自定义样式 | `{ [key: string]: string }` | - |
-| `[nzBordered]` | 是否有边框 | `boolean` | `true` | ✅ |
+| `[nzBorderless]` | 是否移除边框 | `boolean` | `false` | ✅ |
 | `[nzCover]` | 卡片封面 | `TemplateRef<void>` | - |
 | `[nzExtra]` | 卡片右上角的操作区域 | `string\|TemplateRef<void>` | - |
 | `[nzHoverable]` | 鼠标移过时可浮起 | `boolean` | `false` | ✅ |

diff --git a/components/core/config/config.ts b/components/core/config/config.ts
@@ -102,6 +102,7 @@ export interface CardConfig {
   nzSize?: NzSizeDSType;
   nzHoverable?: boolean;
   nzBordered?: boolean;
+  nzBorderless?: boolean;
 }
 
 export interface CarouselConfig {