Skip to content

G
getme
Commit acd12c15 by Arjun
Options

style fix

parent d99adcd2
Showing with 327 additions and 291 deletions
config.xml
...@@ -21,8 +21,6 @@ ...@@ -21,8 +21,6 @@
<preference name="SplashShowOnlyFirstTime" value="false" /> <preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" /> <preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="5000" /> <preference name="SplashScreenDelay" value="5000" />
<preference name="KeyboardResize" value="true" />
<preference name="resizeOnFullScreen" value="true" />
<platform name="android"> <platform name="android">
<edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android"> <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
<application android:networkSecurityConfig="@xml/network_security_config" /> <application android:networkSecurityConfig="@xml/network_security_config" />
...@@ -107,5 +105,5 @@ ...@@ -107,5 +105,5 @@
<plugin name="cordova-plugin-nativegeocoder" spec="3.2.2" /> <plugin name="cordova-plugin-nativegeocoder" spec="3.2.2" />
<plugin name="cordova-plugin-statusbar" spec="^2.4.2" /> <plugin name="cordova-plugin-statusbar" spec="^2.4.2" />
<plugin name="cordova-plugin-ionic-keyboard" spec="2.2.0" /> <plugin name="cordova-plugin-ionic-keyboard" spec="2.2.0" />
<engine name="android" spec="8.0.0" /> <engine name="android" spec="7.1.4" />
</widget> </widget>
package.json
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
"@types/googlemaps": "^3.39.2", "@types/googlemaps": "^3.39.2",
"agm-direction": "^0.7.9", "agm-direction": "^0.7.9",
"call-number": "^1.0.1", "call-number": "^1.0.1",
"cordova-android": "8.0.0", "cordova-android": "7.1.4",
"cordova-plugin-device": "^2.0.3", "cordova-plugin-device": "^2.0.3",
"cordova-plugin-geolocation": "^4.0.2", "cordova-plugin-geolocation": "^4.0.2",
"cordova-plugin-googleplus": "^8.4.0", "cordova-plugin-googleplus": "^8.4.0",
......
src/app/forgot/forgot.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)="goToPage('login')">
<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>FORGOT PASSWORD</h4> <h4>FORGOT PASSWORD</h4>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content> <ion-content>
<div class="verification_div"> <div class="verification_div">
<div class="form_div"> <div class="form_div">
<div class="row"> <div class="row">
<input class="" type="email" placeholder="Type your email Id" #emailId required /> <input class="" type="email" placeholder="Type your email Id" #emailId required />
</div> </div>
<div class="row"> <div class="row">
<button class="login_btn" (click)="authService.resetPassword(emailId.value);"> <button class="login_btn" (click)="authService.resetPassword(emailId.value);">
RESET PASSWORD RESET PASSWORD
</button> </button>
</div> </div>
</div>
</div> </div>
</div>
</ion-content> </ion-content>
<div class="loader" *ngIf="authService.loader"> <div class="loader" *ngIf="authService.loader">
<div class="lds-ripple"> <div class="lds-ripple">
<div></div> <div></div>
<div></div> <div></div>
</div> </div>
</div> </div>
\ No newline at end of file
src/app/home/home.page.html
...@@ -6,8 +6,7 @@ ...@@ -6,8 +6,7 @@
<div class="nav_title floatLeft relative"> <div class="nav_title floatLeft relative">
<!-- <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()" (input)="searchFun($event.target.value)" #searchText> --> <!-- <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="clickSearch()" (input)="searchFun($event.target.value)" #searchText> -->
<input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." <input class="search_bar" placeholder="Search here.. eg:shirts, retailers etc..." (click)="goToPage('searchmodal')" />
(click)="goToPage('searchmodal')" />
</div> </div>
<button class="nav_btn nav_search floatRight" *ngIf="!searchShow" (click)="goToPage('searchmodal')"></button> <button class="nav_btn nav_search floatRight" *ngIf="!searchShow" (click)="goToPage('searchmodal')"></button>
<button class="nav_btn nav_close floatRight" *ngIf="searchShow" (click)="searchClose()"></button> <button class="nav_btn nav_close floatRight" *ngIf="searchShow" (click)="searchClose()"></button>
...@@ -32,8 +31,7 @@ ...@@ -32,8 +31,7 @@
<h5>{{center.centerName}}</h5> <h5>{{center.centerName}}</h5>
<p>{{center.description}}</p> <p>{{center.description}}</p>
</div> </div>
<img [src]="center.centerImg" <img [src]="center.centerImg" onerror="this.src='./../../assets/getmi_malls/mall_banner/mall_4.png'" />
onerror="this.src='./../../assets/getmi_malls/mall_banner/mall_4.png'" />
</ion-slide> </ion-slide>
</ion-slides> </ion-slides>
</div> </div>
...@@ -41,12 +39,10 @@ ...@@ -41,12 +39,10 @@
Featured Stores Featured Stores
</div> </div>
<div class="featured_slider"> <div class="featured_slider">
<ion-slides pager="false" [options]="slideOpts" <ion-slides pager="false" [options]="slideOpts" *ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0">
*ngIf="shopperService.activeshoppers && shopperService.activeshoppers.length > 0">
<ion-slide *ngFor="let shopper of shopperService.activeshoppers"> <ion-slide *ngFor="let shopper of shopperService.activeshoppers">
<div class="feature_product" (click)="goToPage('productlist', shopper)"> <div class="feature_product" (click)="goToPage('productlist', shopper)">
<img [src]="shopper.featuredImage" <img [src]="shopper.featuredImage" onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'" />
onerror="this.src='./../../assets/getmi_malls/featured/featured1.png'" />
<div class="feature_overlay"> <div class="feature_overlay">
<h5>{{shopper.name}}</h5> <h5>{{shopper.name}}</h5>
<p>{{shopper.caption}}</p> <p>{{shopper.caption}}</p>
...@@ -66,17 +62,16 @@ ...@@ -66,17 +62,16 @@
</div> </div>
<div class="home_sub_header"> <div class="home_sub_header">
<span class="floatLeft">Nearby Shopping Centers</span> <span class="floatLeft">Nearby Shopping Centers</span>
<span class="floatRight"> <!-- <span class="floatRight">
<div class="nearby_icon" (click)="goToPage('nearby')"></div> <div class="nearby_icon" (click)="goToPage('nearby')"></div>
</span> </span> -->
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<div class="nearby_shop_list"> <div class="nearby_shop_list">
<ul *ngIf="centerService.nearcenters && centerService.nearcenters.length > 0"> <ul *ngIf="centerService.nearcenters && centerService.nearcenters.length > 0">
<li *ngFor="let center of centerService.nearcenters" (click)="goToPage('storelist', center)"> <li *ngFor="let center of centerService.nearcenters" (click)="goToPage('storelist', center)">
<div class="nearby_image"> <div class="nearby_image">
<img [src]="center.centerImg" <img [src]="center.centerImg" onerror="this.src='./../../assets/getmi_malls/mall_298/mall2.png'" />
onerror="this.src='./../../assets/getmi_malls/mall_298/mall2.png'" />
</div> </div>
<div class="nearby_detail"> <div class="nearby_detail">
<h5> <h5>
...@@ -97,10 +92,8 @@ ...@@ -97,10 +92,8 @@
</div> </div>
<div class="featured_catagory_list"> <div class="featured_catagory_list">
<ul *ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0"> <ul *ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0">
<li *ngFor="let categories of categoriesService.activecategories" <li *ngFor="let categories of categoriesService.activecategories" (click)="goToPage('catstorelist', categories)">
(click)="goToPage('catstorelist', categories)"> <img [src]="categories.catImage" onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'" />
<img [src]="categories.catImage"
onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'" />
<div class="featured_overlay"> <div class="featured_overlay">
<h4>{{categories.catName}}</h4> <h4>{{categories.catName}}</h4>
</div> </div>
...@@ -120,12 +113,17 @@ ...@@ -120,12 +113,17 @@
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content class="sort_wrappper"> <ion-content class="sort_wrappper">
<agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false" <agm-map [zoom]="20" [latitude]="lat" [longitude]="lng" [disableDefaultUI]="false" [zoomControl]="false" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
[backgroundColor]="'rgba(29, 27, 130,0.2)'"> <agm-marker [latitude]="lat" [longitude]="lng" [iconUrl]="
<agm-marker [latitude]="lat" [longitude]="lng"></agm-marker> {
url: './assets/pin.svg',
scaledSize: {
width: 28,
height: 40
}}"></agm-marker>
</agm-map> </agm-map>
<div class="add_address_wrapper"> <div class="add_address_wrapper">
<h5 class="floatLeft">NEW ADDRESS</h5> <h5 class="floatLeft">ADDRESS LIST</h5>
<h5 class="floatRight" (click)="istoggle(); goToPage('nearby')"> <h5 class="floatRight" (click)="istoggle(); goToPage('nearby')">
ADD NEW ADD NEW
</h5> </h5>
...@@ -135,9 +133,7 @@ ...@@ -135,9 +133,7 @@
<li *ngFor="let address of addressService.addressList; let i = index"> <li *ngFor="let address of addressService.addressList; let i = index">
<div class="floatLeft"> <div class="floatLeft">
{{address.default}} {{address.default}}
<input class="styled-checkbox" name="addressId" id="styled-checkbox-{{i}}" type="radio" <input class="styled-checkbox" name="addressId" id="styled-checkbox-{{i}}" type="radio" (click)="setDefault(address)" [value]="address.addressId" #addressType [checked]="address.defaultVal == 1" />
(click)="setDefault(address)" [value]="address.addressId" #addressType
[checked]="address.defaultVal == 1" />
<label for="styled-checkbox-{{i}}"> <label for="styled-checkbox-{{i}}">
{{address.addressType}} {{address.addressType}}
</label> </label>
......
src/app/home/home.page.ts
...@@ -104,7 +104,7 @@ export class HomePage implements OnInit { ...@@ -104,7 +104,7 @@ export class HomePage implements OnInit {
console.log(status); console.log(status);
if (status === 'OK') { if (status === 'OK') {
if (results[0]) { if (results[0]) {
const addressData = results[0].formatted_address.split(', '); const addressData = results[1].formatted_address.split(', ');
this.address = addressData[0] + ', ' + addressData[1]; this.address = addressData[0] + ', ' + addressData[1];
console.log(this.address); console.log(this.address);
} else { } else {
...@@ -119,15 +119,27 @@ export class HomePage implements OnInit { ...@@ -119,15 +119,27 @@ export class HomePage implements OnInit {
setDefault(address: any) { setDefault(address: any) {
this.loader = true; this.loader = true;
this.addressService.setDefaultAddress(address.addressId, this.custId).then(() => { this.addressService
this.address = address.address; .setDefaultAddress(address.addressId, this.custId)
console.log(address.latLng); .then(() => {
this.centerService.getNearBy(address.latLng._lat, address.latLng._long, this.service.distance); this.address = address.address;
this.loader = false; console.log(address.latLng);
}).catch(err => { this.centerService.getNearBy(
this.loader = false; address.latLng._lat,
this.service.showToast('Something went wrong please try again!', 'top', 'my-error', 1000); address.latLng._long,
}); this.service.distance
);
this.loader = false;
})
.catch(err => {
this.loader = false;
this.service.showToast(
'Something went wrong please try again!',
'top',
'my-error',
1000
);
});
} }
clickSearch() { clickSearch() {
...@@ -153,7 +165,6 @@ export class HomePage implements OnInit { ...@@ -153,7 +165,6 @@ export class HomePage implements OnInit {
} else if (path === 'catstorelist') { } else if (path === 'catstorelist') {
this.service.set('catParams', data); this.service.set('catParams', data);
} else { } else {
} }
this.router.navigateByUrl(path, { queryParams: data }); this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0; document.body.scrollTop = document.documentElement.scrollTop = 0;
......
src/app/nearby/nearby.page.html
<div class="nav_header"> <div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()" *ngIf="authService.regState"> <button class="nav_btn nav_back floatLeft" (click)="goBack()" *ngIf="authService.regState">
<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>NEAR BY STORES</h4> <h4>NEW ADDRESS</h4>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content> <ion-content>
<div class="nearby_map"> <div class="nearby_map">
<agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8" [backgroundColor]="'rgba(29, 27, 130,0.2)'"> <agm-map [latitude]="latitude" [longitude]="longitude" [zoom]="8" [backgroundColor]="'rgba(29, 27, 130,0.2)'">
<agm-marker [latitude]="latitude" [longitude]="longitude" [markerDraggable]="true" <agm-marker [latitude]="latitude" [longitude]="longitude" [markerDraggable]="true" (dragEnd)="markerDragEnd($event)" [iconUrl]="
(dragEnd)="markerDragEnd($event)"></agm-marker> {
</agm-map> url: './assets/pin.svg',
<form (ngSubmit)="onSubmit(addressForm.value); addressForm.reset()" #addressForm="ngForm" method="post" scaledSize: {
class="form-horizontal"> width: 28,
<div class="add_address_wrapper"> height: 40
<h5>DELIVERY</h5> }}"></agm-marker>
<p>{{address}}</p> </agm-map>
<input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required <form (ngSubmit)="onSubmit(addressForm.value); addressForm.reset()" #addressForm="ngForm" method="post" class="form-horizontal">
placeholder="House No./ Building No" /> <div class="add_address_wrapper">
<div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start"> <h5>DELIVERY</h5>
Building Name is required <p>{{address}}</p>
</div> <input [(ngModel)]="addressForm.building" name="building" #building="ngModel" name="building" required placeholder="House No./ Building No" />
<input [(ngModel)]="addressForm.landmark" name="landmark" #landmark="ngModel" name="landmark" required <div class="md-errors-spacer" [hidden]="building.valid || landmark.pristine" class="ion-padding-start">
placeholder="Landmark" /> Building Name is required
<div class="md-errors-spacer" [hidden]="landmark.valid || landmark.pristine" class="ion-padding-start"> </div>
Landmark is required <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-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>
</div>
</ion-content> </ion-content>
\ No newline at end of file
src/app/nearby/nearby.page.scss
.nearby_map { .nearby_map {
width: 100%;
height: 100%;
.overlay {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
background: rgba(29, 27, 130, 0.2);
}
agm-map {
width: 100%; width: 100%;
height: 100vh; height: 100%;
.overlay { .overlay {
position: absolute; position: absolute;
top: 0px; top: 0px;
...@@ -22,112 +11,144 @@ ...@@ -22,112 +11,144 @@
} }
agm-map { agm-map {
width: 100%; width: 100%;
height: 100%; height: calc(100% - 330px);
position: relative; .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;
}
}
} }
.click_marker { .add_address_wrapper {
min-width: 200px; position: fixed;
padding: 10px; 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 { h5 {
color: rgba(41, 40, 91, 1);
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
font-weight: 800;
} }
p { input {
margin: 0px; width: 100%;
padding: 0px; height: 45px;
border: 1px solid #e1e0eb;
border-radius: 4px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: 20px;
outline: none;
transition: all 0.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 {
.add_address_wrapper { position: absolute; // take it out of document flow
position: fixed; opacity: 0; // hide it
bottom: 0px; &+label {
left: 0px; position: relative;
right: 0px; cursor: pointer;
padding: 20px; padding: 0;
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 0.4s ease-in-out;
&::placeholder {
color: rgba(215, 213, 228, 1);
} }
&:focus { // Box.
border: 1px solid #f3d09f; &+label:before {
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11); 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);
} }
}
.add_btn {
width: 100%;
height: 45px;
background-color: #29285b;
color: #fff;
border-radius: 4px;
} }
} }
.styled-checkbox {
position: absolute; // take it out of document flow @media only screen and (max-width: 350px) {
opacity: 0; // hide it .nearby_map {
&+label { .add_address_wrapper {
position: relative; padding: 10px 20px !important;
cursor: pointer; p {
padding: 0; margin: 2px 0;
} }
// Box. input {
&+label:before { margin-bottom: 5px;
content: ''; }
margin-right: 10px; h6 {
display: inline-block; margin: 0;
vertical-align: text-top; }
width: 20px; }
height: 20px; agm-map {
border-radius: 10px; width: 100%;
background: white; height: calc(100% - 235px);
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
\ No newline at end of file
src/app/productlist/productlist.page.scss
...@@ -288,4 +288,12 @@ ...@@ -288,4 +288,12 @@
text-transform: uppercase; text-transform: uppercase;
margin-top: 10px; margin-top: 10px;
} }
}
@media only screen and (max-width: 350px) {
.product_list {
.ellipse {
width: 135px !important;
}
}
} }
\ No newline at end of file
src/app/signup/signup.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)="goToPage('login')">
<img src="../assets/Group17_2.png" /> <img src="../assets/Group17_2.png" />
</button> </button>
<div class="nav_title floatLeft"> <div class="nav_title floatLeft">
...@@ -62,68 +62,52 @@ ...@@ -62,68 +62,52 @@
<div class="row"> <div class="row">
<h6> <h6>
<input class="styled-checkbox" id="styled-checkbox-1" type="checkbox" value="true" [(ngModel)]="signup.terms" required name="terms" #terms="ngModel" /> <input class="styled-checkbox" id="styled-checkbox-1" type="checkbox" value="true" [(ngModel)]="signup.terms" required name="terms" #terms="ngModel" />
<label for="styled-checkbox-1"><span <label for="styled-checkbox-1"><span>I agree with
>I agree with <a (click)="menuToggle()">Terms and Conditions</a></span></label>
<a (click)="menuToggle()">Terms and Conditions</a></span </h6>
></label <div class="md-errors-spacer" [hidden]="terms.valid || submitted == false">
> <div *ngIf="terms.errors && terms.errors.required">
</h6> Please accept Terms and Conditions
<div </div>
class="md-errors-spacer" </div>
[hidden]="terms.valid || submitted == false" </div>
> <div class="row">
<div *ngIf="terms.errors && terms.errors.required"> <button class="login_btn" (click)="onSignup(signupForm)">
Please accept Terms and Conditions
</div>
</div>
</div>
<div class="row">
<button class="login_btn" (click)="onSignup(signupForm)">
SIGN UP SIGN UP
</button> </button>
</div>
</form>
<div class="row">
<hr />
<p><span>OR</span></p>
</div>
<div class="row">
<div class="social_div">
<div class="social_btn" style="border-right:1px solid rgba(215, 213, 228, 1);" (click)="register.facebook()">
Facebook
</div>
<div class="social_btn" (click)="register.google(2)">
Google
</div>
</div>
</div>
</div> </div>
</form>
<div class="row">
<hr />
<p><span>OR</span></p>
</div>
<div class="row">
<div class="social_div">
<div
class="social_btn"
style="border-right:1px solid rgba(215, 213, 228, 1);"
(click)="register.facebook()"
>
Facebook
</div>
<div class="social_btn" (click)="register.google(2)">
Google
</div>
</div>
</div>
</div> </div>
</div> <div class="loader" *ngIf="register.loader">
<div class="loader" *ngIf="register.loader"> <div class="lds-ripple">
<div class="lds-ripple"> <div></div>
<div></div> <div></div>
<div></div> </div>
</div> </div>
</div>
</ion-content> </ion-content>
<div class="terms_wrapper" *ngIf="menuShow" [@slideInOut]> <div class="terms_wrapper" *ngIf="menuShow" [@slideInOut]>
<div class="terms_inner"> <div class="terms_inner">
<h5>Terms & Conditions</h5> <h5>Terms & Conditions</h5>
<p> <p>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has
Lorem Ipsum has been the industry's standard dummy text ever since the survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop
1500s, when an unknown printer took a galley of type and scrambled it to publishing software like Aldus PageMaker including versions of Lorem Ipsum.
make a type specimen book. It has survived not only five centuries, but </p>
also the leap into electronic typesetting, remaining essentially <button class="accept" (click)="menuToggle()">I Accept</button>
unchanged. It was popularised in the 1960s with the release of Letraset </div>
sheets containing Lorem Ipsum passages, and more recently with desktop
publishing software like Aldus PageMaker including versions of Lorem
Ipsum.
</p>
<button class="accept" (click)="menuToggle()">I Accept</button>
</div>
</div> </div>
\ No newline at end of file
src/assets/pin.svg 0 → 100644
<svg xmlns="http://www.w3.org/2000/svg" width="65.533" height="99" viewBox="0 0 65.533 99">
<g id="Group_6" data-name="Group 6" transform="translate(-20 0)">
<g id="Group_5" data-name="Group 5" transform="translate(-2.935 1.022)">
<ellipse id="Ellipse_4" data-name="Ellipse 4" cx="17" cy="6" rx="17" ry="6" transform="translate(38.935 85.978)" fill="#b5b5cd"/>
<ellipse id="Ellipse_6" data-name="Ellipse 6" cx="17" cy="6" rx="17" ry="6" transform="translate(38.935 85.978)" fill="#b5b5cd"/>
</g>
<g id="Group_2" data-name="Group 2" transform="translate(3 -3)">
<circle id="Ellipse_1" data-name="Ellipse 1" cx="24.5" cy="24.5" r="24.5" transform="translate(25 11)" fill="#fff"/>
<g id="pin" transform="translate(-0.222 -0.104)">
<path id="Path_1" data-name="Path 1" d="M49.8,96.9c-3.7-4.7-7.4-9.2-10.9-13.9A147.669,147.669,0,0,1,22.5,56.1a55.361,55.361,0,0,1-4.9-15.4,31.919,31.919,0,0,1,7.4-26A31.406,31.406,0,0,1,44.9,3.5,32.726,32.726,0,0,1,82,28.8c1.6,7.1.5,13.9-1.8,20.7A111.792,111.792,0,0,1,67.3,74.2,205.419,205.419,0,0,1,50.7,96,3.74,3.74,0,0,1,49.8,96.9Zm.3-84.6A23.6,23.6,0,1,0,73.6,35.9,23.475,23.475,0,0,0,50.1,12.3Z" fill="#242052"/>
<g id="Group_1" data-name="Group 1">
<path id="Path_2" data-name="Path 2" d="M33.3,45.1V25.6L50,16.1l4.7,2.2L37.6,28l-.1,14.6,12.6,7,12.4-6.9-.2-9.4-7.9,4.5v6.1L50.7,46l-9.4-5.1V29.7l16.2-9.2,4.7,2.2L45.5,32.2v6.1L50.1,41l.1-5.7,16.5-9.4V45.1L50.1,54.5Z" fill="#c9974d"/>
</g>
</g>
</g>
</g>
</svg>
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