Product list style fix

eduardoumpierre · Apr 30, 2018 · c09ebe5 · c09ebe5
1 parent 392a203
commit c09ebe5
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 16 deletions.
diff --git a/src/app/app.scss b/src/app/app.scss
@@ -158,6 +158,8 @@ ion-content {
         }
 
         &.product-list {
+            margin-bottom: 1rem;
+
             > .item {
                 > ion-avatar {
                     margin-bottom: 0;
@@ -172,11 +174,13 @@ ion-content {
                     border-bottom: 1px solid #f6f7fa;
                 }
 
-                &:last-child > .item-inner {
-                    border-bottom: 0;
+                &:last-child {
+                    > .item-inner {
+                        border-bottom: 0;
 
-                    .ion-label {
-                        margin-bottom: 0;
+                        ion-label {
+                            margin-bottom: 0;
+                        }
                     }
                 }
             }

diff --git a/src/pages/orders/form/order-form.html b/src/pages/orders/form/order-form.html
@@ -116,13 +116,11 @@
 
             <!-- Produtos -->
             <div class="list-item" *ngSwitchCase="'products'">
-                <ion-list class="product-list">
-                    <ion-item>
-                        <button ion-button type="button" color="blue" full (click)="loadProductModal()">
-                            Adicionar Produto
-                        </button>
-                    </ion-item>
+                <button ion-button type="button" color="blue" full (click)="loadProductModal()" class="add-product-button">
+                    Adicionar Produto
+                </button>
 
+                <ion-list class="product-list">
                     <ion-item *ngFor="let product of order; let i = index">
                         <ion-avatar item-start>
                             <img src="assets/images/placeholder-60.jpg" alt="" width="60" height="60">

diff --git a/src/pages/orders/form/order-form.scss b/src/pages/orders/form/order-form.scss
@@ -16,11 +16,7 @@ page-order-form {
         }
     }
 
-    .product-list {
-        > ion-item {
-            ion-label {
-                margin-top: 0 !important;
-            }
-        }
+    .add-product-button {
+        margin-bottom: 1rem;
     }
 }