More styling
This commit is contained in:
		@@ -43,9 +43,9 @@
 | 
				
			|||||||
            </mat-card-header>
 | 
					            </mat-card-header>
 | 
				
			||||||
            <mat-card-content>
 | 
					            <mat-card-content>
 | 
				
			||||||
                <p class="ml-3 lead text-white-50">Tired of using your browser? Download the standalone version of the Formula Manager.</p>
 | 
					                <p class="ml-3 lead text-white-50">Tired of using your browser? Download the standalone version of the Formula Manager.</p>
 | 
				
			||||||
                <button mat-raised-button class="button-fix ml-3"><i class="fab fa-windows mr-1 mb-1"></i> Windows</button>
 | 
					                <button mat-button class="button-fix"><i class="fab fa-windows mr-1 mb-1"></i> Windows</button>
 | 
				
			||||||
                <button mat-raised-button class="button-fix ml-2"><i class="fab fa-apple mr-1 mb-1"></i> MacOS</button>
 | 
					                <button mat-button class="button-fix ml-2"><i class="fab fa-apple mr-1 mb-1"></i> MacOS</button>
 | 
				
			||||||
                <button mat-raised-button class="button-fix ml-2"><i class="fab fa-linux mr-1 mb-1"></i> Linux</button>
 | 
					                <button mat-button class="button-fix ml-2"><i class="fab fa-linux mr-1 mb-1"></i> Linux</button>
 | 
				
			||||||
            </mat-card-content>
 | 
					            </mat-card-content>
 | 
				
			||||||
        </mat-card>
 | 
					        </mat-card>
 | 
				
			||||||
        <mat-card *ngIf="formula" class="my-4 mx-auto" style="max-width: 600px">
 | 
					        <mat-card *ngIf="formula" class="my-4 mx-auto" style="max-width: 600px">
 | 
				
			||||||
@@ -101,15 +101,10 @@
 | 
				
			|||||||
            </mat-card-content>
 | 
					            </mat-card-content>
 | 
				
			||||||
            <mat-card-actions *ngIf="store.user" style="overflow: hidden">
 | 
					            <mat-card-actions *ngIf="store.user" style="overflow: hidden">
 | 
				
			||||||
                <mat-divider></mat-divider>
 | 
					                <mat-divider></mat-divider>
 | 
				
			||||||
                <button *ngIf="!formula.approved" mat-raised-button class="m-1 mt-3" (click)="approve(formula)">
 | 
					                <button *ngIf="!formula.approved" mat-button class="m-1 mt-3" (click)="approve(formula)">Approve</button>
 | 
				
			||||||
                    <mat-icon>check</mat-icon> Approve
 | 
					 | 
				
			||||||
                </button>
 | 
					 | 
				
			||||||
                <div class="float-right m-1 mt-3">
 | 
					                <div class="float-right m-1 mt-3">
 | 
				
			||||||
                    <button mat-raised-button (click)="edit(formula)">
 | 
					                    <button mat-button (click)="edit(formula)">Edit</button>
 | 
				
			||||||
                        <mat-icon>edit</mat-icon> Edit</button>
 | 
					                    <button mat-button class="ml-2" color="warn" (click)="delete(formula)">Delete</button>
 | 
				
			||||||
                    <button mat-raised-button class="ml-2" color="warn" (click)="delete(formula)">
 | 
					 | 
				
			||||||
                        <mat-icon>delete</mat-icon> Delete
 | 
					 | 
				
			||||||
                    </button>
 | 
					 | 
				
			||||||
                </div>
 | 
					                </div>
 | 
				
			||||||
            </mat-card-actions>
 | 
					            </mat-card-actions>
 | 
				
			||||||
        </mat-card>
 | 
					        </mat-card>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -15,8 +15,9 @@
 | 
				
			|||||||
        </mat-form-field>
 | 
					        </mat-form-field>
 | 
				
			||||||
    </form>
 | 
					    </form>
 | 
				
			||||||
</mat-dialog-content>
 | 
					</mat-dialog-content>
 | 
				
			||||||
<mat-dialog-actions>
 | 
					<mat-divider></mat-divider>
 | 
				
			||||||
    <button mat-raised-button type="submit" form="createForm" color="primary" (click)="submit()">
 | 
					<mat-dialog-actions class="justify-content-end">
 | 
				
			||||||
 | 
					    <button mat-button type="submit" form="createForm" (click)="submit()" [disabled]="!name || !cost">
 | 
				
			||||||
        <span *ngIf="data">Update</span>
 | 
					        <span *ngIf="data">Update</span>
 | 
				
			||||||
        <span *ngIf="!data">Create</span>
 | 
					        <span *ngIf="!data">Create</span>
 | 
				
			||||||
    </button>
 | 
					    </button>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -20,7 +20,7 @@
 | 
				
			|||||||
            </mat-select>
 | 
					            </mat-select>
 | 
				
			||||||
        </mat-form-field>
 | 
					        </mat-form-field>
 | 
				
			||||||
        <mat-form-field style="width: 75px">
 | 
					        <mat-form-field style="width: 75px">
 | 
				
			||||||
            <input matInput type="number" placeholder="Amount" [(ngModel)]="amount">
 | 
					            <input matInput type="number" placeholder="Amount" min="1" [(ngModel)]="amount">
 | 
				
			||||||
        </mat-form-field>
 | 
					        </mat-form-field>
 | 
				
			||||||
        <mat-form-field style="width: 40px">
 | 
					        <mat-form-field style="width: 40px">
 | 
				
			||||||
            <mat-select placeholder="Unit" [(ngModel)]="unit">
 | 
					            <mat-select placeholder="Unit" [(ngModel)]="unit">
 | 
				
			||||||
@@ -58,9 +58,7 @@
 | 
				
			|||||||
</mat-dialog-content>
 | 
					</mat-dialog-content>
 | 
				
			||||||
<mat-divider></mat-divider>
 | 
					<mat-divider></mat-divider>
 | 
				
			||||||
<mat-dialog-actions class="justify-content-end">
 | 
					<mat-dialog-actions class="justify-content-end">
 | 
				
			||||||
    <button mat-raised-button type="submit" form="createForm" (click)="submit()" [disabled]="components.length < 1 || !name">
 | 
					    <button mat-button type="submit" form="createForm" (click)="submit()" [disabled]="components.length < 1 || !name">
 | 
				
			||||||
        <mat-icon *ngIf="data" class="mr-1">edit</mat-icon>
 | 
					 | 
				
			||||||
        <mat-icon *ngIf="!data" class="mr-1">add</mat-icon>
 | 
					 | 
				
			||||||
        <span *ngIf="data">Update</span>
 | 
					        <span *ngIf="data">Update</span>
 | 
				
			||||||
        <span *ngIf="!data">Create</span>
 | 
					        <span *ngIf="!data">Create</span>
 | 
				
			||||||
    </button>
 | 
					    </button>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,32 +1,37 @@
 | 
				
			|||||||
<button mat-raised-button class="float-right mb-3" (click)="createComponent()">
 | 
					<div class="bg-white text-right p-2" style="overflow: auto">
 | 
				
			||||||
    <mat-icon>add</mat-icon> Create</button>
 | 
					    <button mat-raised-button class="float-right mb-3" (click)="createComponent()">
 | 
				
			||||||
<table class="table">
 | 
					        <mat-icon>add</mat-icon> Create
 | 
				
			||||||
 | 
					    </button>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 | 
					<div class="px-2">
 | 
				
			||||||
 | 
					    <table class="table">
 | 
				
			||||||
    <thead>
 | 
					    <thead>
 | 
				
			||||||
        <tr>
 | 
					    <tr>
 | 
				
			||||||
            <th>Name</th>
 | 
					        <th>Name</th>
 | 
				
			||||||
            <th>Description</th>
 | 
					        <th>Description</th>
 | 
				
			||||||
            <th>Created</th>
 | 
					        <th>Created</th>
 | 
				
			||||||
            <th>Cost Per Kg</th>
 | 
					        <th>Cost Per Kg</th>
 | 
				
			||||||
            <th></th>
 | 
					        <th></th>
 | 
				
			||||||
            <th></th>
 | 
					        <th></th>
 | 
				
			||||||
        </tr>
 | 
					    </tr>
 | 
				
			||||||
    </thead>
 | 
					    </thead>
 | 
				
			||||||
    <tbody>
 | 
					    <tbody>
 | 
				
			||||||
        <tr *ngFor="let c of store.components | async">
 | 
					    <tr *ngFor="let c of store.components | async">
 | 
				
			||||||
            <td>{{c.name}}</td>
 | 
					        <td>{{c.name}}</td>
 | 
				
			||||||
            <td>{{c.description}}</td>
 | 
					        <td>{{c.description}}</td>
 | 
				
			||||||
            <td>{{c.created | date}}</td>
 | 
					        <td>{{c.created | date}}</td>
 | 
				
			||||||
            <td class="text-center">{{c.cost | currency}}</td>
 | 
					        <td class="text-center">{{c.cost | currency}}</td>
 | 
				
			||||||
            <td>
 | 
					        <td>
 | 
				
			||||||
                <button mat-icon-button (click)="createComponent(c)">
 | 
					            <button mat-icon-button (click)="createComponent(c)">
 | 
				
			||||||
                    <mat-icon class="curs-pointer">edit</mat-icon>
 | 
					                <mat-icon class="curs-pointer">edit</mat-icon>
 | 
				
			||||||
                </button>
 | 
					            </button>
 | 
				
			||||||
            </td>
 | 
					        </td>
 | 
				
			||||||
            <td>
 | 
					        <td>
 | 
				
			||||||
                <button mat-icon-button (click)="delete(c)">
 | 
					            <button mat-icon-button (click)="delete(c)">
 | 
				
			||||||
                    <mat-icon class="curs-pointer">delete</mat-icon>
 | 
					                <mat-icon class="curs-pointer">delete</mat-icon>
 | 
				
			||||||
                </button>
 | 
					            </button>
 | 
				
			||||||
            </td>
 | 
					        </td>
 | 
				
			||||||
        </tr>
 | 
					    </tr>
 | 
				
			||||||
    </tbody>
 | 
					    </tbody>
 | 
				
			||||||
</table>
 | 
					    </table>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user