Commit 6336fbad by muhsin

fixed maps

parent 6825ef55
<div class="nav_header"> <div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()"> <button class="nav_btn nav_back floatLeft" (click)="goBack()">
<img src="../assets/Group17_2.png"> <img src="../assets/Group17_2.png" />
</button> </button>
<div class="nav_title floatLeft"> <div class="nav_title floatLeft">
<h4>ADD ADDRESS</h4> <h4>ADD ADDRESS</h4>
...@@ -15,75 +15,209 @@ ...@@ -15,75 +15,209 @@
<ion-row> <ion-row>
<ion-col> <ion-col>
<h6> <h6>
<input class="styled-checkbox" id="styled-checkbox-1" type="radio" value="Work" [(ngModel)]="address.addressType" name="addressType" #addressType="ngModel" required> <input
<label for="styled-checkbox-1"><span>Work</span></label></h6> class="styled-checkbox"
id="styled-checkbox-1"
type="radio"
value="Work"
[(ngModel)]="address.addressType"
name="addressType"
#addressType="ngModel"
required
/>
<label for="styled-checkbox-1"><span>Work</span></label>
</h6>
</ion-col> </ion-col>
<ion-col> <ion-col>
<h6> <h6>
<input class="styled-checkbox" id="styled-checkbox-2" type="radio" value="Office" [(ngModel)]="address.addressType" name="addressType" #addressType="ngModel" required> <input
<label for="styled-checkbox-2"><span>Office</span></label></h6> class="styled-checkbox"
id="styled-checkbox-2"
type="radio"
value="Office"
[(ngModel)]="address.addressType"
name="addressType"
#addressType="ngModel"
required
/>
<label for="styled-checkbox-2"><span>Office</span></label>
</h6>
</ion-col> </ion-col>
<ion-col> <ion-col>
<h6> <h6>
<input class="styled-checkbox" id="styled-checkbox-3" type="radio" value="Other" [(ngModel)]="address.addressType" name="addressType" #addressType="ngModel" required> <input
<label for="styled-checkbox-3"><span>Others</span></label></h6> class="styled-checkbox"
id="styled-checkbox-3"
type="radio"
value="Other"
[(ngModel)]="address.addressType"
name="addressType"
#addressType="ngModel"
required
/>
<label for="styled-checkbox-3"><span>Others</span></label>
</h6>
</ion-col> </ion-col>
</ion-row> </ion-row>
<div class="md-errors-spacer" [hidden]="addressType.valid || submitted == false" class="ion-padding-start"> <div
class="md-errors-spacer"
[hidden]="addressType.valid || submitted == false"
class="ion-padding-start"
>
Address Type is required Address Type is required
</div> </div>
</ion-grid> </ion-grid>
<div class="row"> <div class="row">
<button class="btn btn-info" (click)="getGeolocation()">Get Current</button> <button class="btn btn-info" (click)="getGeolocation()">
Get Current
</button>
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="Address 1" [(ngModel)]="address.firstAddress" name="firstAddress" #firstAddress="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="firstAddress.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="Address 1"
[(ngModel)]="address.firstAddress"
name="firstAddress"
#firstAddress="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="firstAddress.valid || submitted == false"
class="ion-padding-start"
>
Address 1 is required Address 1 is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="Address 2" [(ngModel)]="address.secondAddress" name="secondAddress" #secondAddress="ngModel"> <input
class=""
type="text"
placeholder="Address 2"
[(ngModel)]="address.secondAddress"
name="secondAddress"
#secondAddress="ngModel"
/>
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="Country" [(ngModel)]="address.country" name="country" #country="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="country.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="Country"
[(ngModel)]="address.country"
name="country"
#country="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="country.valid || submitted == false"
class="ion-padding-start"
>
Country is required Country is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="State" [(ngModel)]="address.state" name="state" #state="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="state.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="State"
[(ngModel)]="address.state"
name="state"
#state="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="state.valid || submitted == false"
class="ion-padding-start"
>
State is required State is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="District" [(ngModel)]="address.district" name="district" #district="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="district.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="District"
[(ngModel)]="address.district"
name="district"
#district="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="district.valid || submitted == false"
class="ion-padding-start"
>
District is required District is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="City" [(ngModel)]="address.city" name="city" #city="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="city.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="City"
[(ngModel)]="address.city"
name="city"
#city="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="city.valid || submitted == false"
class="ion-padding-start"
>
City is required City is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="Area" [(ngModel)]="address.area" name="area" #area="ngModel"> <input
class=""
type="text"
placeholder="Area"
[(ngModel)]="address.area"
name="area"
#area="ngModel"
/>
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="Landmark" [(ngModel)]="address.landmark" name="landmark" #landmark="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="landmark.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="Landmark"
[(ngModel)]="address.landmark"
name="landmark"
#landmark="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="landmark.valid || submitted == false"
class="ion-padding-start"
>
Landmark is required Landmark is required
</div> </div>
<div class="row"> <div class="row">
<input class="" type="text" placeholder="ZipCode" [(ngModel)]="address.zip" name="zip" #zip="ngModel" required> <input
</div> class=""
<div class="md-errors-spacer" [hidden]="zip.valid || submitted == false" class="ion-padding-start"> type="text"
placeholder="ZipCode"
[(ngModel)]="address.zip"
name="zip"
#zip="ngModel"
required
/>
</div>
<div
class="md-errors-spacer"
[hidden]="zip.valid || submitted == false"
class="ion-padding-start"
>
ZipCode is required ZipCode is required
</div> </div>
<div class="row"> <div class="row">
......
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ContactComponent } from './contact.component';
describe('ContactComponent', () => {
let component: ContactComponent;
let fixture: ComponentFixture<ContactComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ContactComponent ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ContactComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-contact',
templateUrl: './contact.component.html',
styleUrls: ['./contact.component.scss'],
})
export class ContactComponent implements OnInit {
constructor() { }
ngOnInit() {}
}
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
p { p {
margin: 0px; margin: 0px;
text-align: right; text-align: right;
background-image: url('../../assets/Path 55_2.png'); background-image: url("../../assets/Path 55_2.png");
background-position: left; background-position: left;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 12px; background-size: 12px;
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
.nearby_icon { .nearby_icon {
width: 25px; width: 25px;
height: 25px; height: 25px;
background-image: url('../../assets/location.png'); background-image: url("../../assets/location.png");
background-position: center; background-position: center;
background-size: contain; background-size: contain;
} }
...@@ -262,6 +262,9 @@ ...@@ -262,6 +262,9 @@
.add_address_wrapper { .add_address_wrapper {
position: fixed; position: fixed;
top: 40%;
overflow: scroll;
height: auto;
bottom: 0px; bottom: 0px;
left: 0px; left: 0px;
right: 0px; right: 0px;
...@@ -281,15 +284,15 @@ ...@@ -281,15 +284,15 @@
.styled-checkbox { .styled-checkbox {
position: absolute; // take it out of document flow position: absolute; // take it out of document flow
opacity: 0; // hide it opacity: 0; // hide it
&+label { & + label {
position: relative; position: relative;
cursor: pointer; cursor: pointer;
padding: 0; padding: 0;
width: 100%; width: 100%;
} }
// Box. // Box.
&+label:before { & + label:before {
content: ''; content: "";
margin-right: 10px; margin-right: 10px;
display: inline-block; display: inline-block;
vertical-align: text-top; vertical-align: text-top;
...@@ -299,29 +302,30 @@ ...@@ -299,29 +302,30 @@
background: white; background: white;
border: 1px solid rgba(215, 213, 228, 1); border: 1px solid rgba(215, 213, 228, 1);
} }
&:checked+label:before { &:checked + label:before {
background: #29285b; background: #29285b;
} }
// Disabled state label. // Disabled state label.
&:disabled+label { &:disabled + label {
color: #b8b8b8; color: #b8b8b8;
cursor: auto; cursor: auto;
} }
// Disabled box. // Disabled box.
&:disabled+label:before { &:disabled + label:before {
box-shadow: none; box-shadow: none;
background: #ddd; background: #ddd;
} }
// Checkmark. Could be replaced with an image // Checkmark. Could be replaced with an image
&:checked+label:after { &:checked + label:after {
content: ''; content: "";
position: absolute; position: absolute;
left: 6px; left: 6px;
top: 10px; top: 10px;
background: white; background: white;
width: 2px; width: 2px;
height: 2px; height: 2px;
box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white; box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white,
4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white;
transform: rotate(45deg); transform: rotate(45deg);
} }
} }
......
.nearby_map { .nearby_map {
width: 100%; width: 100%;
height: 100vh; height: 100%;
.overlay { .overlay {
position: absolute; position: absolute;
top: 0px; top: 0px;
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
} }
// Box. // Box.
& + label:before { & + label:before {
content: ''; content: "";
margin-right: 10px; margin-right: 10px;
display: inline-block; display: inline-block;
vertical-align: text-top; vertical-align: text-top;
...@@ -102,7 +102,7 @@ ...@@ -102,7 +102,7 @@
} }
// Checkmark. Could be replaced with an image // Checkmark. Could be replaced with an image
&:checked + label:after { &:checked + label:after {
content: ''; content: "";
position: absolute; position: absolute;
left: 6px; left: 6px;
top: 11px; top: 11px;
......
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