From 005218ee399d27e60ea3465dc0df24266c3aee24 Mon Sep 17 00:00:00 2001 From: chinmoy-eGov Date: Wed, 27 Mar 2024 17:41:16 +0530 Subject: [PATCH] CSS Changes --- .../packages/css/package.json | 4 +- .../css/src/components/CardBasedOptions.scss | 2 +- .../css/src/components/CitizenHomeCard.scss | 2 +- .../css/src/components/bannercomponents.scss | 1 - .../packages/css/src/components/card.scss | 26 +- .../packages/css/src/components/navbar.scss | 1 - .../css/src/components/textfields.scss | 4 - .../packages/css/src/index.scss | 24 -- .../css/src/pages/employee/inbox.scss | 12 +- .../css/src/pages/employee/index.scss | 372 ++++++------------ .../css/src/pages/employee/login.scss | 2 +- .../pages/employee/NewApplication/index.js | 6 - 12 files changed, 143 insertions(+), 313 deletions(-) diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json b/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json index 9d32cb4cf8d..8bbbd406544 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/package.json @@ -45,7 +45,7 @@ "postcss-prefixer": "2.1.3", "postcss-preset-env": "6.7.1", "postcss-scss": "3.0.5", - "sass": "1.49.11" + "sass": "^1.26.11" }, "files": [ "dist/index.min.css", @@ -62,4 +62,4 @@ "digit-ui", "css" ] -} +} \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss index b2f53f3233d..e1aee311792 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CardBasedOptions.scss @@ -108,4 +108,4 @@ background-size: cover .employeeCustomCard{ font-size: 1rem; } -} +} \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss index 392ff0a87d7..9bef88269e2 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/CitizenHomeCard.scss @@ -55,4 +55,4 @@ } } } -} +} \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss index 682f961cdfd..0839ab7acb4 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/bannercomponents.scss @@ -112,7 +112,6 @@ @apply flex justify-center items-center; height: calc(100vh - 80px); position: relative; - background: linear-gradient(rgba(11, 75, 102, 0.8), rgba(11, 75, 102, 0.8)), var(--banner-url) center center; .bannerCard { min-width: 400px; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/card.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/card.scss index e3dc9ef949c..0e57e8ae517 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/card.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/card.scss @@ -127,7 +127,7 @@ } } .employeeCard.fsm { - margin-bottom: 16px !important; + margin-bottom: 64px !important; margin-left: 0px !important; margin-right: 16px !important; } .header-wrap { @@ -168,6 +168,7 @@ .submit-bar-disabled { @apply h-10 bg-primary-main text-center w-full outline-none opacity-50; + background-color: #882636 !important; &:focus { @apply outline-none; @@ -175,6 +176,7 @@ header { @apply font-rc font-medium text-legend text-white leading-10; + line-height: 2rem !important; } } @@ -182,6 +184,8 @@ .submit-bar, .submit-bar-disabled { width: 240px; + background-color: #882636 !important; + height: 2rem !important } .card { @@ -334,7 +338,7 @@ } .home-page-info-banner-wrap { max-width: 45%; - min-width: 40%; + min-width: 100%; margin-left: 0; margin-right: 24px; margin-bottom: 24px; @@ -360,7 +364,7 @@ .BPAemployeeCard { margin-left: 0px !important; margin-right: 0px !important; - margin-bottom: 64px !important; + margin-bottom: 0px !important; } .employee-application-details { @@ -390,3 +394,19 @@ margin: 0 !important; width: 100% !important; } + +.language-selector .submit-bar, .submit-bar-disabled{ + background-color: #5a1166 !important; +} + +.owner-details{ + display: flex; + flex-direction: row; + width: 100%; + flex-wrap: wrap; + justify-content: space-between +} + +.owner-details-child{ + width: 50%; +} \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss index b9be29c5acf..a9a080f229e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/navbar.scss @@ -177,7 +177,6 @@ } .drawer-desktop { - overflow: auto; .menu-item { border: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss index 8ad8a8fb971..559f1dd6d1e 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/components/textfields.scss @@ -19,10 +19,6 @@ height: 2.0rem !important; @apply border-grey-dark text-grey-dark !important; pointer-events: none !important; } -.employee-card-input:disabled { - @apply border-grey-dark text-grey-dark !important; - pointer-events: none !important; -} .employee-card-input--front { width: fit-content !important; display: flex; diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/index.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/index.scss index 948ec7a9cef..175553744f7 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/index.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/index.scss @@ -766,27 +766,3 @@ min-height: calc(100vh - 8em); } } -.privacy-icon-2 { - cursor: pointer; -} -.privacy-icon-2:hover { - path { - fill: none; - } -} - -.audit-card { - width: 80%; - margin-left: -260px; - margin-right: -27%; - max-height: 120px; - margin-top: 90px; -} -.fsm-inline-style { - background: #fafafa; - border: 1px solid #d6d5d4; - border-radius: 4px; - padding: 16px; - margin-bottom: 40px; - width: 90%; -} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss index 7ebafcd5641..8ce1f48c1b7 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/inbox.scss @@ -29,10 +29,6 @@ @apply p-sm text-primary-main items-center; display: flex !important; color: #a82227 !important; - a{ - color: inherit; - text-decoration: inherit - } } .inbox-total { @@ -611,12 +607,6 @@ background-size: cover } - -.inboxLinksFSM { - margin: 0 !important; -} - - .plumber-details-new-value-wrapper { flex: 2 1 auto; } @@ -694,4 +684,4 @@ background-size: cover } } } -} \ No newline at end of file +} diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss index e54893761aa..c942f419a48 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/index.scss @@ -1,17 +1,14 @@ @import "./login.scss"; - /* TODO: convert using tailwind */ .employee { .breadcrumb { @apply ml-sm mb-lg; } - .ground-container { margin-bottom: 56px; margin-left: 0px; @apply flex flex-col; } - .card-home { font-size: 16px; padding: 0 0 16px 0; @@ -19,12 +16,10 @@ display: inline-block; margin: 8px auto; } - .home-action-cards { height: auto !important; min-height: 263px; } - .topbar { position: fixed; top: 0; @@ -72,63 +67,56 @@ padding-top: 88px; } - .submit-bar header { - height: 2rem !important; - line-height: 2rem !important; - } +.submit-bar header{ + height: 2rem !important; + line-height: 2rem !important; +} .loginContainer { padding-top: 88px; position: relative; } - .loginnn { - position: relative; - max-width: 100%; - width: 100%; - min-width: 100%; - } - - .loginnn .img { - position: absolute; - background-size: cover; - width: 100%; - max-width: 100%; - max-height: 100%; - } - - .logoNiua { - display: flex; - width: 100%; - position: absolute; - } - - .logoNiua .img { - width: 15%; - height: 15%; - } - - .upyogLogo { - width: 100% !important; - } - - .login-logo-wrapper { +.loginnn{ + position: relative; + max-width: 100%; + width: 100%; + min-width: 100%; +} +.loginnn .img{ + position: absolute; + background-size: cover; + width: 100%; + max-width: 100%; + max-height: 100%; +} +.logoNiua{ + display: flex; + width: 100%; + position: absolute; +} +.logoNiua .img{ + width: 15%; + height: 15%; +} +.upyogLogo{ + width: 100% !important; +} +.login-logo-wrapper{ min-width: 100%; height: 100%; position: absolute; display: flex; flex-direction: row; - } - - .loginConference { +} +.loginConference{ position: relative; height: 100%; width: 100%; font-weight: 700; - } - - .login-banner-wrapper { +} +.login-banner-wrapper{ position: relative; color: white; float: right; @@ -138,7 +126,7 @@ margin-right: 2%; text-align: right; font-family: none; - } +} .react-time-picker { width: 100%; @@ -168,32 +156,26 @@ padding-left: 8px; } } - -#login-conference-table { - position: absolute; - z-index: 1; - width: 36vw; - height: 62vh; - margin-top: 20vh; - margin-left: 2vw; +#login-conference-table{ + position:absolute; + z-index:1; + width:36vw; + height:62vh; + margin-top:20vh; + margin-left: 2vw; } - -.banner-slogan { +.banner-slogan{ padding-top: 10%; } - -.psuedo-banner span { +.psuedo-banner span{ color: #fdd049; -} - -.login-banner-wrapper .psuedo-banner { +} +.login-banner-wrapper .psuedo-banner{ font-size: 2.2rem; } - -.login-banner-wrapper .banner-slogan { +.login-banner-wrapper .banner-slogan{ font-size: 1.5rem; } - .citizen { .main { padding-top: 82px; @@ -201,7 +183,6 @@ display: flex !important; } } - .citizen, .employee { .sidebar { @@ -211,7 +192,6 @@ color: #ffffff; margin-top: 80px; z-index: 999; - background: #22394d; transition: 0.3s ease all; white-space: nowrap; height: calc(100vh - 36px); @@ -225,7 +205,6 @@ cursor: pointer; display: flex; align-items: center; - .tooltip { margin-left: 16px; } @@ -236,11 +215,9 @@ height: 24px; fill: #ffffff; } - a { display: flex; } - .sidebar-link { display: flex; color: #ffffff; @@ -248,28 +225,23 @@ align-items: center; padding: 20px; font-size: 14px; - &.active { color: #a82227 !important; border-right: 4px solid #a82227; - svg { fill: #a82227 !important; } } - .employee-search-input { border: none; outline: none; background-color: rgba(0, 0, 0, 0); margin-left: 13px; } - .custom-link { .tooltip { margin-left: 16px; - span { margin-left: unset !important; left: unset !important; @@ -288,25 +260,21 @@ background-color: #486480; cursor: pointer; - svg { fill: #a82227 !important; } } - .search-icon-wrapper { svg { fill: #ffffff !important; width: 21px; height: 21px; - path { fill: #ffffff !important; } } } } - .dropdown-link { height: 40px; display: flex; @@ -315,41 +283,34 @@ text-decoration: none; color: #ffffff; font-size: 14px; - .actions { .tooltiptext { left: unset; right: 1%; } } - svg { width: 20px; height: 20px; fill: #ffffff; } - &:hover { color: #fe7a51 !important; background-color: #486480; cursor: pointer; - svg { fill: #fe7a51 !important; } } - &.active { color: #a82227 !important; border-right: 4px solid #a82227; - svg { fill: #a82227 !important; } } } - span { margin-left: 16px; text-overflow: ellipsis; @@ -452,7 +413,6 @@ .sidebar { margin-top: 54px; min-width: 200px; - .actions { display: flex; align-items: center; @@ -469,27 +429,22 @@ } } -.RightMostTopBarOptions { +.RightMostTopBarOptions{ @apply flex float-right; display: flex; - - .EventNotificationWrapper { + .EventNotificationWrapper{ @apply relative cursor-pointer; - - span { + span{ top: -10px; right: -10px; @apply absolute bg-error h-5 w-5 rounded-full text-center; - p { line-height: 20px; } } } - .select-wrap { margin-bottom: unset; - svg { fill: #ffffff; } @@ -530,39 +485,33 @@ margin: auto !important; } -.mb-50 { +.mb-50{ margin-bottom: 50px; } - -.mb-25 { +.mb-25{ margin-bottom: 25px; } - @media (min-width: 640px) { .employee { .ground-container { margin-left: 0px !important; @apply block ml-md; } - .breadcrumb { @apply mb-lg; margin-left: 0; } - .card-home { width: 270px; margin-right: 10px; margin-bottom: 10px; } - .card-home-hrms { width: 405px; padding: 0px; margin-right: 16px; margin-bottom: 16px; } - .main { display: flex; flex-direction: column; @@ -570,7 +519,6 @@ margin-left: 64px; width: calc(100%-83px); } - .citizen-home-container { display: flex; flex-direction: unset !important; @@ -579,11 +527,9 @@ padding-top: 58px; } } - - #main-img { - content: url("https://in-egov-assets.s3.ap-south-1.amazonaws.com/images/employee-login.png"); - } - + #main-img{ + content:url("https://in-egov-assets.s3.ap-south-1.amazonaws.com/images/employee-login.png"); +} .citizen { .main { width: 100%; @@ -593,177 +539,87 @@ display: flex !important; } - .center-container {} + .center-container { + } } - + } -@media only screen and (max-width:950px) { - #main-img { - content: url("https://i.postimg.cc/9Q7jT6Dd/Banner-Image-2.png"); - } - - #login-conference-table { - position: relative; - z-index: 1; - width: 75%; - height: 115%; - margin: 12%; - margin-top: 25% - } - - .loginConference { +@media only screen and (max-width:950px){ + #main-img{ + content:url("https://i.postimg.cc/9Q7jT6Dd/Banner-Image-2.png"); + } + #login-conference-table{ + position:relative; + z-index:1; + width:75%; + height:115%; + margin:12%; + margin-top:25% +} +.loginConference{ position: absolute; height: 100%; width: 100%; font-weight: 700; display: flex; flex-direction: column; - } - - .employee .login-banner-wrapper { - padding-top: 0vh; - - } - - .psuedo-banner { - font-size: 4vw; - } - - .banner-slogan { - font-size: 3.5vw; - } } - -@media screen and (min-width:768) { - - #login-conference-table { - position: absolute; - z-index: 1; - width: 40%; - height: 30%; - margin: 12%; - margin-top: 25% - } +.employee .login-banner-wrapper{ + padding-top: 0vh; + +} +.psuedo-banner{ + font-size: 4vw; +} +.banner-slogan{ + font-size: 3.5vw; +} } -@media only screen and (max-width:500px) { - #main-img { - content: url("https://i.postimg.cc/9Q7jT6Dd/Banner-Image-2.png"); - } - - #login-conference-table { - position: relative; - z-index: 1; - width: 75%; - height: 80%; - margin: 12%; - margin-top: 25% - } +@media screen and (min-width:768){ - .loginConference { + #login-conference-table{ + position:absolute; + z-index:1; + width:40%; + height:30%; + margin:12%; + margin-top:25% +} +} +@media only screen and (max-width:500px){ + #main-img{ + content:url("https://i.postimg.cc/9Q7jT6Dd/Banner-Image-2.png"); + } + #login-conference-table{ + position:relative; + z-index:1; + width:75%; + height:80%; + margin:12%; + margin-top:25% +} +.loginConference{ position: absolute; height: 100%; width: 100%; font-weight: 700; display: flex; flex-direction: column; - } - - .employee .psuedo-banner { - font-size: 1.2rem; - } - - .employee .banner-slogan { - font-size: 0.8rem; - } -} - -@media only screen and (min-width:300px) { - .employee .card-home { - height: 220px; - box-shadow: #32325d14 0px 50px 100px -20px, rgb(0 0 0 / 18%) 0px 30px 60px -30px, #0a254038 0px -2px 6px 0px inset; - border-radius: 12px; - } -} - - -.fullWidth { - width: 100%; -} - -.multi-select-container { - .disposal-text { - @apply font-bold; - } - - .disposal-info { - @apply my-md ml-sm; - } - - .disposal-action-bar { - @apply flex justify-between items-center; - } } - -@screen dt { - .d-grid { - display: grid; - grid-template-columns: 250px 250px 250px 250px; - column-gap: 10px; - row-gap: 2px; - margin-left: -12px; - } -} - -.m-auto { - margin: auto !important; -} - -.mb-50 { - margin-bottom: 50px; +.employee .psuedo-banner{ + font-size: 1.2rem; } - -.mb-25 { - margin-bottom: 25px; +.employee .banner-slogan{ + font-size: 0.8rem; } - -.back-wrapper { - display: flex; - justify-content: space-between; - - .top-back-btn { - margin-bottom: 0px; - color: #ffffff; - margin-right: 1em; - - & svg { - fill: #ffffff; - } - } - - .hambuger-back-wrapper { - display: flex; - - @media (min-width: 780px) { - .hamburger-span { - display: none; - } - } - } } - -@screen dt { - .back-wrapper { - margin-right: 2rem; - margin-left: 2rem; - } +@media only screen and (min-width:300px) +{ +.employee .card-home{ +height: 220px; +box-shadow: #32325d14 0px 50px 100px -20px, rgb(0 0 0 / 18%) 0px 30px 60px -30px, #0a254038 0px -2px 6px 0px inset; +border-radius: 12px; } - -.user-profile { - @media (min-width: 780px) { - width: calc(100% - 219px); - margin-left: 16px; - margin-right: 16px; - } } \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss index a69df322721..6b8c5a8472d 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss +++ b/frontend/micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/login.scss @@ -257,4 +257,4 @@ background-color: white !important; } .employeeForgotPassword{ z-index: 2; -} +} \ No newline at end of file diff --git a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js index 55e93b754be..19eacec3f39 100644 --- a/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js +++ b/frontend/micro-ui/web/micro-ui-internals/packages/modules/fsm/src/pages/employee/NewApplication/index.js @@ -81,12 +81,6 @@ export const NewApplication = ({ parentUrl, heading }) => { } }; - // useEffect(() => { - // (async () => { - - // })(); - // }, [propertyType, subType, vehicle]); - const onSubmit = (data) => { const applicationChannel = data.channel; const sanitationtype = data?.pitType?.code;