peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-18 20:47:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

IconGroupAtempt

Browse Source
This commit is contained in:
ivan gomes
2021-11-19 08:51:10 +01:00
parent e622acc98e
commit d8fcd32b3b
9 changed files with 165 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/modals/group-icons/group-icons.page.html
+35 -31
View File
@@ -1,31 +1,35 @@
<ion-card >
<ion-card-content >
<ion-row>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="removerIcone()" fill="clear" color="light">
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
<ion-icon class="redla" name="trash-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="openGaleria()" fill="clear" color="light">
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
<ion-icon class="redla" name="flower-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="OpenCamera()" fill="clear" color="light">
<ion-icon class="redla" name="camera-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="pesquizarWeb()" fill="clear" color="light">
<ion-icon class="redla" name="search-outline"></ion-icon>
</ion-button>
</ion-col>
</ion-row>
</ion-card-content>
</ion-card>
<ion-card class="cardconteudo" (click)= "dismiss()" >
<ion-card-content >
<ion-row>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="removerIcone()" fill="clear" color="light">
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
<ion-icon class="redla" name="trash-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="openGaleria()" fill="clear" color="light">
<!-- <ion-icon name="remove" slot="start"></ion-icon> -->
<ion-icon class="redla" name="flower-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="OpenCamera()" fill="clear" color="light">
<ion-icon class="redla" name="camera-outline"></ion-icon>
</ion-button>
</ion-col>
<ion-col size="3" class="ion-text-center">
<ion-button (click)="pesquizarWeb()" fill="clear" color="light">
<ion-icon class="redla" name="search-outline"></ion-icon>
</ion-button>
</ion-col>
</ion-row>
</ion-card-content>
</ion-card>
src/app/modals/group-icons/group-icons.page.scss
+63
View File
@@ -0,0 +1,63 @@
// .animated{
// animation: duration 5s;
// animation-fill-mode: both;
// }
// @keyframes bounceInUp{
// 0%{
// opacity:0;
// transform: translateY(300px);
// }
// 60%{
// opacity:0;
// transform: translateY(-30px);
// }
// 80%{
// opacity:0;
// transform: translateY(10px);
// }
// 100%{
// opacity:0;
// transform: translateY(0);
// }
// }
// .bounceInUp{
// animation-name: bounceInUp;
// }
// @keyframes bounceInUp{
// from{down:0px}
// 30% {top: 100px !important;} /* ignored */
// from{down:200px}
// }
.rollover {
position: relative;
animation: mymove 5s infinite;
}
@keyframes mymove {
from {bottom: 0px; }
to {bottom: 100px;}
}
@media only screen and (min-height: 600px) and (min-width: 768px)
{
.custom-modal {
.modal-wrapper {
position: absolute !important;
height: 500px !important;
top: calc(100% - (500px));
}
}
}
.redla{
color: rgb(255, 38, 0);
// background-color: rgb(255, 72, 0);
}
src/app/modals/preview-camera/preview-camera.module.ts
+4 -1
View File
@@ -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
+10 -8
View File
@@ -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
+14 -4
View File
@@ -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
+11
View File
@@ -66,7 +66,18 @@ close(){
// });
// modal.present();
// }
async getIconGallery(){
const modal = await this.modalController.create({
component: GroupIconsPage ,
animated: true,
cssClass: 'transparentblack-modal',
});
modal.present();
}
}
src/app/pages/chat/chat.page.html
+1 -1
View File
@@ -125,7 +125,7 @@
</div>
</div>
</ion-item-sliding>
am i here?!
</ion-list>
</div>
<!-- <button (click)="sendMsg()" style="height: 41px;">Send message</button> -->
src/app/pages/chat/group-messages/group-messages.page.html
+1 -1
View File
@@ -157,5 +157,5 @@
</button>
</div>
</div>
in group!
</ion-footer>
src/global.scss
+26 -3
View File
@@ -747,6 +747,9 @@ app-header-no-search .ion-toolbar{
--title-text-color: rgb(0, 0, 0);
--subtitle-text-color: #000
}
@@ -1300,8 +1303,6 @@ ngx-mat-datetime-content{
}
@keyframes ldio-rpinwye8j0b {
0% { transform: rotate(0deg) }
50% { transform: rotate(180deg) }
@@ -1332,4 +1333,26 @@ ngx-mat-datetime-content{
backface-visibility: hidden;
transform-origin: 0 0; /* see note above */
}
.ldio-rpinwye8j0b div { box-sizing: content-box; }
.ldio-rpinwye8j0b div { box-sizing: content-box; }
.transparent-modal {
--background: #0000005c;
ion-content {
--background:transparent;
}
}
ion-modal::part(content){
backdrop-filter: blur(12px);
}
.transparentblack-modal{
--background: #000000e7;
ion-content {
--background:transparent;
}
}