several improvements

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

@@ -10,7 +10,7 @@
         </div>
         <div class="div-icon">
           <ion-icon class="edit" (click)="editEvent()" slot="end" src="assets/images/icons-edit.svg" ></ion-icon>
-          <ion-icon class="delete" (click)="deleteEvent()" name="trash-sharp"></ion-icon>
+          <ion-icon class="delete" (click)="deleteEvent()" name="trash-sharp"></ion-icon> 
         </div>
       </div>
     </div>
@@ -24,8 +24,8 @@
         <div class="location-detail">
           <ion-label >{{loadedEvent.Location}}</ion-label>
         </div>
-        <div class="button-calendar-type">
-          <ion-button  class="button-calendar-type" slot="end">{{loadedEvent.CalendarName}}</ion-button>
+        <div class="button-{{profile}}-{{loadedEvent.CalendarName}}">
+          <ion-button  class="button-{{profile}}-{{loadedEvent.CalendarName}}" slot="end">{{loadedEvent.CalendarName}}</ion-button>
         </div>
       </div>
       <div class="content-details">

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

@@ -38,7 +38,7 @@ ion-menu{
         overflow: hidden;
       }
       .middle{
-          width: 220px;
+          width: 230px;
           padding: 0!important;
           float: left;
           margin: 2.5px 0 0 0;
@@ -57,8 +57,7 @@ ion-menu{
       }
       .div-icon .edit{
         font-size: 35px;
-        float: right;
-        padding-left: 20px;
+        float: left;
       }
       .div-icon .delete{
         padding: 7px;
@@ -66,6 +65,7 @@ ion-menu{
         color:#fff;
         background: #d30606;
         border-radius: 20px;
+        margin-left: 10px;
       }
     }
 
@@ -102,13 +102,37 @@ ion-menu{
           float: left;
           margin: 5px 5px 5px 0px;
         }
-        .button-calendar-type{
+        .button-mdgpr-Oficial{
             width: 91px;
-            --border-radius: 12.5px;
+            --border-radius: 20px;
             --background: #ffb703;
             margin-left: 5px;
             float: left;
         }
+        .button-mdgpr-Pessoal{
+          width: 91px;
+          --border-radius: 20px;
+          --background: #f05d5e;
+          margin-left: 5px;
+          float: left;
+        }
+
+        .button-pr-Oficial{
+          width: 91px;
+          --border-radius: 20px;
+          --background: #cbeecb;
+          margin-left: 5px;
+          float: left;
+      }
+      .button-pr-Pessoal{
+        width: 91px;
+        --border-radius: 20px;
+        --background: #cab0dc;
+        margin-left: 5px;
+        float: left;
+      }
+
+
         .button-calendar-type ion-button{
           height: 25px;
         }

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

@@ -41,6 +41,7 @@ export class ViewEventPage implements OnInit {
     public alertController: AlertController,
   ) 
   {
+    this.profile = this.navParams.get('profile');
     this.isEventEdited = false;
     this.loadedEvent = new Event();
     this.eventBody = { BodyType : "1", Text : ""};

src/app/pages/events/events.page.html

@@ -37,7 +37,7 @@
         <div class="content">
           <ul>
             <li *ngFor="let event of eventsList"
-            [routerLink]="['/home/events', event.EventId, 'events']">
+            (click)="viewEventDetail(event.EventId)">
             <div class="d-flex  content-{{profile}}-{{event.CalendarName}}">
               <div class="schedule-time">
                 <div class="time-start">{{event.StartDate | date: 'hh:mm'}}</div>

src/app/pages/events/events.page.scss

@@ -296,6 +296,7 @@ ion-toolbar{
   text-align: center;
   color: var(--white);
   line-height: unset;
+  margin-top: 10px;
 }
 
 .next-meeting{

src/app/pages/events/events.page.ts

@@ -14,6 +14,7 @@ import { EventDetailPage } from './event-detail/event-detail.page';
 import { EventDetailModalPage } from './event-detail-modal/event-detail-modal.page';
 import { ProcessesService } from '../../services/processes.service';
 import { DailyWorkTask } from '../../models/dailyworktask.model';
+import { ViewEventPage } from '../agenda/view-event/view-event.page';
 
 @Component({
   selector: 'app-events',
@@ -285,10 +286,7 @@ export class EventsPage implements OnInit {
 
       this.taskslist = this.sortArrayISODate(AllResult).reverse()
 
-
     });
-
-
   }
 
   sortArrayISODate(myArray: any){
@@ -297,6 +295,27 @@ export class EventsPage implements OnInit {
     });
   }
 
+  async viewEventDetail(eventId:any) {
+    console.log(this.profile);
+    
+    const modal = await this.modalController.create({
+      component: ViewEventPage,
+      componentProps:{
+        eventId: eventId,
+        profile: this.profile,
+      },
+      cssClass: 'modal',
+      backdropDismiss: false
+    });
+    await modal.present();
+    modal.onDidDismiss().then((res)=>{
+      if(res){
+        console.log(res);
+        this.RefreshEvents();
+      }
+    });
+  }
+
   
   
   

src/theme/variables.scss

@@ -322,25 +322,25 @@
   margin-bottom: 10px;
   overflow: auto;
 }
-.content-mdgpr-Oficial{
+.content-pr-Oficial{
   width: 340px;
   border-radius: 5px;
   border-right: 5px solid #99e47b;
   overflow: auto;
 }
-.content-mdgpr-Pessoal{
+.content-pr-Pessoal{
   width: 340px;
   border-radius: 5px;
   border-right: 5px solid #958bfc;
   overflow: auto;
 }
-.content-pr-Oficial{
+.content-mdgpr-Oficial{
   width: 340px;
   border-radius: 5px;
   border-right: 5px solid #ffb703;
   overflow: auto;
 }
-.content-pr-Pessoal{
+.content-mdgpr-Pessoal{
   width: 340px;
   border-radius: 5px;
   border-right: 5px solid #f05d5e;