20-08-2019 sprint one
Showing
| ... | ... | @@ -13,6 +13,7 @@ |
| }, | ||
| "private": true, | ||
| "dependencies": { | ||
| "@agm/core": "^1.0.0-beta.7", | ||
| "@angular/animations": "^8.2.2", | ||
| "@angular/common": "~8.1.2", | ||
| "@angular/compiler": "~8.1.2", | ||
| ... | ... | @@ -22,13 +23,17 @@ |
| "@angular/platform-browser-dynamic": "~8.1.2", | ||
| "@angular/router": "~8.1.2", | ||
| "@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/status-bar": "^5.0.0", | ||
| "@ionic/angular": "^4.7.1", | ||
| "cordova-android": "7.1.4", | ||
| "cordova-plugin-device": "^2.0.2", | ||
| "cordova-plugin-geolocation": "4.0.2", | ||
| "cordova-plugin-ionic-keyboard": "^2.1.3", | ||
| "cordova-plugin-ionic-webview": "^4.1.1", | ||
| "cordova-plugin-nativegeocoder": "3.2.2", | ||
| "cordova-plugin-splashscreen": "^5.0.2", | ||
| "cordova-plugin-statusbar": "^2.4.2", | ||
| "cordova-plugin-whitelist": "^1.3.3", | ||
| ... | ... | @@ -73,10 +78,14 @@ |
| "cordova-plugin-ionic-webview": { | ||
| "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": [ | ||
| "android" | ||
| ] | ||
| } | ||
| } | ||
| \ No newline at end of file | ||
| } |
| <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 InfoparkInfopark 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> | ||
| \ 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> | ||
| <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 InfoparkInfopark Kochi<br> 682030, Kerala, India | ||
| </h5> | ||
| <button class="cancel_btn" (click)="goToPage('productdetail')">BUY NOW</button> | ||
| <hr> | ||
| </div> | ||
| </ion-content> | ||
| <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> | ||
| \ 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> | ||
| <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 InfoparkInfopark Kochi<br> 682030, Kerala, India | ||
| </h5> | ||
| <button class="cancel_btn" (click)="goToPage('ordercancelled')">CANCEL THIS ORDER</button> | ||
| <hr> | ||
| </div> | ||
| </ion-content> | ||
| <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> | ||
| \ 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