@tattvafoundation/upyog-css 1.0.15 → 1.0.16

package/src/components/navbar.scss

@@ -8,12 +8,15 @@
     min-width: 78px;
     height: 24px;
   }
+
   .nav {
     display: flex;
     justify-content: space-between;
   }
+
   .nav-wrapper {
     display: flex;
+
     @media (min-width: 780px) {
       .hamburger-span {
         display: none;
@@ -36,7 +39,7 @@
   flex-direction: column;
   align-items: center;
   padding-top: 30px;
-  background-color: #ffffff;
+  background-color: transparent;
 
   img {
     width: 89px;
@@ -48,6 +51,7 @@
     .label-text {
       color: #767676;
     }
+
     &.name-Profile {
       .label-text {
         letter-spacing: 0.6px;
@@ -57,6 +61,7 @@
       }
     }
   }
+
   .profile-divider {
     border-top: 1px solid #d6d5d4;
     margin-left: 20px;
@@ -71,6 +76,7 @@
   position: relative;
   min-height: 1px;
   overflow: auto;
+
   .menu-item {
     border: 10px;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
@@ -87,6 +93,7 @@
     min-height: 48px;
     white-space: initial;
     background: none;
+
     .icon {
       display: block;
       color: rgb(117, 117, 117);
@@ -96,27 +103,33 @@
       float: left;
       margin-top: 12px;
     }
-    .edit-btn-ico{
+
+    .edit-btn-ico {
       height: 17px;
       width: 17px;
       margin-top: 16px;
     }
-    .icon + .menu-label {
+
+    .icon+.menu-label {
       margin-left: 36px;
       text-overflow: ellipsis;
       white-space: nowrap;
     }
   }
+
   .sidebar-list {
     padding-right: 16px;
     padding-left: 16px;
+
     &.active {
-      border-left: 5px solid #a82227;
+      border-left: 5px solid #d1b03f;
+
       .menu-label {
-        color: #a82227;
+        color: #d1b03f;
       }
+
       .icon {
-        fill: #a82227;
+        fill: #d1b03f;
       }
     }
 
@@ -124,10 +137,12 @@
       cursor: pointer;
       display: flex;
       flex-direction: column;
+
       .sidebar-link {
         display: flex;
         justify-content: space-between;
         align-items: center;
+
         svg {
           width: 21px;
           height: 21px;
@@ -135,6 +150,7 @@
           fill: rgb(117, 117, 117);
         }
       }
+
       .actions {
         display: flex;
         align-items: center;
@@ -148,6 +164,7 @@
           overflow: hidden;
           text-overflow: ellipsis;
         }
+
         input {
           border: none;
           outline: none;
@@ -163,12 +180,14 @@
     .actions {
       display: flex;
       padding: 1em;
+
       svg {
         width: 21px;
         height: 21px;
         color: rgb(117, 117, 117);
         fill: rgb(117, 117, 117);
       }
+
       span {
         color: #5f5c62;
       }
@@ -177,6 +196,13 @@
 }
 
 .drawer-desktop {
+  background-color: rgb(245, 234, 205);
+  position: fixed;
+  top: 0;
+  bottom: 0;
+  padding-top: 80px;
+  width: 190px;
+
   .menu-item {
     border: 10px;
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
@@ -193,6 +219,7 @@
     min-height: 48px;
     white-space: initial;
     background: none;
+
     .icon {
       display: block;
       color: rgb(117, 117, 117);
@@ -202,30 +229,36 @@
       float: left;
       margin-top: 12px;
     }
+
     .edit-btn-ico {
       height: 17px;
       width: 17px;
       margin-top: 16px;
     }
-    .icon + .menu-label {
+
+    .icon+.menu-label {
       margin-left: 36px;
       overflow: hidden;
       text-overflow: ellipsis;
       white-space: nowrap;
     }
   }
+
   @media (min-width: 780px) {
     .sidebar-list {
       padding-right: 16px;
       padding-left: 16px;
+
       &.active {
-        border-left: 5px solid #a82227;
+        border-left: 5px solid #d1b03f;
         padding-left: 11px;
+
         .menu-label {
-          color: #a82227;
+          color: #d1b03f;
         }
+
         .icon {
-          fill: #a82227;
+          fill: #d1b03f;
         }
       }
 
@@ -233,22 +266,26 @@
         cursor: pointer;
         display: flex;
         flex-direction: column;
+
         .sidebar-link {
           display: flex;
           justify-content: space-between;
           align-items: center;
+
           svg {
             width: 21px;
             height: 21px;
             color: rgb(117, 117, 117);
             fill: rgb(117, 117, 117);
           }
+
           .actions {
             .tooltip {
               margin-left: 16px;
             }
           }
         }
+
         .actions {
           display: flex;
           align-items: center;
@@ -270,12 +307,14 @@
       .actions {
         display: flex;
         padding: 1em;
+
         svg {
           width: 21px;
           height: 21px;
           color: rgb(117, 117, 117);
           fill: rgb(117, 117, 117);
         }
+
         span {
           color: #5f5c62;
         }
@@ -302,7 +341,8 @@
 
 .digit-footer {
   @apply flex h-4 mb-sm;
+
   img {
     @apply mr-sm;
   }
-}
+}

package/src/index.scss

@@ -771,7 +771,7 @@ input[type="number"] {
 }
 
 .icon-banner-employee svg {
-  background-color: #bf2f3b !important;
+  background-color: #d1b03f !important;
   width: 40px;
   height: 40px;
 }

package/src/pages/citizen/HomePageWrapper.scss

@@ -5,11 +5,13 @@
     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;
@@ -19,6 +21,8 @@
   .ServicesSection {
     @apply flex flex-wrap;
     padding: 40px 15px 0 15px;
+    width: 100% !important;
+    float: left !important;
   }
 
   @screen dt {
@@ -32,25 +36,31 @@
   .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{
+  .WhatsAppBanner {
     width: 100%;
     padding: 0px 20px 0px 20px;
     margin: auto;
     cursor: pointer;
+    clear: both;
+
     img {
       width: 100%;
     }
@@ -60,10 +70,11 @@
 @media (min-width: 780px) {
   .SideBarStatic {
     width: 219px;
-    background: #ffffff;
+    background: transparent;
     margin-top: -24px;
   }
 }
+
 @media (max-width: 780px) {
   .SideBarStatic {
     width: 219px;
@@ -85,30 +96,37 @@
   @media (min-width: 780px) {
     width: calc(100% - 219px);
   }
+
   margin-top: -25px;
+
   img {
     height: 33vw;
-    background: linear-gradient(#000000,#000000);
+    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;
@@ -119,14 +137,17 @@
 @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;
       }
@@ -134,22 +155,26 @@
 
     .WhatsAppBanner {
       width: 100%;
-      img{
+
+      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;
@@ -158,6 +183,6 @@
 
   .moduleLinkHomePageModuleLinks {
     max-width: unset;
-    width:100%
+    width: 100%
   }
-}
+}