fix(module:color-picker): optimize demo copywriting and style (#8088)

Author: OriginRing

components/color-picker/demo/disable.md

@@ -7,7 +7,7 @@ title:
 
 ## zh-CN
 
-最简单的用法。
+设置为禁用状态。
 
 ## en-US
 

components/color-picker/demo/flip-flop.ts

@@ -7,7 +7,14 @@ import { Component } from '@angular/core';
     <ng-template #flipFlop>
       <button nz-button nzType="primary" [style.background-color]="color">Color</button>
     </ng-template>
-  `
+  `,
+  styles: [
+    `
+      button {
+        border: none;
+      }
+    `
+  ]
 })
 export class NzDemoColorPickerFlipFlopComponent {
   color = '#1677ff';

components/color-picker/demo/format.ts

@@ -3,14 +3,23 @@ import { Component } from '@angular/core';
 @Component({
   selector: 'nz-demo-color-picker-format',
   template: `
-    <nz-color-picker nzFormat="hex" [(ngModel)]="hex"></nz-color-picker> HEX: {{ hex }}
-    <br />
-    <br />
-    <nz-color-picker nzFormat="hsb" [(ngModel)]="hsb"></nz-color-picker> HSB: {{ hsb }}
-    <br />
-    <br />
-    <nz-color-picker nzFormat="rgb" [(ngModel)]="rgb"></nz-color-picker> RGB: {{ rgb }}
-  `
+    <div class="format"> <nz-color-picker nzFormat="hex" [(ngModel)]="hex"></nz-color-picker> HEX: {{ hex }} </div>
+    <div class="format"> <nz-color-picker nzFormat="hsb" [(ngModel)]="hsb"></nz-color-picker> HSB: {{ hsb }} </div>
+    <div class="format"> <nz-color-picker nzFormat="rgb" [(ngModel)]="rgb"></nz-color-picker> RGB: {{ rgb }} </div>
+  `,
+  styles: [
+    `
+      .format {
+        display: flex;
+        align-items: center;
+        margin-bottom: 12px;
+      }
+
+      nz-color-picker {
+        margin-right: 8px;
+      }
+    `
+  ]
 })
 export class NzDemoColorPickerFormatComponent {
   hex: string = '#1677ff';

components/color-picker/demo/show-text.md

@@ -7,8 +7,8 @@ title:
 
 ## zh-CN
 
-最简单的用法。
+渲染触发器的默认文本, `nzShowText` 为 `true` 时生效。
 
 ## en-US
 
-Show color text.
+The default text of the rendering trigger, effective when `nzShowText` is `true`.