multiples changes

src/app/home/home-routing.module.ts

@@ -180,12 +180,12 @@ const routes: Routes = [
             path:':folderId',
             loadChildren: ()=> import('../pages/publications/view-publications/view-publications.module').then(m => m.ViewPublicationsPageModule)
           },
-          /* {
+          {
             path:'view-publications',
             children: [
               {
-                path:':folderId',
+                path:':folderId/:publicationId',
-                loadChildren: ()=> import('../pages/publications/view-publications/view-publications.module').then(m => m.ViewPublicationsPageModule)
+                loadChildren: ()=> import('../pages/publications/view-publications/publication-detail/publication-detail.module').then(m => m.PublicationDetailPageModule)
               },
               {
                 path:'publication-detail',
@@ -198,7 +198,7 @@ const routes: Routes = [
                 
               },
             ]  
-          }, */
+          },
           {
             path:'new-publication',
             loadChildren: ()=> import('../shared/publication/new-publication/new-publication.module').then(m => m.NewPublicationPageModule)

src/app/pages/publications/view-publications/publication-detail/publication-detail.module.ts

@@ -7,13 +7,15 @@ import { IonicModule } from '@ionic/angular';
 import { PublicationDetailPageRoutingModule } from './publication-detail-routing.module';
 
 import { PublicationDetailPage } from './publication-detail.page';
+import { HeaderPageModule } from 'src/app/shared/header/header.module';
 
 @NgModule({
   imports: [
     CommonModule,
     FormsModule,
     IonicModule,
-    PublicationDetailPageRoutingModule
+    PublicationDetailPageRoutingModule,
+    HeaderPageModule,
   ],
   declarations: [PublicationDetailPage]
 })

src/app/pages/publications/view-publications/publication-detail/publication-detail.page.html

@@ -1,9 +1,12 @@
+<ion-header class="ion-no-border">
+  <app-header></app-header>
+</ion-header>
 
 <ion-content>
 
   <div class="content-container">
     <div *ngIf="publication.Title != ''">
-    <div class="title-content px-20" (click)="close()">
+    <div class="title-content px-20" (click)="goBack()">
       <div class="back-icon">
         <ion-icon  slot="end" src='assets/images/icons-arrow-arrow-left.svg'></ion-icon>
       </div>

src/app/pages/publications/view-publications/publication-detail/publication-detail.page.ts

@@ -1,10 +1,9 @@
 import { Component, OnInit } from '@angular/core';
-import { AnimationController, ModalController, NavParams } from '@ionic/angular';
+import { ActivatedRoute, Router } from '@angular/router';
+import { AnimationController, ModalController } from '@ionic/angular';
 import { Publication } from 'src/app/models/publication';
 import { PublicationsService } from 'src/app/services/publications.service';
 import { ToastService } from 'src/app/services/toast.service';
-import { BadRequestPage } from 'src/app/shared/popover/bad-request/bad-request.page';
-import { SuccessMessagePage } from 'src/app/shared/popover/success-message/success-message.page';
 import { ImageModalPage } from '../../gallery/image-modal/image-modal.page';
 import { NewPublicationPage } from '../../new-publication/new-publication.page';
 
@@ -21,13 +20,21 @@ export class PublicationDetailPage implements OnInit {
 
   constructor(
     private modalController: ModalController,
-    private navParams:NavParams,
     private publications:PublicationsService,
     private animationController: AnimationController,
     private toastService: ToastService,
+    private activatedRoute: ActivatedRoute,
+    private router: Router, 
     ) { 
-      this.publicationId = this.navParams.get('publicationId');
+      this.activatedRoute.paramMap.subscribe(params => {
-      this.folderId = this.navParams.get('folderId');
+        console.log(params);
+        if(params["params"]) {
+          this.folderId = params["params"].folderId;
+          this.publicationId = params["params"].publicationId;
+          console.log(params["params"]);
+        }
+      });
+      
       this.publication = {
         DateIndex: null,
         DocumentId: '',
@@ -80,6 +87,10 @@ export class PublicationDetailPage implements OnInit {
     this.modalController.dismiss();
   }
 
+  goBack(){
+    this.router.navigate(['/home/publications', this.folderId]);
+  }
+
 
   async deletePost(){
 

src/app/pages/publications/view-publications/view-publications.page.html

@@ -35,7 +35,7 @@
       <!-- [routerLink]="['/home/publications/view-publications/publication-detail', publication.publicationId]" -->
       <div class="post-item"
       *ngFor="let publication of publicationList"
-      (click)="viewPublicationDetail(publication.DocumentId)">
+      (click)="goToPublicationDetail(publication.DocumentId)">
         <div *ngIf="publication.FileBase64.length > 30" class="post-img">
           <img src="{{publication.FileBase64}}" alt="image">
         </div>

src/app/pages/publications/view-publications/view-publications.page.ts

@@ -115,6 +115,10 @@ export class ViewPublicationsPage implements OnInit {
     });
   }
 
+  goToPublicationDetail(publicationId:string){
+    this.router.navigate(['/home/publications/view-publications', this.folderId, publicationId]);
+  }
+
   async viewPublicationDetail(publicationId:string) {
     const modal = await this.modalController.create({
       component: PublicationDetailPage,

src/app/shared/publication/view-publications/view-publications.page.scss

@@ -1,4 +1,11 @@
+
 :host{
+
+  ::-webkit-scrollbar {
+    width: 7px;
+    height: 7px;
+  }
+
     background: transparent;
     padding: 0!important;
   }
@@ -56,15 +63,12 @@
     color:#000;
     
   }
-  .main-content{
+  .main-container{
-    width: 100%; /* 400px */
+    width: 100%;
-    height: 100%;
+    height: 100% !important;
-    font-family: Roboto;
+    overflow-y: auto;
-    margin: 0 auto;
-    background-color: #fff;
-    overflow:auto;
-    padding: 15px 20px 0 20px;
   }
+
   .content-top{
     background: #f3f2f2;
     height: 20px;
@@ -73,17 +77,6 @@
     border-top-right-radius: 25px;
     transform: translate3d(0, 1px, 0);
 }
-  .content-container{
-    width: 100%;
-    margin:0 auto;
-    border-top-left-radius: 25px;
-    border-top-right-radius: 25px;
-    background: #ffffff;
-    height: 100%;
-    box-shadow: 0px 0px 18px rgba(0, 0, 0, 0.6);
-    padding: 25px 0px 0 0px;
-    overflow: auto;
-  }
   .title-content{
     margin: 0px auto;
     overflow: auto;