datastake-daf 0.6.577 → 0.6.578

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

@@ -0,0 +1,423 @@
+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);
+
+        .left-logo img {
+            height: 46px;
+            margin-bottom: 40px;
+          }
+    
+        @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;
+

package/src/layouts.js

@@ -1 +1,3 @@
-export { default as AppLayout } from './@daf/layouts/AppLayout/index.jsx';
+export { default as AppLayout } from './@daf/layouts/AppLayout/index.jsx';
+export { default as AuthLayout } from './@daf/layouts/AuthLayout/index.jsx';
+export { default as AuthNavbar } from './@daf/layouts/AuthLayout/components/Navbar/index.jsx';

package/build/manifest.json

@@ -1,25 +0,0 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}

package/build/robots.txt

@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow: