@riosst100/pwa-marketplace 2.7.5 → 2.7.8

package/src/overwrites/venia-ui/lib/components/ProductFullDetail/productFullDetail.module.css

@@ -4,26 +4,36 @@
     composes: lg_items-start from global;
     composes: gap-x-10 from global;
 }
-
-@media (min-width: 1024px) {
-    .root {
-        grid-template-areas:
-            'left-container right-container';
-        grid-template-columns: minmax(0, 495px) minmax(0, 1fr);
-        grid-template-rows: repeat(5, min-content) 1fr [fold];
-    }
-
-    .title {
-        grid-template-columns: 1fr max-content;
-    }
+.productDetailsMaxContent{
+    background: linear-gradient(0deg,#fff 20px,#fff0);
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 30%;
+    content: "";
+}
+.rfqButton {
+  padding: 10px 0px;
+}
+.rfqButton span {
+  font-size: 14px;
+}
+.customAttributesList {
+    padding-left: 0 !important;
+    column-count: 2;
+    column-gap: 2rem;
+    list-style: none;
+}
+.contentContainerTabOverride {
+  max-width: none !important;
 }
-
 .section {
     composes: border-solid from global;
     composes: border-subtle from global;
     composes: border-t-0 from global;
     composes: border-r-0 from global;
-    composes: border-b from global;
+    composes: border-b-0 from global;
     composes: border-l-0 from global;
 }
 
@@ -35,7 +45,10 @@
     composes: mb-sm from global;
     composes: text-colorDefault from global;
 }
-
+:global(.root).makeOfferButton { 
+  padding-left: 0 !important;
+  padding-right: 0 !important;
+}
 .title {
     /* composes: section;
     composes: gap-2 from global;
@@ -47,6 +60,12 @@
     grid-area: title; */
 }
 
+.productDetailTabs {
+    border-bottom: 1px solid #d3d3d3;
+    padding-bottom: 10px;
+    margin-bottom: 15px;
+}
+
 .productName {
     composes: font-medium from global;
     composes: text-colorDefault from global;
@@ -74,6 +93,13 @@
 
 .options {
     grid-area: options;
+    border: none;
+}
+.options :global([class*="option"]) {
+  border-bottom: none !important;
+}
+.options {
+  border: none !important;
 }
 
 .formErrors {
@@ -145,16 +171,6 @@
     list-style: none;
 }
 
-@media (min-width: 1024px) {
-    .details {
-        align-self: stretch;
-        border-top-width: 1px;
-        margin: 0;
-        padding-left: 1.5rem;
-        padding-right: 1.5rem;
-    }
-}
-
 .detailsTitle {
     composes: sectionTitle;
 }
@@ -206,4 +222,36 @@
         flex-direction: column;
         row-gap: 16px;
     }
+}
+
+@media only screen and (min-width: 1025px) {
+    .root {
+        grid-template-areas:
+            'left-container right-container';
+        grid-template-columns: minmax(0, 500px) minmax(0, 1fr);
+        grid-template-rows: repeat(5, min-content) 1fr [fold];
+    }
+     .details {
+        align-self: stretch;
+        border-top-width: 1px;
+        margin: 0;
+        padding-left: 1.5rem;
+        padding-right: 1.5rem;
+    }
+    .title {
+        grid-template-columns: 1fr max-content;
+    }
+}
+@media only screen and (max-width: 1024px) {
+    .root {
+        grid-template-areas:
+            'left-container right-container';
+        grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
+        grid-template-rows: repeat(5, min-content) 1fr [fold];
+    }
+}
+@media (max-width: 769px) {
+    .leftContainer {
+        composes: max-w-[100%] from global;
+    }
 }

package/src/overwrites/venia-ui/lib/components/ProductImageCarousel/carousel.module.css

@@ -22,6 +22,7 @@
 }
 
 .imageContainer {
+    composes: h-full from global;
     composes: w-full from global;
     grid-area: 1 / 1 / 2 / 4;
 }
@@ -37,7 +38,7 @@
 }
 
 .carouselContainer {
-    composes: flex items-center justify-center p-4 bg-[#f7f7f8] rounded-md max-h-[660px] from global;
+    composes: flex items-center justify-center p-4 bg-[#f7f7f8] rounded-md h-[540px] max-h-[540px] from global;
 }
 
 .currentImage_placeholder {