updates

沈斌

2017-12-15 f9b157566af34b8dc28ba10b34d025ac04f3168b

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<div class="content__title">
    <h1>
        Colors
        <small>Color Palettes</small>
    </h1>
</div>
<div nz-row [nzGutter]="16">
    <div nz-col [nzMd]="24">
        <nz-card nzTitle="Classic colors">
            <div nz-row *ngFor="let c of colorSrv.brands">
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}}-light p-lg">.bg-{{c}}-light<br>.text-{{c}}-light</div>
                </div>
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}} p-lg">.bg-{{c}}<br>.text-{{c}}</div>
                </div>
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}}-dark p-lg">.bg-{{c}}-dark<br>.text-{{c}}-dark</div>
                </div>
            </div>
        </nz-card>
    </div>
</div>
<div nz-row [nzGutter]="16">
    <div nz-col [nzMd]="24">
        <nz-card nzTitle="Name colors">
            <div nz-row *ngFor="let c of colors">
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}}-light p-lg">.bg-{{c}}-light<br>.text-{{c}}-light</div>
                </div>
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}} p-lg">.bg-{{c}}<br>.text-{{c}}</div>
                </div>
                <div nz-col [nzSpan]="8">
                    <div class="bg-{{c}}-dark p-lg">.bg-{{c}}-dark<br>.text-{{c}}-dark</div>
                </div>
            </div>
            <div nz-row>
                <div nz-col [nzSpan]="5">
                    <div class="bg-grey-darker p-lg">.bg-grey-darker<br>.color-grey-darker</div>
                </div>
                <div nz-col [nzSpan]="5">
                    <div class="bg-grey-dark p-lg">.bg-grey-dark<br>.color-grey-dark</div>
                </div>
                <div nz-col [nzSpan]="4">
                    <div class="bg-grey p-lg">.bg-grey<br>.color-grey</div>
                </div>
                <div nz-col [nzSpan]="5">
                    <div class="bg-grey-light p-lg">.bg-grey-light<br>.color-grey-light</div>
                </div>
                <div nz-col [nzSpan]="5">
                    <div class="bg-grey-lighter p-lg">.bg-grey-lighter<br>.color-grey-lighter</div>
                </div>
            </div>
        </nz-card>
    </div>
</div>
<div nz-row [nzGutter]="16">
    <div nz-col [nzMd]="24">
        <nz-card nzTitle="Full Colors">
            <div nz-row>
                <div nz-col [nzSpan]="4" *ngFor="let c of colorSrv.names">
                    <div *ngFor="let i of nums" class="bg-{{c}}-{{i}} p-lg">
                        .bg-{{c}}-{{i}}<br>
                        .bg-{{c}}-{{i}}-h<br>
                        .text-{{c}}-{{i}}<br>
                    </div>
                </div>
            </div>
        </nz-card>
    </div>
</div>