Finish style expedient-detail page

src/app/pages/gabinete-digital/expediente/expediente-detail/expediente-detail.page.html

@@ -16,7 +16,7 @@
   </ion-toolbar>
 </ion-header>
 
-<!-- <ion-menu autoHide="false" side="end" content-id="main-content">
+<ion-menu autoHide="false" side="end" content-id="main-content">
   <ion-header>
     <ion-toolbar translucent>
       <ion-title>Menu</ion-title>
@@ -50,10 +50,10 @@
       </ion-item>
     </ion-list>
   </ion-content>
-</ion-menu> -->
-<!-- <div class="ion-page" id="main-content">
+</ion-menu>
+<div class="ion-page" id="main-content">
   <ion-menu-button></ion-menu-button>
-</div> -->
+</div>
 
 <ion-content class="height-100">
   <div class="main-content d-flex height-100">
@@ -81,29 +81,29 @@
         </div>
       </div>
       <div class="middle-content">
+        <h5>Intervenientes</h5>
         <ion-item class="ion-no-margin ion-no-padding">
           <ion-label>
-            <h3>Intervenientes</h3>
             <div>
               <p>Tiago Kayaya</p>
               <p>Tiago Kayaya</p>
             </div>
           </ion-label>
         </ion-item>
+        <h5>Detalhes</h5>
         <ion-item class="ion-no-margin ion-no-padding">
           <ion-label>
-            <h3>Detalhes</h3>
-            <p>MINEC, MINFIN</p>
+            <p [innerHTML]="task.Note"></p>
           </ion-label>
         </ion-item>
       </div>
       <div class="bottom-content width-100">
         <ion-list>
-          <h3>Documentos Anexados</h3>
+          <h5>Documentos Anexados</h5>
           <ion-item class="ion-no-margin ion-no-padding">
           <ion-label
           (click)="viewDocument()">
-            <p class="attach-title-item">{{ task.Folio }}</p>
+            <p class="attach-title-item">{{ task.Folio }}<span class="span-right color-red btn-size"><ion-icon name="close"></ion-icon></span></p>
             <p><span class="span-left">{{task.Remetente}}</span><span class="span-right">{{ task.CreateDate | date: 'dd/MM/yy' }}</span></p>
           </ion-label>
         </ion-item>
@@ -151,7 +151,7 @@
         <div class="solid"></div>
         <button class="btn-cancel" shape="round" >Executar</button>
         <button full class="btn-cancel" shape="round" >Delegar</button>
-        <button class="btn-cancel" shape="round" >Arquivar</button>
+        <button class="btn-cancel" shape="round" >Enviar para Pendentes</button>
       </div>
     </div>
 

src/app/pages/gabinete-digital/expediente/expediente-detail/expediente-detail.page.scss

@@ -4,6 +4,13 @@
   margin: 0;
   float: left;
 }
+.color-red{
+  font-weight: 500;
+  color:#d30a0a !important;
+}
+.btn-size{
+  font-size: 18px !important;
+}
 .main-header{
   font-family: Roboto;
   border-top-left-radius: 25px;
@@ -65,6 +72,7 @@
           font-size: 25px;
           overflow: auto;
           float: left;
+          padding-top: 4px;
           padding-left: 5px;
         }
         .div-icon{
@@ -86,6 +94,7 @@ ion-button{
 
 
 .upper-content{
+  font-family: Roboto;
   margin-left: 41px;
   overflow: auto;
   font-size: 18px;
@@ -103,18 +112,13 @@ ion-button{
   }
   .content-details{
     font-size: 17px;
-    font-weight: 600;
     .date{
       color: #797979;
     }
-    .color-red{
-      color:#d30a0a;
-    }
-
-  } 
+  }
 }
 .middle-conten{
-  .middle-content h3, .middle-content p{
+ .middle-content p{
     font-size: 16px;
   }
 }
@@ -139,9 +143,10 @@ ion-button{
     float: left;
   }
   .attach-title-item{
+    font-size: 18px;
     width: 100%;
-    font-size: 15px;
     color:#0d89d1;
+    padding-bottom: 5px;
   }
   /* SPAN */
   .span-left{
@@ -175,6 +180,7 @@ ion-button{
     justify-content: space-between;
 
     .btn-ok, .btn-cancel, .btn-delete{
+      height: auto !important;
       font-size: 16px !important;
       font-weight: 600 !important;
       width: 100% !important;
@@ -185,19 +191,30 @@ ion-button{
   .solid {
     display: block;
     width: 90%;
-    border-top: 1px solid #bbb;
+    border-top: 1px solid #ebebeb;
     margin: 0 auto !important;
     margin-bottom: 10px !important;
   }
 }
 
-@media only screen and (min-width: 1024px) {
+@media only screen and (max-width: 1023px) {
   .content{
-    width: 70%;
+    width: 100%;
+  }
+  .aside-right{
+    display: none;
+  }
+}
+@media only screen and (min-width: 1024px) {
+  .div-icon{
+    display: none;
+  }
+  .content{
+    width: 75%;
     border-right: 1px solid #d8d8d8;
   }
 
   .aside-right{
-    width: 30%;
+    width: 25%;
   }
 }

src/app/pages/gabinete-digital/expediente/expediente-detail/expediente-detail.page.ts

@@ -62,11 +62,12 @@ export class ExpedienteDetailPage implements OnInit {
     this.processes.GetTask(serial).subscribe(res => {
       this.task = {
         "SerialNumber": res.serialNumber,
-        "Folio": res.workflowInstanceFolio,
+        "Folio": res.workflowInstanceDataFields.Subject,
         "Senders": res.originator.email,
         "CreateDate": momentG(new Date(res.taskStartDate),'yyyy-MM-dd HH:mm:ss'),
         "DocumentURL": res.workflowInstanceDataFields.ViewerRequest,
         "Remetente": res.workflowInstanceDataFields.Sender,
+        "Note": res.workflowInstanceDataFields.Note,
       }
       this.fulltask = res;
       console.log(res);

src/app/shared/gabinete-digital/expedients/expedients.page.ts

@@ -89,7 +89,6 @@ export class ExpedientsPage implements OnInit {
         profile: this.profile,
       },
       cssClass: 'modal modal-desktop',
-      backdropDismiss: false,
     });
     await modal.present();
     modal.onDidDismiss().then((res)=>{

src/global.scss

@@ -352,7 +352,7 @@ td.monthview-secondary-with-event, td.monthview-secondary-with-event[_ngcontent-
 
 @media only screen and (min-width: 1024px) {
   .gabinete-digital-mobile-modal-to-Desktop{
-    top: 75px;
+    //top: 75px;
     left: 40%;
 
     .modal-wrapper{

src/theme/variables.scss

@@ -44,6 +44,7 @@
   --ion-color-warning-tint: #ffca22;
 
   /** danger **/
+  --ion-color-red:#d30a0a;
   --ion-color-danger: #eb445a;
   --ion-color-danger-rgb: 235, 68, 90;
   --ion-color-danger-contrast: #ffffff;
@@ -264,7 +265,7 @@
   background: rgba(51, 51, 51, 0.3); 
 }
 .modal, .newchat, .new-group, .contacts, .group-messages, .custom-modal{
-  padding-top: 93px;
+  padding-top: 75px;
   --border-radius: 25px 25px 0 0;
   --border-width:0px;
 }