Content
- -
@@ -22,13 +22,16 @@ import { Component } from '@angular/core';
Content
-
Content
-
+
+
+
\ No newline at end of file
diff --git a/components/layout/nz-sider.component.ts b/components/layout/nz-sider.component.ts
index 9015953433a..7701d5ca64a 100644
--- a/components/layout/nz-sider.component.ts
+++ b/components/layout/nz-sider.component.ts
@@ -6,7 +6,6 @@ import {
ElementRef,
EventEmitter,
Host,
- HostBinding,
Input,
NgZone,
OnDestroy,
@@ -37,6 +36,7 @@ export type NzBreakPoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
host : {
'[class.ant-layout-sider-zero-width]': 'nzCollapsed && nzCollapsedWidth === 0',
'[class.ant-layout-sider-light]' : `nzTheme === 'light'`,
+ '[class.ant-layout-sider-collapsed]' : 'nzCollapsed',
'[style.flex]' : 'flexSetting',
'[style.max-width.px]' : 'widthSetting',
'[style.min-width.px]' : 'widthSetting',
@@ -58,10 +58,11 @@ export class NzSiderComponent implements OnInit, AfterViewInit, OnDestroy {
@Input() nzTheme: 'light' | 'dark' = 'dark';
@Input() nzCollapsedWidth = 80;
@Input() nzBreakpoint: NzBreakPoint;
+ @Input() nzZeroTrigger: TemplateRef;
+ @Input() @ViewChild('defaultTrigger') nzTrigger: TemplateRef;
@Input() @InputBoolean() nzReverseArrow = false;
@Input() @InputBoolean() nzCollapsible = false;
- @Input() @ViewChild('defaultTrigger') nzTrigger: TemplateRef;
- @Input() @InputBoolean() @HostBinding('class.ant-layout-sider-collapsed') nzCollapsed = false;
+ @Input() @InputBoolean() nzCollapsed = false;
@Output() readonly nzCollapsedChange = new EventEmitter();
get flexSetting(): string {
@@ -86,7 +87,9 @@ export class NzSiderComponent implements OnInit, AfterViewInit, OnDestroy {
this.below = matchBelow;
this.nzCollapsed = matchBelow;
this.nzCollapsedChange.emit(matchBelow);
- this.cdr.markForCheck();
+ this.ngZone.run(() => {
+ this.cdr.markForCheck();
+ });
}
}
@@ -96,11 +99,11 @@ export class NzSiderComponent implements OnInit, AfterViewInit, OnDestroy {
}
get isZeroTrigger(): boolean {
- return this.nzCollapsible && this.nzTrigger && (this.nzCollapsedWidth === 0) && ((this.nzBreakpoint && this.below) || (!this.nzBreakpoint));
+ return this.nzCollapsible && this.nzTrigger && this.nzCollapsedWidth === 0 && ((this.nzBreakpoint && this.below) || (!this.nzBreakpoint));
}
get isSiderTrigger(): boolean {
- return this.nzCollapsible && this.nzTrigger && (this.nzCollapsedWidth !== 0);
+ return this.nzCollapsible && this.nzTrigger && this.nzCollapsedWidth !== 0;
}
constructor(@Optional() @Host() private nzLayoutComponent: NzLayoutComponent, private mediaMatcher: MediaMatcher, private ngZone: NgZone, private platform: Platform, private cdr: ChangeDetectorRef, renderer: Renderer2, elementRef: ElementRef) {
diff --git a/components/list/demo/infinite-load.ts b/components/list/demo/infinite-load.ts
index f435cf2f2a1..4c508c6247e 100644
--- a/components/list/demo/infinite-load.ts
+++ b/components/list/demo/infinite-load.ts
@@ -36,7 +36,7 @@ import { BehaviorSubject, Observable, Subscription } from 'rxjs';
`,
styles: [
`
- :host ::ng-deep .demo-infinite-container {
+ .demo-infinite-container {
height: 300px;
border: 1px solid #e8e8e8;
border-radius: 4px;
diff --git a/components/list/demo/loadmore.ts b/components/list/demo/loadmore.ts
index dbb19273057..2295d3529a9 100644
--- a/components/list/demo/loadmore.ts
+++ b/components/list/demo/loadmore.ts
@@ -40,10 +40,10 @@ const fakeDataUrl = 'https://randomuser.me/api/?results=5&inc=name,gender,email,
`,
styles: [ `
- :host ::ng-deep .demo-loadmore-list {
+ .demo-loadmore-list {
min-height: 350px;
}
- :host ::ng-deep .loadmore {
+ .loadmore {
text-align: center;
margin-top: 12px;
height: 32px;
diff --git a/components/notification/demo/with-icon.ts b/components/notification/demo/with-icon.ts
index fa5e89e1b75..f2cce88bf2d 100644
--- a/components/notification/demo/with-icon.ts
+++ b/components/notification/demo/with-icon.ts
@@ -11,7 +11,7 @@ import { NzNotificationService } from 'ng-zorro-antd';
`,
styles : [
`
- :host ::ng-deep .ant-btn {
+ button {
margin-right: 1em;
}
`
diff --git a/components/popconfirm/demo/placement.ts b/components/popconfirm/demo/placement.ts
index 76be9134a5b..8da70d2e455 100644
--- a/components/popconfirm/demo/placement.ts
+++ b/components/popconfirm/demo/placement.ts
@@ -26,14 +26,6 @@ import { NzMessageService } from 'ng-zorro-antd';
`,
styles : [ `
- :host ::ng-deep .demo {
- overflow: auto;
- }
-
- :host ::ng-deep .ant-popover-wrap > a {
- margin-right: 8px;
- }
-
button {
margin-right: 8px;
margin-bottom: 8px;
diff --git a/components/table/demo/dynamic-settings.ts b/components/table/demo/dynamic-settings.ts
index 1f80011f4d2..8fdb120a253 100644
--- a/components/table/demo/dynamic-settings.ts
+++ b/components/table/demo/dynamic-settings.ts
@@ -118,11 +118,11 @@ import { Component, OnInit } from '@angular/core';
styles : [
`
.components-table-demo-control-bar {
- margin-bottom: 10px;
+ margin-bottom: 12px;
}
- .components-table-demo-control-bar ::ng-deep .ant-form-item {
- margin-right: 15px;
+ .nz-form-item {
+ margin-right: 16px;
margin-bottom: 8px;
}
`
diff --git a/components/upload/demo/avatar.ts b/components/upload/demo/avatar.ts
index 6652a5f0d50..f44ef112681 100644
--- a/components/upload/demo/avatar.ts
+++ b/components/upload/demo/avatar.ts
@@ -13,7 +13,7 @@ import { Observable, Observer } from 'rxjs';
[nzBeforeUpload]="beforeUpload"
(nzChange)="handleChange($event)">
Upload
Click or drag file to this area to upload
Support for a single or bulk upload. Strictly prohibit from uploading company data or other band files
- `, - styles: [ - ` - :host ::ng-deep nz-upload { display: block; } - :host ::ng-deep .ant-upload.ant-upload-drag { height: 180px; } ` - ] }) export class NzDemoUploadDragComponent { constructor(private msg: NzMessageService) {} diff --git a/components/upload/demo/picture-card.ts b/components/upload/demo/picture-card.ts index accd26f7413..f40d105e871 100644 --- a/components/upload/demo/picture-card.ts +++ b/components/upload/demo/picture-card.ts @@ -24,11 +24,11 @@ import { NzMessageService, UploadFile } from 'ng-zorro-antd'; `, styles: [ ` - :host ::ng-deep i { + i[nz-icon] { font-size: 32px; color: #999; } - :host ::ng-deep .ant-upload-text { + .ant-upload-text { margin-top: 8px; color: #666; } diff --git a/ngsw-config.json b/ngsw-config.json index 50afcd84401..b0fc3d70dea 100644 --- a/ngsw-config.json +++ b/ngsw-config.json @@ -28,6 +28,6 @@ "!/**/*.*", "!/**/*__*", "!/**/*__*/**", - "!/**/(version|issue-helper)/**" + "!/**/(version|issue-helper|iframe)/**" ] } diff --git a/scripts/site/utils/generate-code-box.js b/scripts/site/utils/generate-code-box.js index 2de98f16afa..5fc35606415 100644 --- a/scripts/site/utils/generate-code-box.js +++ b/scripts/site/utils/generate-code-box.js @@ -14,7 +14,7 @@ module.exports = function generateCodeBox(component, demoName, key, title, doc, if (iframe.source) { output = output.replace(/{{iframeSource}}/g, iframe.source); } else { - output = output.replace(/{{iframeSource}}/g, `/iframe/#/${component}-${key}`); + output = output.replace(/{{iframeSource}}/g, `/iframe/index.html/#/${component}-${key}`); } if (iframe.height) { output = output.replace(/{{iframeHeight}}/g, iframe.height);