fix(scss): pre-importing some component styles

[skip ci]
ecomplus · Apr 3, 2020 · db0f56c · db0f56c
1 parent cf0f3d5
commit db0f56c
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 62 deletions.
diff --git a/@ecomplus/storefront-template/template/scss/components/_product-card.scss b/@ecomplus/storefront-template/template/scss/components/_product-card.scss
@@ -1,38 +1,19 @@
-.product-card {
-  padding: 1rem;
-
-  a {
-    text-decoration: none;
-  }
+@import "@ecomplus/storefront-components/src/scss/APicture";
+@import "@ecomplus/storefront-components/src/scss/APrices";
+@import "@ecomplus/storefront-components/src/scss/ProductCard";
 
-  &__name {
-    margin-top: .5rem;
-    font-size: .88rem;
-    line-height: 1.2;
-    font-weight: 400;
-  }
-
-  &__pictures {
-    overflow: hidden;
+.product-card {
+  .spinner-border {
+    position: absolute;
+    bottom: var(--spacer-3);
+    right: var(--spacer-3);
+    opacity: 0;
+    color: var(--gray);
   }
 
-  &__picture,
-  &__picture img {
-    max-height: 250px;
-
-    @media (max-width: 575.98px) {
-      max-height: 180px;
+  &:hover {
+    .spinner-border {
+      opacity: .85;
     }
   }
-
-  &__info .spinner-border {
-    color: var(--gray);
-    opacity: .85;
-  }
-}
-
-.col > .product-card {
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: 0;
 }
diff --git a/@ecomplus/storefront-template/template/scss/components/_product.scss b/@ecomplus/storefront-template/template/scss/components/_product.scss
@@ -1,40 +1,13 @@
+@import "@ecomplus/storefront-components/src/scss/TheProduct";
+
 .product {
   &__picture {
-    width: 100%;
-    min-height: 10rem;
     text-align: center;
+    display: block;
 
     img {
       max-width: 100%;
       height: auto;
     }
   }
-
-  &__name {
-    margin-bottom: 1.5rem;
-  }
-
-  &__price {
-    font-size: 2.5rem;
-    color: var(--gray);
-  }
-
-  &__buy {
-    margin-top: 1.5rem;
-
-    @media (max-width: 575.98px) {
-      display: block;
-      width: 100%;
-    }
-  }
-
-  &__description,
-  &__specs {
-    margin-top: 2.5rem;
-    margin-bottom: 2.5rem;
-
-    .html-clearfix {
-      margin-top: 1.5rem;
-    }
-  }
 }
diff --git a/@ecomplus/storefront-template/template/scss/components/_products-carousel.scss b/@ecomplus/storefront-template/template/scss/components/_products-carousel.scss
@@ -43,4 +43,8 @@
       padding-right: 1rem;
     }
   }
+
+  &__item {
+    padding: var(--spacer-1);
+  }
 }