Skip to content

G
getme
Commit 8281ba99 by Adarsh K
Options

Merge branch 'arjunlatest' into 'master'

Arjunlatest See merge request !73
parents f9c1a3fe 05adf738
Showing with 1010 additions and 641 deletions
package.json
...@@ -39,18 +39,19 @@ ...@@ -39,18 +39,19 @@
"cordova-android": "8.0.0", "cordova-android": "8.0.0",
"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.2.1", "cordova-plugin-googleplus": "^8.4.0",
"cordova-plugin-ionic-keyboard": "^2.2.0", "cordova-plugin-ionic-keyboard": "^2.2.0",
"cordova-plugin-ionic-webview": "^4.1.3", "cordova-plugin-ionic-webview": "^4.1.3",
"cordova-plugin-nativegeocoder": "^3.2.2", "cordova-plugin-nativegeocoder": "^3.2.2",
"cordova-plugin-splashscreen": "^5.0.3", "cordova-plugin-splashscreen": "^5.0.3",
"cordova-plugin-statusbar": "^2.4.3", "cordova-plugin-statusbar": "^2.4.3",
"cordova-plugin-whitelist": "^1.3.4", "cordova-plugin-whitelist": "^1.3.4",
"cordova-plugin-x-socialsharing": "^5.6.3", "cordova-plugin-x-socialsharing": "^5.6.4",
"cordova-sqlite-storage": "^3.4.1", "cordova-sqlite-storage": "^3.4.1",
"core-js": "^2.6.11", "core-js": "^2.6.11",
"es6-promise-plugin": "^4.2.2", "es6-promise-plugin": "^4.2.2",
"firebase": "^6.6.2", "firebase": "^6.6.2",
"mx.ferreyra.callnumber": "0.0.2",
"rxjs": "^6.5.4", "rxjs": "^6.5.4",
"rxjs-compat": "^6.5.4", "rxjs-compat": "^6.5.4",
"tslib": "^1.9.0", "tslib": "^1.9.0",
...@@ -105,7 +106,8 @@ ...@@ -105,7 +106,8 @@
"cordova-plugin-x-socialsharing": { "cordova-plugin-x-socialsharing": {
"ANDROID_SUPPORT_V4_VERSION": "24.1.1+" "ANDROID_SUPPORT_V4_VERSION": "24.1.1+"
}, },
"mx.ferreyra.callnumber": {} "mx.ferreyra.callnumber": {},
"call-number": {}
}, },
"platforms": [ "platforms": [
"android" "android"
......
src/app/app-routing.module.ts
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router'; import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [ const routes: Routes = [
{ {
path: 'landing', path: 'landing',
loadChildren: './landing/landing.module#LandingPageModule' loadChildren: './landing/landing.module#LandingPageModule'
}, },
{ path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule' }, { path: 'tabs', loadChildren: './tabs/tabs.module#TabsPageModule' },
{ path: 'login', loadChildren: './login/login.module#LoginPageModule' }, { path: 'login', loadChildren: './login/login.module#LoginPageModule' },
{ path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' }, { path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' },
{ {
path: 'verification', path: 'verification',
loadChildren: './verification/verification.module#VerificationPageModule' loadChildren: './verification/verification.module#VerificationPageModule'
}, },
{ path: 'forgot', loadChildren: './forgot/forgot.module#ForgotPageModule' }, { path: 'forgot', loadChildren: './forgot/forgot.module#ForgotPageModule' },
{ {
path: 'changepass', path: 'changepass',
loadChildren: './changepass/changepass.module#ChangepassPageModule' loadChildren: './changepass/changepass.module#ChangepassPageModule'
}, },
{ {
path: 'orderdelivered', path: 'orderdelivered',
loadChildren: loadChildren:
'./orderdelivered/orderdelivered.module#OrderdeliveredPageModule' './orderdelivered/orderdelivered.module#OrderdeliveredPageModule'
}, },
{ {
path: 'orderplaced', path: 'orderplaced',
loadChildren: './orderplaced/orderplaced.module#OrderplacedPageModule' loadChildren: './orderplaced/orderplaced.module#OrderplacedPageModule'
}, },
{ {
path: 'ordercancelled', path: 'ordercancelled',
loadChildren: loadChildren:
'./ordercancelled/ordercancelled.module#OrdercancelledPageModule' './ordercancelled/ordercancelled.module#OrdercancelledPageModule'
}, },
{ {
path: 'myorder', path: 'myorder',
loadChildren: './myorder/myorder.module#MyorderPageModule' loadChildren: './myorder/myorder.module#MyorderPageModule'
}, },
{ path: 'cart', loadChildren: './cart/cart.module#CartPageModule' }, { path: 'cart', loadChildren: './cart/cart.module#CartPageModule' },
{ {
path: 'changedetails', path: 'changedetails',
loadChildren: './changedetails/changedetails.module#ChangedetailsPageModule' loadChildren: './changedetails/changedetails.module#ChangedetailsPageModule'
}, },
{ {
path: 'wishlist', path: 'wishlist',
loadChildren: './wishlist/wishlist.module#WishlistPageModule' loadChildren: './wishlist/wishlist.module#WishlistPageModule'
}, },
{ {
path: 'addaddresss', path: 'addaddresss',
loadChildren: './addaddresss/addaddresss.module#AddaddresssPageModule' loadChildren: './addaddresss/addaddresss.module#AddaddresssPageModule'
}, },
{ {
path: 'profile', path: 'profile',
loadChildren: './profile/profile.module#ProfilePageModule' loadChildren: './profile/profile.module#ProfilePageModule'
}, },
{ path: 'home', loadChildren: './home/home.module#HomePageModule' }, { path: 'home', loadChildren: './home/home.module#HomePageModule' },
{ {
path: 'productlist', path: 'productlist',
loadChildren: './productlist/productlist.module#ProductlistPageModule' loadChildren: './productlist/productlist.module#ProductlistPageModule'
}, },
{ {
path: 'productdetail', path: 'productdetail',
loadChildren: './productdetail/productdetail.module#ProductdetailPageModule' loadChildren: './productdetail/productdetail.module#ProductdetailPageModule'
}, },
{ {
path: 'reviewlist', path: 'reviewlist',
loadChildren: './reviewlist/reviewlist.module#ReviewlistPageModule' loadChildren: './reviewlist/reviewlist.module#ReviewlistPageModule'
}, },
{ {
path: 'catagory', path: 'catagory',
loadChildren: './catagory/catagory.module#CatagoryPageModule' loadChildren: './catagory/catagory.module#CatagoryPageModule'
}, },
{ {
path: 'trackorder', path: 'trackorder',
loadChildren: './trackorder/trackorder.module#TrackorderPageModule' loadChildren: './trackorder/trackorder.module#TrackorderPageModule'
}, },
{ {
path: 'storelist', path: 'storelist',
loadChildren: './storelist/storelist.module#StorelistPageModule' loadChildren: './storelist/storelist.module#StorelistPageModule'
}, },
{ {
path: 'catstorelist', path: 'catstorelist',
loadChildren: './catstorelist/catstorelist.module#CatStorelistPageModule' loadChildren: './catstorelist/catstorelist.module#CatStorelistPageModule'
}, },
{ path: 'nearby', loadChildren: './nearby/nearby.module#NearbyPageModule' }, { path: 'nearby', loadChildren: './nearby/nearby.module#NearbyPageModule' },
{ path: 'review', loadChildren: './review/review.module#ReviewPageModule' }, { path: 'review', loadChildren: './review/review.module#ReviewPageModule' },
{ {
path: 'delivery', path: 'delivery',
loadChildren: './delivery/delivery.module#DeliveryPageModule' loadChildren: './delivery/delivery.module#DeliveryPageModule'
}, },
{ {
path: 'addcard', path: 'addcard',
loadChildren: './addcard/addcard.module#AddcardPageModule' loadChildren: './addcard/addcard.module#AddcardPageModule'
}, },
{ {
path: 'searchmodal', path: 'searchmodal',
loadChildren: './searchmodal/searchmodal.module#SearchmodalPageModule' loadChildren: './searchmodal/searchmodal.module#SearchmodalPageModule'
}, },
{ {
path: 'noresult', path: 'noresult',
loadChildren: './noresult/noresult.module#NoresultPageModule' loadChildren: './noresult/noresult.module#NoresultPageModule'
}, },
{ {
path: 'feedback', path: 'feedback',
loadChildren: './feedback/feedback.module#FeedbackPageModule' loadChildren: './feedback/feedback.module#FeedbackPageModule'
}, },
{ {
path: 'address', path: 'address',
loadChildren: './address/address.module#AddressPageModule' loadChildren: './address/address.module#AddressPageModule'
}, },
{ {
path: 'success', path: 'success',
loadChildren: './success/success.module#SuccessPageModule' loadChildren: './success/success.module#SuccessPageModule'
}, },
{ path: 'failed', loadChildren: './failed/failed.module#FailedPageModule' }, { path: 'failed', loadChildren: './failed/failed.module#FailedPageModule' },
{ {
path: 'preference', path: 'preference',
loadChildren: './preference/preference.module#PreferencePageModule' loadChildren: './preference/preference.module#PreferencePageModule'
}, },
{ {
path: 'contact', path: 'contact',
loadChildren: './contact/contact.module#ContactPageModule' loadChildren: './contact/contact.module#ContactPageModule'
}, },
{ {
path: 'changeaddress', path: 'changeaddress',
loadChildren: './changeaddress/changeaddress.module#ChangeaddressPageModule' loadChildren: './changeaddress/changeaddress.module#ChangeaddressPageModule'
}, },
{ path: '', loadChildren: './firstpage/firstpage.module#FirstpagePageModule' } {
path: 'verficationnumber',
]; loadChildren:
@NgModule({ './verficationnumber/verficationnumber.module#VerficationnumberPageModule'
imports: [ },
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules }) { path: '', loadChildren: './firstpage/firstpage.module#FirstpagePageModule' }
], ];
exports: [RouterModule] @NgModule({
}) imports: [
export class AppRoutingModule { } RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}
src/app/app.component.html
<ion-app> <ion-app>
<ion-split-pane> <ion-split-pane>
<ion-menu> <ion-menu>
<ion-content> <ion-content>
<div class="side_menu_wrapper"> <div class="side_menu_wrapper">
<ion-menu-toggle *ngIf="userData"> <ion-menu-toggle *ngIf="userData">
<div class="top_banner"> <div class="top_banner">
<div class="top_image"> <div class="top_image">
<img <img [src]="userData.profilePhoto" onerror="this.src='./../assets/asset_avatar.png'" />
[src]="userData.profilePhoto" </div>
onerror="this.src='./../assets/asset_avatar.png'" <div class="top_detail">
/> <h4>{{ userData.name }}</h4>
</div> <p>{{ userData.emailId }}</p>
<div class="top_detail"> </div>
<h4>{{ userData.name }}</h4> <div class="clear"></div>
<p>{{ userData.emailId }}</p> </div>
</div> </ion-menu-toggle>
<div class="clear"></div> <div class="sidemenu_list">
</div> <ul>
</ion-menu-toggle> <ion-menu-toggle>
<div class="sidemenu_list"> <li (click)="vieworder('home')">Shop</li>
<ul> </ion-menu-toggle>
<ion-menu-toggle> <!-- <li>About us</li> -->
<li (click)="vieworder('home')">Shop</li> <ion-menu-toggle>
</ion-menu-toggle> <li (click)="vieworder('myorder')">View Order</li>
<!-- <li>About us</li> --> </ion-menu-toggle>
<ion-menu-toggle>
<li (click)="vieworder('myorder')">View Order</li>
</ion-menu-toggle>
<div class="sub_menu"> <div class="sub_menu">
<ul *ngIf="categoryService.activecategories"> <ul *ngIf="categoryService.activecategories">
<ion-menu-toggle> <ion-menu-toggle>
<li <li *ngFor="let category of categoryService.activecategories" (click)="goToPage('catstorelist', category)">
*ngFor="let category of categoryService.activecategories" {{ category.catName }}
(click)="goToPage('catstorelist', category)" </li>
> </ion-menu-toggle>
{{ category.catName }} <!-- <li>Women's Fashion</li>
</li>
</ion-menu-toggle>
<!-- <li>Women's Fashion</li>
<li>Features</li> <li>Features</li>
<li>Bags</li> <li>Bags</li>
<li>Shoes</li> <li>Shoes</li>
<li>Electronics</li> --> <li>Electronics</li> -->
</ul> </ul>
</div> </div>
<ion-menu-toggle> <ion-menu-toggle>
<li (click)="vieworder('feedback')">Complaints & Feedback</li> <li (click)="vieworder('feedback')">Complaints & Feedback</li>
</ion-menu-toggle> </ion-menu-toggle>
<li> <li>
<span class="floatLeft" (click)="authService.SignOut()" <span class="floatLeft" (click)="authService.SignOut()">Logout</span>
>Logout</span <span class="floatRight version">Version 0.1.0.2</span>
> <div class="clear"></div>
<span class="floatRight version">Version 0.1.0.2</span> </li>
<div class="clear"></div> </ul>
</li> </div>
</ul> </div>
</div> </ion-content>
</div> </ion-menu>
</ion-content> <ion-router-outlet main></ion-router-outlet>
</ion-menu> </ion-split-pane>
<ion-router-outlet main></ion-router-outlet>
</ion-split-pane>
</ion-app> </ion-app>
<div class="common_tab" [hidden]="fetchCase() === true" *ngIf="!isSearchOpen"> <div class="common_tab" [hidden]="fetchCase() === true" *ngIf="!isSearchOpen">
<ul> <button (click)="istoggle()"></button>
<li (click)="goToPage('home')"> <ul>
<div <li (click)="goToPage('home')">
class="icon_sec m1_icon" <div class="icon_sec m1_icon" [class.m1_icon_act]="sec_active1" (click)="setActive1()"></div>
[class.m1_icon_act]="sec_active1" </li>
(click)="setActive1()" <li (click)="goToPage('catagory')">
></div> <div class="icon_sec m2_icon" [class.m2_icon_act]="sec_active2" (click)="setActive2()"></div>
</li> </li>
<li (click)="goToPage('catagory')"> <li (click)="searchModal()">
<div <div class="icon_sec m3_icon" [class.m3_icon_act]="sec_active3" (click)="setActive3()"></div>
class="icon_sec m2_icon" </li>
[class.m2_icon_act]="sec_active2" <li (click)="goToPage('cart')">
(click)="setActive2()" <div class="icon_sec m4_icon" [class.m4_icon_act]="sec_active4" (click)="setActive4()"></div>
></div> </li>
</li> <li (click)="goToPage('myorder')">
<li (click)="searchModal()"> <div class="icon_sec m5_icon" [class.m5_icon_act]="sec_active5" (click)="setActive5()"></div>
<div </li>
class="icon_sec m3_icon" <li (click)="goToPage('profile')">
[class.m3_icon_act]="sec_active3" <div class="icon_sec m6_icon" [class.m6_icon_act]="sec_active6" (click)="setActive6()" menuClose></div>
(click)="setActive3()" </li>
></div> </ul>
</li>
<li (click)="goToPage('cart')">
<div
class="icon_sec m4_icon"
[class.m4_icon_act]="sec_active4"
(click)="setActive4()"
></div>
</li>
<li (click)="goToPage('myorder')">
<div
class="icon_sec m5_icon"
[class.m5_icon_act]="sec_active5"
(click)="setActive5()"
></div>
</li>
<li (click)="goToPage('profile')">
<div
class="icon_sec m6_icon"
[class.m6_icon_act]="sec_active6"
(click)="setActive6()"
menuClose
></div>
</li>
</ul>
</div> </div>
<div class="common-pop-wrapper" *ngIf="isShow" [@slideInOut]>
<div class="pop_inner">
<div class="img-wrapper">
<img src="../assets/model1_2.png" alt="Product">
</div>
<div class="content">
<h1>Order Placed Successfully</h1>
<p>Order ID 123456 , Green Churidhar has been successfully orderd. </p>
</div>
<span (click)="istoggle();"><img src="../assets/close.png" alt="Close"></span>
</div>
</div>
\ No newline at end of file
src/app/app.component.scss
...@@ -12,6 +12,7 @@ ...@@ -12,6 +12,7 @@
padding-left: 20px; padding-left: 20px;
padding-top: 20px; padding-top: 20px;
padding-right: 10px; padding-right: 10px;
padding-bottom: 55px;
.top_banner { .top_banner {
.top_image { .top_image {
width: 60px; width: 60px;
...@@ -164,4 +165,65 @@ ...@@ -164,4 +165,65 @@
background-position: top -6px left -398px; background-position: top -6px left -398px;
} }
} }
}
.common-pop-wrapper {
width: 100%;
height: 90px !important;
position: fixed;
top: 60px;
left: 0px;
right: 0px;
bottom: 0px;
z-index: 99;
.pop_inner {
margin: 0 auto;
width: 95%;
padding: 10px;
background-color: #fff;
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.3);
border-radius: 10px;
display: flex;
position: relative;
.img-wrapper {
width: 70px;
height: 70px;
border-radius: 8px;
background-color: #f9f9f9;
display: block;
img {
width: 70px;
min-width: 70px;
height: 70px;
border-radius: 8px;
background-color: #f9f9f9;
}
}
.content {
display: flex;
-webkit-box-align: center;
flex-direction: column;
text-align: left;
justify-content: center;
padding-left: 12px;
overflow: hidden;
h1 {
color: rgba(59, 57, 77, 1);
margin: 0px;
font-weight: bold;
font-size: 18px;
}
p {
margin-bottom: 0;
line-height: 1;
margin-top: 8px;
}
}
}
span {
width: 20px;
position: absolute;
right: 4px;
top: 4px;
}
} }
\ No newline at end of file
src/app/app.component.ts
...@@ -17,10 +17,23 @@ import { SubjectService } from './../config/subject.service'; ...@@ -17,10 +17,23 @@ import { SubjectService } from './../config/subject.service';
import { CategoriesService } from './../config/category.service'; import { CategoriesService } from './../config/category.service';
import { SearchmodalPage } from './searchmodal/searchmodal.page'; import { SearchmodalPage } from './searchmodal/searchmodal.page';
import { trigger, transition, animate, style } from '@angular/animations';
@Component({ @Component({
selector: 'app-root', selector: 'app-root',
templateUrl: 'app.component.html', templateUrl: 'app.component.html',
styleUrls: ['app.component.scss'] styleUrls: ['app.component.scss'],
animations: [
trigger('slideInOut', [
transition(':enter', [
style({ transform: 'translateY(100%)' }),
animate('200ms ease-in', style({ transform: 'translateY(0%)' }))
]),
transition(':leave', [
animate('200ms ease-out', style({ transform: 'translateY(100%)' }))
])
])
]
}) })
export class AppComponent { export class AppComponent {
isSearchOpen = false; isSearchOpen = false;
...@@ -40,6 +53,8 @@ export class AppComponent { ...@@ -40,6 +53,8 @@ export class AppComponent {
userData: any; userData: any;
tabData = true; tabData = true;
isShow = false;
constructor( constructor(
private platform: Platform, private platform: Platform,
private splashScreen: SplashScreen, private splashScreen: SplashScreen,
...@@ -118,7 +133,8 @@ export class AppComponent { ...@@ -118,7 +133,8 @@ export class AppComponent {
'changeaddress', 'changeaddress',
'changedetails', 'changedetails',
'contact', 'contact',
'myorder' 'myorder',
'review'
]; ];
const currentUrl = this.router.url.split('/'); const currentUrl = this.router.url.split('/');
const index = restrictedUrl.findIndex(x => x === currentUrl[1]); const index = restrictedUrl.findIndex(x => x === currentUrl[1]);
...@@ -242,4 +258,8 @@ export class AppComponent { ...@@ -242,4 +258,8 @@ export class AppComponent {
}); });
return await modal.present(); return await modal.present();
} }
istoggle() {
this.isShow = !this.isShow;
}
} }
src/app/cart/cart.page.html
...@@ -166,12 +166,15 @@ ...@@ -166,12 +166,15 @@
</div> --> </div> -->
<hr /> <hr />
<div class="coupon_code"> <div class="coupon_code">
<input class="" placeholder="COUPON CODE: GET50" #promo /><button class="add_btn" (click)="promoApply(promo.value)"> <div class="promo-row">
APPLY <input class="" placeholder="COUPON CODE: GET50" #promo /><button class="add_btn" (click)="promoApply(promo.value)">
</button> APPLY
<span *ngIf="discountApplied" style="color: red">Promocode applied successfully </button>
</div>
<span *ngIf="discountApplied" class="promo-success">Promocode applied successfully
</span> </span>
</div> </div>
<br /> <br />
<h6> <h6>
......
src/app/cart/cart.page.scss
...@@ -205,35 +205,44 @@ ...@@ -205,35 +205,44 @@
} }
.coupon_code { .coupon_code {
padding-top: 20px; padding-top: 20px;
padding-bottom: 50px; padding-bottom: 40px;
border-bottom: 1px solid #b0aec7; border-bottom: 1px solid #b0aec7;
display: flex; .promo-row {
justify-content: space-between; display: flex;
input { justify-content: space-between;
width: 75%; input {
border: 1px solid #b0aec7; width: 75%;
border-radius: 20px; border: 1px solid #b0aec7;
height: 35px; border-radius: 20px;
padding-left: 20px; height: 35px;
font-weight: 900; padding-left: 20px;
color: #29285b; font-weight: 900;
outline: none; color: #29285b;
transition: all .4s ease-in-out; outline: none;
&::placeholder { transition: all .4s ease-in-out;
color: rgba(215, 213, 228, 1); &::placeholder {
color: rgba(215, 213, 228, 1);
}
&:focus {
border: 1px solid #f3d09f;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
}
} }
&:focus { .add_btn {
border: 1px solid #f3d09f; color: #29285b;
box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11); width: 25%;
height: 35px;
background: transparent;
font-size: 17px;
font-weight: bolder;
} }
} }
.add_btn { .promo-success {
color: #29285b; color: #31b131;
width: 25%; font-size: 16px;
height: 35px; text-align: left;
background: transparent; display: block;
font-size: 17px; margin-top: 5px;
font-weight: bolder;
} }
} }
.total_div { .total_div {
......
src/app/home/home.page.html
...@@ -31,8 +31,7 @@ ...@@ -31,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>
...@@ -40,12 +39,10 @@ ...@@ -40,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>
...@@ -74,8 +71,7 @@ ...@@ -74,8 +71,7 @@
<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>
...@@ -96,10 +92,8 @@ ...@@ -96,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>
...@@ -119,23 +113,21 @@ ...@@ -119,23 +113,21 @@
<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"></agm-marker> <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
</agm-map> </agm-map>
<div class="add_address_wrapper"> <div class="add_address_wrapper">
<div class="add-address-c"> <h5 class="floatLeft">NEW ADDRESS</h5>
<span>NEW ADDRESS</span> <h5 class="floatRight" (click)="istoggle(); goToPage('nearby')">
<span (click)="istoggle(); goToPage('nearby')">ADD NEW</span> ADD NEW
</div> </h5>
<div class="clear"></div>
<div> <div>
<ul class="address-ul" *ngIf="addressService.addressList && addressService.addressList.length > 0"> <ul class="address-ul" *ngIf="addressService.addressList && addressService.addressList.length > 0">
<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.addressId)" [value]="address.addressId" #addressType [checked]="address.defaultVal == 1" />
(click)="setDefault(address.addressId)" [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.scss
...@@ -262,9 +262,9 @@ ...@@ -262,9 +262,9 @@
.add_address_wrapper { .add_address_wrapper {
position: fixed; position: fixed;
top: 40%;
overflow: scroll;
height: auto; height: auto;
max-height: 70%;
overflow: scroll;
bottom: 0px; bottom: 0px;
left: 0px; left: 0px;
right: 0px; right: 0px;
......
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: 100%; height: 100vh;
.overlay { .overlay {
position: absolute; position: absolute;
top: 0px; top: 0px;
...@@ -11,123 +22,112 @@ ...@@ -11,123 +22,112 @@
} }
agm-map { agm-map {
width: 100%; width: 100%;
height: 100vh; height: 100%;
.overlay { position: relative;
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 { .click_marker {
position: fixed; min-width: 200px;
bottom: 0px; padding: 10px;
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;
} }
input { p {
width: 100%; margin: 0px;
height: 45px; padding: 0px;
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 { }
position: absolute; // take it out of document flow .add_address_wrapper {
opacity: 0; // hide it position: fixed;
&+label { bottom: 0px;
position: relative; left: 0px;
cursor: pointer; right: 0px;
padding: 0; padding: 20px;
} border-top-left-radius: 15px;
// Box. border-top-right-radius: 15px;
&+label:before { background: #fff;
content: ''; -webkit-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
margin-right: 10px; -moz-box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
display: inline-block; box-shadow: 0px -2px 5px 0px rgba(0, 0, 0, 0.2);
vertical-align: text-top; h5 {
width: 20px; color: rgba(41, 40, 91, 1);
height: 20px; margin: 0px;
border-radius: 10px; padding: 0px;
background: white; font-weight: 800;
border: 1px solid rgba(215, 213, 228, 1); }
} input {
// Box hover width: 100%;
// Box checked height: 45px;
&:checked+label:before { border: 1px solid #e1e0eb;
background: #29285b; border-radius: 4px;
} padding-left: 10px;
// Disabled state label. padding-right: 10px;
&:disabled+label { margin-bottom: 20px;
color: #b8b8b8; outline: none;
cursor: auto; transition: all 0.4s ease-in-out;
} &::placeholder {
// Disabled box. color: rgba(215, 213, 228, 1);
&:disabled+label:before {
box-shadow: none;
background: #ddd;
} }
// Checkmark. Could be replaced with an image &:focus {
&:checked+label:after { border: 1px solid #f3d09f;
content: ''; box-shadow: 3px 3px 6px 0px rgba(202, 154, 83, 0.11);
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 {
\ No newline at end of file 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
src/app/preference/preference.page.html
<div class="nav_header"> <div class="nav_header">
<button class="nav_btn nav_back floatLeft" (click)="goBack()" *ngIf="type==0"> <button class="nav_btn nav_back floatLeft" (click)="goBack()" *ngIf="type==0">
<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>Preferences</h4> <h4>Preferences</h4>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content> <ion-content>
<div class="preference-wrapper"> <div class="preference-wrapper">
<div class="pref-wrap-two"> <div class="pref-wrap-two">
<ion-grid> <ion-grid>
<ion-row <ion-row *ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0">
*ngIf="categoriesService.activecategories && categoriesService.activecategories.length > 0" <ion-col size="6" *ngFor="let categories of categoriesService.categories">
> <div class="preference-box">
<ion-col <input type="checkbox" class="preference" (click)="selectPrefernce(categories.catId)" [checked]="selectedPref(categories.catId)" />
size="6" <img [src]="categories.catImage" onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'" />
*ngFor="let categories of categoriesService.categories" <h1>{{categories.catName}}</h1>
> </div>
<div class="preference-box"> </ion-col>
<input </ion-row>
type="checkbox" </ion-grid>
class="preference" </div>
(click)="selectPrefernce(categories.catId)"
[checked]="selectedPref(categories.catId)"
/>
<img
[src]="categories.catImage"
onerror="this.src='../assets/handsome-man-outdoors-drinking-coffee-with-sunglasses-guy-with-beard-instagram-effect_1212-818@3x.png'"
/>
<h1>{{categories.catName}}</h1>
</div>
</ion-col>
</ion-row>
</ion-grid>
</div> </div>
</ion-content>
<ion-footer>
<div class="bottom-button"> <div class="bottom-button">
<button class="show-btn" (click)="onSubmit()"> <button class="show-btn" (click)="onSubmit()">
Continue Continue
</button> </button>
<!-- <span>SKIP</span> --> <!-- <span>SKIP</span> -->
</div> </div>
</div> </ion-footer>
</ion-content>
<div class="loader" *ngIf="loader"> <div class="loader" *ngIf="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/preference/preference.page.scss
.preference-wrapper { .preference-wrapper {
padding: 20px 20px 110px 20px; padding: 20px 20px 110px 20px;
.bottom-button {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
padding: 20px;
text-align: center;
z-index: 2;
button {
width: 100%;
background-color: #29285b;
color: #fff;
border-radius: 8px;
height: 45px;
font-size: 16px;
text-transform: uppercase;
}
span {
text-transform: uppercase;
font-size: 16px;
text-align: center;
margin-top: 10px;
display: inline-block;
font-weight: 600;
}
}
.pref-wrap-two { .pref-wrap-two {
.preference-box { .preference-box {
width: 100%; width: 100%;
...@@ -89,4 +62,32 @@ ...@@ -89,4 +62,32 @@
} }
} }
} }
}
.bottom-button {
position: fixed;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
padding: 20px;
text-align: center;
z-index: 9;
button {
width: 100%;
background-color: #29285b;
color: #fff;
border-radius: 8px;
height: 45px;
font-size: 16px;
text-transform: uppercase;
}
span {
text-transform: uppercase;
font-size: 16px;
text-align: center;
margin-top: 10px;
display: inline-block;
font-weight: 600;
}
} }
\ No newline at end of file
src/app/productdetail/productdetail.page.scss
...@@ -134,12 +134,11 @@ ...@@ -134,12 +134,11 @@
top: 0px; top: 0px;
bottom: 0px; bottom: 0px;
padding: 4px; padding: 4px;
padding-top: 35px;
padding-bottom: 35px;
text-align: center; text-align: center;
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;
justify-content: center;
} }
#custom_check_button label { #custom_check_button label {
width: 100%; width: 100%;
......
src/app/profile/profile.page.html
<div class="nav_header"> <div class="nav_header">
<ion-menu-toggle> <ion-menu-toggle>
<button class="nav_btn nav_menu floatLeft"></button> <button class="nav_btn nav_menu floatLeft"></button>
</ion-menu-toggle> </ion-menu-toggle>
<div class="nav_title floatLeft"> <div class="nav_title floatLeft">
<img src="../../assets/Group [email protected]" /> <img src="../../assets/Group [email protected]" />
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<ion-content> <ion-content>
<div class="profile_wrapper" *ngIf="loggedUser"> <div class="profile_wrapper" *ngIf="loggedUser">
<div class="profile_banner"> <div class="profile_banner">
<!-- <div class="profile_circle"> <!-- <div class="profile_circle">
<div class="edit"></div> <div class="edit"></div>
</div> --> </div> -->
<div class="profile_circle"> <div class="profile_circle">
<img <img [src]="loggedUser.profilePhoto" onerror="this.src='./../assets/asset_avatar.png'" />
[src]="loggedUser.profilePhoto" <div class="edit"></div>
onerror="this.src='./../assets/asset_avatar.png'" <input type="file" accept="image/*" (change)="fileChange($event)" />
/> </div>
<div class="edit"></div>
<input type="file" accept="image/*" (change)="fileChange($event)" />
</div>
<h5>{{loggedUser.name}}</h5> <h5>{{loggedUser.name}}</h5>
<p (click)="istoggle()">LOGOUT</p> <p (click)="istoggle()">LOGOUT</p>
</div> </div>
<div class="account_wrapper"> <div class="account_wrapper">
<div class="account_header"> <div class="account_header">
<h5 class="floatLeft">ACCOUNT INFORMATION</h5> <h5 class="floatLeft">ACCOUNT INFORMATION</h5>
<span <span class="floatRight" (click)="goToPage('changedetails', user && user)"><img
class="floatRight" src="../../assets/edit.png" /></span>
(click)="goToPage('changedetails', user && user)" <div class="clear"></div>
><img src="../../assets/edit.png" </div>
/></span> <div class="row">
<div class="clear"></div> <ion-row>
</div> <ion-col class="textLeft p0">
<div class="row"> <p>
<ion-row> Phone
<ion-col class="textLeft p0"> </p>
<p> </ion-col>
Phone <ion-col class="textRight p0">
</p> <h6>{{loggedUser.phone}}</h6>
</ion-col> <span class="ar-span" *ngIf="loggedUser.phoneVerified == true">Verified</span>
<ion-col class="textRight p0"> <span class="ar-span" *ngIf="loggedUser.phoneVerified == false" (click)="goToPage('verficationnumber')">Not
<h6>{{loggedUser.phone}}</h6> Verified yet</span>
<span class="ar-span" *ngIf="loggedUser.phoneVerified == true" </ion-col>
>Verified</span </ion-row>
> </div>
<span class="ar-span" *ngIf="loggedUser.phoneVerified == false" <div class="row">
>Not Verified yet</span <ion-row>
> <ion-col class="textLeft p0">
</ion-col> <p>
</ion-row> Email
</div> </p>
<div class="row"> </ion-col>
<ion-row> <ion-col class="textRight p0">
<ion-col class="textLeft p0"> <h6>{{loggedUser.emailId}}</h6>
<p> <span class="ar-span" *ngIf="loggedUser.emailVerified == true">Verified</span>
Email <span class="ar-span" *ngIf="loggedUser.emailVerified == false">Not Verified yet</span>
</p> </ion-col>
</ion-col> </ion-row>
<ion-col class="textRight p0"> </div>
<h6>{{loggedUser.emailId}}</h6> <hr />
<span class="ar-span" *ngIf="loggedUser.emailVerified == true" <ion-row (click)="goToPage('wishlist')">
>Verified</span <ion-col class="textLeft p0">
> <p>Wishlist</p>
<span class="ar-span" *ngIf="loggedUser.emailVerified == false" </ion-col>
>Not Verified yet</span <ion-col class="textRight p0">
> <h6 *ngIf="wishService.whishItem">
</ion-col> ({{wishService.whishItem.length}})
</ion-row> </h6>
</div> </ion-col>
<hr /> </ion-row>
<ion-row (click)="goToPage('wishlist')"> <hr />
<ion-col class="textLeft p0"> <ion-row (click)="goToPage('address')">
<p>Wishlist</p> <ion-col class="textLeft p0">
</ion-col> <p>Address</p>
<ion-col class="textRight p0"> </ion-col>
<h6 *ngIf="wishService.whishItem"> <ion-col class="textRight p0">
({{wishService.whishItem.length}}) <h6 *ngIf="addressService.addList">
</h6> ({{addressService.addressList.length}})
</ion-col> </h6>
</ion-row> </ion-col>
<hr /> </ion-row>
<ion-row (click)="goToPage('address')"> <hr />
<ion-col class="textLeft p0"> <!-- <ion-row>
<p>Address</p>
</ion-col>
<ion-col class="textRight p0">
<h6 *ngIf="addressService.addList">
({{addressService.addressList.length}})
</h6>
</ion-col>
</ion-row>
<hr />
<!-- <ion-row>
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>My Cards</p> <p>My Cards</p>
</ion-col> </ion-col>
...@@ -107,63 +94,60 @@ ...@@ -107,63 +94,60 @@
</ion-col> </ion-col>
</ion-row> </ion-row>
<hr /> --> <hr /> -->
<ion-row (click)="goToPage('myorder')"> <ion-row (click)="goToPage('myorder')">
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>My Order</p> <p>My Order</p>
</ion-col> </ion-col>
<ion-col class="textRight p0"> <ion-col class="textRight p0">
<h6> <h6>
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</h6> </h6>
</ion-col> </ion-col>
</ion-row> </ion-row>
<hr /> <hr />
<ion-row (click)="goToPage('preference')"> <ion-row (click)="goToPage('preference')">
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>Preferences</p> <p>Preferences</p>
</ion-col> </ion-col>
<ion-col class="textRight p0"> <ion-col class="textRight p0">
<h6> <h6>
<ion-icon name="arrow-forward"></ion-icon> <ion-icon name="arrow-forward"></ion-icon>
</h6> </h6>
</ion-col> </ion-col>
</ion-row> </ion-row>
<hr /> <hr />
<ion-row> <ion-row>
<ion-col class="textLeft p0"> <ion-col class="textLeft p0">
<p>Currency</p> <p>Currency</p>
</ion-col> </ion-col>
<ion-col class="textRight p0"> <ion-col class="textRight p0">
<h6> <h6>
<span>AUD</span> <span>AUD</span>
</h6> </h6>
</ion-col> </ion-col>
</ion-row> </ion-row>
</div> </div>
<div class="logout-pop-wrapper" *ngIf="isShow" [@slideInOut]> <div class="logout-pop-wrapper" *ngIf="isShow" [@slideInOut]>
<div class="logout_inner"> <div class="logout_inner">
<h4>Logout</h4> <h4>Logout</h4>
<p>Are you sure to Logout ?</p> <p>Are you sure to Logout ?</p>
<div class="logout_footer"> <div class="logout_footer">
<button class="btn-cancel floatLeft" (click)="istoggle();"> <button class="btn-cancel floatLeft" (click)="istoggle();">
Cancel Cancel
</button> </button>
<button <button class="btn-logout floatRight" (click)="authService.SignOut(); istoggle()">
class="btn-logout floatRight"
(click)="authService.SignOut(); istoggle()"
>
Logout Logout
</button> </button>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div> </div>
</div>
</div> </div>
</div>
</ion-content> </ion-content>
<div class="loader" *ngIf="loader"> <div class="loader" *ngIf="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/review/review.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>RATING & REVIEWS</h4> <h4>RATING & REVIEWS</h4>
</div> </div>
...@@ -11,22 +11,19 @@ ...@@ -11,22 +11,19 @@
<div class="nearby_shop_list"> <div class="nearby_shop_list">
<ul> <ul>
<li (click)="goToPage('productlist')"> <li (click)="goToPage('productlist')">
<div class="nearby_image"></div> <div class="nearby_image">
<img src="../../assets/2193bb91-3be9-4de9-96f4-4ce7aab8547e1558436499234-RARE-Women-Black-Printed-A-Line-Dress-6731558436495088-1@3x.png" alt="">
</div>
<div class="nearby_detail"> <div class="nearby_detail">
<h5> <h5> Carnival Life</h5>
<span class="floatLeft">Carnival Life</span> <p><span><img src="../assets/Path61_2.png"> 4</span> Men's & Women's Fashion</p>
<span class="floatRight">4
<img src="../assets/Path61_2.png">
</span>
<div class="clear"></div>
</h5>
<p>Men's & Women's Fashion</p>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</li> </li>
</ul> </ul>
</div> </div>
<div class="rating_div"> <div class="rating_div">
<h5>Rate Us</h5>
<fieldset class="rating"> <fieldset class="rating">
<input type="radio" id="star5" name="rating" value="5" /><label class="full" for="star5" title="Awesome - 5 stars"></label> <input type="radio" id="star5" name="rating" value="5" /><label class="full" for="star5" title="Awesome - 5 stars"></label>
<input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label> <input type="radio" id="star4half" name="rating" value="4 and a half" /><label class="half" for="star4half" title="Pretty good - 4.5 stars"></label>
...@@ -41,4 +38,10 @@ ...@@ -41,4 +38,10 @@
</fieldset> </fieldset>
</div> </div>
<div class="form_div">
<p>Comments</p>
<textarea required name="message" class="form-control" rows="8" placeholder="Type here.."></textarea>
<button class="login_btn"> SUBMIT </button>
</div>
</ion-content> </ion-content>
\ No newline at end of file
src/app/review/review.page.scss
.nearby_shop_list { .nearby_shop_list {
ul { ul {
margin: 0px; margin-top: 25px;
padding: 10px; padding: 10px;
padding-left: 20px; padding-left: 20px;
padding-right: 20px; padding-right: 20px;
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 8px;
object-fit: cover; object-fit: cover;
object-position: center; object-position: center;
} }
...@@ -30,14 +31,14 @@ ...@@ -30,14 +31,14 @@
color: rgba(59, 57, 77, 1); color: rgba(59, 57, 77, 1);
font-weight: 900; font-weight: 900;
padding-bottom: 2px; padding-bottom: 2px;
img {
width: 16px;
}
} }
p { p {
margin: 0px; margin: 0px;
padding: 0px; padding: 0px;
color: rgba(176, 174, 199); color: rgba(176, 174, 199);
img {
width: 16px;
}
} }
} }
} }
...@@ -45,10 +46,22 @@ ...@@ -45,10 +46,22 @@
} }
.rating_div { .rating_div {
margin: 0px;
padding: 10px;
padding-left: 20px;
padding-right: 20px;
display: flex;
h5 {
margin: 0px;
padding: 0px;
color: #3b394d;
font-weight: 900;
display: flex;
align-items: center;
}
.rating { .rating {
border: none; border: none;
width: 250px; width: 250px;
margin: 0 auto;
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;
} }
...@@ -87,4 +100,43 @@ ...@@ -87,4 +100,43 @@
.rating>input:checked~label:hover~label { .rating>input:checked~label:hover~label {
color: rgba(41, 40, 91, 1); color: rgba(41, 40, 91, 1);
} }
}
.form_div {
padding: 10px;
padding-left: 20px;
padding-right: 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-top: 30px;
}
p {
color: #3b394d;
font-weight: 900;
margin-top: 0;
}
} }
\ No newline at end of file
src/app/verficationnumber/verficationnumber.module.ts 0 → 100644
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 { VerficationnumberPage } from './verficationnumber.page';
const routes: Routes = [
{
path: '',
component: VerficationnumberPage
}
];
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
RouterModule.forChild(routes)
],
declarations: [VerficationnumberPage]
})
export class VerficationnumberPageModule {}
src/app/verficationnumber/verficationnumber.page.html 0 → 100644
<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>VERIFICATION</h4>
</div>
<div class="clear"></div>
</div>
<ion-content>
<div class="verification_div" *ngIf="authService.userPostData">
<div class="form_div">
<div class="row">
<p>We have sent and OTP to</p>
<h6>+01 {{authService.userPostData.phone}}</h6>
</div>
<div class="row">
<input class="" type="number" placeholder="Type OTP" maxlength="4" #otp required />
</div>
<div class="row">
<button class="login_btn" (click)="authService.verify(otp.value)">
SUBMIT
</button>
</div>
<div class="row">
<button class="resend_btn" (click)="authService.resend()">
RESEND
</button>
</div>
<h6>OTP: {{authService.userPostData.otp}}</h6>
</div>
</div>
<div class="loader" *ngIf="authService.loader">
<div class="lds-ripple">
<div></div>
<div></div>
</div>
</div>
</ion-content>
\ No newline at end of file
src/app/verficationnumber/verficationnumber.page.scss 0 → 100644
.verification_div {
width: 80%;
margin: 0 auto;
.form_div {
padding-top: 30%;
.row {
margin-bottom: 20px;
input {
border: 1px solid rgba(215, 213, 228, 1);
background: transparent;
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%;
background-color: #29285b;
color: #fff;
border-radius: 8px;
height: 45px;
font-size: 16px;
}
.resend_btn {
width: 100%;
background-color: transparent;
color: #29285b;
border-radius: 8px;
height: 45px;
font-size: 16px;
font-weight: 900;
}
hr {
border: 1px solid rgba(215, 213, 228, 1);
border-bottom: none;
margin-top: 30px;
margin-bottom: 10px;
}
P {
text-align: center;
color: rgba(59, 57, 77, 1);
margin: 0px;
text-align: center;
span {
background-color: #fff;
padding: 10px;
font-size: 18px;
}
}
h4 {
color: rgba(59, 57, 77, 1);
text-align: center;
margin: 0px;
padding-top: 15px;
}
h6 {
color: rgba(41, 40, 91, 1);
text-align: center;
font-weight: bold;
padding-bottom: 20%;
font-size: 25px;
.styled-checkbox {
position: absolute;
opacity: 0;
&+label {
position: relative;
cursor: pointer;
padding: 0;
}
&+label:before {
content: '';
margin-right: 10px;
display: inline-block;
vertical-align: text-top;
width: 30px;
height: 30px;
border-radius: 10px;
background: white;
border: 1px solid rgba(215, 213, 228, 1);
}
// 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: 10px;
top: 15px;
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);
}
}
}
.social_div {
border: 1px solid rgba(215, 213, 228, 1);
height: 45px;
border-radius: 20px;
.social_btn {
display: inline-block;
width: 50%;
text-align: center;
height: 100%;
font-size: 18px;
padding: 9px;
}
}
}
}
}
\ No newline at end of file
src/app/verficationnumber/verficationnumber.page.spec.ts 0 → 100644
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { VerficationnumberPage } from './verficationnumber.page';
describe('VerficationnumberPage', () => {
let component: VerficationnumberPage;
let fixture: ComponentFixture<VerficationnumberPage>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ VerficationnumberPage ],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(VerficationnumberPage);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/verficationnumber/verficationnumber.page.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { Location } from '@angular/common';
import { Router, ActivatedRoute } from '@angular/router';
import { AuthService } from './../../config/auth.service';
@Component({
selector: 'app-verficationnumber',
templateUrl: './verficationnumber.page.html',
styleUrls: ['./verficationnumber.page.scss']
})
export class VerficationnumberPage implements OnInit {
constructor(
private router: Router,
private route: ActivatedRoute,
private location: Location,
public authService: AuthService
) {}
ngOnInit() {}
goToPage(path, data = null) {
this.router.navigateByUrl(path, { queryParams: data });
document.body.scrollTop = document.documentElement.scrollTop = 0;
}
goBack() {
this.location.back();
}
}
src/global.scss
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
--------------------------------*/ --------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Abel&display=swap'); @import url('https://fonts.googleapis.com/css?family=Abel&display=swap');
@import url(//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css); @import url('//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css');
* { * {
font-family: 'Abel', sans-serif; font-family: 'Abel', sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
......
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