@entit/digit-ui-css 1.5.6 → 2.0.0

package/src/pages/citizen/Events.scss

@@ -1,47 +1,47 @@
-.OnGroundEventDetailsCard{
-    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
-    @apply bg-white mx-sm mb-md p-md rounded;
-}
-
-.eventAddressAndDirection{
-    @apply text-body-s mb-md;
-    span{
-        @apply flex mb-sm;
-        svg{
-            @apply h-5 w-5;
-        }
-        div{
-            @apply ml-md;
-            p{
-                @apply mb-sm;
-            }
-            .direction{
-                @apply text-primary-main cursor-pointer;
-            }
-        }
-    }
-}
-
-.eventTimeRange{
-    @apply text-body-s flex;
-    svg{
-        @apply h-5 w-5;
-    }
-    p{
-        @apply ml-md;
-    }
-}
-
-.cardCaptionBodyS{
-    @apply text-body-s text-text-secondary mb-md;
-}
-
-@screen dt{
-    .eventAddressAndDirection{
-        @apply text-body-s-dt;
-    }
-
-    .cardCaptionBodyS{
-        @apply text-body-s-dt;
-    }
+.OnGroundEventDetailsCard{
+    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.16);
+    @apply bg-white mx-sm mb-md p-md rounded;
+}
+
+.eventAddressAndDirection{
+    @apply text-body-s mb-md;
+    span{
+        @apply flex mb-sm;
+        svg{
+            @apply h-5 w-5;
+        }
+        div{
+            @apply ml-md;
+            p{
+                @apply mb-sm;
+            }
+            .direction{
+                @apply text-primary-main cursor-pointer;
+            }
+        }
+    }
+}
+
+.eventTimeRange{
+    @apply text-body-s flex;
+    svg{
+        @apply h-5 w-5;
+    }
+    p{
+        @apply ml-md;
+    }
+}
+
+.cardCaptionBodyS{
+    @apply text-body-s text-text-secondary mb-md;
+}
+
+@screen dt{
+    .eventAddressAndDirection{
+        @apply text-body-s-dt;
+    }
+
+    .cardCaptionBodyS{
+        @apply text-body-s-dt;
+    }
 }

package/src/pages/citizen/HomePageWrapper.scss

@@ -1,99 +1,163 @@
-.HomePageWrapper{
-    margin-top: -25px;
-    .BannerWithSearch{
-        margin-bottom: 40px;
-        @apply relative;
-        .Search{
-            width: calc( 100% - 32px );
-            bottom: -18px;
-            @apply mx-md absolute;
-        }
-        img{
-            height: 33vw;
-            @apply w-full object-cover;
-        }
-    }
-
-    .ServicesSection{
-        @apply flex flex-wrap ;
-    }
-
-    .WhatsNewSection{
-        @apply m-sm;
-        .headSection{
-            @apply flex mb-sm justify-between;
-            h2{
-                @apply text-heading-s font-bold text-text-primary pl-sm; 
-            }
-            p{
-                @apply text-link text-primary-main font-medium;
-            }
-        }
-    }
-}
-
-.moduleLinkHomePage{
-    margin-top: -25px;
-    img{
-        height: 33vw;
-       
-        @apply w-full object-cover;
-    }
-    h1{
-        position: absolute;
-        top: 100px;
-        left: 21px;
-        @apply text-heading-xl text-white font-bold;
-    }
-    .moduleLinkHomePageBackButton{
-        border: none;
-        top: 76px;
-        svg{
-            fill: #ffffff;
-        }
-        @apply absolute text-white text-heading-s ml-md;
-    }
-}
-
-.moduleLinkHomePageModuleLinks{
-    @apply mt-md;
-    .CitizenHomeCard{
-        .header{
-            @apply hidden;
-        }
-    }
-}
-
-@screen dt{
-    .HomePageWrapper{
-        .BannerWithSearch{
-            margin-bottom: 56px;
-            min-width: 100vw;
-            margin-left: calc( -15vw - 16px );
-            .Search{
-                width: calc(70% - 32px);
-                left: calc( 15% + 25px );
-                margin: 0;
-            }
-            img{
-                height: 20vw;
-            }
-        }
-    }
-    .moduleLinkHomePage{
-        img{
-            min-width: 100vw;
-            margin-left: calc( -15vw - 16px );
-            height: 20vw;
-        }
-        h1{
-            top: calc( 10vw + 40px );
-            left: calc( 15% + 14px );
-            @apply ml-lg;
-        }
-        .moduleLinkHomePageBackButton{
-            top: calc( 10vw + 16px );
-            @apply ml-md;
-        }
-    }
-}
+.HomePageWrapper {
+  margin-top: -25px;
+
+  .BannerWithSearch {
+    margin-bottom: 40px;
+    width: 100%;
+    @apply relative;
+    .Search {
+      width: calc(100% - 32px);
+      bottom: -18px;
+      @apply mx-md absolute;
+    }
+    img {
+      height: 33vw;
+      @apply w-full object-cover;
+    }
+  }
+
+  .ServicesSection {
+    @apply flex flex-wrap;
+    padding: 40px 15px 0 15px;
+  }
+
+  @screen dt {
+    .ServicesSection {
+      @apply flex flex-wrap;
+      padding: 40px 15px 0 15px;
+      width: 100%;
+    }
+  }
+
+  .WhatsNewSection {
+    @apply m-sm;
+    padding: 0 15px;
+    .headSection {
+      @apply flex mb-sm justify-between;
+      h2 {
+        @apply text-heading-s font-bold text-text-primary pl-sm;
+      }
+      p {
+        @apply text-link text-primary-main font-medium cursor-pointer;
+      }
+    }
+    @media (min-width: 780px) {
+      padding: 0 15px;
+    }
+  }
+
+  .WhatsAppBanner{
+    width: 100%;
+    padding: 0px 20px 0px 20px;
+    margin: auto;
+    cursor: pointer;
+    img {
+      width: 100%;
+    }
+  }
+}
+
+@media (min-width: 780px) {
+  .SideBarStatic {
+    width: 219px;
+    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: 100% !important;
+    height: calc(100%-30px);
+  }
+}
+
+.moduleLinkHomePage {
+  @media (min-width: 780px) {
+    width: calc(100% - 219px);
+  }
+  margin-top: -25px;
+  img {
+    height: 33vw;
+    background: linear-gradient(#000000,#000000);
+    @apply w-full object-cover;
+  }
+  h1 {
+    position: absolute;
+    top: 100px;
+    left: 21px;
+    @apply text-heading-xl text-white font-bold;
+  }
+  .moduleLinkHomePageBackButton {
+    border: none;
+    top: 76px;
+    svg {
+      fill: #ffffff;
+    }
+    @apply absolute text-white text-heading-s ml-md;
+  }
+}
+
+.moduleLinkHomePageModuleLinks {
+  @apply mt-md;
+  .CitizenHomeCard {
+    .header {
+      @apply hidden;
+    }
+  }
+}
+
+@screen dt {
+  .HomePageWrapper {
+    width: 100%;
+    .BannerWithSearch {
+      margin-bottom: 56px;
+      width: 100% !important;
+      .Search {
+        width: 100%;
+        margin: 0;
+        padding: 0 15px 0 15px;
+      }
+      img {
+        height: 20vw;
+      }
+    }
+
+    .WhatsAppBanner {
+      width: 100%;
+      img{
+        height: 20vw;
+        width: 100%;
+      }
+    }
+
+  }
+  .moduleLinkHomePage {
+    img {
+      min-width: 100vw;
+      height: 20vw;
+    }
+    h1 {
+      top: calc(10vw + 40px);
+      left: 15.8rem;
+    }
+    .moduleLinkHomePageBackButton {
+      top: calc(10vw + 16px);
+      @apply ml-md;
+    }
+  }
+
+  .moduleLinkHomePageModuleLinks {
+    max-width: unset;
+    width:100%
+  }
+}

package/src/pages/citizen/SurveyList.scss

@@ -1,22 +1,22 @@
-.surveyListclockDiv{
-    @apply flex items-center my-lg;
-}
-.surveyListclockDiv span{
-    @apply pl-md text-text-primary;
-}
-.surveyListstatus{
-    @apply flex items-center justify-between;
-}
-.surveyLisNotResponded{
-    @apply text-error;
-}
-.surveyLisResponded{
-    @apply text-success;
-}
-.surveyListCardMargin{
-    @apply mx-md my-lg ;
-}
-.centered-message{
-    @apply flex items-center pl-md py-lg ;
-    
+.surveyListclockDiv{
+    @apply flex items-center my-lg;
+}
+.surveyListclockDiv span{
+    @apply pl-md text-text-primary;
+}
+.surveyListstatus{
+    @apply flex items-center justify-between;
+}
+.surveyLisNotResponded{
+    @apply text-error;
+}
+.surveyLisResponded{
+    @apply text-success;
+}
+.surveyListCardMargin{
+    @apply mx-md my-lg ;
+}
+.centered-message{
+    @apply flex items-center pl-md py-lg ;
+    
 }

package/src/pages/citizen/citizenDocument.scss

@@ -1,22 +1,22 @@
-.notice_and_circular_image svg {
-    width: 80px;
-    height: 100px;
-  }
-  .notice_and_circular_content {
-    padding-left: 50px;
-  }
-  .back-btn2{
-      border: none;
-  }
-  @media screen and (max-width: 768px) {
-    .notice_and_circular_image svg {
-      width: 53px;
-      height: 66px;
-    }
-    .notice_and_circular_content {
-      padding-left: 40px;
-    }
-    .documentContainerPadding{
-        padding: 0 10px;
-    }
+.notice_and_circular_image svg {
+    width: 80px;
+    height: 100px;
+  }
+  .notice_and_circular_content {
+    padding-left: 50px;
+  }
+  .back-btn2{
+      border: none;
+  }
+  @media screen and (max-width: 768px) {
+    .notice_and_circular_image svg {
+      width: 53px;
+      height: 66px;
+    }
+    .notice_and_circular_content {
+      padding-left: 40px;
+    }
+    .documentContainerPadding{
+        padding: 0 10px;
+    }
   }

package/src/pages/citizen/container.scss

@@ -1,19 +1,19 @@
-.citizen-home-footer {
-  @apply flex  w-full  h-10 bg-grey-bg pb-md pt-sm justify-center;
-  img {
-    @apply ml-sm;
-  }
-}
-
-.employee .citizen-home-footer {
-  @apply fixed bottom-0;
-}
-.fill-path-primary-main {
-  path {
-    fill: #f47738;
-  }
-}
-
-.obps-search {
-  margin: 8px;
-}
+.citizen-home-footer {
+  @apply flex  w-full  h-10 bg-grey-bg pb-md pt-sm justify-center;
+  img {
+    @apply ml-sm;
+  }
+}
+
+.employee .citizen-home-footer {
+  @apply fixed bottom-0;
+}
+.fill-path-primary-main {
+  path {
+    fill: #a82227;
+  }
+}
+
+.obps-search {
+  margin: 8px;
+}

package/src/pages/citizen/payment/payment-type.scss

@@ -1,3 +1,3 @@
-.payment-amount-info{
-    @apply flex justify-between;
+.payment-amount-info{
+    @apply flex justify-between;
 }

package/src/pages/citizen/updatePropertyNumber.scss

@@ -1,46 +1,46 @@
-.updatenumber-warper-citizen{
-  min-height: 95vh;
-  height: unset;
-}
-.updatePropertyNumber {
-  .pt-update-no-popup-wrapper {
-    @apply m-md;
-  }
-  .search-form-wrapper {
-    display: inherit;
-    padding: 16px;
-    .submit-bar {
-      position: absolute;
-      bottom: 25px;
-      width: 90%;
-    }
-    .submit-bar-disabled {
-      position: absolute;
-      bottom: 25px;
-      width: 90%;
-    }
-  }
-}
-
-@screen dt {
-  .updatenumber-warper-citizen{
-    min-height: 100vh;
-    height: unset;
-  }
-  .updatePropertyNumber {
-    .h1 {
-      @apply m-md;
-    }
-    .search-form-wrapper {
-      .submit-bar {
-        width: 100% !important;
-        position: unset !important;
-      }
-      .submit-bar-disabled {
-        position: absolute;
-        bottom: 25px;
-        width: 90%;
-      }
-    }
-  }
-}
+.updatenumber-warper-citizen{
+  min-height: 95vh;
+  height: unset;
+}
+.updatePropertyNumber {
+  .pt-update-no-popup-wrapper {
+    @apply m-md;
+  }
+  .search-form-wrapper {
+    display: inherit;
+    padding: 16px;
+    .submit-bar {
+      position: absolute;
+      bottom: 25px;
+      width: 90%;
+    }
+    .submit-bar-disabled {
+      position: absolute;
+      bottom: 25px;
+      width: 90%;
+    }
+  }
+}
+
+@screen dt {
+  .updatenumber-warper-citizen{
+    min-height: 100vh;
+    height: unset;
+  }
+  .updatePropertyNumber {
+    .h1 {
+      @apply m-md;
+    }
+    .search-form-wrapper {
+      .submit-bar {
+        width: 100% !important;
+        position: unset !important;
+      }
+      .submit-bar-disabled {
+        position: absolute;
+        bottom: 25px;
+        width: 90%;
+      }
+    }
+  }
+}

package/src/pages/employee/EmployeeLogin.scss

@@ -1,7 +1,7 @@
-.EmployeeLoginFooter{
-    margin: auto;
-    @apply absolute bottom-10;
-    img{
-        @apply h-4 object-contain;
-    }
+.EmployeeLoginFooter{
+    margin: auto;
+    @apply absolute bottom-10;
+    img{
+        @apply h-4 object-contain;
+    }
 }

package/src/pages/employee/cardfix.scss

@@ -1,13 +1,14 @@
-.flex-fit{
-    @apply flex w-full border-b border-solid border-border;
-    padding : 8px 10px;
-}
-.card-count{
-    @apply pr-xl;
-    div{
-        @apply text-link;
-        span{
-            @apply text-link font-bold;
-        }
-    }
+.flex-fit{
+    @apply flex w-full border-b border-solid border-border;
+    border-bottom: 0px !important;
+    padding-top: 5px
+}
+.card-count{
+    @apply pr-xl;
+    div{
+        @apply text-link;
+        span{
+            @apply text-link font-bold;
+        }
+    }
 }