Commit 4a593959 authored by mdsecurity's avatar mdsecurity

Started working on the typescript for places

parent b4afd26f
No preview for this file type
......@@ -2,12 +2,17 @@
<img src="../../assets/BKing.jpg" class="place-picture">
<div class="place-info-block">
<i class="fa fa-star-o star-icon" aria-hidden="true"></i>
<div class="place-title">Burger King</div>
<div class="place-status-open">
<div class="place-title">{{place.name}}</div>
<!--<div class="place-status-open">
<div class="status-text">OPEN</div>
<hr class="hr-vertical">
<div class="status-text">~13Hrs</div>
</div>-->
<div [ngClass]="(place.status === 'open')?'status-open' : 'status-closed'">
<div [ngClass]="(place.status==='open' )? 'text-open' : 'text-closed' ">{{status}}</div>
<hr class="hr-vertical">
<div class="status-text">~13Hrs</div>
</div>
<div class="place-location">The Johnson Center</div>
<div class="place-location">{{place.location}}</div>
</div>
</div>
......@@ -24,18 +24,26 @@
margin-left: 5px;
}
.place-status-open {
.place-status {
height: 18px;
width: 71px;
background-color: $open-green;
border-radius: 4px;
display: flex;
flex-direction: row;
align-items: center;
margin-bottom: 5px;
}
.status-open{
@extend .place-status;
background-color: $open-green;
width: 71px;
}
.status-closed{
@extend .place-status;
background-color: $closed-grey;
width: 80px;
}
.hr-vertical{
height: 17px;
height: 18px;
background-color: $white;
opacity: 0.6;
width:1px;
......@@ -45,7 +53,6 @@
}
.status-text {
margin-left: 3px;
width:30px;
height:11px;
font-family: HelveticaNeue-Medium;
font-size: 9px;
......@@ -56,6 +63,18 @@
letter-spacing: normal;
// text-align: center;
color: $white;
}
.text-open{
@extend .status-text;
width:27px;
margin-right: 3px;
}
.text-closed{
@extend .status-text;
width:37px;
margin-right: 3px;
}
.star-icon{
color:$primary;
......
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, Input } from '@angular/core';
import { Place } from '../../../place';
@Component({
selector: 'app-place-card',
templateUrl: './place-card.component.html',
styleUrls: ['./place-card.component.scss']
})
export class PlaceCardComponent implements OnInit {
@Input() private place: Place;
private status: string;
constructor() { }
ngOnInit() {
this.place = new Place('Burger King', [new Date()],
[new Date()], 'picture: string', 'open', 'The Johnson Center');
if (this.place.status === 'open') {
status = 'OPEN';
} else {
status = 'CLOSED';
}
}
}
......@@ -5,14 +5,17 @@ export class Place {
status: string;
startTimes: Date[];
endTimes: Date[];
location: string;
constructor(name: string, startTimes: Date[],
endTimes: Date[], picture: string, status: string) {
endTimes: Date[], picture: string, status: string, location: string) {
this.name = name;
this.startTimes = startTimes;
this.endTimes = endTimes;
this.picture = picture;
this.status = status;
this.location = location;
}
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment