Added electron styling

This commit is contained in:
Zakary Timson 2019-03-24 13:07:14 -04:00
parent ae4d1922be
commit 6e0a113d32
3 changed files with 12 additions and 12 deletions

View File

@ -1,16 +1,16 @@
<div [ngClass]="{lock: lock, unlock: !lock}">
<div>
<nav class="navbar navbar-expand-lg fixed-top navbar-light bg-light">
<div class="container">
<div [ngClass]="{container: !electron.isElectronApp, 'container-fluid': electron.isElectronApp}">
<a class="navbar-brand roboto" [routerLink]="['/']">
<span class="fh-fade">fh</span>
<span class="rainbow"> & </span>
<span class="sons-fade">sons</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<button *ngIf="!electron.isElectronApp" class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbar" aria-expanded="false">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbar">
<div *ngIf="!electron.isElectronApp" class="collapse navbar-collapse" id="navbar">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link text-dark" [routerLink]="['/about']">About</a>
@ -50,7 +50,7 @@
</div>
<!-- Footer -->
<footer class="d-print-none">
<footer *ngIf="!electron.isElectronApp" class="d-print-none">
<div class="d-flex py-4 justify-content-center">
<div class="d-none d-md-inline ml-5 text-left">
<h5>MAIN MENU</h5>
@ -59,7 +59,7 @@
<a [routerLink]="['/about']">About</a>
</li>
<li>
<a [routerLink]="['/store']">Store</a>
<a [routerLink]="['/catalog']">Catalog</a>
</li>
<li>
<a [routerLink]="['/formulaManager']">Formula Manager</a>

View File

@ -11,14 +11,14 @@
<mat-list>
<ng-container *ngFor="let f of formulas | async; let i = index">
<mat-divider *ngIf="f.name.toLowerCase().indexOf(search.value.toLowerCase()) != -1 && i > 0"></mat-divider>
<mat-list-item *ngIf="f.name.toLowerCase().indexOf(search.value.toLowerCase()) != -1" (click)="displayFormula(f)" [ngClass]="{'active': f.id == formula?.id}">
<mat-list-item *ngIf="f.name.toLowerCase().indexOf(search.value.toLowerCase()) != -1" (click)="displayFormula(f); mobile ? drawer.close() : null" [ngClass]="{'active': f.id == formula?.id}">
<mat-icon *ngIf="!f.approved" class="mr-3 text-danger">remove_circle</mat-icon>
{{f.name}}
</mat-list-item>
</ng-container>
</mat-list>
</mat-drawer>
<mat-drawer-content class="p-3 bg-white ml-print-0" style="min-height: 450px; background: url('assets/img/splatter.jpg') center; background-size: cover;">
<mat-drawer-content class="p-3 bg-white ml-print-0" style="min-height: calc(100vh - 56px); background: url('assets/img/splatter.jpg') center; background-size: cover;">
<div class="d-block d-print-none" style="overflow: auto">
<button *ngIf="mobile" class="mr-2" mat-raised-button (click)="drawer.open()">
<mat-icon>opacity</mat-icon> Formulas
@ -32,7 +32,7 @@
</button>
</span>
</div>
<div *ngIf="(electron.isElectronApp || mobile) && !formula">
<div *ngIf="mobile && !formula">
<img src="assets/img/starthere.png" class="m-4">
</div>
<mat-card *ngIf="!electron.isElectronApp && !mobile && !formula" class="mx-auto mt-4" style="max-width: 600px">

View File

@ -14,10 +14,10 @@
</a>
</div>
<div class="col-12 col-md-4 text-center">
<a class="no-underline" style="max-width: 20rem" [routerLink]="['/store']">
<a class="no-underline" style="max-width: 20rem" [routerLink]="['/catalog']">
<mat-card class="dark-hover mb-3" style="min-height: 320px;">
<mat-icon class="my-5" style="transform: scale(4); color: #53709f;">local_grocery_store</mat-icon>
<h3 class="text-dark mb-4">Store</h3>
<h3 class="text-dark mb-4">Catalog</h3>
<mat-divider class="custom-line"></mat-divider>
<p class="text-black-50">Buy equipment, ink and anything else you might need!</p>
</mat-card>
@ -102,4 +102,4 @@
<div class="container-fluid px-0" style="width: 100%; height: 400px">
<iframe style="width: 100%; height: 100%;" title="Google Maps" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d11529.15485962886!2d-79.6054727!3d43.746101!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0x55ebba8b241a8cc!2sFH+%26+Son&#39;s+Mfg+Ltd!5e0!3m2!1sen!2sca!4v1526647428011"
frameborder="0"></iframe>
</div>
</div>