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:

Border.component.ts
4 4 
@Component({
5 5 
  selector: 'border',
6 6 
  template: `
7 
    <div class="uk-grid uk-margin-remove">
8 
      <div class="uk-width-small uk-margin-small-top uk-padding-remove-left"> Radius (px):</div>
9 
      <div class="uk-width-small uk-padding-remove-left">
10 
        <input class="uk-input uk-width-small uk-margin-small-left" [(ngModel)]="radius" (ngModelChange)="borderChanged()" type="number" min="0"  />
7 
    <div class="uk-grid uk-child-width-1-2" >
8 
      <div class="uk-margin-remove">
9 
        <div class="uk-text-bold uk-form-label uk-margin-small-bottom"> Border radius (px)</div>
10 
  <!--      <div class="uk-margin-bottom uk-form-hint ">hint</div>-->
11 
        <div class="input-box">
12 
           <input class="uk-input " [(ngModel)]="radius" (ngModelChange)="borderChanged()" type="number" min="0"  />
13 
        </div>
11 14 
      </div>
12 
    </div>
13 
    <div class="uk-grid uk-margin-remove">
14 
      <div class="uk-width-small uk-margin-small-top uk-padding-remove-left"> Width (px):</div>
15 
      <div class="uk-width-small uk-padding-remove-left">
16 
        <input class="uk-input uk-width-small uk-margin-small-left" [(ngModel)]="width" (ngModelChange)="borderChanged()" type="number" min="0" />
15 
      <div class="uk-margin-remove">
16 
        <div class="uk-text-bold uk-form-label uk-margin-small-bottom"> Button width (px)</div>
17 
        <!--      <div class="uk-margin-bottom uk-form-hint "> hint</div>-->
18 
        <div class="input-box">
19 
          <input class="uk-input  " [(ngModel)]="width" (ngModelChange)="borderChanged()" type="number" min="0"  />
20 
        </div>
17 21 
      </div>
18 
    </div>
19 
    <div class="uk-grid uk-margin-small-top">
20 
<!--      <div class="uk-width-small uk-margin-small-top uk-padding-remove-left"> Style:</div>-->
21 
<!--      <div class="uk-width-small uk-padding-remove-left">-->
22 
<!--&lt;!&ndash;        <input class="uk-input uk-width-small uk-margin-small-left" [(ngModel)]="style" (ngModelChange)="borderChanged()"/>&ndash;&gt;-->
22 
      <div class="uk-margin-small-top">
23 
        <div class="uk-text-bold uk-form-label uk-margin-small-bottom"> Border style</div>
24 
        <!--      <div class="uk-margin-bottom uk-form-hint "> hint</div>-->
25 
        <div class="input-box ">
26 
          <mat-form-field class="uk-width-1-1">
27 
            <mat-select class=""  [(ngModel)]="style" name="{{'select_type_'}}"
28 
                        (ngModelChange)="borderChanged()"
29 
                        [disableOptionCentering]="true"
30 
                        panelClass="">
31 
              <mat-option [value]="'solid'" >solid</mat-option>
32 
              <mat-option [value]="'dotted'" >dotted</mat-option>
33 
              <mat-option [value]="'dashed'" >dashed</mat-option>
23 34 

  		




  24
  
  
    
<!--        <select [(ngModel)]="style" name="{{'select_type_'}}"-->


  		




  25
  
  
    
<!--                class="uk-select uk-width-small" (ngModelChange)="borderChanged()">-->


  		




  26
  
  
    
<!--          <option [value]="'solid'" >solid</option>-->


  		




  27
  
  
    
<!--          <option [value]="'dotted'" >dotted</option>-->


  		




  28
  
  
    
<!--          <option [value]="'dashed'" >dashed</option>-->


  		




  29
  
  
    
<!--        </select>-->


  		




  30
  
  
    

  		




  31
  
  
    
<!--      </div>-->


  		




  32
  
  
    
      <mat-form-field class="matSelectionFormField uk-width-1-1">


  		




  33
  
  
    
        <mat-label>Style</mat-label>


  		




  34
  
  
    
        <mat-select class="matSelection"  [(ngModel)]="style" name="{{'select_type_'}}"


  		




  35
  
  
    
                    (ngModelChange)="borderChanged()"


  		




  36
  
  
    
                    [disableOptionCentering]="true"


  		




  37
  
  
    
                    panelClass="matSelectionPanel">


  		




  38
  
  
    
          <mat-option [value]="'solid'" >solid</mat-option>


  		




  39
  
  
    
          <mat-option [value]="'dotted'" >dotted</mat-option>


  		




  40
  
  
    
          <mat-option [value]="'dashed'" >dashed</mat-option>


  		




  41
  
  
    

  		




  42
  
  
    
        </mat-select>


  		




  43
  
  
    
      </mat-form-field>


  		




  
  35
  
    
            </mat-select>


  		




  
  36
  
    
          </mat-form-field>


  		




  
  37
  
    
        </div>


  		




  
  38
  
    
      </div>


  		




  44
  39
  
    
    </div>


  		




  
  40
  
    
    


  		




  
  41
  
    
   


  		




  45
  42
  
    
  `


  		




  46
  43
  
    
})


  		




  47
  44
  
    

  		












Also available in:  Unified diff