Project

General

Profile

« Previous | Next » 

Revision 60894

Added by Argiro Kokogiannaki about 3 years ago

[Admin tool | Branch new-UI]

-updates on Customization component

View differences:

customize-buttons.component.ts
6 6 
  selector: 'customize-buttons',
7 7 
  template: `
8 8
9 
      <div class="uk-width-1-2@m uk-width-1-1@s">
9 
      <div class="">
10 10 
        <border [style]="buttons.borderStyle" [width]=
11 11 
          "buttons.borderWidth" [radius]=
12 12 
                  "buttons.borderRadius" (borderChange)=
13 13 
                  " buttons.borderStyle = $event.style;
14 14 
                        buttons.borderRadius = $event.radius;
15 15 
                        buttons.borderWidth = $event.width; "></border>
16 
        <color [color]="buttons.color" (colorChange)=
17 
          " buttons.color = $event; "
18 
               label="Fonts Color"
19 
               [addMargin]="true"></color>
20 
        <color [color]="buttons.backgroundColor" (colorChange)=
21 
          " buttons.backgroundColor = $event; "
22 
               label="Background Color" [addMargin]="true"></color>
23 
        <color [color]="buttons.borderColor" (colorChange)=
24 
          " buttons.borderColor = $event; "
25 
               label="Border Color"
26 
               [addMargin]="true"
27 
        ></color>
28 
        <div class="uk-margin-top uk-margin-small-bottom uk-text-bold">ON HOVER</div>
29 
        <color [color]="buttons.onHover.color" (colorChange)=
30 
          " buttons.onHover.color = $event;" label="Fonts Color"
31 
        ></color>
32 
        <color [color]="buttons.onHover.backgroundColor"
33 
               (colorChange)=
34 
                 " buttons.onHover.backgroundColor = $event;"
35 
               label="Background Color" [addMargin]="true"></color>
36 
        <color [color]="buttons.onHover.borderColor" (colorChange)=
37 
          " buttons.onHover.borderColor = $event;"
38 
               label="Border Color" [addMargin]="true"></color>
16 
        <div class="uk-grid uk-child-width-1-2 uk-margin-top" >
17 
          <div class="">
18 
            <div class=" uk-margin-small-bottom uk-text-bold uk-margin-small-left">Colors</div>
19 
            <color [color]="buttons.color" (colorChange)=
20 
              " buttons.color = $event; "
21 
                   label="Fonts"
22 
                   ></color>
23 
            <color [color]="buttons.backgroundColor" (colorChange)=
24 
              " buttons.backgroundColor = $event; "
25 
                   label="Background" ></color>
26 
            <color [color]="buttons.borderColor" (colorChange)=
27 
              " buttons.borderColor = $event; "
28 
                   label="Border"
29
30 
            ></color>
31 
          </div>
32 
          <div>
33 
            <div class=" uk-margin-small-bottom uk-text-bold uk-margin-small-left">Colors on hover</div>
34 
            <div class="">
35 
            <color [color]="buttons.onHover.color" (colorChange)=
36 
              " buttons.onHover.color = $event;" label="Fonts"
37 
            ></color>
38 
            <color [color]="buttons.onHover.backgroundColor"
39 
                   (colorChange)=
40 
                     " buttons.onHover.backgroundColor = $event;"
41 
                   label="Background" ></color>
42 
            <color [color]="buttons.onHover.borderColor" (colorChange)=
43 
              " buttons.onHover.borderColor = $event;"
44 
                   label="Border" ></color>
45 
            </div>
46 
              </div>
47 
          </div>
39 48 
      </div>
40 49
41 50

Also available in: Unified diff