Commit 47fe521c by Arjun

stylefix

parent eb6d59e9
......@@ -78,7 +78,7 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: left;
......@@ -86,6 +86,15 @@
font-size: 16px;
padding-left: 15px;
padding-right: 15px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -78,7 +78,7 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: left;
......@@ -87,6 +87,15 @@
padding-left: 15px;
padding-right: 15px;
text-align: center;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -100,7 +100,8 @@ const routes: Routes = [
{ path: 'address', loadChildren: './address/address.module#AddressPageModule' },
{ path: 'success', loadChildren: './success/success.module#SuccessPageModule' },
{ path: 'failed', loadChildren: './failed/failed.module#FailedPageModule' },
{ path: 'preference', loadChildren: './preference/preference.module#PreferencePageModule' }
{ path: 'preference', loadChildren: './preference/preference.module#PreferencePageModule' },
{ path: 'changeaddress', loadChildren: './changeaddress/changeaddress.module#ChangeaddressPageModule' }
];
@NgModule({
......
......@@ -112,7 +112,8 @@ export class AppComponent {
'forgot',
'feedback',
'wishlist',
'preference'
'preference',
'changeaddress'
];
const currentUrl = this.router.url.split('/');
const index = restrictedUrl.findIndex(x => x === currentUrl[1]);
......
......@@ -206,27 +206,30 @@
.coupon_code {
padding-top: 20px;
padding-bottom: 50px;
border-bottom: 1px solid rgba(176, 174, 199, 1);
border-bottom: 1px solid #b0aec7;
display: flex;
justify-content: space-between;
input {
width: calc(100% - 50px);
border: 1px solid rgba(176, 174, 199, 1);
width: 75%;
border: 1px solid #b0aec7;
border-radius: 20px;
height: 35px;
padding-left: 20px;
font-weight: 900;
color: rgba(215, 213, 228, 1);
color: #29285b;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
outline: none;
}
&:focus {
color: rgba(215, 213, 228, 1);
outline: none;
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.add_btn {
color: #29285b;
width: 50px;
width: 25%;
height: 35px;
background: transparent;
font-size: 17px;
......
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { IonicModule } from '@ionic/angular';
import { ChangeaddressPage } from './changeaddress.page';
import { AgmCoreModule } from '@agm/core';
import { AgmDirectionModule } from 'agm-direction';
const routes: Routes = [
{
path: '',
component: ChangeaddressPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
AgmDirectionModule,
AgmCoreModule.forRoot({
apiKey: 'AIzaSyBn6hOlr6YHcZAmbptlsmbhvH5iQllWflE'
}),
RouterModule.forChild(routes)
],
declarations: [ChangeaddressPage]
})
export class ChangeaddressPageModule {}
<div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()">
<img src="../assets/Group17_2.png" />
</button>
<div class="nav_title floatLeft">
<h4>Change Address</h4>
</div>
<div class="clear"></div>
</div>
<ion-content>
<div class="nearby_map">
<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-marker [latitude]="latitude" [longitude]="longitude" [markerDraggable]="true" (dragEnd)="markerDragEnd($event)"></agm-marker>
</agm-map>
<form (ngSubmit)="onSubmit(addressForm.value); addressForm.reset()" #addressForm="ngForm" method="post" class="form-horizontal">
<div class="add_address_wrapper">
<h5>DELIVERY</h5>
<p>{{address}}</p>
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required placeholder="House No./ Building No" />
<div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
Building Name is required
</div>
<input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark" required placeholder="Landmark" />
<div class="md-errors-spacer" [hidden]="landmark.valid || landmark.pristine" class="ion-padding-start">
Landmark is required
</div>
<ion-grid>
<ion-row>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-1" type="radio" value="Home" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-1"><span>Home</span></label>
</h6>
</ion-col>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-2" type="radio" value="Work" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-2"><span>Office</span></label>
</h6>
</ion-col>
<ion-col>
<h6>
<input class="styled-checkbox" id="styled-check-3" type="radio" value="Other" [(ngModel)]="addressForm.addressType" name="addressType" #addressType="ngModel" required />
<label for="styled-check-3"><span>Others</span></label>
</h6>
</ion-col>
</ion-row>
<div class="md-errors-spacer" [hidden]="addressType.valid || addressType.pristine" class="ion-padding-start">
Address Type is required
</div>
</ion-grid>
<button class="add_btn" type="submit" [disabled]="!addressForm.form.valid">
ADD
</button>
</div>
</form>
</div>
<div class="loader" *ngIf="loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
</ion-content>
\ No newline at end of file
.nearby_map {
width: 100%;
height: 100vh;
.overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background: rgba(29, 27, 130, 0.2);
}
agm-map {
width: 100%;
height: 100%;
position: relative;
}
.click_marker {
min-width: 200px;
padding: 10px;
h5 {
margin: 0px;
padding: 0px;
}
p {
margin: 0px;
padding: 0px;
}
}
}
.add_address_wrapper {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
padding: 20px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
background: #fff;
-webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
h5 {
color: rgba(41, 40, 91, 1);
margin: 0px;
padding: 0px;
font-weight: 800;
}
input {
width: 100%;
height: 45px;
border: 1px solid #e1e0eb;
border-radius: 4px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
}
.add_btn {
width: 100%;
height: 45px;
background-color: #29285b;
color: #fff;
border-radius: 4px;
}
}
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
&+label {
position: relative;
cursor: pointer;
padding: 0;
}
// Box.
&+label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 10px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
// Box hover
// Box checked
&: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: 11px;
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);
}
}
\ No newline at end of file
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ChangeaddressPage } from './changeaddress.page';
describe('ChangeaddressPage', () => {
let component: ChangeaddressPage;
let fixture: ComponentFixture<ChangeaddressPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ ChangeaddressPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(ChangeaddressPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import {
Component,
OnInit,
ViewChild,
ElementRef,
NgZone
} from '@angular/core';
import { Location } from '@angular/common';
import { Router, ActivatedRoute } from '@angular/router';
import { MapsAPILoader, MouseEvent } from '@agm/core';
import { Address } from './../../config/services/address';
import { AddressService } from './../../config/address.service';
import { ServiceService } from './../../config/service.service';
import { NgForm } from '@angular/forms';
import * as firebase from 'firebase';
@Component({
selector: 'app-changeaddress',
templateUrl: './changeaddress.page.html',
styleUrls: ['./changeaddress.page.scss']
})
export class ChangeaddressPage implements OnInit {
latitude: number;
longitude: number;
zoom: number;
address: string;
private geoCoder;
addressForm: NgForm;
addressData = new Address('', '', '', '', true, '', 0, '');
successState: boolean;
uid: string;
type: any;
loader: boolean;
public searchElementRef: ElementRef;
constructor(
private router: Router,
private route: ActivatedRoute,
private location: Location,
private mapsAPILoader: MapsAPILoader,
private ngZone: NgZone,
public addressService: AddressService,
public service: ServiceService
) {
this.successState = false;
this.type = 0;
const users = this.service.get('user').then(data => {
if (data) {
data = JSON.parse(data);
this.uid = data.uid;
}
});
this.service.get('type').then(data => {
this.type = data;
});
}
ngOnInit() {
// load Places Autocomplete
this.mapsAPILoader.load().then(() => {
this.setCurrentLocation();
this.geoCoder = new google.maps.Geocoder();
});
}
// google maps zoom level
private setCurrentLocation() {
if ('geolocation' in navigator) {
navigator.geolocation.getCurrentPosition(position => {
this.latitude = position.coords.latitude;
this.longitude = position.coords.longitude;
this.zoom = 8;
this.getAddress(this.latitude, this.longitude);
});
}
}
markerDragEnd($event: MouseEvent) {
console.log($event);
this.latitude = $event.coords.lat;
this.longitude = $event.coords.lng;
this.getAddress(this.latitude, this.longitude);
}
getAddress(latitude, longitude) {
this.geoCoder.geocode(
{ location: { lat: latitude, lng: longitude } },
(results, status) => {
console.log(results);
console.log(status);
if (status === 'OK') {
if (results[0]) {
this.zoom = 12;
this.address = results[0].formatted_address;
console.log(this.address);
} else {
window.alert('No results found');
}
} else {
window.alert('Geocoder failed due to: ' + status);
}
}
);
}
goToPage(path, data = null) {
this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
goBack() {
window.history.back();
}
onSubmit(data: any) {
this.loader = true;
console.log(data);
const postData: Address = {
address: this.address,
addressType: data.addressType,
building: data.building,
landmark: data.landmark,
defaultVal: 0,
uid: this.uid,
latLng: new firebase.firestore.GeoPoint(this.latitude, this.longitude),
status: true
};
this.addressService.addressCreate(postData);
this.successState = true;
setTimeout(() => {
this.loader = false;
this.successState = false;
if (this.type === 1) {
this.service.set('type', 0);
this.router.navigateByUrl('home', { queryParams: null });
} else {
this.goBack();
}
}, 3000);
}
}
interface Marker {
lat: number;
lng: number;
label?: string;
draggable: boolean;
}
......@@ -22,7 +22,7 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
......@@ -30,6 +30,15 @@
font-size: 16px;
padding-left: 15px;
padding-right: 15px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -8,12 +8,21 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
.feedback_wrapper {
width: 80%;
margin: 0 auto;
padding-top: 30px;
.form_div {
.row {
margin-bottom: 20px;
.form-control {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: #333;
width: 100%;
border-radius: 8px;
font-size: 16px;
padding: 11px 15px;
resize: none;
&::placeholder {
color: rgba(215, 213, 228, 1);
width: 80%;
margin: 0 auto;
padding-top: 30px;
.form_div {
.row {
margin-bottom: 20px;
.form-control {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: #000;
width: 100%;
border-radius: 8px;
font-size: 16px;
padding: 11px 15px;
resize: none;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
background-color: #29285b;
color: #fff;
border-radius: 8px;
height: 45px;
font-size: 16px;
margin-bottom: 50px;
}
p {
text-align: left;
color: rgba(59, 57, 77, 1);
margin: 0px;
font-weight: bolder;
padding-bottom: 10px;
}
}
}
.login_btn {
width: 100%;
background-color: #29285b;
color: #fff;
border-radius: 8px;
height: 45px;
font-size: 16px;
margin-bottom: 50px;
}
p {
text-align: left;
color: rgba(59, 57, 77, 1);
margin: 0px;
font-weight: bolder;
padding-bottom: 10px;
}
}
}
}
}
\ No newline at end of file
......@@ -8,12 +8,21 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -63,8 +63,8 @@
<div class="home_sub_header">
<span class="floatLeft">Nearby Shopping Centers</span>
<span class="floatRight">
<div class="nearby_icon" (click)="goToPage('nearby')"></div>
</span>
<div class="nearby_icon" (click)="goToPage('nearby')"></div>
</span>
<div class="clear"></div>
</div>
<div class="nearby_shop_list">
......@@ -77,8 +77,8 @@
<h5>
<span class="floatLeft">{{center.centerName}}</span>
<span class="floatRight">0
<img src="../assets/Path61_2.png" />
</span>
<img src="../assets/Path61_2.png" />
</span>
<div class="clear"></div>
</h5>
<p>{{center.description}}</p>
......@@ -105,8 +105,8 @@
<div *ngIf="isShow" [@slideInOut]>
<div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="istoggle()">
<img src="../assets/Group17_2.png" />
</button>
<img src="../assets/Group17_2.png" />
</button>
<div class="nav_title floatLeft">
<h4>CHANGE LOCATION</h4>
</div>
......
<ion-content>
<div class="start_wizard_wrapper">
<ion-slides
pager="true"
[options]="landingOptions"
(ionSlideDidChange)="slideChanged()"
>
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 229_2.png" />
<div class="wizard_textarea">
<h3>EASY PURCHASE</h3>
<p>
Purchase your products from your<br />
favourite shops
</p>
</div>
</div>
</ion-slide>
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 230_2.png" />
<div class="wizard_textarea">
<h3>1 HOUR DELIVERY</h3>
<p>The products will be delivered<br />within 1 hour</p>
</div>
</div>
</ion-slide>
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 231_2.png" />
<div class="wizard_textarea">
<h3>EASY PAYMENT</h3>
<p>
Easy Online payment system
</p>
</div>
</div>
</ion-slide>
</ion-slides>
<div class="btn_row">
<div class="btn_bay" [hidden]="currentIndex == 2">
<div class="btn_next" (click)="next()">
NEXT
</div>
</div>
<div class="start_wizard_wrapper">
<ion-slides pager="true" [options]="landingOptions" (ionSlideDidChange)="slideChanged()">
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 229_2.png" />
<div class="wizard_textarea">
<h3>EASY PURCHASE</h3>
<p>
Purchase your products from your<br /> favourite shops
</p>
</div>
</div>
</ion-slide>
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 230_2.png" />
<div class="wizard_textarea">
<h3>1 HOUR DELIVERY</h3>
<p>The products will be delivered<br />within 1 hour</p>
</div>
</div>
</ion-slide>
<ion-slide>
<div class="wizard_inner_wrapper">
<img src="../assets/Group 231_2.png" />
<div class="wizard_textarea">
<h3>EASY PAYMENT</h3>
<p>
Easy Online payment system
</p>
</div>
</div>
</ion-slide>
</ion-slides>
<div class="btn_row">
<div class="btn_bay" [hidden]="currentIndex == 2">
<div class="btn_next" (click)="next()">
NEXT
</div>
</div>
<div class="btn_bay" [hidden]="currentIndex != 2">
<div class="btn_getstarted" (click)="goToPage('login')">
GET STARTED
<div class="btn_bay" [hidden]="currentIndex != 2">
<div class="btn_getstarted" (click)="goToPage('login')">
GET STARTED
</div>
</div>
</div>
</div>
</div>
</div>
<div class="loader" *ngIf="loader">
<div class="lds-ripple">
<div></div>
<div></div>
<div class="loader" *ngIf="loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
</div>
</ion-content>
</ion-content>
\ No newline at end of file
......@@ -46,7 +46,7 @@ export class LandingPage implements OnInit {
landingOptions = {
initialSlide: 1,
speed: 1000,
allowTouchMove: false
allowTouchMove: true
};
ngOnInit() {}
......
......@@ -16,12 +16,21 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
.nearby_map {
width: 100%;
height: 100vh;
.overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background: rgba(29, 27, 130, 0.2);
}
agm-map {
width: 100%;
height: 100%;
position: relative;
}
.click_marker {
min-width: 200px;
padding: 10px;
h5 {
margin: 0px;
padding: 0px;
height: 100vh;
.overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background: rgba(29, 27, 130, 0.2);
}
agm-map {
width: 100%;
height: 100%;
position: relative;
}
p {
margin: 0px;
padding: 0px;
.click_marker {
min-width: 200px;
padding: 10px;
h5 {
margin: 0px;
padding: 0px;
}
p {
margin: 0px;
padding: 0px;
}
}
}
}
.add_address_wrapper {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
padding: 20px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
background: #fff;
-webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
h5 {
color: rgba(41, 40, 91, 1);
margin: 0px;
padding: 0px;
font-weight: 800;
}
p {
}
input {
width: 100%;
height: 45px;
border: 1px solid #e1e0eb;
border-radius: 4px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
}
.add_btn {
width: 100%;
height: 45px;
background-color: #29285b;
color: #fff;
border-radius: 4px;
}
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
padding: 20px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
background: #fff;
-webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
h5 {
color: rgba(41, 40, 91, 1);
margin: 0px;
padding: 0px;
font-weight: 800;
}
input {
width: 100%;
height: 45px;
border: 1px solid #e1e0eb;
border-radius: 4px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.add_btn {
width: 100%;
height: 45px;
background-color: #29285b;
color: #fff;
border-radius: 4px;
}
}
.styled-checkbox {
position: absolute; // take it out of document flow
opacity: 0; // hide it
& + label {
position: relative;
cursor: pointer;
padding: 0;
}
// Box.
& + label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 10px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
// Box hover
// Box checked
&: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: 11px;
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);
}
}
position: absolute; // take it out of document flow
opacity: 0; // hide it
&+label {
position: relative;
cursor: pointer;
padding: 0;
}
// Box.
&+label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 20px;
height: 20px;
border-radius: 10px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
// Box hover
// Box checked
&: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: 11px;
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);
}
}
\ No newline at end of file
<ion-content>
<div class="cart_wrapper" *ngIf="data">
<div class="cart_head">
<div class="nav_header">
<button class="nav_btn nav_back_white floatLeft" (click)="goBack()">
<div class="cart_wrapper" *ngIf="data">
<div class="cart_head">
<div class="nav_header">
<button class="nav_btn nav_back_white floatLeft" (click)="goBack()">
<img src="../assets/arrow_white.png" />
</button>
<div class="nav_title floatLeft">
<h4></h4>
<div class="nav_title floatLeft">
<h4></h4>
</div>
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
</div>
<img src="../assets/white_tick.png" />
<h4>ORDER IS PLACED</h4>
<p>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</p>
</div>
<button class="nav_btn floatRight"></button>
<div class="clear"></div>
</div>
<img src="../assets/white_tick.png" />
<h4>ORDER IS PLACED</h4>
<p>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</p>
</div>
<div class="order_status">
<div class="clear"></div>
<div class="status_div go_green">
<h4>Order Placed</h4>
<h6>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</h6>
</div>
<!-- <div class="status_gap go_green">
<div class="order_status">
<div class="clear"></div>
<div class="status_div go_green">
<h4>Order Placed</h4>
<h6>{{ data.bookDate.seconds * 1000 | date:'MMMM dd, y' }}</h6>
</div>
<!-- <div class="status_gap go_green">
</div>
<div class="status_div go_green">
<h4>Retailer Accepted</h4>
......@@ -54,63 +54,57 @@
<div class="status_div">
<h4>Your product is delivered</h4>
</div> -->
</div>
<div class="nearby_shop_list">
<ul>
<li (click)="goToPage('productlist')">
<div class="nearby_image">
<img
[src]="data.product[0].image"
onerror="this.src='../assets/[email protected]'"
/>
</div>
<div class="nearby_detail">
<h5>
<span class="floatLeft">{{data.shopperName}}</span>
<span class="floatRight"
>{{data.product[0].qty}}
</div>
<div class="nearby_shop_list">
<ul>
<li (click)="goToPage('productlist')">
<div class="nearby_image">
<img [src]="data.product[0].image" onerror="this.src='../assets/[email protected]'" />
</div>
<div class="nearby_detail">
<h5>
<span class="floatLeft">{{data.shopperName}}</span>
<span class="floatRight">{{data.product[0].qty}}
<img src="../assets/Path61_2.png" />
</span>
<div class="clear"></div>
<div class="clear"></div>
</h5>
<p class="prodName">{{data.product[0].prodName}}</p>
</div>
<div class="clear"></div>
</li>
</ul>
</div>
<div class="product_detail" *ngFor="let product of data.product">
<h6>
<span *ngIf="product.color !== 'No-Color'">{{product.color}}, </span>
<span *ngIf="product.size !== 'Any-Size'">{{product.size}}</span>
</h6>
<h5>Quantity : <span>{{product.qty}}</span></h5>
<h5>
Amount : <strong>A$ {{product.price}}</strong><span class="afterpay">COD</span>
</h5>
<p class="prodName">{{data.product[0].prodName}}</p>
</div>
<div class="clear"></div>
</li>
</ul>
</div>
<div class="product_detail" *ngFor="let product of data.product">
<h6>
<span *ngIf="product.color !== 'No-Color'">{{product.color}}, </span>
<span *ngIf="product.size !== 'Any-Size'">{{product.size}}</span>
</h6>
<h5>Quantity : <span>{{product.qty}}</span></h5>
<h5>
Amount : <strong>A$ {{product.price}}</strong
><span class="afterpay">COD</span>
</h5>
<h5 *ngIf="data.orderStatus >= 3 && data.orderStatus < 7">
Delivery time : <span>{{deliveryTime}}</span>
</h5>
<h5>Order Status : <span>{{getStatus(data.orderStatus)}}</span></h5>
<h4>DELIVERY</h4>
<h5 *ngIf="data.deliveryAddress">
{{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
<br />
{{data.deliveryAddress.building}}, <br />
{{data.deliveryAddress.landmark}}
</h5>
<button
class="cancel_btn"
(click)="cancellOrder(data.orderId)"
*ngIf="cancelDelivery > 0 && data.orderStatus != 0 && data.orderStatus != 8"
>
<h5 *ngIf="data.orderStatus >= 3 && data.orderStatus < 7">
Delivery time : <span>{{deliveryTime}}</span>
</h5>
<h5>Order Status : <span>{{getStatus(data.orderStatus)}}</span></h5>
<div class="delivery-wrap">
<h4 class="floatLeft">DELIVERY</h4>
<span class="floatRight"><img class="ng-tns-c3-0" src="../../assets/edit.png"
(click)="goToPage('changeaddress')"></span>
<div class="clear"></div>
</div>
<h5 *ngIf="data.deliveryAddress">
{{data.deliveryAddress.addressType}},<br />{{data.deliveryAddress.address}},
<br /> {{data.deliveryAddress.building}}, <br /> {{data.deliveryAddress.landmark}}
</h5>
<button class="cancel_btn" (click)="cancellOrder(data.orderId)" *ngIf="cancelDelivery > 0 && data.orderStatus != 0 && data.orderStatus != 8">
CANCEL THIS ORDER
</button>
<!-- <hr /> -->
</div>
<!-- <hr /> -->
</div>
<!-- <div class="related_product_slider">
<!-- <div class="related_product_slider">
<h5>
<span class="floatLeft">Related Products</span><span class="floatRight">MORE</span>
<div class="clear"></div>
......@@ -165,5 +159,5 @@
</ion-slides>
</ul>
</div> -->
</div>
</ion-content>
</div>
</ion-content>
\ No newline at end of file
......@@ -16,23 +16,43 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.md-errors-spacer {
color: #c76969;
font-size: 14px;
}
ion-datetime {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
padding-left: 0px;
&::placeholder {
color: rgba(215, 213, 228, 1) !important;
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -8,12 +8,21 @@
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
color: rgba(215, 213, 228, 1);
color: #000;
width: 100%;
height: 45px;
text-align: center;
border-radius: 8px;
font-size: 16px;
outline: none;
transition: all .4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
}
.login_btn {
width: 100%;
......
......@@ -40,7 +40,7 @@ export class AuthService {
this.SetUserData(user);
this.loader = false;
if (this.type === 1) {
this.router.navigateByUrl('home');
// this.router.navigateByUrl('home');
} else {
this.router.navigateByUrl('verification');
}
......
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