datastake-daf 0.6.575 → 0.6.577

package/src/@daf/layouts/AuthLayout/style.js

@@ -1,418 +0,0 @@
-import styled from "styled-components";
-import { MOBILE_WIDTH, TABLET_WIDTH } from "datastake-daf/src/constants/Style";
-
-const Style = styled.div`
-  .errors-cont {
-    margin-top: var(--size-lg);
-
-    &.no-pt {
-      margin-top: 0px;
-    }
-  }
-
-  &.popup {
-    h2 {
-      font-size: 36px;
-      line-height: 44px;
-      color: #101828;
-      margin-bottom: 8px;
-    }
-
-    p {
-      color: #667085;
-      font-size: var(--font-size-lg);
-      line-height: var(--size-lg);
-      margin-bottom: 0;
-    }
-
-    .ant-btn-primary {
-      background-color: var(--color-primary-70) !important;
-    }
-  }
-  
-  display: flex;
-  flex-direction: column;
-  font-family: Outfit;
-  
-  @media(${TABLET_WIDTH}) {
-    max-height: 100dvh;
-    overflow-y: auto;
-  }
-
-  .category-understood {
-    margin-top: -4px;
-    background: #F9FAFB;
-    border-radius: 8px;
-    padding: 12px;
-
-    svg {
-      margin-bottom: 12px;
-    }
-
-    .paragraph {
-      display: flex;
-      gap: 13px;
-
-      svg {
-        color: #F79009;
-      }
-    }
-
-    p {
-      font-size: 14px;
-      line-height: 20px;
-      color: #6C737F;
-      font-weight: 400;
-      margin-bottom: 8px;
-      text-align: left;
-      margin-bottom: 8px;
-    }
-
-    .btn {
-      padding: 0;
-
-      span {
-        color: var(--mmt-primary-70);
-        font-size: 14px;
-        font-weight: 500;
-        margin-left: 30px;
-        cursor: pointer;
-      }
-    }
-  }
-
-  .main-cont {
-    flex: 1;
-    display: flex;
-    flex-direction: row;
-    justify-content: center;
-
-    @media (${TABLET_WIDTH}) {
-      flex-direction: column;
-      justify-content: flex-start;
-      gap: 48px;
-    }
-
-    .dots {
-      display: flex;
-      gap: 8px;
-      margin-top: 32px;
-
-      @media (${TABLET_WIDTH}) {
-        justify-content: center;
-      }
-
-      .dot {
-        width: 12px;
-        height: 12px;
-        background: white;
-        border-radius: 6px;
-        transition: .4s width, .4s background;
-
-        &.active {
-          width: 35px;
-          background: var(--mmt-primary-60);
-        }
-      }
-    }
-
-    .d-cont {
-      flex: 1;
-      display: flex;
-      flex-direction: column;
-
-      a {
-        color: var(--mmt-primary-70);
-      }
-
-      .main {
-        flex: 1;
-        width: 380px;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        margin-right: auto;
-
-        span {
-          font-size: 14px;
-        }
-
-        @media(${TABLET_WIDTH}) {
-          width: 100%;
-          margin-right: unset;
-          padding: 0px 10px;
-        }
-      }
-
-      &.left {
-        animation: .7s slideRight forwards;
-        height: 100dvh;
-        overflow-y: auto;
-        padding: 6rem 0;
-        padding-top: calc(6rem + 80px);
-
-        @media (${TABLET_WIDTH}) {
-          padding-top: calc(72px + 3rem);
-          padding-bottom: 3rem;
-          padding-left: 2.3rem;
-          padding-right: 2.3rem;
-          width: 100%;
-        }
-
-        @media (${MOBILE_WIDTH}) {
-          padding-top: 8.12rem;
-          padding-bottom: 3rem;
-        }
-
-        .left-header {
-          margin-bottom: 32px;
-
-          h2 {
-            font-size: 36px;
-            line-height: 44px;
-            color: #101828;
-            margin-bottom: 8px;
-          }
-
-          p {
-            color: #667085;
-            font-size: var(--font-size-lg);
-            line-height: var(--size-lg);
-            margin-bottom: 0;
-          }
-
-          img {
-            margin-bottom: 32px;
-            width: 136px;
-          }
-        }
-
-        .main {
-          margin-left: auto;
-          margin-right: auto;
-
-          @media(${TABLET_WIDTH}) {
-            width: unset;
-            margin-left: unset;
-            margin-right: unset;
-            padding: 0px;
-          }
-        }
-
-        @media(${TABLET_WIDTH}) {
-          height: unset;
-          overflow-y: hidden;
-        }
-      }
-
-      @media (${TABLET_WIDTH}) {
-        margin-left: auto;
-        margin-right: auto;
-        width: 100%;
-        flex: unset;
-      }
-
-      @media (max-width: 575px) {
-        .ant-form-item {
-          flex-direction: row !important;
-        }
-      }
-
-      @media (max-width: 500px) {
-        width: 100%;
-      }
-
-      &.right {
-        animation: .7s slideLeft forwards;
-        background-image: url('/assets/images/auth-bg-2.svg');
-        background-size: contain;
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        padding-top: 80px;
-
-        @media (${TABLET_WIDTH}) {
-          padding-top: 72px;
-        }
-
-        @media (${MOBILE_WIDTH}) {
-          padding-top: 5.12rem;
-        }
-
-        .right-img {
-          flex: 1;
-          background-position: center right;
-          background-repeat: no-repeat;
-          margin-left: 96px;
-          background-size: contain;
-          max-height: 700px;
-
-          &.default {
-            background-image: url('/assets/images/auth-bg.svg');
-          }
-        }
-
-        &.verified-user {
-          .right-img {
-            background-image: url('/assets/images/verified-user.svg');
-          }
-        }
-
-        @media (${TABLET_WIDTH}) {
-          display: none;
-        }
-      }
-
-      &.left {
-        .ant-form-item-required {
-          ::before {
-            content: unset;
-          }
-        }
-
-        .ant-input  {
-          padding: 10px 12px;
-          font-size: 14px;
-          font-weight: 400;
-          border: 1px solid #E5E7EB;
-          border-radius: 6px;
-        }
-
-        .ant-checkbox-wrapper + .ant-checkbox-wrapper {
-          margin-left: 0px;
-        }
-
-        .ant-checkbox-wrapper {
-          color: #344054;
-          font-size: 14px;
-          font-weight: 400;
-        }
-
-        .ant-select-selector {
-          padding: 4px 12px;
-          border-radius: 6px;
-          height: fit-content;
-          font-size: 14px;
-          border: 1px solid #E5E7EB;
-          font-weight: 400;
-          transition: 0s;
-
-          .ant-select-selection-item {
-            transition: 0s;
-          }
-
-          .ant-select-selection-search {
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-          }
-        }
-
-        .ant-input-affix-wrapper {
-          padding: 11px 14px;
-          border: 2px solid #F2FAFF;
-          border-radius: 8px;
-
-          .ant-input {
-            padding: 0;
-            border: unset;
-            border-radius: unset;
-          }
-
-          .ant-input-prefix {
-            margin-right: 10px;
-            color: #A4A4A4;
-          }
-        }
-
-        .buttons {
-          display: flex;
-          flex-direction: column;
-          margin-top: var(--size-lg);
-          gap: 12px;
-
-          .d-btn-cont {
-            flex: 1;
-          }
-        }
-
-        .bottom {
-          margin-top: 10px;
-          display: flex;
-          flex-direction: column;
-          gap: 4px;
-
-          p {
-            color: #667085;
-            font-size: 14px;
-            line-height: 20px;
-            margin-bottom: 0px;
-          }
-        }
-
-        form {
-          display: flex;
-          flex-direction: column;
-          gap: 10px;
-        }
-
-        .ant-row.ant-form-item {
-          margin-bottom: 0px;
-        }
-
-        .ant-form-item-label {
-          label {
-            color: #1F2A37;
-            font-size: 14px;
-            font-weight: 500;
-            line-height: 20px;
-          }
-        }
-
-      }
-    }
-  }
-
-  @keyframes slideLeft {
-    0% {transform: translate(-10%, 0%); opacity: 0;}
-    100% {transform: translate(0%, 0%); opacity: 1;}
-  }
-
-  @keyframes slideRight {
-    0% {transform: translate(10%, 0%); opacity: 0;}
-    100% {transform: translate(0%, 0%); opacity: 1;}
-  }
-
-  &.tif-layout {
-    .ant-btn {
-      &.ant-btn-primary {
-        background: #1E4F7C;
-        border-color: #1E4F7C;
-      }
-    }
-
-    .app-logo {
-      width: 230px !important;
-    }
-  }
-
-  &.sbg-layout {
-    .right-img {
-      background-position: center !important;
-      background-size: cover !important;
-      background-image: url('/assets/sbg-images/sbg-bg.png') !important;
-      max-height: 100% !important;
-      margin-left: 0 !important;
-    }
-
-    .ant-btn {
-      &.ant-btn-primary {
-        background: var(--color-primary-70);
-        border-color: var(--color-primary-70);
-      }
-    }
-  }
-`;
-
-export default Style;
-