save

src/app/pages/agenda/view-event/view-event.page.html

@@ -12,10 +12,10 @@
               <ion-icon slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
             </button>
           </div>
-          <div class="middle d-flex align-center flex-grow-1">
-            <ion-label class="title">{{loadedEvent.Subject}}</ion-label>
+          <div class="middle">
+            <p class="title"><span>{{loadedEvent.Subject}}</span></p>
           </div>
-          <div class="menu-options d-flex align-base">
+          <div class="menu-options d-flex">
             <button class="btn-no-color" (click)="editEvent()">
               <ion-icon class="edit" slot="end" src="assets/images/icons-edit.svg" ></ion-icon>
             </button>

src/app/pages/agenda/view-event/view-event.page.scss

@@ -5,6 +5,7 @@ ion-content{
     --padding-start: 20px;
     --padding-end: 20px;
     font-size: 18px; */
+    overflow: auto;
 }
 ion-menu{
     --height: 225px;
@@ -14,15 +15,18 @@ ion-menu{
    --opacity: 1;
 }
   .main-header{
+    width: 100%; /* 400px */
     font-family: Roboto;
     background-color: #fff;
     color:#000;
     transform: translate3d(0, 1px, 0);
     
     .title-content{
+      width: 100% !important;
       margin: 0px auto;
-      overflow: auto;
+      padding: 0 !important;
       background: #fff;
+      overflow: auto;
 
       .left{
         width: 37px;
@@ -30,19 +34,29 @@ ion-menu{
         font-size: 35px;
       }
       .middle{
-          //width: 230px;
-          padding: 0!important;
-          float: left;
-          //margin: 2.5px 0 0 0;
+        width: calc(100% - 138.5px) !important;
+        padding: 0 !important;
+        float: left;
+        margin: 0 !important;
+        overflow: auto;
+
+        p{
+          margin: 0 !important;
         }
+      }
       .header-icon-right{
         width: 45px;
         font-size: 45px;
         float: right;
       }
       .menu-options{
+        width: fit-content;
+        height: fit-content;
+        align-items: flex-start;
+        justify-content: flex-start;
         float: right;
         padding: 1px;
+        margin-left: 15px;
       }
       .menu-options .edit{
         font-size: 35px;
@@ -64,6 +78,7 @@ ion-menu{
 
   }
   .main-content{
+    width: 100%;
     font-family: Roboto;
     background-color: #fff !important;
     border-top-left-radius: 25px;
@@ -77,15 +92,21 @@ ion-menu{
     }
 
     .upper-content{
-        margin-left: 50px;
-        overflow: auto;
-        font-size: 18px;
+      width: calc(100%-50px);
+      margin-left: 50px;
+      overflow: auto;
+      font-size: 18px;
       
         .content-location{
           width: 100%;
           margin: 0 auto;
           padding: 0;
           overflow: auto;
+
+          .date{
+            width: calc(100% - 105px);
+            float: left;
+          }
           
           .label{
             border-radius: 20px;
@@ -149,10 +170,14 @@ ion-menu{
         }
       }
       .line{
+        width: 100% !important;
         margin-top: 15px;
         border-top: 1px solid #d8d8d8;
       }
       .middle-conten{
+        width: 100% !important;
+        overflow: auto;
+
         .middle-content h3, .middle-content p{
           font-size: 16px;
         }