@djb25/digit-ui-css 1.0.0 → 1.0.1

package/src/index.scss

@@ -81,7 +81,6 @@
 @import "./components/staticDynamicMessages.scss";
 @import "./components/toggleSwitch.scss";
 @import "./components/plusMinus.scss";
-@import "./components/financeUi.scss";
 @import "./components/landingpage.scss";
 
 @import "./pages/employee/index.scss";
@@ -108,30 +107,17 @@
 @import "./pages/citizen/updatePropertyNumber.scss";
 @import "./pages/citizen/citizenDocument.scss";
 @import "./pages/employee/surveys.scss";
-@import "./digitv2/index.scss";
-/* @import "./digitv2/typography.scss"; */
-@import "./components/inboxv2/index.scss";
-@import "./components//sidebar.scss";
 
 .display-none {
   display: none;
 }
-
+.primary-label-btn{
+  margin: 10px auto 0px !important;
+}
 .p-unset {
   padding: unset !important;
 }
 
-h1,
-h2,
-h3,
-h4,
-h5,
-h6 {
-  font-size: inherit;
-  font-weight: inherit;
-}
-
-
 .flex-one {
   @apply flex-1;
 }
@@ -139,7 +125,6 @@ h6 {
 .display-flex-gap-2 {
   @apply flex gap-3;
 }
-
 .rm-mb {
   margin-bottom: unset !important;
 }
@@ -192,24 +177,17 @@ h6 {
   @apply mb-sm;
 }
 
-.employeeCard {
-  /*  TODO need to revisit that we need mx-md NABEEL/ANIL
-   @apply mb-md mx-md !important;
-  */
-  @apply mb-md !important;
-}
-
 .home-link {
   margin-left: 16px;
   margin-bottom: 16px;
 
   a {
-    color: theme(colors.link.normal);
+    color: #1d70b8;
   }
 }
 
 .clear-search-label {
-  color: theme(colors.primary.main);
+  color: #a82227;
   cursor: pointer;
 }
 
@@ -222,7 +200,7 @@ h6 {
   @apply flex justify-between items-center;
 
   .download-button {
-    color: theme(colors.primary.main);
+    color: a82227;
     margin-left: 8px;
   }
 }
@@ -231,13 +209,15 @@ h6 {
   @apply flex mb-sm;
 
   .download-button {
-    color: theme(colors.primary.main);
+    color: #a82227;
     margin-left: 8px;
+    white-space: nowrap;
+
   }
 }
 
 .check-page-link-button {
-  color: theme(colors.primary.main) !important;
+  color: #a82227 !important;
 }
 
 .pt-application-download-btn {
@@ -251,7 +231,6 @@ h6 {
     position: unset;
   }
 }
-
 .application-table-container {
   @apply mt-lg ml-lg flex-1;
 }
@@ -261,10 +240,10 @@ h6 {
   gap: 10px;
 
   svg {
-    fill: theme(colors.primary.main);
+    fill: #a82227;
   }
 
-  color: theme(colors.primary.main);
+  color: #5a1166;
 
   cursor: pointer;
   font-weight: 500;
@@ -272,20 +251,7 @@ h6 {
 }
 
 .primaryColor {
-  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);
-}
-
-.hide-input-type-file {
-  position: absolute;
-  clip: rect(0, 0, 0, 0);
-  pointer-events: none !important;
+  color: #0b0c0c !important;
 }
 
 @media (hover: hover) {
@@ -318,17 +284,14 @@ input[readonly] {
 .react-time-picker {
   width: 194px;
   height: 2.5rem;
-
   &__wrapper {
-    border: 2px solid theme(colors.text.primary);
+    border: 2px solid #0b0c0c;
     padding-left: 16px;
   }
-
   &__inputGroup__input {
     @apply px-sm;
     line-height: 2.5rem;
     min-width: 16px;
-
     &:focus {
       outline: 2px solid black;
     }
@@ -345,12 +308,10 @@ input[type="number"]::-webkit-outer-spin-button {
   -webkit-appearance: none;
   margin: 0;
 }
-
 input[type="number"] {
   -moz-appearance: textfield;
 }
 
-
 .static {
   @apply flex flex-col;
   min-height: 85vh;
@@ -359,10 +320,8 @@ input[type="number"] {
     flex: 1;
     max-height: 75vh;
     overflow: scroll;
-    -ms-overflow-style: none;
-    /* IE and Edge */
-    scrollbar-width: none;
-    /* Firefox */
+    -ms-overflow-style: none; /* IE and Edge */
+    scrollbar-width: none; /* Firefox */
 
     &::-webkit-scrollbar {
       display: none;
@@ -430,7 +389,7 @@ input[type="number"] {
 
 .cheque-date {
   @apply flex items-center mb-lg;
-  border: 2px solid theme(colors.text.primary);
+  border: 2px solid #0b0c0c;
   border-radius: 2px;
 
   input {
@@ -455,7 +414,7 @@ input[type="number"] {
 
 .ifsc-field {
   @apply flex items-center mb-lg;
-  border: 2px solid theme(colors.text.primary);
+  border: 2px solid #0b0c0c;
   border-radius: 2px;
 
   input {
@@ -465,7 +424,6 @@ input[type="number"] {
     text-indent: 5px;
     padding: 6px 0px;
   }
-
   button {
     @apply outline-none;
     border: 0px;
@@ -476,11 +434,9 @@ input[type="number"] {
 
 .text-input {
   @apply relative w-full;
-
   input {
     &:hover {
-      --border-opacity: 1;
-      border: 1px solid #667eea;
+      @apply border-2 border-solid border-primary-main;
     }
   }
 }
@@ -550,10 +506,12 @@ input[type="number"] {
   width: 100% !important;
 }
 
-.edcr-citizen-inbox {
-  thead th:first-child {
-    min-width: 155px;
-  }
+
+.edcr-citizen-inbox{ 
+   thead th:first-child{
+  min-width:100px; 
+}
+
 }
 
 .error-boundary {
@@ -565,19 +523,17 @@ input[type="number"] {
   justify-content: center;
   align-items: center;
   flex-direction: column;
-
+  position: absolute !important;
   .error-container {
     display: flex;
     width: 400px;
     justify-content: center;
     align-items: center;
     flex-direction: column;
-
     h1 {
       font-size: 32px;
       font-weight: bold;
     }
-
     button {
       height: 40px;
       width: 153px;
@@ -585,7 +541,7 @@ input[type="number"] {
       padding: 8px 24px;
       color: white;
       cursor: pointer;
-      background-color: theme(colors.primary.main);
+      background-color: #a82227;
     }
   }
 }
@@ -603,17 +559,10 @@ input[type="number"] {
 .full-width-card {
   width: 92vw !important;
 }
-
 .full-employee-card-link {
   width: 100% !important;
   margin: 7px 0px;
-
-  a {
-    color: inherit;
-    text-decoration: inherit;
-  }
 }
-
 .full-employee-card-height {
   height: unset !important;
 }
@@ -622,18 +571,15 @@ input[type="number"] {
   .full-employee-card-height {
     height: 196px !important;
   }
-
   .full-employee-card-link {
     width: 30% !important;
   }
-
   .full-width-card {
     @apply w-full !important;
   }
 }
-
-.applications-list-container {}
-
+.applications-list-container {
+}
 .complaint-summary {
   @media (min-width: 780px) {
     flex: 1 0 auto;
@@ -652,7 +598,6 @@ input[type="number"] {
     padding-right: 16px;
   }
 }
-
 @media (min-width: 780px) {
   .citizen-card-container {
     padding-left: 15px;
@@ -662,9 +607,9 @@ input[type="number"] {
 }
 
 @media (min-width: 780px) {
-
   .citizen-obps-wrapper,
   .selection-card-wrapper,
+  .fsm-citizen-wrapper,
   .pgr-citizen-wrapper,
   .pt-citizen,
   .bill-citizen,
@@ -681,15 +626,12 @@ input[type="number"] {
     margin-top: 1rem;
   }
 }
-
 @media only screen and (max-width: 768px) {
-
   /* For mobile phones: */
   .error-boundary {
     height: 75vh;
   }
 }
-
 .employee-app-wrapper {
   min-height: calc(100vh - 8em);
 }
@@ -700,11 +642,9 @@ input[type="number"] {
     flex-direction: row-reverse !important;
     width: 100% !important;
     align-items: center;
-
     button {
       width: 240px !important;
     }
-
     p {
       width: unset;
       margin-right: 1rem;
@@ -729,7 +669,6 @@ input[type="number"] {
     padding-bottom: 8px;
     margin-bottom: 8px;
   }
-
   .row {
     color: #b1b4b6;
     font-weight: 700;
@@ -748,13 +687,11 @@ input[type="number"] {
 .connection-details-old-value-wrapper,
 .plumber-details-old-value-wrapper {
   flex: 1 1 auto;
-
   .old-value-null-wrapper {
     visibility: hidden;
     padding-bottom: 8px;
     margin-bottom: 8px;
   }
-
   .row {
     color: #b1b4b6;
     font-weight: 700;
@@ -766,39 +703,67 @@ input[type="number"] {
   padding: 1rem;
   font-weight: 400;
 }
-
 .modal-body-ws {
   padding: 1rem;
   font-weight: 700;
-  color: theme(colors.text.primary);
+  color: #0b0c0c;
   font-size: 24px;
   margin-bottom: 1rem;
 }
-
 .privacy-icon {
   cursor: pointer;
 }
-
 .privacy-icon:hover {
   path {
     fill: rgba(244, 119, 56, 1);
   }
 }
 
-.privacy-icon-2 {
-  cursor: pointer;
+.employee-app-wrapper{
+min-height: calc(100vh - 8em);
+}
+.submit-bar header{
+  line-height: 2.0rem !important;
+}
+.logo-removeBorderRadiusLogo svg{
+  width: 50px;
+  height: 60px;
 }
 
-.privacy-icon-2:hover {
-  path {
-    fill: none;
+.icon-banner-employee {
+    background-color:#d7aefc !important;
+}
+.icon-banner-employee svg{
+  background-color:#bf2f3b !important;
+  width: 40px;
+  height: 40px;
+}
+.inboxButton{
+    border: none;
+    color: white;
+    text-align: center;
+    text-decoration: none;
+    display: inline-block;
+    font-size: 14px;
+    margin: 4px 2px;
+    cursor: pointer;
+    height: fit-content;
+    border-radius: 5px;
+    font-family: sans-serif;
+    font-weight: 700;
+}
+.employee .inboxButton{
+  padding: 5px 15px;
+  background: #ba2b36
+}
+.citizen .inboxButton{
+  padding: 15px;
+  font-size: 1.2rem
+}
+
+@media screen and (max-width: 768px) {
+  .citizen .inboxButton{
+    font-size: 1rem;
   }
 }
 
-.audit-card {
-  width: 80%;
-  margin-left: -260px;
-  margin-right: -27%;
-  max-height: 120px;
-  margin-top: 90px;
-}

package/src/pages/citizen/DocumentList.scss

@@ -37,7 +37,7 @@
   padding: 1em 0em;
 }
 .document_list_searchbar {
-  border: 1px solid theme(colors.text.secondary) !important;
+  border: 1px solid #505A5F !important;
   border-radius: 0px !important;
   margin: 20px 0;
 }
@@ -67,7 +67,7 @@
   font-weight: normal;
   font-size: 12px;
   line-height: 24px;
-  color: theme(colors.text.secondary);
+  color: #505A5F;
   padding-right: 5px;
   padding-left: 15px;
   min-width: 80px;
@@ -81,7 +81,7 @@
   font-weight: normal;
   font-size: 12px;
   line-height: 14px;
-  color: theme(colors.text.secondary);
+  color: #505A5F;
 }
 .notice_and_circular_caption {
   margin-top: 10px;
@@ -109,7 +109,7 @@
         font-weight: normal;
         font-size: 16px;
         line-height: 19px;
-        color: theme(colors.primary.main);
+        color: #a82227;
       }
     }
   }
@@ -129,7 +129,7 @@
           font-weight: normal;
           font-size: 16px;
           line-height: 19px;
-          color: theme(colors.primary.main);
+          color: #a82227;
         }
       }
     }

package/src/pages/citizen/HomePageWrapper.scss

@@ -60,19 +60,23 @@
 @media (min-width: 780px) {
   .SideBarStatic {
     width: 219px;
-    background: theme(colors.white);
+    background: #ffffff;
+    margin-top: -24px;
   }
 }
-
 @media (max-width: 780px) {
   .SideBarStatic {
+    width: 219px;
+    background: #ffffff;
+    margin-top: -24px;
     display: none;
   }
 }
+
 .HomePageContainer {
   @media (min-width: 780px) {
     display: flex;
-    width: calc(100% - 219px);
+    width: 100% !important;
     height: calc(100%-30px);
   }
 }
@@ -84,7 +88,7 @@
   margin-top: -25px;
   img {
     height: 33vw;
-    filter: grayscale(100%);
+    background: linear-gradient(#000000,#000000);
     @apply w-full object-cover;
   }
   h1 {
@@ -97,7 +101,7 @@
     border: none;
     top: 76px;
     svg {
-      fill: theme(colors.white);
+      fill: #ffffff;
     }
     @apply absolute text-white text-heading-s ml-md;
   }
@@ -153,6 +157,7 @@
   }
 
   .moduleLinkHomePageModuleLinks {
-    width: 100%;
+    max-width: unset;
+    width:100%
   }
 }

package/src/pages/citizen/container.scss

@@ -10,7 +10,7 @@
 }
 .fill-path-primary-main {
   path {
-    fill: theme(colors.primary.main);
+    fill: #a82227;
   }
 }
 

package/src/pages/employee/cardfix.scss

@@ -1,6 +1,7 @@
 .flex-fit{
     @apply flex w-full border-b border-solid border-border;
-    padding : 8px 10px;
+    border-bottom: 0px !important;
+    padding-top: 5px
 }
 .card-count{
     @apply pr-xl;

package/src/pages/employee/container.scss

@@ -19,7 +19,7 @@
 }
 
 .employee-home-footer {
-  @apply flex h-10 pb-md pt-sm justify-center w-full;
+  @apply flex  h-10 bg-grey-bg pb-md pt-sm justify-center w-full;
   img {
     height: 100%;
   }
@@ -31,17 +31,17 @@
   }
 }
 .fieldInspectionWrapper{
-  border: 1px solid theme(colors.border);
+  border: 1px solid #d6d5d4;
   padding: 16px;
   margin-top: 8px;
-  background: theme(colors.grey.light);
+  background: #fafafa;
 }
 
 .fieldInsepctionInsideWrapper {
-  border: 1px solid theme(colors.border);
+  border: 1px solid #d6d5d4;
   padding: 16px;
   margin-top: 8px;
-  background: theme(colors.white);
+  background: #ffffff;
   max-width: 70%;
   min-width: 280px;
 }
@@ -49,7 +49,8 @@
 @screen dt {
   .ground-container {
     margin-bottom: 56px;
-    /* @apply p-md; */
+    
+    @apply p-md;
   }
   .heading-m {
     @apply text-heading-m-dt;
@@ -64,9 +65,9 @@
   .employee-home-footer {
   }
   .moduleCardWrapper {
-    /* @apply flex flex-row flex-wrap !important; */
+    @apply flex flex-row flex-wrap !important;
   }
   .gridModuleWrapper {
-    @apply grid grid-cols-4 gap-1;
+    @apply grid grid-cols-4 gap-4;
   }
 }