fix: improve the ui of out-of-stock products on the cart page after a…

… failing cart validation (#443)
intershop · Oct 29, 2020 · 5488707 · 5488707
1 parent e6c5478
commit 5488707
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 16 deletions.
diff --git a/src/app/pages/basket/shopping-basket-empty/shopping-basket-empty.component.html b/src/app/pages/basket/shopping-basket-empty/shopping-basket-empty.component.html
@@ -1,15 +1,13 @@
-<div class="empty-cart">
-  <div>
-    <!-- Error message -->
-    <ish-error-message [error]="error"></ish-error-message>
+<!-- Error message -->
+<ish-error-message [error]="error"></ish-error-message>
 
-    <!-- Info messages -->
-    <ish-basket-info></ish-basket-info>
+<!-- Info messages -->
+<ish-basket-info></ish-basket-info>
 
-    <!-- Validation messages-->
-    <ish-basket-validation-results></ish-basket-validation-results>
-  </div>
+<!-- Validation messages-->
+<ish-basket-validation-results></ish-basket-validation-results>
 
+<div class="empty-cart">
   <img class="empty-cart-icon" src="assets/img/empty-cart.png" alt="{{ 'shopping_cart.empty.alt.text' | translate }}" />
 
   <h2>{{ 'shopping_cart.empty.text' | translate }}</h2>

diff --git a/...p/shared/components/basket/basket-validation-items/basket-validation-items.component.html b/...p/shared/components/basket/basket-validation-items/basket-validation-items.component.html
@@ -16,9 +16,7 @@
         </div>
         <!---Product Description --->
         <div class="col-5 col-md-4 list-item">
-          <div class="product-title">
-            <a [routerLink]="product | ishProductRoute">{{ product.name }}</a>
-          </div>
+          <a [routerLink]="product | ishProductRoute">{{ product.name }}</a>
           <p class="product-id">{{ 'product.itemNumber.label' | translate }}&nbsp;{{ pli.productSKU }}</p>
 
           <!---Out of Stock --->

diff --git a/...ed/components/basket/basket-validation-products/basket-validation-products.component.html b/...ed/components/basket/basket-validation-products/basket-validation-products.component.html
@@ -19,9 +19,7 @@
             </div>
             <!---Product Description --->
             <div class="col-7 col-md-6 list-item">
-              <div class="product-title">
-                <a [routerLink]="product | ishProductRoute">{{ product.name }}</a>
-              </div>
+              <a [routerLink]="product | ishProductRoute" class="product-title">{{ product.name }}</a>
               <p class="product-id">{{ 'product.itemNumber.label' | translate }}&nbsp;{{ product.sku }}</p>
             </div>
 

diff --git a/src/styles/pages/checkout/shopping-cart.scss b/src/styles/pages/checkout/shopping-cart.scss
@@ -244,7 +244,7 @@
   border-bottom: $border-width-default solid $border-color-light;
 
   .empty-cart-icon {
-    padding: ($space-default * 7) 0 ($space-default * 2);
+    padding: ($space-default * 4) 0 ($space-default * 2);
   }
 
   h2 {