Commit 41a9eef8 authored by mdsecurity's avatar mdsecurity

commiting so i can try new design

parent 5708c7b4
......@@ -41,7 +41,7 @@
}
},
"defaults": {
"styleExt": "css",
"styleExt": "scss",
"prefixInterfaces": false,
"inline": {
"style": false,
......
<nav class="navbar navbar-light bg-faded">
<h1 class="navbar-brand mb-0"> {{title}}</h1>
<form class="form-inline float-xs-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-secondary fa fa-search " type="submit"></button>
</form>
</nav>
<app-location-view ></app-location-view>
<div class="app-container">
<div class="sidebar">
Where is this element
Send Nudes
<h5 class="sidebar-heading">Sidebar Heading</h5>
<img class="sidebar-icon" src="{{icon1}}">
<img class="sidebar-icon" src="{{icon2}}">
<img class="sidebar-icon" src="{{icon3}}">
</div>
<div class="main-content">
hi
<!--<button (click)="showSidebar = !showSidebar;">Toggle style</button>-->
<nav class="navbar navbar-light nav-whats-open">
<h1 class="navbar-brand mb-0"> Title Here</h1>
<form class="form-inline float-xs-right">
<input class="form-control" type="text" placeholder="Search">
<button class="btn btn-secondary fa fa-search " type="submit"></button>
</form>
</nav>
<h1 style="color:#2f363b;margin-left:1rem;">The Johnson Center</h1>
<hr>
<div class="card-content">
<div *ngFor="let location of locations" class="location-card card col-xs">
<img class="location-background-picture" src="{{location.picture}}" alt="Card image">
<img class="location-circle-picture" src="{{secondPic}}" alt="Card image">
<div class="card-block">
<h4 class="card-title mb-0">{{location._name}}</h4>
<p class="card-text">Opening Time: {{location.openTimes[dayOfTheWeek] | date:'shortTime'}}</p>
......@@ -18,4 +29,5 @@
</div>
</div>
</div>
</div>
</div>
......@@ -4,6 +4,7 @@ $card-width: 15rem;
$card-height: 20rem;
$card-border-radius:0.25rem;
$card-border:1px solid rgba(0, 0, 0, 0.125);
$sidebar-icon-diameter:5rem;
//picture height
$card-background-height: 8.5rem;
......@@ -36,6 +37,7 @@ $card-circle-picture-diameter:7rem;
overflow: hidden;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
margin:.5rem;
}
.location-card:hover {
......@@ -61,20 +63,51 @@ $card-circle-picture-diameter:7rem;
.sidebar {
height: 100%;
width: 25%;
background-color: #28282B;
width: 98px;
//20%
background-color: #2b2b2b;
transition:all .5s cubic-bezier(0.55, 0, 0.1, 1);
color: #D7D7D4;
}
.main-content {
width:75%;
width:100%;
height:100%;
display:flex;
background: center center no-repeat scroll #f5f5ef;
background-image: url('../assets/clock.png');
background: center center no-repeat scroll #f2f2f2;// #f5f5ef light cream
background-image: url('../assets/clock.png'); // possible use the mason M logo here
background-repeat: repeat;
}
.card-content {
display:flex;
margin-left: .5rem;
margin-right: .5rem;
}
hr {
display: block;
margin:.5rem;
margin-right: auto;
// border-style: inset;
border-top: 1px solid rgba(0, 0, 0, 1);
border-width: 2px;
max-width: 75%;
color: black;
}
.sidebar-heading {
margin-top: .5rem;
margin-left: .5rem;
}
.sidebar-icon {
// right:($card-width/2) - ($card-circle-picture-diameter/2);
// top:$card-background-height - ($card-circle-picture-diameter/2);
border-radius:50%;
// border:5px solid rgba(255, 255, 255, 1);
// box-shadow: 0 0 1px white;
height: $sidebar-icon-diameter;
width: $sidebar-icon-diameter;
}
@mixin transition($transition...) {
-moz-transition: $transition;
-o-transition: $transition;
......
......@@ -9,6 +9,10 @@ export class LocationViewComponent implements OnInit {
locations: Location[] = [];
dayOfTheWeek: number;
secondPic = '../assets/BKing.jpg';
icon1 = '../assets/square.jpeg';
icon2 = '../assets/Adobe.png';
icon3 = '../assets/Fedex.jpg';
gmuLogo = '../assets/GMU_PLogo_RGB.jpg';
constructor() { }
ngOnInit() {
......
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 90 90" enable-background="new 0 0 90 90" xml:space="preserve">
<g>
<rect fill="#FF0000" width="90" height="90"/>
<path fill="#FFFFFF" d="M51.2,35.2c1.2,0,2.3,1.1,2.3,2.5l0,0.2c-0.1,1.3-1,2.3-2.2,2.3c-1.3,0-2.3-1.1-2.3-2.4
C49,36.3,50,35.2,51.2,35.2z M53.3,41.8l0,13h-4.1v-13H53.3z M20.2,73.9c-1,1.1-1.6,1.6-2.5,2.1c-1.1,0.6-2.3,0.9-3.5,0.9
c-1.6,0-3.2-0.6-4.4-1.6c-0.7-0.6-1.3-1.4-1.7-2.3C7.4,71.3,7,69.4,7,67.4c0-3.4,1.2-6.3,3.2-7.9c1.2-1,2.9-1.5,4.6-1.5
c1,0,1.9,0.2,2.7,0.5c0.5,0.2,0.9,0.5,1.4,0.8c0.5,0.4,0.7,0.6,1.3,1.1l-1.5,1.3c-0.3-0.4-0.5-0.5-1-0.8c-0.9-0.5-1.7-0.8-2.7-0.8
c-1.3,0-2.4,0.4-3.2,1.2c-0.5,0.4-0.8,1-1.1,1.5c-0.6,1.3-0.8,2.9-0.8,4.7c0,2.1,0.4,3.8,1.1,5.1c0.7,1.3,2.1,2.1,3.6,2.1
c1.5,0,3.1-0.8,4.6-2.4l1.2,1.3L20.2,73.9z M45.7,76.8h-1.8l-0.2-2.9c-0.3,0.5-0.4,0.7-0.8,1.2c-0.3,0.4-0.7,0.8-1.1,1
c-0.7,0.5-1.6,0.8-2.5,0.8c-0.4,0-0.8-0.1-1.2-0.2c-0.9-0.2-1.6-0.7-2-1.4c-0.2-0.4-0.3-0.9-0.4-1.3c-0.2-0.8-0.1-1.3-0.1-3.1v-7.4
h2.2V71c0,1.7,0,2.3,0.2,2.9c0.2,0.8,0.9,1.2,1.8,1.2c1.1,0,2.1-0.7,2.7-2c0.3-0.6,0.4-1.2,0.5-1.8c0.2-1.1,0.2-2.6,0.2-4.3v-3.4
h2.5L45.7,76.8L45.7,76.8z M46,53.9c-0.9,0.7-2,1-3.3,1c-1.1,0-2.1-0.2-3.4-0.7c-0.7-0.3-0.9-0.4-1.5-0.7l1-2.2
c0.5,0.3,0.7,0.3,1.3,0.6c1,0.3,1.6,0.5,2.2,0.5c1,0,1.7-0.5,1.7-1.2c0-0.2-0.1-0.4-0.2-0.6c-0.3-0.4-0.7-0.6-1.8-1.1
c-1.4-0.6-1.7-0.7-2.4-1.2c-0.9-0.7-1.4-1.7-1.4-2.9c0-1.2,0.5-2.3,1.4-3c0.8-0.7,2.1-1,3.5-1c0.9,0,1.9,0.2,2.7,0.5
c0.6,0.2,0.8,0.3,1.4,0.7l-1,2c-0.6-0.4-0.9-0.5-1.5-0.7c-0.4-0.1-0.9-0.2-1.3-0.2c-0.3,0-0.6,0-0.8,0.1c-0.4,0.1-0.7,0.6-0.7,1
c0,0.5,0.4,0.9,1.4,1.4c2,0.9,2.4,1.1,3,1.6c0.9,0.7,1.4,1.8,1.4,2.9C47.7,51.9,47.1,53.1,46,53.9z M59,76.8h-2.3v-8.2
c0-1-0.1-1.9-0.2-2.4c-0.2-0.8-0.8-1.3-1.7-1.3c-0.3,0-0.6,0.1-0.9,0.2c-0.7,0.3-1.5,1-1.9,1.9c-0.3,0.5-0.5,1.1-0.6,1.8
C51.1,70,51,71.2,51,73v3.8h-2.3V63.5h1.8l0.3,3c0.3-0.7,0.5-1,0.9-1.5c0.4-0.5,0.7-0.8,1-1.1c0.7-0.5,1.7-0.9,2.6-0.9
c0.3,0,0.7,0,1.1,0.1c1,0.2,1.6,0.7,2,1.5c0.2,0.4,0.4,0.9,0.5,1.3c0.2,0.8,0.2,1.3,0.2,3.1L59,76.8L59,76.8z M70.8,75.3
c-1.2,1.1-2.4,1.6-3.9,1.6c-3.3,0-5.5-2.7-5.5-6.8c0-1.8,0.4-3.3,1.3-4.6c0.4-0.6,0.8-1,1.3-1.4c0.9-0.6,2-1,3.2-1
c1,0,1.9,0.2,3,0.8c0.6,0.3,0.9,0.5,1.3,1l-1.2,1.5c-0.3-0.4-0.5-0.5-0.9-0.8c-0.7-0.4-1.2-0.6-2-0.6c-0.5,0-0.9,0.1-1.3,0.2
C64.9,65.8,64,67.6,64,70c0,3.1,1.2,5,3.3,5c0.7,0,1.5-0.3,2.2-0.8c0.4-0.4,0.6-0.5,1.1-1.1l1.3,1C71.5,74.6,71.3,74.8,70.8,75.3z
M76,76.8h-2.3V63.5H76V76.8z M76.2,60.6c-0.3,0.6-0.7,0.8-1.3,0.8c-0.3,0-0.6-0.1-0.8-0.2c-0.4-0.3-0.7-0.8-0.7-1.4
c0-0.9,0.7-1.6,1.5-1.6c0.8,0,1.4,0.7,1.4,1.5C76.4,60,76.3,60.3,76.2,60.6z M81.5,76.8h-2.3V58.3h2.3V76.8z M81.5,54.8h-3.8v-6.7
c0-1.1-0.1-2.1-0.2-2.5c-0.2-0.7-0.7-1.1-1.5-1.1c-0.7,0-1.4,0.4-1.7,1c-0.2,0.4-0.4,0.8-0.4,1.2c0,0.5-0.1,1.7-0.1,2.4v5.6h-4v-13
h2.8l0.4,2.2c0.3-0.6,0.5-0.9,1.2-1.4c0.9-0.8,2-1.2,3.2-1.2c1.4,0,2.7,0.6,3.4,1.7c0.3,0.4,0.5,0.9,0.6,1.3
c0.2,0.7,0.2,1.4,0.2,2.8L81.5,54.8L81.5,54.8z M36,45c-0.2-0.8-0.6-1.5-1.1-2c-0.9-1.1-2.4-1.7-4-1.7c-2,0-3.7,0.9-4.7,2.5
C25.4,45,25,46.6,25,48.2c0,2.4,0.9,4.5,2.4,5.7c1,0.8,2.3,1.2,3.7,1.2c1.2,0,2.3-0.3,3.7-1c0.8-0.4,1-0.5,1.6-0.9l-1-2
c-1.4,0.7-2.4,1-3.3,1c-1.2,0-2-0.7-2.4-1.7c-0.2-0.5-0.1-0.8-0.1-1.5V49h6.9c0,0,0-0.3,0-0.6C36.4,47.4,36.2,46,36,45z M32.5,46.4
V47h-3v-0.5c0-0.7,0-1.4,0.3-1.9c0.3-0.5,0.7-0.8,1.3-0.8c0.6,0,1,0.3,1.2,0.8C32.5,45.1,32.5,45.5,32.5,46.4z M18.4,37.5
C17.1,36.9,16,37,13.1,37H8.5v18h3.7c2.8,0,3.9-0.2,5.3-0.8c1-0.3,1.9-0.9,2.7-1.6c1.9-1.7,3-4.2,3-7
C23.2,41.9,21.4,38.8,18.4,37.5z M17.7,49.8c-0.4,0.6-0.8,1.1-1.4,1.5C15.4,51.8,14.6,52,13,52h-0.5V39H13c1.6,0,2.5,0.3,3.3,0.7
c0.6,0.3,1.1,0.8,1.5,1.4c0.7,1.1,1.1,2.5,1.1,4.2C18.8,47.1,18.5,48.6,17.7,49.8z M64.6,42l-0.4,2c-0.2-0.6-0.3-0.8-0.7-1.3
c-0.2-0.3-0.5-0.6-0.7-0.7c-0.6-0.4-1.4-0.6-2.3-0.6c-1.1,0-2.1,0.3-3,0.9c-0.5,0.4-1,0.9-1.3,1.4c-0.8,1.2-1.2,2.7-1.2,4.5
c0,2.5,0.8,4.5,2.3,5.7c0.8,0.6,1.7,0.9,2.7,0.9c0.8,0,1.6-0.2,2.2-0.6c0.2-0.1,0.3-0.2,0.5-0.4c0.3-0.2,0.3-0.3,0.5-0.6l0,0.4
c-0.1,1.5-0.1,1.7-0.3,2.4c-0.2,0.4-0.3,0.8-0.6,1.1c-0.8,1-2.5,1.7-4.2,1.7c-0.4,0-0.9,0-1.4-0.1l-0.3,0l-0.2,2.3
c0.5,0.1,0.7,0.1,1.2,0.1c0.3,0,0.6,0,0.9,0c1,0,1.9-0.1,2.8-0.4c1.5-0.4,2.6-1,3.6-1.9c1.2-1.2,2.1-2.5,2.4-4.4
c0.2-1.2,0.4-1.7,0.4-4.1V42H64.6z M63.5,48c0,0.9-0.2,1.8-0.5,2.6c-0.3,0.8-0.9,1.2-1.7,1.2c-0.7,0-1.2-0.4-1.6-1.1
c-0.3-0.7-0.5-1.5-0.5-2.7c0-1.3,0.2-2.1,0.6-2.8c0.4-0.6,1-1,1.6-1c0.6,0,1.2,0.4,1.5,1c0.3,0.6,0.5,1.6,0.5,2.6V48z M31.8,65.4
c-0.3-0.5-0.8-1-1.4-1.4c-0.9-0.6-1.9-0.9-3.2-0.9c-1.8,0-3.3,0.7-4.2,2c-1,1.3-1.5,3-1.5,4.9c0,1.9,0.5,3.5,1.3,4.8
c0.3,0.5,0.8,0.9,1.3,1.3c0.9,0.6,1.9,0.9,3,0.9c1.7,0,3.5-0.9,4.5-2.3c0.8-1.2,1.3-3,1.3-4.8C33.1,68.3,32.6,66.6,31.8,65.4z
M29.9,73.2c-0.2,0.4-0.4,0.9-0.8,1.2c-0.5,0.5-1.1,0.8-1.8,0.8c-0.8,0-1.5-0.3-2.1-0.9c-0.3-0.3-0.5-0.7-0.7-1.1
c-0.3-0.9-0.5-2.2-0.5-3.3c0-1.1,0.2-2.2,0.6-3.1c0.2-0.5,0.5-0.9,0.8-1.3c0.5-0.5,1.1-0.8,1.8-0.8c0.7,0,1.4,0.3,1.9,0.8
c0.3,0.3,0.5,0.6,0.6,1c0.4,1,0.6,2.2,0.6,3.4C30.5,71.1,30.3,72.3,29.9,73.2z"/>
</g>
</svg>
/* You can add global styles to this file, and also import other style files */
......@@ -12,3 +12,8 @@ body {
height: inherit;
}
.nav-whats-open{
background-color: #006633;
border-radius: 0;
margin-bottom: 0;
}
\ No newline at end of file
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