update shadows & crud dialog
This commit is contained in:
parent
516159783d
commit
f140ba157b
@ -76,7 +76,7 @@
|
|||||||
<ng-template pTemplate="body" let-product>
|
<ng-template pTemplate="body" let-product>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<img src="../../../assets/demo/images/product/{{product.image}}" alt="{{product.name}}" width="100">
|
<img src="../../../assets/demo/images/product/{{product.image}}" class="shadow-4" alt="{{product.name}}" width="100">
|
||||||
</td>
|
</td>
|
||||||
<td>{{product.name}}</td>
|
<td>{{product.name}}</td>
|
||||||
<td>{{product.price | currency:'USD'}}</td>
|
<td>{{product.price | currency:'USD'}}</td>
|
||||||
|
@ -257,7 +257,7 @@
|
|||||||
<button type="button" pButton pRipple [pRowToggler]="product" class="p-button-text p-button-rounded p-button-plain" [icon]="expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-right'"></button>
|
<button type="button" pButton pRipple [pRowToggler]="product" class="p-button-text p-button-rounded p-button-plain" [icon]="expanded ? 'pi pi-chevron-down' : 'pi pi-chevron-right'"></button>
|
||||||
</td>
|
</td>
|
||||||
<td><span class="p-column-title">Name</span>{{product.name}}</td>
|
<td><span class="p-column-title">Name</span>{{product.name}}</td>
|
||||||
<td><span class="p-column-title">Image</span><img [src]="'assets/demo/images/product/' + product.image" [alt]="product.name" width="100" class="p-shadow-4" /></td>
|
<td><span class="p-column-title">Image</span><img [src]="'assets/demo/images/product/' + product.image" [alt]="product.name" width="100" class="shadow-4" /></td>
|
||||||
<td><span class="p-column-title">Price</span>{{product.price | currency:'USD'}}</td>
|
<td><span class="p-column-title">Price</span>{{product.price | currency:'USD'}}</td>
|
||||||
<td><span class="p-column-title">Category</span>{{product.category}}</td>
|
<td><span class="p-column-title">Category</span>{{product.category}}</td>
|
||||||
<td><span class="p-column-title">Reviews</span><p-rating [ngModel]="product.rating" [readonly]="true" [cancel]="false"></p-rating></td>
|
<td><span class="p-column-title">Reviews</span><p-rating [ngModel]="product.rating" [readonly]="true" [cancel]="false"></p-rating></td>
|
||||||
|
@ -51,7 +51,7 @@
|
|||||||
{{product.name}}
|
{{product.name}}
|
||||||
</td>
|
</td>
|
||||||
<td><span class="p-column-title">Image</span>
|
<td><span class="p-column-title">Image</span>
|
||||||
<img [src]="'assets/demo/images/product/' + product.image" [alt]="product.name" width="100" class="p-shadow-4" />
|
<img [src]="'assets/demo/images/product/' + product.image" [alt]="product.name" width="100" class="shadow-4" />
|
||||||
</td>
|
</td>
|
||||||
<td><span class="p-column-title">Price</span>
|
<td><span class="p-column-title">Price</span>
|
||||||
{{product.price | currency:'USD'}}
|
{{product.price | currency:'USD'}}
|
||||||
|
@ -22,6 +22,11 @@ import {ConfirmationService, MessageService} from 'primeng/api';
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@media (max-width: 1024px){
|
||||||
|
:host ::ng-deep .p-dialog{
|
||||||
|
margin: 0 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
`],
|
`],
|
||||||
providers: [MessageService, ConfirmationService]
|
providers: [MessageService, ConfirmationService]
|
||||||
|
@ -6,13 +6,13 @@
|
|||||||
<h5>Custom Timeline</h5>
|
<h5>Custom Timeline</h5>
|
||||||
<p-timeline [value]="customEvents" align="alternate" styleClass="customized-timeline">
|
<p-timeline [value]="customEvents" align="alternate" styleClass="customized-timeline">
|
||||||
<ng-template pTemplate="marker" let-event>
|
<ng-template pTemplate="marker" let-event>
|
||||||
<span class="custom-marker p-shadow-2" [style.backgroundColor]="event.color">
|
<span class="custom-marker shadow-2" [style.backgroundColor]="event.color">
|
||||||
<i [ngClass]="event.icon"></i>
|
<i [ngClass]="event.icon"></i>
|
||||||
</span>
|
</span>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
<ng-template pTemplate="content" let-event>
|
<ng-template pTemplate="content" let-event>
|
||||||
<p-card [header]="event.status" [subheader]="event.date">
|
<p-card [header]="event.status" [subheader]="event.date">
|
||||||
<img *ngIf="event.image" [src]="'assets/demo/images/product/' + event.image" [alt]="event.name" width="200" class="p-shadow-2" />
|
<img *ngIf="event.image" [src]="'assets/demo/images/product/' + event.image" [alt]="event.name" width="200" class="shadow-2" />
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore sed consequuntur error repudiandae numquam deserunt
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore sed consequuntur error repudiandae numquam deserunt
|
||||||
quisquam repellat libero asperiores earum nam nobis, culpa ratione quam perferendis esse, cupiditate neque quas!</p>
|
quisquam repellat libero asperiores earum nam nobis, culpa ratione quam perferendis esse, cupiditate neque quas!</p>
|
||||||
<button pButton label="Read more" class="p-button-text"></button>
|
<button pButton label="Read more" class="p-button-text"></button>
|
||||||
|
Loading…
Reference in New Issue
Block a user