20-08-2019 sprint one
Showing
| ... | @@ -13,6 +13,7 @@ | ... | @@ -13,6 +13,7 @@ |
| }, | }, | ||
| "private": true, | "private": true, | ||
| "dependencies": { | "dependencies": { | ||
| "@agm/core": "^1.0.0-beta.7", | |||
| "@angular/animations": "^8.2.2", | "@angular/animations": "^8.2.2", | ||
| "@angular/common": "~8.1.2", | "@angular/common": "~8.1.2", | ||
| "@angular/compiler": "~8.1.2", | "@angular/compiler": "~8.1.2", | ||
| ... | @@ -22,13 +23,17 @@ | ... | @@ -22,13 +23,17 @@ |
| "@angular/platform-browser-dynamic": "~8.1.2", | "@angular/platform-browser-dynamic": "~8.1.2", | ||
| "@angular/router": "~8.1.2", | "@angular/router": "~8.1.2", | ||
| "@ionic-native/core": "^5.0.0", | "@ionic-native/core": "^5.0.0", | ||
| "@ionic-native/geolocation": "^5.0.0", | |||
| "@ionic-native/native-geocoder": "^5.0.0", | |||
| "@ionic-native/splash-screen": "^5.0.0", | "@ionic-native/splash-screen": "^5.0.0", | ||
| "@ionic-native/status-bar": "^5.0.0", | "@ionic-native/status-bar": "^5.0.0", | ||
| "@ionic/angular": "^4.7.1", | "@ionic/angular": "^4.7.1", | ||
| "cordova-android": "7.1.4", | "cordova-android": "7.1.4", | ||
| "cordova-plugin-device": "^2.0.2", | "cordova-plugin-device": "^2.0.2", | ||
| "cordova-plugin-geolocation": "4.0.2", | |||
| "cordova-plugin-ionic-keyboard": "^2.1.3", | "cordova-plugin-ionic-keyboard": "^2.1.3", | ||
| "cordova-plugin-ionic-webview": "^4.1.1", | "cordova-plugin-ionic-webview": "^4.1.1", | ||
| "cordova-plugin-nativegeocoder": "3.2.2", | |||
| "cordova-plugin-splashscreen": "^5.0.2", | "cordova-plugin-splashscreen": "^5.0.2", | ||
| "cordova-plugin-statusbar": "^2.4.2", | "cordova-plugin-statusbar": "^2.4.2", | ||
| "cordova-plugin-whitelist": "^1.3.3", | "cordova-plugin-whitelist": "^1.3.3", | ||
| ... | @@ -73,7 +78,11 @@ | ... | @@ -73,7 +78,11 @@ |
| "cordova-plugin-ionic-webview": { | "cordova-plugin-ionic-webview": { | ||
| "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+" | "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+" | ||
| }, | }, | ||
| "cordova-plugin-ionic-keyboard": {} | "cordova-plugin-ionic-keyboard": {}, | ||
| "cordova-plugin-geolocation": { | |||
| "GEOLOCATION_USAGE_DESCRIPTION": "To locate you" | |||
| }, | |||
| "cordova-plugin-nativegeocoder": {} | |||
| }, | }, | ||
| "platforms": [ | "platforms": [ | ||
| "android" | "android" | ||
| ... | ... |
| <ion-header> | |||
| <ion-toolbar> | |||
| <ion-title>cart</ion-title> | |||
| </ion-toolbar> | |||
| </ion-header> | |||
| <ion-content> | <ion-content> | ||
| <div class="cart_wrapper"> | |||
| <div class="cart_head"> | |||
| <div class="nav_header"> | |||
| <button class="nav_btn nav_back_white floatLeft" (click)="goBack()"> | |||
| </button> | |||
| <div class="nav_title floatLeft"> | |||
| <h4>CART</h4> | |||
| </div> | |||
| <button class="nav_btn floatRight"> | |||
| </button> | |||
| <div class="clear"></div> | |||
| </div> | |||
| <div class="cart_menu_header"> | |||
| <ul> | |||
| <li class="textCenter active" [class.active]="currentIndex == 0">CART</li> | |||
| <li class="textCenter"> | |||
| <hr> | |||
| </li> | |||
| <li class="textCenter" [class.active]="currentIndex == 1">CHECKOUT</li> | |||
| <li class="textCenter"> | |||
| <hr> | |||
| </li> | |||
| <li class="textCenter" [class.active]="currentIndex == 2">FINISH</li> | |||
| </ul> | |||
| </div> | |||
| <div class="cart_content"> | |||
| <ion-slides pager="false" [options]="cart_wizard" (ionSlideDidChange)="slideChanged()"> | |||
| <ion-slide> | |||
| <div class="cart_list"> | |||
| <ul> | |||
| <li> | |||
| <div class="close"></div> | |||
| <div class="cart_image"></div> | |||
| <div class="cart_detail"> | |||
| <h4>European Style V neck</h4> | |||
| <h4>Green, Red</h4> | |||
| <h5>AU$99.00</h5> | |||
| </div> | |||
| <div class="cart_count"> | |||
| <div class="add" (click)="addCount()">+</div> | |||
| <div class="count">{{count}}</div> | |||
| <div class="remove" (click)="removeCount()">-</div> | |||
| </div> | |||
| <div class="clear"></div> | |||
| </li> | |||
| <li> | |||
| <div class="close"></div> | |||
| <div class="cart_image"></div> | |||
| <div class="cart_detail"> | |||
| <h4>European Style V neck</h4> | |||
| <h4>Green, Red</h4> | |||
| <h5>AU$99.00</h5> | |||
| </div> | |||
| <div class="cart_count"> | |||
| <div class="add" (click)="addCount()">+</div> | |||
| <div class="count">{{count}}</div> | |||
| <div class="remove" (click)="removeCount()">-</div> | |||
| </div> | |||
| <div class="clear"></div> | |||
| </li> | |||
| <li> | |||
| <div class="close"></div> | |||
| <div class="cart_image"></div> | |||
| <div class="cart_detail"> | |||
| <h4>European Style V neck</h4> | |||
| <h4>Green, Red</h4> | |||
| <h5>AU$99.00</h5> | |||
| </div> | |||
| <div class="cart_count"> | |||
| <div class="add" (click)="addCount()">+</div> | |||
| <div class="count">{{count}}</div> | |||
| <div class="remove" (click)="removeCount()">-</div> | |||
| </div> | |||
| <div class="clear"></div> | |||
| </li> | |||
| </ul> | |||
| <div class="total_div"> | |||
| <ion-row> | |||
| <ion-col> | |||
| <p class="textLeft">Total Price:</p> | |||
| </ion-col> | |||
| <ion-col> | |||
| <p class="textRight">AU$ 239.00</p> | |||
| </ion-col> | |||
| </ion-row> | |||
| </div> | |||
| </div> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <div class="checkout_list"> | |||
| <h5> | |||
| <span class="floatLeft">ITEMS</span> | |||
| <span class="floatRight">AU$239.00</span> | |||
| <div class="clear"></div> | |||
| </h5> | |||
| <ion-grid class="p0"> | |||
| <ion-row> | |||
| <ion-col size="6" class="p0"> | |||
| <h6 class="textLeft">European Style V Neck</h6> | |||
| </ion-col> | |||
| <ion-col size="2" class="p0"> | |||
| <h6 class="textRight"><strong>1 X</strong></h6> | |||
| </ion-col> | |||
| <ion-col size="4" class="p0"> | |||
| <h6 class="textRight"><strong>AU$99.00</strong></h6> | |||
| </ion-col> | |||
| </ion-row> | |||
| <ion-row> | |||
| <ion-col size="6" class="p0"> | |||
| <h6 class="textLeft">Simple Night Wear black doted</h6> | |||
| </ion-col> | |||
| <ion-col size="2" class="p0"> | |||
| <h6 class="textRight"><strong>3 X</strong></h6> | |||
| </ion-col> | |||
| <ion-col size="4" class="p0"> | |||
| <h6 class="textRight"><strong>AU$60.00</strong></h6> | |||
| </ion-col> | |||
| </ion-row> | |||
| <ion-row> | |||
| <ion-col size="6" class="p0"> | |||
| <h6 class="textLeft">European Style V Neck</h6> | |||
| </ion-col> | |||
| <ion-col size="2" class="p0"> | |||
| <h6 class="textRight"><strong>3 X</strong></h6> | |||
| </ion-col> | |||
| <ion-col size="4" class="p0"> | |||
| <h6 class="textRight"><strong>AU$90.00</strong></h6> | |||
| </ion-col> | |||
| </ion-row> | |||
| </ion-grid> | |||
| <hr> | |||
| <h5> | |||
| <span class="floatLeft">DELIVERY</span> | |||
| <span class="floatRight">EDIT</span> | |||
| <div class="clear"></div> | |||
| </h5> | |||
| <ion-grid class="p0"> | |||
| <ion-row> | |||
| <ion-col class="p0"> | |||
| <h6> | |||
| Shamjith KS<br> +00 0000 888 888<br> Carnival Infopark Infopark Kochi<br> 682030, Kerala, India | |||
| </h6> | |||
| </ion-col> | |||
| </ion-row> | |||
| </ion-grid> | |||
| <hr> | |||
| <h5> | |||
| <span class="floatLeft">PAYMENT</span> | |||
| <span class="floatRight">CHANGE</span> | |||
| <div class="clear"></div> | |||
| </h5> | |||
| <div class="card_div"> | |||
| <input class="card_no" placeholder="**** **** **** 1458"> | |||
| <input class="cv_number" placeholder="CVV"> | |||
| </div> | |||
| <div class="after_pay"> | |||
| <input class="" placeholder="After Pay"> | |||
| </div> | |||
| <div class="delivery_time"> | |||
| <ul> | |||
| <li> | |||
| Delivery 10 Mnt<br> | |||
| <strong>AU$10</strong> | |||
| </li> | |||
| <li> | |||
| Delivery 1 Hr<br> | |||
| <strong>FREE</strong> | |||
| </li> | |||
| </ul> | |||
| </div> | |||
| <hr> | |||
| <div class="coupon_code"> | |||
| <input class="" placeholder="COUPON CODE"><button class="add_btn">ADD</button> | |||
| </div> | |||
| <div class="total_div"> | |||
| <ion-row> | |||
| <ion-col> | |||
| <p class="textLeft">Total Price:</p> | |||
| </ion-col> | |||
| <ion-col> | |||
| <p class="textRight">AU$ 239.00</p> | |||
| </ion-col> | |||
| </ion-row> | |||
| </div> | |||
| </div> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <div class="order_placed_div"> | |||
| <img src="../../assets/[email protected]"> | |||
| <h4>Order Placed</h4> | |||
| <p>June 26th 2019, 03:00 PM</p> | |||
| <h3>The product will be delivered in</h3> | |||
| <h1>10:00 Mins</h1> | |||
| <button class="view_order" (click)="goToPage('myorder')">VIEW ORDERS</button><br> | |||
| <button class="home_btn" (click)="goToPage('home')">HOME</button> | |||
| </div> | |||
| </ion-slide> | |||
| </ion-slides> | |||
| </div> | |||
| </div> | |||
| <div class="footer_btn" [hidden]="currentIndex != 0" (click)="next()"> | |||
| CHECKOUT | |||
| </div> | |||
| <div class="footer_btn" [hidden]="currentIndex != 1" (click)="next()"> | |||
| PAY | |||
| </div> | |||
| <div class="footer_btn" [hidden]="currentIndex != 2" (click)="goToPage('orderplaced')"> | |||
| FINISH | |||
| </div> | |||
| </div> | |||
| </ion-content> | </ion-content> | ||
| \ No newline at end of file |
| .cart_wrapper { | |||
| width: 100%; | |||
| .cart_head { | |||
| width: 100%; | |||
| height: 220px; | |||
| background-image: url("../../assets/[email protected]"); | |||
| background-position: center bottom; | |||
| background-repeat: no-repeat; | |||
| background-size: cover; | |||
| .nav_header { | |||
| .nav_title { | |||
| h4 { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| } | |||
| .cart_menu_header { | |||
| padding: 20px; | |||
| ul { | |||
| margin: 0px; | |||
| padding: 10px; | |||
| background-color: rgba(273, 273, 273, 0.1); | |||
| border-radius: 10px; | |||
| li { | |||
| list-style: none; | |||
| color: rgba(176, 174, 199, 1); | |||
| width: 20%; | |||
| display: inline-block; | |||
| font-weight: 700; | |||
| hr { | |||
| height: 0px; | |||
| border-top: none; | |||
| width: 90%; | |||
| margin-top: 0px; | |||
| margin-bottom: 0px; | |||
| position: relative; | |||
| margin: 0 auto; | |||
| border-bottom: 2px dashed rgba(176, 174, 199, 1); | |||
| bottom: 4px; | |||
| } | |||
| } | |||
| .active { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| } | |||
| .cart_content { | |||
| width: calc(100% - 40px); | |||
| margin: 0 auto; | |||
| height: 500px; | |||
| border-radius: 10px; | |||
| background-color: #fff; | |||
| .checkout_list { | |||
| width: 100%; | |||
| padding: 15px; | |||
| height: calc(100vh - 180px); | |||
| overflow: scroll; | |||
| h5 { | |||
| color: rgba(59, 57, 77, 1); | |||
| margin: 0px; | |||
| padding: 0px; | |||
| font-weight: bolder; | |||
| font-size: 18px; | |||
| padding-bottom: 15px; | |||
| padding-top: 10px; | |||
| } | |||
| h6 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| white-space: nowrap; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| text-align: left; | |||
| strong { | |||
| color: rgba(59, 57, 77, 1); | |||
| font-weight: 400; | |||
| } | |||
| } | |||
| ion-row { | |||
| padding-bottom: 10px; | |||
| } | |||
| hr { | |||
| border-top: none; | |||
| height: 0px; | |||
| border-bottom: 1px solid rgba(176, 174, 199, 1); | |||
| } | |||
| .card_div { | |||
| border: 1px solid rgba(176, 174, 199, 1); | |||
| height: 50px; | |||
| border-radius: 5px; | |||
| input { | |||
| border: none; | |||
| height: 100%; | |||
| background-color: transparent; | |||
| } | |||
| .card_no { | |||
| width: calc(100% - 80px); | |||
| height: 100%; | |||
| padding-left: 20px; | |||
| border-right: 1px solid rgba(176, 174, 199, 1); | |||
| } | |||
| .cv_number { | |||
| width: 80px; | |||
| height: 100%; | |||
| text-align: center; | |||
| } | |||
| } | |||
| .after_pay { | |||
| height: 50px; | |||
| border-bottom: 1px solid rgba(176, 174, 199, 1); | |||
| input { | |||
| width: 100%; | |||
| height: 100%; | |||
| padding-left: 20px; | |||
| border: none; | |||
| } | |||
| } | |||
| .delivery_time { | |||
| width: 100%; | |||
| padding-top: 50px; | |||
| padding-bottom: 20px; | |||
| ul { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| text-align: left; | |||
| li { | |||
| padding: 0px; | |||
| list-style: none; | |||
| display: inline-block; | |||
| font-size: 12px; | |||
| margin-right: 10px; | |||
| text-align: center; | |||
| border: 1px solid rgba(176, 174, 199, 1); | |||
| border-radius: 4px; | |||
| padding: 5px; | |||
| strong { | |||
| color: rgba(59, 57, 77, 1); | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .coupon_code { | |||
| padding-top: 20px; | |||
| padding-bottom: 50px; | |||
| border-bottom: 1px solid rgba(176, 174, 199, 1); | |||
| input { | |||
| width: calc(100% - 50px); | |||
| border: 1px solid rgba(176, 174, 199, 1); | |||
| border-radius: 20px; | |||
| height: 35px; | |||
| padding-left: 20px; | |||
| font-weight: 900; | |||
| color: rgba(215, 213, 228, 1); | |||
| &::placeholder { | |||
| color: rgba(215, 213, 228, 1); | |||
| outline: none; | |||
| } | |||
| } | |||
| .add_btn { | |||
| color: #29285b; | |||
| width: 50px; | |||
| height: 35px; | |||
| background: transparent; | |||
| font-size: 17px; | |||
| font-weight: bolder; | |||
| } | |||
| } | |||
| .total_div { | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(41, 40, 91, 1); | |||
| font-weight: bolder; | |||
| } | |||
| } | |||
| } | |||
| .cart_list { | |||
| width: 100%; | |||
| ul { | |||
| margin: 0px; | |||
| padding: 10px; | |||
| width: 100%; | |||
| li { | |||
| list-style: none; | |||
| width: 100%; | |||
| padding-right: 10px; | |||
| position: relative; | |||
| padding-left: 25px; | |||
| border-bottom: 1px solid rgba(215, 213, 228, 1); | |||
| padding-bottom: 20px; | |||
| padding-top: 20px; | |||
| .close { | |||
| background-image: url("../../assets/close.png"); | |||
| width: 15px; | |||
| height: 15px; | |||
| background-position: center; | |||
| background-repeat: no-repeat; | |||
| position: absolute; | |||
| top: 55px; | |||
| left: 0px; | |||
| background-size: cover; | |||
| } | |||
| .cart_image { | |||
| width: 90px; | |||
| height: 90px; | |||
| background-color: #a8a8a8; | |||
| border-radius: 8px; | |||
| float: left; | |||
| img { | |||
| width: 100%; | |||
| height: 100%; | |||
| object-fit: cover; | |||
| object-position: center; | |||
| } | |||
| } | |||
| .cart_detail { | |||
| float: left; | |||
| width: calc(100% - 120px); | |||
| padding-left: 15px; | |||
| padding-top: 5px; | |||
| h4 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| text-align: left; | |||
| font-size: 16px; | |||
| } | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(59, 57, 77, 1); | |||
| text-align: left; | |||
| font-weight: bolder; | |||
| font-size: 20px; | |||
| padding-top: 10px; | |||
| } | |||
| } | |||
| .cart_count { | |||
| width: 30px; | |||
| float: left; | |||
| height: 90px; | |||
| padding-top: 35px; | |||
| padding-bottom: 35px; | |||
| border: 1px solid rgba(215, 213, 228, 1); | |||
| border-radius: 20px; | |||
| color: rgba(215, 213, 228, 1); | |||
| font-size: 20px; | |||
| position: relative; | |||
| .add { | |||
| position: absolute; | |||
| top: 0px; | |||
| left: 0px; | |||
| right: 0px; | |||
| } | |||
| .remove { | |||
| position: absolute; | |||
| bottom: 0px; | |||
| left: 0px; | |||
| right: 0px; | |||
| } | |||
| .count { | |||
| color: rgba(41, 40, 91, 1); | |||
| font-size: 16px; | |||
| font-weight: 900; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .total_div { | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(41, 40, 91, 1); | |||
| font-weight: bolder; | |||
| } | |||
| } | |||
| } | |||
| .order_placed_div { | |||
| width: 100%; | |||
| padding: 10px; | |||
| padding-top: 30px; | |||
| img { | |||
| width: 80px; | |||
| } | |||
| h4 { | |||
| color: #29285b; | |||
| font-weight: bolder; | |||
| margin-bottom: 5px; | |||
| } | |||
| p { | |||
| color: #29285b; | |||
| margin: 0px; | |||
| padding: 0px; | |||
| font-size: 14px; | |||
| } | |||
| h3 { | |||
| color: rgba(176, 174, 199, 1); | |||
| font-size: 18px; | |||
| padding-top: 20px; | |||
| } | |||
| h1 { | |||
| color: rgba(59, 57, 77, 1); | |||
| font-weight: bolder; | |||
| font-size: 35px; | |||
| margin: 0px; | |||
| } | |||
| .view_order { | |||
| height: 45px; | |||
| border-radius: 10px; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| background-color: #29285b; | |||
| color: #FFF; | |||
| margin-top: 30px; | |||
| font-size: 18px; | |||
| font-weight: 400; | |||
| } | |||
| .home_btn { | |||
| height: 45px; | |||
| color: #29285b; | |||
| background-color: transparent; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| margin-top: 30px; | |||
| font-size: 18px; | |||
| font-weight: 900; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .footer_btn { | |||
| width: 100%; | |||
| position: fixed; | |||
| bottom: 0px; | |||
| z-index: 999; | |||
| left: 0px; | |||
| right: 0px; | |||
| background-color: rgba(41, 40, 91, 1); | |||
| text-align: center; | |||
| color: #fff; | |||
| font-size: 18px; | |||
| padding: 10px; | |||
| font-weight: 300; | |||
| border-top-left-radius: 15px; | |||
| border-top-right-radius: 15px; | |||
| } | |||
| } | |||
| \ No newline at end of file |
| <ion-header> | |||
| <ion-toolbar> | |||
| <ion-title>ordercancelled</ion-title> | |||
| </ion-toolbar> | |||
| </ion-header> | |||
| <ion-content> | <ion-content> | ||
| <div class="cart_wrapper"> | |||
| <div class="cart_head"> | |||
| <div class="nav_header"> | |||
| <button class="nav_btn nav_back_white floatLeft" (click)="goBack()"> | |||
| </button> | |||
| <div class="nav_title floatLeft"> | |||
| <h4></h4> | |||
| </div> | |||
| <button class="nav_btn floatRight"> | |||
| </button> | |||
| <div class="clear"></div> | |||
| </div> | |||
| <img src="../../assets/[email protected]"> | |||
| <h4>ORDER CANCELLED</h4> | |||
| <p>June 26th 2019, 03:00 PM</p> | |||
| </div> | |||
| <div class="nearby_shop_list"> | |||
| <ul> | |||
| <li (click)="goToPage('productlist')"> | |||
| <div class="nearby_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| </div> | |||
| <div class="nearby_detail"> | |||
| <h5> | |||
| <span class="floatLeft">Carnival Life</span> | |||
| <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 class="clear"></div> | |||
| </li> | |||
| </ul> | |||
| </div> | |||
| <div class="product_detail"> | |||
| <h6>Green, Small</h6> | |||
| <h5>Quantity : <span>3</span></h5> | |||
| <h5>Amount : <strong>AU$99.00</strong></h5> | |||
| <h5>Delivery time : <span>Delivery in 1 hour</span></h5> | |||
| <h4>DELIVERY</h4> | |||
| <h5> | |||
| Shamjith KS<br> +00 0000 888 888<br> Carnival Infopark Infopark Kochi<br> 682030, Kerala, India | |||
| </h5> | |||
| <button class="cancel_btn" (click)="goToPage('productdetail')">BUY NOW</button> | |||
| <hr> | |||
| </div> | |||
| <div class="related_product_slider"> | |||
| <h5> | |||
| <span class="floatLeft">Related Products</span><span class="floatRight">MORE</span> | |||
| <div class="clear"></div> | |||
| </h5> | |||
| <ul> | |||
| <ion-slides pager="false" [options]="relatedProd"> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00</p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/Recommended-Ball-Gown-Floor-Length-V-Neck-Lace-Organza-Prom-Dress-OD850662@3x.png"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00</p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00 <span class="offer">-8%</span></p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| <div class="featured_badge">Featured</div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00<span>AU$110.00</span></p> | |||
| </li> | |||
| </ion-slide> | |||
| </ion-slides> | |||
| </ul> | |||
| </div> | |||
| </div> | |||
| </ion-content> | </ion-content> | ||
| \ No newline at end of file |
| .cart_wrapper { | |||
| width: 100%; | |||
| .cart_head { | |||
| width: 100%; | |||
| height: 240px; | |||
| text-align: center; | |||
| background-image: url("../../assets/Group [email protected]"); | |||
| background-position: center bottom; | |||
| background-repeat: no-repeat; | |||
| background-size: cover; | |||
| .nav_header { | |||
| .nav_title { | |||
| h4 { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| } | |||
| img { | |||
| width: 70px; | |||
| } | |||
| h4 { | |||
| color: #fff; | |||
| font-weight: bolder; | |||
| margin-bottom: 5px; | |||
| text-align: center; | |||
| } | |||
| p { | |||
| color: rgba(215, 213, 228, 1); | |||
| margin: 0px; | |||
| padding: 0px; | |||
| font-size: 14px; | |||
| text-align: center; | |||
| } | |||
| } | |||
| .order_status { | |||
| width: 100%; | |||
| padding: 20px; | |||
| .track_btn { | |||
| border-radius: 5px; | |||
| height: 40px; | |||
| background-color: #29285b; | |||
| color: #FFF; | |||
| font-size: 18px; | |||
| font-weight: lighter; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| } | |||
| .status_div { | |||
| margin-bottom: 10px; | |||
| margin-top: 10px; | |||
| h4 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(215, 213, 228, 1); | |||
| } | |||
| h6 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(215, 213, 228, 1); | |||
| } | |||
| } | |||
| .go_green { | |||
| h4 { | |||
| color: rgba(53, 203, 171, 1); | |||
| } | |||
| } | |||
| .go_green.status_gap { | |||
| border-left: 2px dashed rgba(53, 203, 171, 1); | |||
| } | |||
| .status_gap { | |||
| border-left: 2px dashed rgba(215, 213, 228, 1); | |||
| height: 30px; | |||
| } | |||
| } | |||
| .nearby_shop_list { | |||
| padding-top: 40px; | |||
| ul { | |||
| margin: 0px; | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| li { | |||
| list-style: none; | |||
| padding-bottom: 10px; | |||
| .nearby_image { | |||
| width: 120px; | |||
| height: 120px; | |||
| float: left; | |||
| background-color: #a8a8a8; | |||
| border-radius: 8px; | |||
| img { | |||
| width: 100%; | |||
| height: 100%; | |||
| object-fit: cover; | |||
| object-position: center; | |||
| } | |||
| } | |||
| .nearby_detail { | |||
| width: calc(100% - 120px); | |||
| float: left; | |||
| padding-left: 20px; | |||
| padding-top: 40px; | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(59, 57, 77, 1); | |||
| font-weight: 900; | |||
| padding-bottom: 2px; | |||
| img { | |||
| width: 16px; | |||
| } | |||
| } | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199); | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .product_detail { | |||
| padding: 10px; | |||
| hr { | |||
| border-bottom: 1px solid rgba(176, 174, 199); | |||
| height: 0px; | |||
| border-top: none; | |||
| } | |||
| h6 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: #29285b; | |||
| font-size: 18px; | |||
| padding-bottom: 15px; | |||
| } | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| font-size: 18px; | |||
| line-height: 25px; | |||
| padding-bottom: 15px; | |||
| strong { | |||
| color: rgba(41, 40, 91, 1); | |||
| } | |||
| span { | |||
| color: rgba(41, 40, 91, 1); | |||
| } | |||
| .afterpay { | |||
| color: rgba(206, 153, 76, 1); | |||
| padding-left: 10px; | |||
| } | |||
| } | |||
| h4 { | |||
| color: rgba(41, 40, 91, 1); | |||
| margin: 0px; | |||
| font-weight: 900; | |||
| font-size: 18px; | |||
| padding-top: 20px; | |||
| padding-bottom: 10px; | |||
| } | |||
| .cancel_btn { | |||
| border-radius: 8px; | |||
| height: 45px; | |||
| width: 100%; | |||
| background-color: #29285b; | |||
| color: #FFF; | |||
| font-size: 18px; | |||
| font-weight: lighter; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| margin-bottom: 20px; | |||
| margin-top: 20px; | |||
| } | |||
| } | |||
| .related_product_slider { | |||
| h5 { | |||
| color: rgba(41, 40, 91, 1); | |||
| margin: 0px; | |||
| padding: 10px; | |||
| font-weight: 900; | |||
| font-size: 18px; | |||
| } | |||
| p { | |||
| color: rgba(59, 57, 77, 1); | |||
| padding: 10px; | |||
| text-align: justify; | |||
| margin: 0px; | |||
| font-size: 18px; | |||
| } | |||
| ul { | |||
| padding: 10px; | |||
| padding-bottom: 0px; | |||
| padding-top: 0px; | |||
| margin: 0px; | |||
| li { | |||
| width: 100%; | |||
| display: inline-block; | |||
| border-top: none; | |||
| border-bottom: none; | |||
| margin-bottom: 10px; | |||
| .product_image { | |||
| height: 235px; | |||
| position: relative; | |||
| .featured_badge { | |||
| position: absolute; | |||
| top: 20px; | |||
| left: 0px; | |||
| color: #fff; | |||
| background-color: rgba(41, 40, 91, 1); | |||
| padding: 2px; | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| font-size: 13px; | |||
| } | |||
| .fav_icon { | |||
| position: absolute; | |||
| top: 10px; | |||
| right: 10px; | |||
| font-size: 27px; | |||
| width: 30px; | |||
| height: 30px; | |||
| background-image: url("../../assets/Group32_2.png"); | |||
| background-position: center; | |||
| background-repeat: no-repeat; | |||
| background-size: 24px; | |||
| } | |||
| img { | |||
| width: 100%; | |||
| height: 100%; | |||
| object-fit: cover; | |||
| object-position: center; | |||
| } | |||
| } | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(59, 57, 77, 1); | |||
| padding-top: 5px; | |||
| padding-bottom: 5px; | |||
| font-weight: 500; | |||
| text-align: left; | |||
| font-size: 16px; | |||
| white-space: nowrap; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| } | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| font-size: 12px; | |||
| text-align: left; | |||
| span { | |||
| text-decoration: line-through; | |||
| margin-left: 10px; | |||
| color: rgba(215, 213, 228, 1) | |||
| } | |||
| .offer { | |||
| color: #fff; | |||
| background-color: rgba(41, 40, 91, 1); | |||
| border-radius: 4px; | |||
| text-decoration: none; | |||
| padding: 3px; | |||
| font-size: 13px; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| \ No newline at end of file |
| <ion-header> | |||
| <ion-toolbar> | |||
| <ion-title>orderplaced</ion-title> | |||
| </ion-toolbar> | |||
| </ion-header> | |||
| <ion-content> | <ion-content> | ||
| <div class="cart_wrapper"> | |||
| <div class="cart_head"> | |||
| <div class="nav_header"> | |||
| <button class="nav_btn nav_back_white floatLeft" (click)="goBack()"> | |||
| </button> | |||
| <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>June 26th 2019, 03:00 PM</p> | |||
| </div> | |||
| <div class="order_status"> | |||
| <div class="clear"></div> | |||
| <div class="status_div go_green"> | |||
| <h4>Order Placed</h4> | |||
| <h6>June 26th 2019, 03:00PM</h6> | |||
| </div> | |||
| <div class="status_gap go_green"> | |||
| </div> | |||
| <div class="status_div go_green"> | |||
| <h4>Retailer Accepted</h4> | |||
| <h6>June 26th 2019, 03:05PM</h6> | |||
| </div> | |||
| <div class="status_gap go_green"> | |||
| </div> | |||
| <div class="status_div go_green"> | |||
| <div class="floatLeft"> | |||
| <h4>Product Packed</h4> | |||
| <h6>June 26th 2019, 03:10PM</h6> | |||
| </div> | |||
| <button class="track_btn floatRight" (click)="goToPage('trackorder')">Track Order</button> | |||
| <div class="clear"></div> | |||
| </div> | |||
| <div class="status_gap go_green"> | |||
| </div> | |||
| <div class="status_div go_green"> | |||
| <h4>Rider is assigned to shop</h4> | |||
| <h6>June 26th 2019, 03:12PM</h6> | |||
| </div> | |||
| <div class="status_gap go_green"> | |||
| </div> | |||
| <div class="status_div go_green"> | |||
| <h4>Rider has picked up your product and on the way</h4> | |||
| <h6>June 26th 2019, 03:15PM</h6> | |||
| </div> | |||
| <div class="status_gap"> | |||
| </div> | |||
| <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="../../assets/[email protected]"> | |||
| </div> | |||
| <div class="nearby_detail"> | |||
| <h5> | |||
| <span class="floatLeft">Carnival Life</span> | |||
| <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 class="clear"></div> | |||
| </li> | |||
| </ul> | |||
| </div> | |||
| <div class="product_detail"> | |||
| <h6>Green, Small</h6> | |||
| <h5>Quantity : <span>3</span></h5> | |||
| <h5>Amount : <strong>AU$99.00</strong><span class="afterpay">After Pay</span></h5> | |||
| <h5>Delivery time : <span>Delivery in 1 hour</span></h5> | |||
| <h4>DELIVERY</h4> | |||
| <h5> | |||
| Shamjith KS<br> +00 0000 888 888<br> Carnival Infopark Infopark Kochi<br> 682030, Kerala, India | |||
| </h5> | |||
| <button class="cancel_btn" (click)="goToPage('ordercancelled')">CANCEL THIS ORDER</button> | |||
| <hr> | |||
| </div> | |||
| <div class="related_product_slider"> | |||
| <h5> | |||
| <span class="floatLeft">Related Products</span><span class="floatRight">MORE</span> | |||
| <div class="clear"></div> | |||
| </h5> | |||
| <ul> | |||
| <ion-slides pager="false" [options]="relatedProd"> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00</p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/Recommended-Ball-Gown-Floor-Length-V-Neck-Lace-Organza-Prom-Dress-OD850662@3x.png"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00</p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00 <span class="offer">-8%</span></p> | |||
| </li> | |||
| </ion-slide> | |||
| <ion-slide> | |||
| <li (click)="goToPage('productdetail')"> | |||
| <div class="product_image"> | |||
| <img src="../../assets/[email protected]"> | |||
| <div class="fav_icon"> | |||
| </div> | |||
| <div class="featured_badge">Featured</div> | |||
| </div> | |||
| <h5>European Style V Neck</h5> | |||
| <p>AU$99.00<span>AU$110.00</span></p> | |||
| </li> | |||
| </ion-slide> | |||
| </ion-slides> | |||
| </ul> | |||
| </div> | |||
| </div> | |||
| </ion-content> | </ion-content> | ||
| \ No newline at end of file |
| .cart_wrapper { | |||
| width: 100%; | |||
| .cart_head { | |||
| width: 100%; | |||
| height: 240px; | |||
| text-align: center; | |||
| background-image: url("../../assets/[email protected]"); | |||
| background-position: center bottom; | |||
| background-repeat: no-repeat; | |||
| background-size: cover; | |||
| .nav_header { | |||
| .nav_title { | |||
| h4 { | |||
| color: #FFF; | |||
| } | |||
| } | |||
| } | |||
| img { | |||
| width: 70px; | |||
| } | |||
| h4 { | |||
| color: #fff; | |||
| font-weight: bolder; | |||
| margin-bottom: 5px; | |||
| text-align: center; | |||
| } | |||
| p { | |||
| color: rgba(215, 213, 228, 1); | |||
| margin: 0px; | |||
| padding: 0px; | |||
| font-size: 14px; | |||
| text-align: center; | |||
| } | |||
| } | |||
| .order_status { | |||
| width: 100%; | |||
| padding: 20px; | |||
| .track_btn { | |||
| border-radius: 5px; | |||
| height: 40px; | |||
| background-color: #29285b; | |||
| color: #FFF; | |||
| font-size: 18px; | |||
| font-weight: lighter; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| } | |||
| .status_div { | |||
| margin-bottom: 10px; | |||
| margin-top: 10px; | |||
| h4 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(215, 213, 228, 1); | |||
| } | |||
| h6 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(215, 213, 228, 1); | |||
| } | |||
| } | |||
| .go_green { | |||
| h4 { | |||
| color: rgba(53, 203, 171, 1); | |||
| } | |||
| } | |||
| .go_green.status_gap { | |||
| border-left: 2px dashed rgba(53, 203, 171, 1); | |||
| } | |||
| .status_gap { | |||
| border-left: 2px dashed rgba(215, 213, 228, 1); | |||
| height: 30px; | |||
| } | |||
| } | |||
| .nearby_shop_list { | |||
| ul { | |||
| margin: 0px; | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| li { | |||
| list-style: none; | |||
| padding-bottom: 10px; | |||
| .nearby_image { | |||
| width: 120px; | |||
| height: 120px; | |||
| float: left; | |||
| background-color: #a8a8a8; | |||
| border-radius: 8px; | |||
| img { | |||
| width: 100%; | |||
| height: 100%; | |||
| object-fit: cover; | |||
| object-position: center; | |||
| } | |||
| } | |||
| .nearby_detail { | |||
| width: calc(100% - 120px); | |||
| float: left; | |||
| padding-left: 20px; | |||
| padding-top: 40px; | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(59, 57, 77, 1); | |||
| font-weight: 900; | |||
| padding-bottom: 2px; | |||
| img { | |||
| width: 16px; | |||
| } | |||
| } | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199); | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| .product_detail { | |||
| padding: 10px; | |||
| hr { | |||
| border-bottom: 1px solid rgba(176, 174, 199); | |||
| height: 0px; | |||
| border-top: none; | |||
| } | |||
| h6 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: #29285b; | |||
| font-size: 18px; | |||
| padding-bottom: 15px; | |||
| } | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| font-size: 18px; | |||
| line-height: 25px; | |||
| padding-bottom: 15px; | |||
| strong { | |||
| color: rgba(41, 40, 91, 1); | |||
| } | |||
| span { | |||
| color: rgba(41, 40, 91, 1); | |||
| } | |||
| .afterpay { | |||
| color: rgba(206, 153, 76, 1); | |||
| padding-left: 10px; | |||
| } | |||
| } | |||
| h4 { | |||
| color: rgba(41, 40, 91, 1); | |||
| margin: 0px; | |||
| font-weight: 900; | |||
| font-size: 18px; | |||
| padding-top: 20px; | |||
| padding-bottom: 10px; | |||
| } | |||
| .cancel_btn { | |||
| border-radius: 8px; | |||
| height: 45px; | |||
| width: 100%; | |||
| background-color: #29285b; | |||
| color: #FFF; | |||
| font-size: 18px; | |||
| font-weight: lighter; | |||
| padding-left: 20px; | |||
| padding-right: 20px; | |||
| margin-bottom: 20px; | |||
| margin-top: 20px; | |||
| } | |||
| } | |||
| .related_product_slider { | |||
| h5 { | |||
| color: rgba(41, 40, 91, 1); | |||
| margin: 0px; | |||
| padding: 10px; | |||
| font-weight: 900; | |||
| font-size: 18px; | |||
| } | |||
| p { | |||
| color: rgba(59, 57, 77, 1); | |||
| padding: 10px; | |||
| text-align: justify; | |||
| margin: 0px; | |||
| font-size: 18px; | |||
| } | |||
| ul { | |||
| padding: 10px; | |||
| padding-bottom: 0px; | |||
| padding-top: 0px; | |||
| margin: 0px; | |||
| li { | |||
| width: 100%; | |||
| display: inline-block; | |||
| border-top: none; | |||
| border-bottom: none; | |||
| margin-bottom: 10px; | |||
| .product_image { | |||
| height: 235px; | |||
| position: relative; | |||
| .featured_badge { | |||
| position: absolute; | |||
| top: 20px; | |||
| left: 0px; | |||
| color: #fff; | |||
| background-color: rgba(41, 40, 91, 1); | |||
| padding: 2px; | |||
| padding-left: 10px; | |||
| padding-right: 10px; | |||
| font-size: 13px; | |||
| } | |||
| .fav_icon { | |||
| position: absolute; | |||
| top: 10px; | |||
| right: 10px; | |||
| font-size: 27px; | |||
| width: 30px; | |||
| height: 30px; | |||
| background-image: url("../../assets/Group32_2.png"); | |||
| background-position: center; | |||
| background-repeat: no-repeat; | |||
| background-size: 24px; | |||
| } | |||
| img { | |||
| width: 100%; | |||
| height: 100%; | |||
| object-fit: cover; | |||
| object-position: center; | |||
| } | |||
| } | |||
| h5 { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(59, 57, 77, 1); | |||
| padding-top: 5px; | |||
| padding-bottom: 5px; | |||
| font-weight: 500; | |||
| text-align: left; | |||
| font-size: 16px; | |||
| white-space: nowrap; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| } | |||
| p { | |||
| margin: 0px; | |||
| padding: 0px; | |||
| color: rgba(176, 174, 199, 1); | |||
| font-size: 12px; | |||
| text-align: left; | |||
| span { | |||
| text-decoration: line-through; | |||
| margin-left: 10px; | |||
| color: rgba(215, 213, 228, 1) | |||
| } | |||
| .offer { | |||
| color: #fff; | |||
| background-color: rgba(41, 40, 91, 1); | |||
| border-radius: 4px; | |||
| text-decoration: none; | |||
| padding: 3px; | |||
| font-size: 13px; | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| } | |||
| \ No newline at end of file |
src/app/trackorder/trackorder.module.ts
0 → 100644
src/app/trackorder/trackorder.page.html
0 → 100644
src/app/trackorder/trackorder.page.scss
0 → 100644
src/app/trackorder/trackorder.page.spec.ts
0 → 100644
src/app/trackorder/trackorder.page.ts
0 → 100644
src/assets/Group [email protected]
0 → 100644
22.1 KB
src/assets/[email protected]
0 → 100644
5.04 KB
src/assets/[email protected]
0 → 100644
21.6 KB
src/assets/[email protected]
0 → 100644
3.92 KB
src/assets/arrow_white.png
0 → 100644
366 Bytes
src/assets/close.png
0 → 100644
1.27 KB
src/assets/white_tick.png
0 → 100644
5.3 KB