Merge branch '101-responsividade-da-pagina-de-mapas' into 'development'

Resolve "Responsividade da página de mapas"

Closes #101

See merge request !116

pinsisApp/src/app/hospital-selector/hospital-selector.component.scss

@@ -37,7 +37,7 @@
     bottom: 20px;
     left: 20px;
     right: 20px;
-    overflow: scroll;
+    overflow-y: scroll;
     margin: 0;
     padding: 0;
 
@@ -61,6 +61,7 @@
 	font-weight: bolder;
 	text-decoration: none;
 
+
 	&:hover {
 		cursor: pointer;
     background-color: $dark-purple;

pinsisApp/src/app/maps-page/maps-page.component.html

@@ -39,8 +39,13 @@
 
 
   <div class="row row-hospital-selector">
+    <div class="map-container">
+      <div class="map-frame">
+        <div id="map"></div>
+      </div>
+    </div>
 
-    <div class="col-12 col-md-4 hosp-col">
+    <div class="col-12 col-md-4">
       <button routerLink="/registro-hospital" class="register_button">
         Cadastrar novo hospital
       </button>
@@ -53,12 +58,6 @@
       </div>
     </div>
 
-    <div class="map-container">
-    <div class="map-frame">
-      <div id="map"></div>
-    </div>
-  </div>
-
 
   </div>
 

pinsisApp/src/app/maps-page/maps-page.component.scss

@@ -45,14 +45,11 @@
 	margin-left: auto;
 	margin-right: auto;
 	height: 285px;
-	max-height:600px;
-
-    overflow-y: scroll;
-    background-color: #ffffff;
+	max-height:285px;
+  background-color: #ffffff;
 }
 .row-hospital-selector{
 	height:600px;
-	overflow:hidden;
 }
 
 .hosp-col{
@@ -63,17 +60,14 @@
   .map-container {
 			margin-top: 10px;
 			width:92%;
-			max-height:400px;
+			height:400px;
+      margin-bottom: 10px;
   }
 	.hospital-selector{
-		max-height:600px;
+		height:400px;
 	}
 	.row-hospital-selector{
-		height:850px;
-		overflow:hidden;
-	}
-	.hosp-col{
-		max-height: 400px;
+		height:auto;
 	}
 }
 

pinsisApp/src/app/maps-page/maps-page.component.ts

@@ -141,7 +141,7 @@ export class MapsPageComponent implements AfterViewInit {
     };
     let x = document.getElementById("hospital-card")
     x.style.display = "block"
-    console.log(this.selectedHospital)
+    //console.log(this.selectedHospital)
   }
 
 

pinsisApp/src/app/register-hospital/register-hospital.component.scss

@@ -27,7 +27,6 @@ input {
   background-color: $white;
   border: 2px solid $text-dark;
   border-radius: 10px;
-
 }
 
 .input-text {
@@ -40,6 +39,11 @@ input {
   width: 45%;
   display: inline-block;
   margin-left: 3%;
+  
+  @media only screen and (max-width: $break-small) {
+    display: block;
+    width: 100%;
+  }
 }
 
 .submit-button {
@@ -60,6 +64,11 @@ input {
     text-decoration: none;
     background: $dark-purple;
   }
+  @media only screen and (max-width: $break-small) {
+    width: 90%;
+    margin-left: 5%;
+    margin-right: 5%;
+  }
 }
 
 .file-input {
@@ -83,6 +92,11 @@ input {
     background: $dark-purple;
   }
   
+  @media only screen and (max-width: $break-small) {
+    width: 90%;
+    margin-left: 5%;
+    margin-right: 5%;
+  }
 }
 
 .selected-image {
@@ -92,4 +106,10 @@ input {
   margin-top: 20px;
   margin-left: 20px;
 
+  @media only screen and (max-width: $break-small) {
+    width: 94%;
+    margin-left: 3%;
+    margin-right: 3%;
+    margin-bottom: 10px;
+  }
 }