IconGroupAtempt

src/app/modals/preview-camera/preview-camera.module.ts

@@ -8,6 +8,7 @@ import { PreviewCameraPageRoutingModule } from './preview-camera-routing.module'
 
 import { PreviewCameraPage } from './preview-camera.page';
 import { ImageCropperModule } from 'ngx-image-cropper';
+import { GroupIconsPage } from '../group-icons/group-icons.page';
 
 @NgModule({
   imports: [
@@ -17,6 +18,8 @@ import { ImageCropperModule } from 'ngx-image-cropper';
     ImageCropperModule,
     PreviewCameraPageRoutingModule
   ],
-  declarations: [PreviewCameraPage]
+  declarations: [PreviewCameraPage],
+ 
+  
 })
 export class PreviewCameraPageModule {}

src/app/modals/preview-camera/preview-camera.page.html

@@ -1,13 +1,15 @@
-<ion-card >
+
+
+<ion-card class="cardconteudo" >
 
 <ion-card-content >
   <ion-card-header >
-    <ion-toolbar>
-     
-        {{username}}   <span>{{_updatedAt}}</span> 
+   
+   
+     <ion-text color="light" size="6">{{username}}   <span>{{_updatedAt | date}}</span><div class="right" (click)="getIconGallery()"><ion-icon name="pencil-outline" ></ion-icon></div></ion-text>   
+    
       
-      
-    </ion-toolbar>
+   
   </ion-card-header>
   
     <img src="{{image}}" />
@@ -23,7 +25,7 @@
   
 ></image-cropper> -->
 
-<ion-footer>
+<ion-footer color="light">
   <ion-row>
     <ion-col size="3" class="ion-text-center">
       <ion-button (click)="zoom(false)" fill="clear" color="light">
@@ -52,4 +54,4 @@
     </ion-col>
   </ion-row>
 </ion-footer>
-</ion-card>
+</ion-card>

src/app/modals/preview-camera/preview-camera.page.scss

@@ -1,9 +1,6 @@
 
 
-ion-content {
-    --background:black;
-    --color: red;
-}
+
  
 ion-footer {
     margin-bottom: 10px;
@@ -19,4 +16,17 @@ ion-slides {
     // background-color: rgb(255, 72, 0);
 }
 
+.cardconteudo {
+    background: rgba(255,255,255,0.5);
+}
 
+.whiter{
+    color: white;
+   
+}
+.right{
+float: right;
+}
+.center{
+    clear: both;
+    }

src/app/modals/preview-camera/preview-camera.page.ts

@@ -66,7 +66,18 @@ close(){
 //   });
 //   modal.present();
 //   }
+
+async getIconGallery(){
+
+    const modal = await this.modalController.create({
+      component: GroupIconsPage ,
+      animated: true,
+      cssClass: 'transparentblack-modal',
+            });
+    modal.present();
+  }
 }
 
 
 
+