@djb25/digit-ui-css 1.0.9 → 1.0.11

package/src/index.scss

@@ -28,7 +28,6 @@
 @import "./components/inputotp.scss";
 @import "./components/map.scss";
 @import "./pages/employee/tooltip.scss";
-@import "./components/menu.scss";
 @import "./components/submiterrors.scss";
 @import "./components/ratingstar.scss";
 @import "./components/keynote.scss";
@@ -90,6 +89,7 @@
 @import "./pages/employee/container.scss";
 @import "./pages/employee/inbox.scss";
 @import "./pages/employee/response.scss";
+@import "./pages/employee/ekyc.scss";
 @import "./pages/employee/form-fields.scss";
 @import "./pages/employee/scroll-table.scss";
 @import "./pages/employee/EmployeeLogin.scss";
@@ -205,12 +205,12 @@ h6 {
   margin-bottom: 16px;
 
   a {
-    color: theme("colors.link.normal");
+    color: theme(colors.link.normal);
   }
 }
 
 .clear-search-label {
-  color: theme("colors.primary.main");
+  color: theme(colors.primary.main);
   cursor: pointer;
 }
 
@@ -223,7 +223,7 @@ h6 {
   @apply flex justify-between items-center;
 
   .download-button {
-    color: theme("colors.primary.main");
+    color: theme(colors.primary.main);
     margin-left: 8px;
   }
 }
@@ -232,13 +232,13 @@ h6 {
   @apply flex mb-sm;
 
   .download-button {
-    color: theme("colors.primary.main");
+    color: theme(colors.primary.main);
     margin-left: 8px;
   }
 }
 
 .check-page-link-button {
-  color: theme("colors.primary.main") !important;
+  color: theme(colors.primary.main) !important;
 }
 
 .pt-application-download-btn {
@@ -262,10 +262,10 @@ h6 {
   gap: 10px;
 
   svg {
-    fill: theme("colors.primary.main");
+    fill: theme(colors.primary.main);
   }
 
-  color: theme("colors.primary.main");
+  color: theme(colors.primary.main);
 
   cursor: pointer;
   font-weight: 500;
@@ -273,14 +273,14 @@ h6 {
 }
 
 .primaryColor {
-  color: theme("colors.text.primary") !important;
+  color: theme(colors.text.primary) !important;
 }
 
 input[readonly] {
   @apply border-grey-dark !important;
-  background-color: theme("digitv2.lightTheme.background");
-  border-color: theme("digitv2.lightTheme.text-color-secondary");
-  color: theme("digitv2.lightTheme.text-color-secondary");
+  background-color: theme(digitv2.lightTheme.background);
+  border-color: theme(digitv2.lightTheme.text-color-secondary);
+  color: theme(digitv2.lightTheme.text-color-secondary);
 }
 
 .hide-input-type-file {
@@ -321,7 +321,7 @@ input[readonly] {
   height: 2.5rem;
 
   &__wrapper {
-    border: 2px solid theme("colors.text.primary");
+    border: 2px solid theme(colors.text.primary);
     padding-left: 16px;
   }
 
@@ -430,7 +430,7 @@ input[type="number"] {
 
 .cheque-date {
   @apply flex items-center mb-lg;
-  border: 2px solid theme("colors.text.primary");
+  border: 2px solid theme(colors.text.primary);
   border-radius: 2px;
 
   input {
@@ -455,7 +455,7 @@ input[type="number"] {
 
 .ifsc-field {
   @apply flex items-center mb-lg;
-  border: 2px solid theme("colors.text.primary");
+  border: 2px solid theme(colors.text.primary);
   border-radius: 2px;
 
   input {
@@ -585,7 +585,7 @@ input[type="number"] {
       padding: 8px 24px;
       color: white;
       cursor: pointer;
-      background-color: theme("colors.primary.main");
+      background-color: theme(colors.primary.main);
     }
   }
 }
@@ -695,8 +695,15 @@ input[type="number"] {
   }
 }
 
+.app-wrapper {
+  width: 100%;
+  flex: 1;
+  overflow-y: scroll;
+}
+
 .employee-app-wrapper {
   min-height: calc(100vh - 8em);
+  height: calc(100vh - 125px);
 }
 
 .ws-custom-wrapper {
@@ -775,7 +782,7 @@ input[type="number"] {
 .modal-body-ws {
   padding: 1rem;
   font-weight: 700;
-  color: theme("colors.text.primary");
+  color: theme(colors.text.primary);
   font-size: 24px;
   margin-bottom: 1rem;
 }
@@ -807,3 +814,25 @@ input[type="number"] {
   max-height: 120px;
   margin-top: 90px;
 }
+
+.flex-box {
+  display: flex;
+  width: 100%;
+  height: 100%;
+}
+
+.flex-box-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+}
+
+.bc-white {
+  background-color: #fff;
+}
+
+.round-medium {
+  border-radius: 6px;
+}

package/src/pages/citizen/DocumentList.scss

@@ -91,13 +91,13 @@
   font-weight: normal;
   font-size: 10px;
   line-height: 18px;
-  color: #A3A3A3;
+  color: #a3a3a3;
 }
 .view_download_main {
   display: flex;
   flex-wrap: wrap;
-  gap:8px;
-  align-items: end;
+  gap: 8px;
+  align-items: flex-end;
   span {
     padding-right: 20px;
     & .views {
@@ -113,13 +113,13 @@
       }
     }
   }
-  & .download_views_padding{
-      padding-top: 8px;
+  & .download_views_padding {
+    padding-top: 8px;
   }
 }
-@screen dt{
+@screen dt {
   .view_download_main {
-    span{
+    span {
       & .views {
         display: flex;
         justify-content: space-between;
@@ -138,11 +138,11 @@
   .notice_and_circular_heading_mb .card-caption {
     font-size: 16px;
     line-height: 24px;
-    min-width : 150px;
+    min-width: 150px;
     padding-left: 50px;
   }
 
-  .view_download_main span{
+  .view_download_main span {
     padding-right: 30px;
   }
   .view_download_main span .views p {
@@ -151,22 +151,21 @@
   }
   .notice_and_circular_text p {
     font-size: 16px !important;
-    line-height : 24px;
+    line-height: 24px;
   }
   .documentDetails_row {
     grid-gap: 0 !important;
     gap: 0 !important;
   }
-  .notice_and_circular_heading_mb header{
+  .notice_and_circular_heading_mb header {
     font-size: 24px !important;
     line-height: 28px;
-    margin-right : 100px;
+    margin-right: 100px;
   }
   .notice_and_circular_caption .card-caption {
     font-size: 14px;
     line-height: 21px;
   }
-  
 }
 .documentDetails {
   &_wrapper {
@@ -282,24 +281,24 @@
   text-overflow: ellipsis;
 }
 
-.Docs_CardWrapper{
+.Docs_CardWrapper {
   @apply bg-white m-sm px-md pt-md pb-lg shadow-card;
   border-radius: 4px;
 }
 
-.mobileInbox_attachments{
-  display:flex;
-  gap:10px;
+.mobileInbox_attachments {
+  display: flex;
+  gap: 10px;
 }
 
 .documentDetails_row_items {
-  display:flex;
+  display: flex;
   flex-direction: row;
   align-self: flex-start;
 }
 
-@media screen and (max-width : 768px){
-  .documentDetails_row_items{
+@media screen and (max-width: 768px) {
+  .documentDetails_row_items {
     @apply grid grid-cols-2 gap-4;
   }
-}
+}

package/src/pages/citizen/updatePropertyNumber.scss

@@ -1,4 +1,4 @@
-.updatenumber-warper-citizen{
+.updatenumber-warper-citizen {
   min-height: 95vh;
   height: unset;
 }
@@ -7,6 +7,7 @@
     @apply m-md;
   }
   .search-form-wrapper {
+    border-radius: 6px;
     display: inherit;
     padding: 16px;
     .submit-bar {
@@ -23,7 +24,7 @@
 }
 
 @screen dt {
-  .updatenumber-warper-citizen{
+  .updatenumber-warper-citizen {
     min-height: 100vh;
     height: unset;
   }

package/src/pages/employee/container.scss

@@ -31,7 +31,7 @@
   @apply flex fixed bottom-0 h-10 bg-grey-bg pb-md pt-sm justify-center w-full;
 
   img {
-    @apply ml-sm
+    @apply ml-sm;
   }
 }
 
@@ -52,12 +52,6 @@
 }
 
 @screen dt {
-  .ground-container {
-    margin-bottom: 56px;
-    padding-left: 0px;
-    /* @apply p-md; */
-  }
-
   .heading-m {
     @apply text-heading-m-dt;
   }
@@ -71,7 +65,8 @@
     margin-bottom: 40px;
   }
 
-  .employee-home-footer {}
+  .employee-home-footer {
+  }
 
   .moduleCardWrapper {
     /* @apply flex flex-row flex-wrap !important; */
@@ -80,4 +75,4 @@
   .gridModuleWrapper {
     @apply grid grid-cols-4 gap-1;
   }
-}
+}

package/src/pages/employee/ekyc.scss

@@ -0,0 +1,138 @@
+.ekyc-employee-container {
+    .inbox-main-container {
+        flex: 1;
+        padding-right: -24px;
+        background-color: #f4f7f9;
+    }
+
+    .inbox-wrapper {
+        min-width: 100%;
+        padding: 24px;
+        background-color: rgb(241 241 241);
+    }
+
+    .ekyc-header-container {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 24px;
+    }
+
+    .ekyc-status-container {
+        display: flex;
+        gap: 24px;
+        margin-bottom: 32px;
+    }
+
+    .ekyc-status-card {
+        flex: 1;
+        text-align: center;
+        padding: 24px;
+        border: 1px solid #EAECF0;
+        border-radius: 12px;
+        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
+
+        .count {
+            font-size: 32px;
+            font-weight: 700;
+            color: #101828;
+
+            &.pending {
+                color: #B54708;
+            }
+
+            &.completed {
+                color: #027A48;
+            }
+        }
+
+        .label {
+            color: #667085;
+            margin-top: 8px;
+            font-size: 14px;
+            font-weight: 500;
+        }
+    }
+
+    .ekyc-search-card {
+        margin-bottom: 24px;
+        padding: 20px;
+        background-color: #fff;
+    }
+
+    .ekyc-search-container {
+        flex: 1;
+
+        .search-inner {
+            padding: 0px;
+            background-color: #fff;
+            border: none;
+        }
+
+        .input-grid {
+            display: grid;
+            gap: 20px;
+            align-items: end;
+            grid-template-columns: repeat(auto-fill, minmax(700px, 1fr));
+        }
+
+        .submit-wrapper {
+            display: flex;
+            align-items: center;
+            gap: 20px;
+            height: 40px;
+        }
+    }
+
+    .ekyc-table-card {
+        padding: 0px;
+        overflow: hidden;
+    }
+
+    .ekyc-status-tag {
+        padding: 6px 12px;
+        border-radius: 20px;
+        font-size: 12px;
+        font-weight: 600;
+        text-transform: uppercase;
+
+        &.ALL {
+            background-color: #F4F4F4;
+            color: #505A5F;
+        }
+
+        &.COMPLETED {
+            background-color: #E7F4E9;
+            color: #0B6623;
+        }
+
+        &.PENDING {
+            background-color: #FFF5E6;
+            color: #945700;
+        }
+
+        &.REJECTED {
+            background-color: #FBEAE9;
+            color: #AF1E11;
+        }
+
+        &.DEFAULT {
+            background-color: #F4F4F4;
+            color: #505A5F;
+        }
+    }
+
+    .ekyc-metrics-section {
+        margin-bottom: 24px;
+    }
+
+    .ekyc-table-cell {
+        padding: 20px 18px;
+        font-size: 16px;
+    }
+
+    .ekyc-application-link {
+        font-weight: 600;
+        color: #F47738;
+    }
+}

package/src/pages/employee/inbox.scss

@@ -2,12 +2,15 @@
   /*  @apply bg-white; */
   /* border-radius: 4px; */
 
+  padding: 8px;
   .header {
     /* @apply flex items-center border-b border-border justify-between; */
-
+    display: flex;
     .logo {
-      width: 56px;
-      height: 56px;
+      display: flex;
+      align-items: center;
+      width: auto;
+      aspect-ratio: 1/1;
       @apply bg-focus;
       padding: 0px;
       border-radius: 4px;
@@ -34,7 +37,7 @@
 
       a {
         color: inherit;
-        text-decoration: inherit
+        text-decoration: inherit;
       }
     }
 
@@ -99,6 +102,7 @@
 
 .filter-form {
   .filter-card {
+    border-radius: 6px;
     @apply bg-white min-h-full;
     padding: 10px;
 
@@ -188,7 +192,8 @@
           }
         }
 
-        .mobile-input {}
+        .mobile-input {
+        }
       }
     }
   }
@@ -223,7 +228,7 @@
 
     .header {
       /* @apply flex items-center border-b border-border; */
-
+      display: flex;
       .logo {
         @apply bg-focus;
         padding: 0px;
@@ -249,15 +254,18 @@
 
   .inboxLinks {
     margin: 0 !important;
-    padding: 0 !important;
-
+    padding: 8px !important;
+    background: #fff;
+    border-radius: 6px;
     .header {
+      display: flex;
       border: none;
       @apply justify-start;
-
+      align-items: center;
       .logo {
         @apply bg-white;
-
+        display: flex;
+        align-items: center;
         svg {
           path {
             fill: theme(colors.primary.main);
@@ -418,7 +426,8 @@
         }
       }
 
-      .search-complaint-container-for-search {}
+      .search-complaint-container-for-search {
+      }
     }
   }
 }
@@ -632,4 +641,4 @@
       }
     }
   }
-}
+}

package/src/pages/employee/index.scss

@@ -8,8 +8,7 @@
 
   .ground-container {
     margin-bottom: 56px;
-    padding-inline: 30px;
-    /* @apply flex flex-col; */
+    /* @apply p-md; */
   }
 
   .card-home {
@@ -28,49 +27,6 @@
     box-shadow: 0px 6px 0 0px #764ba2;
   }
 
-  .topbar {
-    position: fixed;
-    top: 0;
-    width: 100%;
-    background: white;
-    box-shadow: rgba(0, 0, 0, 0.24) 0 1px 4px;
-    z-index: 9999;
-
-    .topbar-content {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      width: 100%;
-    }
-
-    img {
-      display: inline;
-
-      &.city {
-        height: 60px;
-      }
-
-      &.spect-icon {
-        width: auto;
-        max-height: 50px;
-      }
-
-      &.state {
-        height: 20px;
-        max-height: 20px;
-        width: auto;
-      }
-    }
-
-    .ulb {
-      font-weight: bold;
-    }
-
-    .right {
-      float: right;
-    }
-  }
-
   .main {
     padding-top: 88px;
   }
@@ -433,8 +389,6 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  padding-left: 30px;
-  padding-right: 30px;
   .header-top-section {
     display: flex;
     width: 100%;
@@ -456,7 +410,7 @@
 
     .subtitle {
       margin: 0;
-       font-size: 20px;
+      font-size: 20px;
       font-weight: 700;
       color: #0f172a;
     }
@@ -470,7 +424,7 @@
 
     display: flex;
     align-items: center;
-    justify-content: start;
+    justify-content: flex-start;
     color: #fff;
     box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
     font-size: 14px;
@@ -500,6 +454,18 @@
       padding-left: 20px;
     }
 
+    .breadcrumbs {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+    }
+
+    .extra-right-content {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+    }
+
     .left-section {
       display: flex;
       gap: 10px;
@@ -539,6 +505,7 @@
       display: flex;
       flex-direction: column;
       padding-top: 80px;
+      height: 100vh;
       /* margin-left: 72px; */
       /* width: calc(100%-83px); */
     }