@sc-360-v2/storefront-cms-library 0.3.58 → 0.3.60

package/dist/bulk-order-pad.scss

@@ -52,6 +52,7 @@
     text-align: center;
     border-block: 1px solid var(--_error-200);
     color: var(--_error-700);
+    margin-top: -1px;
   }
 
   .bulkOrderPad-grid {

package/dist/buyForHeaders.scss

@@ -764,8 +764,7 @@
             var(--_ctm-buy-dn-ee-ds-wr-my-ct-ct-is-ct-cr)
           )
         );
-        font-family:
-          var(
+        font-family: var(
             --_ctm-mob-buy-dn-ee-ds-wr-my-ct-ct-is-ct-ft-fy,
             var(
               --_ctm-tab-buy-dn-ee-ds-wr-my-ct-ct-is-ct-ft-fy,
@@ -913,8 +912,7 @@
           var(--_ctm-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-cr)
         )
       );
-      font-family:
-        var(
+      font-family: var(
           --_ctm-mob-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-ft-fy,
           var(
             --_ctm-tab-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-ft-fy,
@@ -980,8 +978,7 @@
             var(--_ctm-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-cr-dc)
           )
         );
-        font-family:
-          var(
+        font-family: var(
             --_ctm-mob-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-ft-fy-dc,
             var(
               --_ctm-tab-buy-dn-ee-ds-wr-my-ct-mi-ct-tt-ft-fy-dc,

package/dist/cart-details.scss

@@ -565,7 +565,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
             .product_code {
               display: flex;
               align-items: center;
-              gap: 6px;
               align-self: stretch;
               flex-wrap: wrap;
 
@@ -575,7 +574,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
                   content: "";
                   display: inline-block;
                   height: 10px;
-                  margin-inline: 8px;
+                  margin-inline: 12px;
                   width: 1px;
                   background-color: var(--_gray-400);
                 }

package/dist/cart-summary.scss

@@ -250,7 +250,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
               align-items: flex-start;
 
               .cart_summary_product_img {
-                width: 69px;
+                width: 80px;
                 height: 80px;
                 background-color: var(
                   --_ctm-mob-dn-pt-wt-pt-ie-bd-cr,
@@ -1268,6 +1268,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
       }
 
       .btn__with__text[data-btn-name="checkoutButton"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -1341,6 +1342,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
           var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ct-as-ct-dt-se-sw-cr));
 
         &[data-show-border="true"] {
+          width: 100%;
           border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-ct-as-ct-dt-se-br-cr));
 
           border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-ct-as-ct-dt-se-br-se));
@@ -1391,6 +1393,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         }
       }
       .btn__with__text[data-btn-name="placeOrder"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -1470,6 +1473,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
           var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ct-as-pe-or-dt-se-sw-cr));
 
         &[data-show-border="true"] {
+          width: 100%;
           border-color: var(
             --_sf-hr-br-cr,
             prepareMediaVariable(--_ctm-dn-ct-as-pe-or-dt-se-br-cr)
@@ -1532,6 +1536,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         }
       }
       .btn__with__text[data-btn-name="requestQuote"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -1673,6 +1678,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         }
       }
       .btn__with__text[data-btn-name="reviewOrder"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -1814,6 +1820,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         }
       }
       .btn__with__text[data-btn-name="createSubOrders"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -1974,6 +1981,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
         }
       }
       .btn__with__text[data-btn-name="submitQuote"] {
+        width: 100%;
         &[data-show-shadow="false"] {
           --_show-shadow: none;
         }
@@ -2053,6 +2061,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
           var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ct-as-st-qe-dt-se-sw-cr));
 
         &[data-show-border="true"] {
+          width: 100%;
           border-color: var(
             --_sf-hr-br-cr,
             prepareMediaVariable(--_ctm-dn-ct-as-st-qe-dt-se-br-cr)

package/dist/dropdownTemplate.scss

@@ -2,6 +2,13 @@
   display: grid;
   gap: 2px;
   width: 100%;
+  border: 1px solid var(--_gray-300);
+  background-color: var(--_base-white);
+  border-radius: 6px;
+  &:focus-within {
+    border: 1px solid var(--_primary-300);
+    outline: 2px solid var(--_primary-100);
+  }
 
   .dropdown-disabled {
     opacity: 0.6;
@@ -19,16 +26,22 @@
     display: flex;
     justify-content: space-between;
     padding: 0px 12px;
-    border: 1px solid var(--_gray-300);
-    background-color: var(--_base-white);
-    border-radius: 6px;
+
     width: 100%;
     align-items: center;
     height: 40px;
-    &:focus-within {
-      border: 1px solid var(--_primary-300);
-      outline: 2px solid var(--_primary-50);
-    }
+
+    // .dropdown-disabled {
+    //   opacity: 0.6;
+    //   pointer-events: none;
+    //   user-select: none;
+
+    //   input {
+    //     background-color: #f5f5f5;
+    //     cursor: not-allowed;
+    //   }
+    // }
+
     .dropdown-chips {
       display: flex;
       //   flex-wrap: wrap;
@@ -76,6 +89,17 @@
     .dropdown__icon {
       .icon {
         display: flex;
+        svg {
+          width: 16px;
+          height: 16px;
+        }
+        &.up,
+        &.down {
+          svg {
+            width: 18px !important;
+            height: 18px !important;
+          }
+        }
       }
       cursor: pointer;
       .icon svg {
@@ -88,15 +112,29 @@
     .dropdown__clear__icon {
       position: absolute;
       right: 32px;
+      .icon {
+        display: flex;
+        svg {
+          width: 16px;
+          height: 16px;
+        }
+        &.up,
+        &.down {
+          svg {
+            width: 18px !important;
+            height: 18px !important;
+          }
+        }
+      }
     }
     .dropdown-menu {
       position: absolute;
       width: 100%;
-      top: 40px;
+      top: 38px;
       left: 0px;
       right: 24px;
       background: white;
-      border: 1px solid #ddd;
+      border: 1px solid var(--_gray-100);
       border-radius: 6px;
       max-height: 200px;
       // overflow-y: auto;
@@ -107,6 +145,11 @@
       display: flex;
       flex-direction: column;
       // padding: 4px;
+      // &.uom_dropdown {
+      //   margin-left: -10px;
+      //   width: 303px !important;
+      //   max-height: 260px !important;
+      // }
 
       .dropdown_menu_ul {
         height: 200px;
@@ -176,13 +219,29 @@
           }
 
           .dropdown-item-details {
-            max-width: 80%;
+            max-width: 100%;
+            // width: 100%;
+            .item-name {
+              color: var(--_gray-900);
+            }
+            .item-code {
+              color: var(--_gray-600);
+            }
           }
         }
         .selected {
           background-color: var(--_primary-25);
           font-weight: normal;
-          color: var(--_primary-500);
+          color: var(--_primary-400);
+          .dropdown-item-details {
+            width: 70% !important;
+          }
+          .check_mark {
+            margin-left: auto;
+            svg path {
+              stroke: var(--_primary-400);
+            }
+          }
         }
       }
       .dropdown-group-li {
@@ -261,6 +320,14 @@
           align-items: center;
           justify-content: center;
           cursor: pointer;
+          .add_selected_options {
+            &:hover {
+              background-color: var(--_primary-25);
+              svg path {
+                stroke: var(--_primary-400);
+              }
+            }
+          }
           &:not(:last-child) {
             border-right: 1px solid var(--_gray-200);
           }
@@ -287,18 +354,22 @@
     .dropdown_template_panel_search {
       background: none;
       padding: 8px;
-      border-bottom: 1px solid #dddddd;
+      border-bottom: 1px solid var(--_gray-100);
       height: max-content !important;
       position: relative;
       &:hover {
         background: none !important;
       }
+
       input {
         width: 100%;
         padding-inline: 10px;
         border-radius: 4px;
         border: 1px solid var(--_gray-200);
         height: 40px;
+        &:focus {
+          border: 1px solid var(--_gray-300);
+        }
       }
       .close_btn {
         position: absolute;
@@ -307,12 +378,12 @@
         z-index: 10;
       }
     }
-  }
-  .dropdown-with-icon {
-    width: 100%;
-    // pointer-events: none;
-    border: none;
-    padding: 0;
+    .dropdown-with-icon {
+      width: 100%;
+      // pointer-events: none;
+      border: none;
+      padding: 0;
+    }
   }
 }
 // .dropdown-with-input-section.full-width {