diff --git a/src/app/cart/cart.page.html b/src/app/cart/cart.page.html index 4067ee8..665b299 100644 --- a/src/app/cart/cart.page.html +++ b/src/app/cart/cart.page.html @@ -169,18 +169,20 @@ </ion-slides> </div> </div> - <div class="footer_btnbay" *ngIf="cartService.carts && cartService.carts.length > 0" [hidden]="currentIndex != 0"> - <div class="continue" (click)="goToPage('productlist')">CONTINUE SHOPING</div> - <div class="checkout" (click)="next(1)">CHECKOUT</div> - </div> - <div class="footer_btn" *ngIf="cartService.carts && cartService.carts.length > 0" [hidden]="currentIndex != 1" (click)="next(2);"> - PAY - </div> - <!-- <div class="footer_btn" [hidden]="currentIndex != 2" (click)="finishpop()"> - FINISH - </div> --> </div> </ion-content> +<ion-footer> + <div class="footer_btnbay" *ngIf="cartService.carts && cartService.carts.length > 0" [hidden]="currentIndex != 0"> + <div class="continue" (click)="goToPage('productlist')">CONTINUE SHOPING</div> + <div class="checkout" (click)="next(1)">CHECKOUT</div> + </div> + <div class="footer_btn" *ngIf="cartService.carts && cartService.carts.length > 0" [hidden]="currentIndex != 1" (click)="next(2);"> + PAY + </div> + <!-- <div class="footer_btn" [hidden]="currentIndex != 2" (click)="finishpop()"> + FINISH + </div> --> +</ion-footer> <!-- <div class="loader"> <div class="lds-ripple"> <div></div> diff --git a/src/app/cart/cart.page.scss b/src/app/cart/cart.page.scss index 8be077b..f386736 100644 --- a/src/app/cart/cart.page.scss +++ b/src/app/cart/cart.page.scss @@ -49,7 +49,7 @@ .cart_content { width: calc(100% - 40px); margin: 0 auto; - height: 500px; + height: calc(100vh - 220px); border-radius: 10px; background-color: #fff; .checkout_list { @@ -394,54 +394,52 @@ } } } - .footer_btn { - width: 100%; - position: fixed; - bottom: 0px; - z-index: 999; - left: 0px; - right: 0px; - box-shadow: 0px -2px 3px -1px rgba(0, 0, 0, 0.34); +} + +.footer_btn { + width: 100%; + z-index: 999; + left: 0px; + right: 0px; + box-shadow: 0px -2px 3px -1px rgba(0, 0, 0, 0.34); + background-color: rgba(41, 40, 91, 1); + text-align: center; + color: #fff; + font-size: 18px; + padding: 15px; + font-weight: 300; + border-top-left-radius: 15px; + border-top-right-radius: 15px; +} + +.footer_btnbay { + width: 100%; + box-shadow: 0px -2px 3px -1px rgba(0, 0, 0, 0.34); + z-index: 999; + left: 0px; + right: 0px; + border-radius: 15px; + .continue { + width: 50%; + border-top-left-radius: 15px; + text-align: center; + font-size: 18px; + padding: 15px; + font-weight: 300; + float: left; + border-top: 1px solid #d7d5e4; + border-left: 1px solid #d7d5e4; + } + .checkout { + width: 50%; + border-top-right-radius: 15px; background-color: rgba(41, 40, 91, 1); + border: 1px solid rgba(41, 40, 91, 1); text-align: center; color: #fff; font-size: 18px; padding: 15px; font-weight: 300; - border-top-left-radius: 15px; - border-top-right-radius: 15px; - } - .footer_btnbay { - width: 100%; - box-shadow: 0px -2px 3px -1px rgba(0, 0, 0, 0.34); - position: fixed; - bottom: 0px; - z-index: 999; - left: 0px; - right: 0px; - border-radius: 15px; - .continue { - width: 50%; - border-top-left-radius: 15px; - text-align: center; - font-size: 18px; - padding: 15px; - font-weight: 300; - float: left; - border-top: 1px solid #d7d5e4; - border-left: 1px solid #d7d5e4; - } - .checkout { - width: 50%; - border-top-right-radius: 15px; - background-color: rgba(41, 40, 91, 1); - border: 1px solid rgba(41, 40, 91, 1); - text-align: center; - color: #fff; - font-size: 18px; - padding: 15px; - font-weight: 300; - float: right; - } + float: right; } } \ No newline at end of file diff --git a/src/app/productdetail/productdetail.page.html b/src/app/productdetail/productdetail.page.html index 7abf637..447134d 100644 --- a/src/app/productdetail/productdetail.page.html +++ b/src/app/productdetail/productdetail.page.html @@ -4,7 +4,7 @@ </button> <div class="nav_title floatLeft"> </div> - <button class="nav_btn floatRight"> + <button class="nav_btn nav_cart floatRight"> </button> <div class="clear"></div> </div> @@ -42,7 +42,7 @@ </label> </button> </li> - </ion-slide> + </ion-slide> </ion-slides> </ul> </div> @@ -170,6 +170,9 @@ </div> </div> </div> + +</ion-content> +<ion-footer> <div class="footer_div"> <div class="footer_options"> <button class="share"></button> @@ -178,4 +181,4 @@ </div> <div class="footer_btn" (click)="cartService.buyNow(product)">BUY NOW</div> </div> -</ion-content> \ No newline at end of file +</ion-footer> \ No newline at end of file diff --git a/src/app/productdetail/productdetail.page.scss b/src/app/productdetail/productdetail.page.scss index fcaf6cb..f94449b 100644 --- a/src/app/productdetail/productdetail.page.scss +++ b/src/app/productdetail/productdetail.page.scss @@ -279,7 +279,6 @@ } .footer_div { - position: fixed; bottom: 0px; height: 50px; left: 0px; diff --git a/src/app/productlist/productlist.page.html b/src/app/productlist/productlist.page.html index 905471b..4649655 100644 --- a/src/app/productlist/productlist.page.html +++ b/src/app/productlist/productlist.page.html @@ -18,7 +18,6 @@ </div> <div class="viewset floatRight"> <div class="grid_view grid_act floatRight" (click)="gridToggle()" [class.line_view]="onGrid"> - </div> <div class="clear"></div> </div> @@ -37,7 +36,7 @@ </div> <h5>{{product.prodName}}</h5> <p>A$ {{product.price}}<span class="offer" *ngIf="product.discount > 0">-{{product.discount}}%</span></p> - </li> + </li> </ul> </div> <div class="sort_wrappper" *ngIf="isShow" [@slideInOut]> diff --git a/src/assets/cart_icon.png b/src/assets/cart_icon.png new file mode 100644 index 0000000..9228e1f Binary files /dev/null and b/src/assets/cart_icon.png differ diff --git a/src/global.scss b/src/global.scss index 2e41e74..c211491 100644 --- a/src/global.scss +++ b/src/global.scss @@ -491,6 +491,14 @@ app-deliverypop { } } +.nav_cart { + background-image: url("./assets/cart_icon.png"); + img { + width: 25px; + display: none; + } +} + ion-header { z-index: 9999 !important; order: 0 !important;