Skip to content
This repository has been archived by the owner on May 4, 2020. It is now read-only.

updated directory, work in progress #56

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
56 changes: 27 additions & 29 deletions src/app/directory/directory.component.css
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,6 @@
}

h2 {

border: 1px solid rgba(0,0,0,.12);
padding-top: 20px;
border-top-right-radius: 5px;
Expand All @@ -48,19 +47,14 @@ h2 {
font-weight:600;
}


div, .mat-table, .mat-cell, .mat-sort-header-button, .mat-form-field {
font-family: 'Nudista', sans-serif !important;


}

button.mat-sort-header-button, .mat-sort-header-container, .mat-header-cell {
font-weight:600;
color:#333;
font-size:14px !important;


}


Expand All @@ -77,12 +71,9 @@ span.locationAddress, .diaMeals {
font-weight:200;
}



.mat-row.ng-star-inserted {
background-color:rgba(255, 255, 255, 0.963);
padding: 15px 25px;

}

.mat-row.ng-star-inserted:hover {
Expand Down Expand Up @@ -117,66 +108,62 @@ span.locationAddress, .diaMeals {
font-weight:600;
margin:0 0 0 0;
padding:0 0 0 0;

}

.mat-card:not([class*="mat-elevation-z"]) {
box-shadow: none !important;
}

/deep/ .mat-input-underline {

height:3px !important;
background-color: rgba(255, 222, 22,1) !important;

}

/deep/ .mat-form-field-ripple {
background-color: rgba(255, 222, 22,1);
height:5px;

}

/deep/ .mat-form-field-infix input:focus {
background:white;
border: 1px solid rgba(255,222,22,.61) !important;

}



.workinOnIt {
font-size:.6rem;
color: rgba(0,0,0,.6);
margin:0 0 0 0;
padding:0 0 0 0;
}

mat-row p {
display:block !important;
margin: 0 0 0 0;
}

.servingTimes {
margin-top: 15px;
padding-top: 15px;
}

.directory-table {
box-shadow: none !important;
border: 1px solid rgba(0,0,0,.12);


border: 1px solid rgba(0,0,0,.12);
}

.locationAddress {
display:block;
margin-bottom: 15px;
}

.currentlyServing {
font-weight:600;
color: #333;
margin-top:15px;


margin-top: 3px !important;
}

.currentlyServing, .diaMeals {
display:none;
.mat-cell.cdk-column-Meals.mat-column-Meals.ng-star-inserted {
margin: 15px auto 15px auto;
}

#hoverPopUp span{
position:absolute;
top:1vh;
Expand Down Expand Up @@ -219,8 +206,6 @@ border: 1px solid rgba(0,0,0,.12);
-webkit-transition: all 0.3s ease;
transition: all 0.3s ease;
text-align:justify;


}


Expand Down Expand Up @@ -282,15 +267,28 @@ border: 1px solid rgba(0,0,0,.12);
/deep/ .mat-select-arrow{
color: #ffde16 !important;
}

.mat-cell.cdk-column-Name.mat-column-Name.ng-star-inserted p {
display: none !important;
}
.mat-cell.cdk-column-Name.mat-column-Name.ng-star-inserted p.currentlyServing.telephone {
display: block !important;
}
@media screen and (max-width: 800px) {

mat-row p, .mat-cell.cdk-column-Name.mat-column-Name.ng-star-inserted p {
display: block !important;
}

.mat-cell.cdk-column-Meals.mat-column-Meals.ng-star-inserted p {
display: block !important;
}
.currentlyServing, .diaMeals {
display: inline-block;
}

.mat-cell.cdk-column-Meals.mat-column-Meals.ng-star-inserted {
display:none;
display:none !important;
}

.mat-header-row.ng-star-inserted {
Expand Down
45 changes: 42 additions & 3 deletions src/app/directory/directory.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -42,8 +42,29 @@ <h2>All Meal Sites:</h2>
<mat-cell *matCellDef="let row">
<span class="locationName"> {{row.Name}} </span>
<span class="locationAddress">{{ row.FullAddress }}</span>
<span class="currentlyServing">Meals Served:</span>
<span class="diaMeals">{{ row.MealServed }}</span>

<p *ngIf="row.Phone.length > 0" class="currentlyServing telephone">Phone:
<a class="diaMeals" href="tel:{{row.Phone}}">{{ row.Phone }}</a></p>


<p *ngIf="row.MealServed.length > 0" class="currentlyServing">Meals Served:
<span class="diaMeals">{{ row.MealServed }}</span></p>


<p *ngIf="row.DaysOpen.length > 0" class="currentlyServing">Days Open:
<span class="diaMeals">{{ row.DaysOpen }}</span></p>

<p class="locationName servingTimes" *ngIf ="row.BreakfastTime.length > 0 || row.LunchTime.length > 0 || row.SnackTime.length >0">Serving Hours:</p>
<p *ngIf="row.BreakfastTime.length > 0" class="currentlyServing">Breakfast:
<span class="diaMeals">{{ row.BreakfastTime }}</span></p>


<p *ngIf="row.LunchTime.length > 0" class="currentlyServing">Lunch:
<span class="diaMeals">{{ row.LunchTime }}</span></p>


<p *ngIf="row.SnackTime.length > 0" class="currentlyServing">Snacks: <span class="diaMeals">{{ row.SnackTime }}</span></p>

</mat-cell>
</ng-container>

Expand All @@ -52,7 +73,25 @@ <h2>All Meal Sites:</h2>
<!-- Meals Column -->
<ng-container matColumnDef="Meals">
<mat-header-cell *matHeaderCellDef mat-sort-header> Meals Served :</mat-header-cell>
<mat-cell *matCellDef="let row" > {{row.MealServed}} </mat-cell>
<mat-cell *matCellDef="let row" >
<p *ngIf="row.MealServed.length > 0" class="currentlyServing">Serving:
<span class="diaMeals">{{ row.MealServed }}</span></p>


<p *ngIf="row.DaysOpen.length > 0" class="currentlyServing">Days Open:
<span class="diaMeals">{{ row.DaysOpen }}</span></p>

<span class="locationName servingTimes" *ngIf ="row.BreakfastTime.length > 0 || row.LunchTime.length > 0 || row.SnackTime.length >0">Serving Hours:</span>
<p *ngIf="row.BreakfastTime.length > 0" class="currentlyServing">Breakfast:
<span class="diaMeals">{{ row.BreakfastTime }}</span></p>


<p *ngIf="row.LunchTime.length > 0" class="currentlyServing">Lunch:
<span class="diaMeals">{{ row.LunchTime }}</span></p>


<p *ngIf="row.SnackTime.length > 0" class="currentlyServing">Snacks: <span class="diaMeals">{{ row.SnackTime }}</span></p>
</mat-cell>
</ng-container>


Expand Down
2 changes: 1 addition & 1 deletion src/app/directory/directory.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ export class DirectoryComponent implements OnInit {
console.log("TURF WORK....");
this.dataSource2.data.forEach((site) => {
Object.defineProperty(site, 'distance', {
value: turf.distance(<Coord>this._mService.userGPS, site.gps, options),
// value: turf.distance(<Coord>this._mService.userGPS, site.gps, options),
writable: true,
enumerable: true,
configurable: true
Expand Down