@licklist/design 0.58.6-dev.11 → 0.58.6-dev.3

package/src/styles/ryft-payment-form/RyftPaymentForm.scss

@@ -1,52 +1,10 @@
 .payment_link {
-  padding: 0 0 1rem 0;
-
-  .button-wrapper {
-    top: 2rem;
-    right: 2rem;
-    position: absolute;
-    z-index: 100;
-  }
-
   .page-body {
-    padding: 0;
-    height: calc(100vh - 2rem) !important;
-
-    .navigation {
-      display: block;
-      @include media-breakpoint-down(sm) {
-        padding: 0;
-      }
-    }
-
-    .right-block {
-      margin-left: 0;
-      height: calc(100vh - 2rem);
-      max-height: calc(100vh - 1rem);
-      @include media-breakpoint-down(sm) {
-        width: calc(100% - 2rem);
-        max-width: unset;
-        position: inherit;
-        overflow: visible;
-        margin: 0 1rem 1rem;
-        height: unset;
-        min-height: unset;
-        max-height: 100%;
-      }
-    }
-
     .left-block {
       .left-block-container {
         position: relative;
         max-height: 100%;
 
-        .payment-title {
-          font-size: 0.875rem;
-          font-weight: 600;
-          align-items: center;
-          margin-left: 0.5rem;
-        }
-
         .ryft-payment-form {
           .submit-button-wrapper {
             margin: -1rem 0 1rem;
@@ -55,55 +13,7 @@
               width: 100%;
             }
           }
-          #mobile-pay-divider-container {
-            display: flex;
-            position: relative;
-            margin-bottom: 1rem;
-            #mobile-pay-divider-text {
-              margin-right: 1rem;
-              font-size: 0.875rem;
-              font-weight: 600;
-            }
-            #mobile-pay-divider {
-              width: 100%;
-              border-bottom: 1px #dfdfdf solid;
-              margin-bottom: 0.6rem;
-            }
-          }
 
-          #card-title-container {
-            height: auto;
-            border: none;
-            margin-bottom: 0.5rem;
-            text-align: left;
-            :first-child {
-              font-size: 1rem;
-              font-weight: 600;
-              margin-bottom: 1rem;
-            }
-
-            .form-label {
-              margin-bottom: 0.5rem;
-            }
-          }
-          .mobile-pay-title {
-            display: block;
-            font-weight: 600;
-            font-size: 1rem;
-            color: black;
-            padding: 0;
-            font-style: normal;
-            font-family: inherit;
-            margin-bottom: 1rem;
-          }
-        }
-        .form {
-          .input {
-            border: 2px solid #525252 !important;
-          }
-        }
-
-        .ryft-payment-form {
           @include media-breakpoint-up(md) {
             .submit-button-wrapper {
               max-width: 15.5rem;
@@ -112,9 +22,10 @@
 
           // it's style for Google and Apple pay container, for unknown reasons we can't move this html elements with appendChild or replaceChild
           .ryft-pay-grid {
+            position: absolute !important;
+            top: 10rem;
             width: 100%;
             max-width: 15.5rem;
-            margin-bottom: 1rem;
           }
           .ryft-pay-apple-pay-button {
             border-radius: 0.25rem;
@@ -125,36 +36,6 @@
           display: none !important;
         }
       }
-      @include media-breakpoint-down(sm) {
-        .left-block-container {
-          max-height: 100%;
-          overflow: visible;
-        }
-      }
-    }
-
-    @include media-breakpoint-down(sm) {
-      flex-direction: column-reverse;
-      overflow: scroll;
-
-      @include media-breakpoint-down(sm) {
-        .left-block {
-          min-height: 100%;
-        }
-        .right-block {
-          margin: 0 auto;
-          width: 100%;
-          .children-wrapper {
-            .accordion {
-              .collapse {
-                overflow: visible;
-                overflow-x: unset;
-                scrollbar-width: unset;
-              }
-            }
-          }
-        }
-      }
     }
   }
   ::-webkit-scrollbar {
@@ -181,7 +62,3 @@
     }
   }
 }
-
-#ryft-threeDSMethodIframe {
-  display: none;
-}

package/dist/iframe/ryft/utils/ryft-form.d.ts

@@ -1,5 +0,0 @@
-import { TFunction } from "react-i18next";
-export declare const injectComponentsInRyftForm: ({ t, }: {
-    t: TFunction<string[]>;
-}) => void;
-//# sourceMappingURL=ryft-form.d.ts.map

package/dist/iframe/ryft/utils/ryft-form.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ryft-form.d.ts","sourceRoot":"","sources":["../../../../src/iframe/ryft/utils/ryft-form.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,eAAO,MAAM,0BAA0B;OAGlC,UAAU,MAAM,EAAE,CAAC;UAyCvB,CAAC"}

package/dist/iframe/ryft/utils/ryft-form.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.injectComponentsInRyftForm=function(e){var t=e.t,n=document.getElementById("ryft-pay-iframe"),i=document.getElementById("card-title-container");if(n&&!i){var r=document.createElement("div"),d=document.createElement("div"),a=document.createElement("div");a.id="card-title-container",r.textContent=t("Design:enterCardDetails"),d.className="bold-text form-label",d.innerText=t("Design:paymentDetails"),a.append(r,d),null==n||n.before(a);var o=document.getElementById("ryft-pay-grid");if(o){var m=document.createElement("div"),c=document.createElement("div"),l=document.createElement("div"),s=document.createElement("div");m.className="mobile-pay-title",m.innerText=t("Design:expressCheckoutWith"),c.id="mobile-pay-divider-text",c.innerText="or",l.id="mobile-pay-divider",s.id="mobile-pay-divider-container",s.append(c,l),o.before(m),o.after(s)}}};

package/src/iframe/ryft/utils/ryft-form.ts

@@ -1,47 +0,0 @@
-import { TFunction } from "react-i18next";
-
-export const injectComponentsInRyftForm = ({
-  t,
-}: {
-  t: TFunction<string[]>;
-}) => {
-  const cardContainer = document.getElementById("ryft-pay-iframe");
-  const oldCardDividerContainer = document.getElementById(
-    "card-title-container"
-  );
-
-  if (!cardContainer || oldCardDividerContainer) {
-    return;
-  }
-
-  const cardTitle = document.createElement("div");
-  const cardText = document.createElement("div");
-  const cardTitleContainer = document.createElement("div");
-  cardTitleContainer.id = "card-title-container";
-  cardTitle.textContent = t("Design:enterCardDetails");
-  cardText.className = "bold-text form-label";
-  cardText.innerText = t("Design:paymentDetails");
-  cardTitleContainer.append(cardTitle, cardText);
-  cardContainer?.before(cardTitleContainer);
-
-  const payGrid = document.getElementById("ryft-pay-grid");
-
-  if (!payGrid) {
-    return;
-  }
-
-  // Adding title and divider for apple and google pay button
-  const mobilePayTitle = document.createElement("div");
-  const dividerText = document.createElement("div");
-  const divider = document.createElement("div");
-  const container = document.createElement("div");
-  mobilePayTitle.className = "mobile-pay-title";
-  mobilePayTitle.innerText = t("Design:expressCheckoutWith");
-  dividerText.id = "mobile-pay-divider-text";
-  dividerText.innerText = "or";
-  divider.id = "mobile-pay-divider";
-  container.id = "mobile-pay-divider-container";
-  container.append(dividerText, divider);
-  payGrid.before(mobilePayTitle);
-  payGrid.after(container);
-};