Skip to content

G
getme
Commit 6336fbad by muhsin
Options

fixed maps

parent 6825ef55
Showing with 578 additions and 398 deletions
src/app/addaddresss/addaddresss.page.html
<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>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content> <ion-content>
<div class="login_wrapper"> <div class="login_wrapper">
<div class="form_div"> <div class="form_div">
<form #addressForm="ngForm" novalidate> <form #addressForm="ngForm" novalidate>
<ion-grid> <ion-grid>
<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"
</ion-col> id="styled-checkbox-1"
<ion-col> type="radio"
<h6> value="Work"
<input class="styled-checkbox" id="styled-checkbox-2" type="radio" value="Office" [(ngModel)]="address.addressType" name="addressType" #addressType="ngModel" required> [(ngModel)]="address.addressType"
<label for="styled-checkbox-2"><span>Office</span></label></h6> name="addressType"
</ion-col> #addressType="ngModel"
<ion-col> required
<h6> />
<input class="styled-checkbox" id="styled-checkbox-3" type="radio" value="Other" [(ngModel)]="address.addressType" name="addressType" #addressType="ngModel" required> <label for="styled-checkbox-1"><span>Work</span></label>
<label for="styled-checkbox-3"><span>Others</span></label></h6> </h6>
</ion-col> </ion-col>
</ion-row> <ion-col>
<div class="md-errors-spacer" [hidden]="addressType.valid || submitted == false" class="ion-padding-start"> <h6>
Address Type is required <input
</div> class="styled-checkbox"
</ion-grid> 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>
<h6>
<input
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-row>
<div
class="md-errors-spacer"
[hidden]="addressType.valid || submitted == false"
class="ion-padding-start"
>
Address Type is required
</div>
</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()">
</div> Get Current
<div class="row"> </button>
<input class="" type="text" placeholder="Address 1" [(ngModel)]="address.firstAddress" name="firstAddress" #firstAddress="ngModel" required> </div>
</div> <div class="row">
<div class="md-errors-spacer" [hidden]="firstAddress.valid || submitted == false" class="ion-padding-start"> <input
Address 1 is required class=""
</div> type="text"
<div class="row"> placeholder="Address 1"
<input class="" type="text" placeholder="Address 2" [(ngModel)]="address.secondAddress" name="secondAddress" #secondAddress="ngModel"> [(ngModel)]="address.firstAddress"
</div> name="firstAddress"
<div class="row"> #firstAddress="ngModel"
<input class="" type="text" placeholder="Country" [(ngModel)]="address.country" name="country" #country="ngModel" required> required
</div> />
<div class="md-errors-spacer" [hidden]="country.valid || submitted == false" class="ion-padding-start"> </div>
Country is required <div
</div> class="md-errors-spacer"
<div class="row"> [hidden]="firstAddress.valid || submitted == false"
<input class="" type="text" placeholder="State" [(ngModel)]="address.state" name="state" #state="ngModel" required> class="ion-padding-start"
</div> >
<div class="md-errors-spacer" [hidden]="state.valid || submitted == false" class="ion-padding-start"> Address 1 is required
State is required </div>
</div> <div class="row">
<div class="row"> <input
<input class="" type="text" placeholder="District" [(ngModel)]="address.district" name="district" #district="ngModel" required> class=""
</div> type="text"
<div class="md-errors-spacer" [hidden]="district.valid || submitted == false" class="ion-padding-start"> placeholder="Address 2"
District is required [(ngModel)]="address.secondAddress"
</div> name="secondAddress"
<div class="row"> #secondAddress="ngModel"
<input class="" type="text" placeholder="City" [(ngModel)]="address.city" name="city" #city="ngModel" required> />
</div> </div>
<div class="md-errors-spacer" [hidden]="city.valid || submitted == false" class="ion-padding-start"> <div class="row">
City is required <input
</div> class=""
<div class="row"> type="text"
<input class="" type="text" placeholder="Area" [(ngModel)]="address.area" name="area" #area="ngModel"> placeholder="Country"
</div> [(ngModel)]="address.country"
name="country"
<div class="row"> #country="ngModel"
<input class="" type="text" placeholder="Landmark" [(ngModel)]="address.landmark" name="landmark" #landmark="ngModel" required> required
</div> />
<div class="md-errors-spacer" [hidden]="landmark.valid || submitted == false" class="ion-padding-start"> </div>
Landmark is required <div
</div> class="md-errors-spacer"
<div class="row"> [hidden]="country.valid || submitted == false"
<input class="" type="text" placeholder="ZipCode" [(ngModel)]="address.zip" name="zip" #zip="ngModel" required> class="ion-padding-start"
</div> >
<div class="md-errors-spacer" [hidden]="zip.valid || submitted == false" class="ion-padding-start"> Country is required
ZipCode is required </div>
</div> <div class="row">
<div class="row"> <input
<button class="login_btn" (click)="onAddrss(addressForm)">ADD</button> class=""
</div> type="text"
</form> 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
</div>
<div class="row">
<input
class=""
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
</div>
<div class="row">
<input
class=""
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
</div>
<div class="row">
<input
class=""
type="text"
placeholder="Area"
[(ngModel)]="address.area"
name="area"
#area="ngModel"
/>
</div>
<div class="row">
<input
class=""
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
</div>
<div class="row">
<input
class=""
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
</div>
<div class="row">
<button class="login_btn" (click)="onAddrss(addressForm)">ADD</button>
</div> </div>
</form>
</div> </div>
</ion-content> </div>
\ No newline at end of file </ion-content>
src/app/contact/contact.component.spec.ts 0 → 100644
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();
});
});
src/app/contact/contact.component.ts 0 → 100644
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() {}
}
src/app/home/home.page.scss
.home_wrapper { .home_wrapper {
width: 100%;
padding-bottom: 50px;
.home_banner {
width: 100%; width: 100%;
padding-bottom: 50px; height: 300px;
.home_banner { padding-top: 80px;
position: relative;
background-color: #fff;
.home_banner_title {
padding: 10px;
position: absolute;
top: 0px;
left: 0px;
right: 0px;
img {
width: 100px;
}
p {
margin: 0px;
text-align: right;
background-image: url("../../assets/Path 55_2.png");
background-position: left;
background-repeat: no-repeat;
background-size: 12px;
padding-left: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 150px;
}
}
ion-slides {
width: 100%;
height: 100%;
ion-slide {
width: 100%; width: 100%;
height: 300px; height: 100%;
padding-top: 80px;
position: relative; position: relative;
background-color: #fff; img {
.home_banner_title { width: 100%;
padding: 10px; height: 100%;
position: absolute; object-fit: cover;
top: 0px;
left: 0px;
right: 0px;
img {
width: 100px;
}
p {
margin: 0px;
text-align: right;
background-image: url('../../assets/Path 55_2.png');
background-position: left;
background-repeat: no-repeat;
background-size: 12px;
padding-left: 20px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 150px;
}
} }
ion-slides { .banner_slide {
width: 100%; position: absolute;
height: 100%; top: 0px;
ion-slide { left: 0px;
width: 100%; right: 0px;
height: 100%; bottom: 0px;
position: relative; -webkit-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
img { -moz-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
width: 100%; box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75);
height: 100%; padding-top: 160px;
object-fit: cover; padding-left: 20px;
} padding-right: 20px;
.banner_slide { h5 {
position: absolute; color: #fff;
top: 0px; margin: 0px;
left: 0px; padding: 0px;
right: 0px; text-align: left;
bottom: 0px; font-weight: bold;
-webkit-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); letter-spacing: 2px;
-moz-box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); padding-bottom: 5px;
box-shadow: inset 0px -128px 63px -45px rgba(0, 0, 0, 0.75); font-size: 14px;
padding-top: 160px; white-space: nowrap;
padding-left: 20px; overflow: hidden;
padding-right: 20px; text-overflow: ellipsis;
h5 { }
color: #fff; p {
margin: 0px; color: #fff;
padding: 0px; margin: 0px;
text-align: left; padding: 0px;
font-weight: bold; text-align: left;
letter-spacing: 2px; font-size: 20px;
padding-bottom: 5px; font-weight: lighter;
font-size: 14px; white-space: nowrap;
white-space: nowrap; overflow: hidden;
overflow: hidden; text-overflow: ellipsis;
text-overflow: ellipsis; }
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
} }
}
}
}
.home_sub_header {
padding: 10px;
padding-top: 20px;
padding-bottom: 20px;
color: rgba(59, 57, 77, 1);
font-weight: 900;
.nearby_icon {
width: 25px;
height: 25px;
background-image: url("../../assets/location.png");
background-position: center;
background-size: contain;
} }
.home_sub_header { }
padding: 10px; .featured_slider {
padding-top: 20px; padding-left: 10px;
padding-bottom: 20px; padding-right: 10px;
color: rgba(59, 57, 77, 1); .feature_product {
font-weight: 900; width: 100%;
.nearby_icon { height: 130px;
width: 25px; position: relative;
height: 25px; background-color: #a8a8a8;
background-image: url('../../assets/location.png'); border: 2px solid #fff;
background-position: center; img {
background-size: contain; width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.feature_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: rgba(0, 0, 0, 0.75);
padding: 15px;
padding-top: 60px;
h5 {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-weight: bold;
letter-spacing: 2px;
padding-bottom: 2px;
font-size: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
}
} }
.featured_slider { }
padding-left: 10px; .nearby_shop_list {
padding-right: 10px; ul {
.feature_product { margin: 0px;
padding-left: 10px;
padding-right: 10px;
li {
list-style: none;
padding-bottom: 10px;
.nearby_image {
width: 120px;
height: 125px;
float: left;
background-color: #a8a8a8;
border-radius: 8px;
img {
width: 100%; width: 100%;
height: 130px; height: 100%;
position: relative; object-fit: cover;
background-color: #a8a8a8; object-position: center;
border: 2px solid #fff; }
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.feature_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background-color: rgba(0, 0, 0, 0.75);
padding: 15px;
padding-top: 60px;
h5 {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-weight: bold;
letter-spacing: 2px;
padding-bottom: 2px;
font-size: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
p {
color: #fff;
margin: 0px;
padding: 0px;
text-align: left;
font-size: 20px;
font-weight: lighter;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
} }
} .nearby_detail {
.nearby_shop_list { width: calc(100% - 120px);
ul { float: left;
padding-left: 20px;
padding-top: 40px;
h5 {
margin: 0px; margin: 0px;
padding-left: 10px; padding: 0px;
padding-right: 10px; color: rgba(59, 57, 77, 1);
li { font-weight: 900;
list-style: none; padding-bottom: 2px;
padding-bottom: 10px; white-space: nowrap;
.nearby_image { overflow: hidden;
width: 120px; text-overflow: ellipsis;
height: 125px; img {
float: left; width: 16px;
background-color: #a8a8a8;
border-radius: 8px;
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
}
.nearby_detail {
width: calc(100% - 120px);
float: left;
padding-left: 20px;
padding-top: 40px;
h5 {
margin: 0px;
padding: 0px;
color: rgba(59, 57, 77, 1);
font-weight: 900;
padding-bottom: 2px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
img {
width: 16px;
}
}
p {
margin: 0px;
padding: 0px;
color: rgba(176, 174, 199);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
} }
}
p {
margin: 0px;
padding: 0px;
color: rgba(176, 174, 199);
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
} }
}
} }
.featured_catagory_list { }
padding: 10px; .featured_catagory_list {
ul { padding: 10px;
ul {
margin: 0px;
padding: 0px;
li {
list-style: none;
position: relative;
height: 120px;
width: 100%;
border-radius: 8px;
margin-bottom: 10px;
&:nth-child(odd) {
text-align: left;
}
&:nth-child(even) {
text-align: right;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.featured_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border-radius: 8px;
background-color: rgba(0, 0, 0, 0.75);
color: #fff;
padding: 45px;
padding-left: 20px;
padding-right: 20px;
h4 {
margin: 0px; margin: 0px;
padding: 0px; font-size: 26px;
li { font-weight: 900;
list-style: none; }
position: relative;
height: 120px;
width: 100%;
border-radius: 8px;
margin-bottom: 10px;
&:nth-child(odd) {
text-align: left;
}
&:nth-child(even) {
text-align: right;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.featured_overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
border-radius: 8px;
background-color: rgba(0, 0, 0, 0.75);
color: #fff;
padding: 45px;
padding-left: 20px;
padding-right: 20px;
h4 {
margin: 0px;
font-size: 26px;
font-weight: 900;
}
}
}
} }
}
} }
}
} }
.sort_wrappper { .sort_wrappper {
height: 100vh; height: 100vh;
width: 100%;
background: #fff;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
z-index: 99;
agm-map {
width: 100%; width: 100%;
background: #fff; height: 100vh;
top: 0px; }
left: 0px;
right: 0px;
bottom: 0px;
z-index: 99;
agm-map {
width: 100%;
height: 100vh;
}
} }
.add_address_wrapper { .add_address_wrapper {
position: fixed; position: fixed;
bottom: 0px; top: 40%;
left: 0px; overflow: scroll;
right: 0px; height: auto;
padding: 20px 20px 50px 20px; bottom: 0px;
border-top-left-radius: 15px; left: 0px;
border-top-right-radius: 15px; right: 0px;
background: #fff; padding: 20px 20px 50px 20px;
-webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2); border-top-left-radius: 15px;
-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2); border-top-right-radius: 15px;
box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2); background: #fff;
h5 { -webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
color: rgba(41, 40, 91, 1); -moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
margin: 0px; box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
padding: 0px; h5 {
font-weight: 800; color: rgba(41, 40, 91, 1);
margin: 0px;
padding: 0px;
font-weight: 800;
}
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
& + label {
position: relative;
cursor: pointer;
padding: 0;
width: 100%;
} }
.styled-checkbox { // Box.
position: absolute; // take it out of document flow & + label:before {
opacity: 0; // hide it content: "";
&+label { margin-right: 10px;
position: relative; display: inline-block;
cursor: pointer; vertical-align: text-top;
padding: 0; width: 20px;
width: 100%; height: 20px;
} border-radius: 50%;
// Box. background: white;
&+label:before { border: 1px solid rgba(215, 213, 228, 1);
content: ''; }
margin-right: 10px; &:checked + label:before {
display: inline-block; background: #29285b;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 50%;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
&:checked+label:before {
background: #29285b;
}
// Disabled state label.
&:disabled+label {
color: #b8b8b8;
cursor: auto;
}
// Disabled box.
&:disabled+label:before {
box-shadow: none;
background: #ddd;
}
// Checkmark. Could be replaced with an image
&:checked+label:after {
content: '';
position: absolute;
left: 6px;
top: 10px;
background: white;
width: 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;
transform: rotate(45deg);
}
} }
// Disabled state label.
&:disabled + label {
color: #b8b8b8;
cursor: auto;
}
// Disabled box.
&:disabled + label:before {
box-shadow: none;
background: #ddd;
}
// Checkmark. Could be replaced with an image
&:checked + label:after {
content: "";
position: absolute;
left: 6px;
top: 10px;
background: white;
width: 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;
transform: rotate(45deg);
}
}
} }
.address-ul { .address-ul {
padding-left: 0 !important; padding-left: 0 !important;
li { li {
list-style: none; list-style: none;
} }
} }
\ No newline at end of file
src/app/nearby/nearby.page.scss
.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