Merge pull request #537 from Madhuravas/develop

MOSIP-27668 changed input fields position in reg centers page.
mosip · Oct 19, 2023 · ddbfea8 · ddbfea8
2 parents deab033 + 06d0934
commit ddbfea8
Show file tree

Hide file tree

Showing 11 changed files with 202 additions and 257 deletions.
diff --git a/resident-ui/src/app/feature/booking/center-selection/center-selection.component.css b/resident-ui/src/app/feature/booking/center-selection/center-selection.component.css
@@ -1,53 +1,3 @@
-/* .expansionPanelPlacer{
-    margin: 30px 30px;
-    padding: 15px 15px;
-}
-
-.spacer{
-    margin: 15px 0 0 0;
-}
-
-.inlineSpacer{
-    margin: 0 35px 0 0;
-}
-
-.right-align{
-    text-align: right;
-}
-
-.img-spacer{
-    margin: 0 0 0 -6px;
-    cursor: pointer;
-}
-
-.hyperlink{
-    color: blue;
-    text-decoration: underline;
-    cursor: pointer;
-}
-
-.map-placer{
-    position: relative;
-}
-
-@media(max-width: 500px) {
-    .expansionPanelPlacer{
-        padding: 0;
-        margin: 5px;
-    }
-}
-
-@media(max-width: 765px) {
-
-    .mat-table {
-        overflow: auto;
-      }
-
-    .mat-header-row, .mat-row {
-        min-width: 1000px;
-      }
-} */
-
 .details-main-card{
   display: flex;
   justify-content: center;
@@ -57,12 +7,11 @@
   background-color: transparent;
   color: #03A64A;
   font-weight: 700;
-  /* border-bottom-color: #03A64A !important; */
 }
 
 .details-card {
   width: 100%;
-  height: 750px;
+  height: 770px;
   background: #FFFFFF 0% 0% no-repeat padding-box;
   box-shadow: 0px 0px 5px #00000014;
   border-radius: 10px;
@@ -78,6 +27,7 @@
   display: flex;
 }
 
+
 mat-card {
   border-radius: 10px !important;
 }
@@ -99,6 +49,7 @@ mat-card {
 
 .center_selection-wrapper {
   margin: 5px 0vw;
+  width: 100%;
 }
 
 .center-selection__title-card {
@@ -131,17 +82,15 @@ section {
 
 .centers-wrapper {
   margin-left: 0px;
-  margin-right: 2vw;
-  width: 30%;
+  /* margin-right: 2vw; */
+  width: 100%;
   height: 40rem;
 }
 
 .centers-list ul {
   list-style-type: none;
   padding: 0%;
   font-size: 0.65rem;
-  display: flex;
-  flex-direction: column;
   row-gap: 10px;
   border: 2px solid #BCBCBC;
   border-radius: 3px;
@@ -158,10 +107,6 @@ section {
   border-bottom: none !important;
 }
 
-/* .center-card-selected {
-  border: 1px solid #fd518c;
-} */
-
 input[type="radio"] {
   -ms-transform: scale(1.5);
   -webkit-transform: scale(1.5);
@@ -171,16 +116,19 @@ input[type="radio"] {
 }
 
 .map {
-  width: 63%;
+  width: 70%;
   display: flex;
 }
 
 .container {
-  display: flex;
-  margin-bottom: 60px;
+  display: flex; 
   height: 100%;
 }
 
+.horizontal-line{
+  background-color: #D3D3D3;
+}
+
 .center-selection__button-container {
   width: 100%;
   position: fixed;
@@ -216,7 +164,6 @@ input[type="radio"] {
   border-radius: 5px;
   padding: 0 10px 0 10px;
   height: 40px;
-  /* font-weight: 600; */
   background-color: #ffffff;
 }
 .show-message-text{
@@ -249,19 +196,26 @@ input[type="radio"] {
 
 .search-btn {
   width: 36px;
-  height: 36px;
+  height: 40px;
   background-color: #03A64A;
   border: none;
   border-radius: 5px;
-  margin: 1.3rem 0 0 12px;
 }
 
-.download-btn{
-  margin: 1.3rem 0 0 0;
+.save-icon{
+  height: 40px;
 }
 
 .center_selection-form-container {
-  animation: 1.3s anim ease-out;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 10%;
+}
+
+.center-search-sub-card{
+  display: flex;
+  align-items: center;
 }
 
 @keyframes anim {
@@ -315,7 +269,6 @@ input[type="radio"] {
   border-radius: 4px !important;
   height: 40px;
   width: 40%;
-  margin-top: 7px;
   outline: none;
 }
 
@@ -331,57 +284,56 @@ input[type="radio"] {
 }
 
 .search-card {
-  width: 50%;
+  width: 200px;
   height: 40px;
   padding: 0;
   box-shadow: 4px black;
   border-radius: 4px !important;
-  margin-top: 10px;
   display: inline-flex;
   display: inline-flex;
   padding: 7px;
   margin-left: 5px;
   border: 2px solid #707070;
-  margin-top: 1.2rem !important;
 }
 
-.mat-card {
-  display: inline-flex;
-}
 
 .search-form {
   display: flex;
-  /* flex-wrap: wrap; */
   align-items: center;
   justify-content: center;
 }
+
 .search-form-card{
-  padding-bottom: 20px;
-  margin-left: -5px;
+  display: flex;
+  align-items: center;
+  margin-top: 2px;
 }
 
 .warning-message{
   margin: 0px; 
   color: red; 
   font-size: 10px;
-  margin-left: 7px;
+  margin-top: -8px;
+}
+::ng-deep .mat-select-panel {
+  margin-top: 38px !important;
+  min-width: 100% !important;
+  margin-left: 15px;
 }
 
 .pagination{
-  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
+  box-shadow: 0px 3px 10px #00000029;
 }
 
 .centers-list {
-  height: 67%;
   overflow: auto;
-  margin-bottom: 4px;
+  height: 78%;
+  margin-bottom: 5px;
 }
 
-/* @media screen and (max-width:1320px) {
-  .centers-list{
-    height: 28rem;
-  }
-} */
+.centers-details-card{
+  margin: 6px 5px 0 5px;
+}
 
 /* width */
 ::-webkit-scrollbar {
@@ -390,7 +342,6 @@ input[type="radio"] {
 
 /* Track */
 ::-webkit-scrollbar-track {
-  /* box-shadow: inset 0 0 5px grey; */
   border-radius: 10px;
 }
 
@@ -405,6 +356,12 @@ input[type="radio"] {
   background: silver;
 }
 
+.or-text{
+  color: #BCBCBC;
+  font-size: 13px;
+  font-weight: 600;
+}
+
 @media (max-width: 500px) {
 
   .user-back-btn,
@@ -419,6 +376,7 @@ input[type="radio"] {
     display: flex;
     padding: 0px 1rem 0px 2rem;
     height: 100%;
+    width: 100%;
   }
 
   .centers-wrapper {
@@ -436,7 +394,7 @@ input[type="radio"] {
 
 .mat-select {
   display: inline-block;
-  height: 38px !important;
+  height: 40px !important;
   border: 1px solid black;
   width: 160px;
   outline: #909090 solid 1px!important;
@@ -448,15 +406,7 @@ input[type="radio"] {
   padding-top: 9px !important;
 }
 
-/* ::ng-deep .mat-menu-panel.locationType-card {
-  width: 150px !important;
-  height: auto !important;
-} */
-
-/* ::ng-deep .cdk-overlay-connected-position-bounding-box{
-  right: auto !important;
-}  */
-
+/* 
 ::ng-deep #cdk-overlay-0{
   right: auto !important;
 } 
@@ -467,4 +417,4 @@ input[type="radio"] {
 
 ::ng-deep #cdk-overlay-3{
   right: auto !important;
-} 
+}  */