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

Added function on edit-perfil button to change themes

Browse Source
This commit is contained in:
Eudes Inácio
2021-10-22 14:00:07 +01:00
parent e7d70f4736
commit 509824d0c5
6 changed files with 29 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/modals/profile/edit-profile/edit-profile.page.html
+2 -2
View File
@@ -60,12 +60,12 @@
<div class="profile-title d-flex justify-space-between align-center width-100">
<div class="d-flex align-center">
<div class="btn-close d-flex cursor-pointer" (click)="changeTheme('grey')">
<div class="btn-close d-flex cursor-pointer" (click)="changeTheme('gov')">
<ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
</div>
<div class="btn-close d-flex cursor-pointer" (click)="changeTheme('blue')">
<div class="btn-close d-flex cursor-pointer" (click)="changeTheme('default')">
<ion-icon class="icon" src="assets/images/icons-search-close.svg"></ion-icon>
</div>
src/app/modals/profile/edit-profile/edit-profile.page.ts
+4 -8
View File
@@ -5,6 +5,7 @@ import { PinPage } from 'src/app/shared/pin/pin.page';
import { SessionStore } from 'src/app/store/session.service';
import { environment } from 'src/environments/environment';
import { BackgroundService } from 'src/app/services/background.service';
import { ThemeService } from 'src/app/services/theme.service';
@Component({
selector: 'app-edit-profile',
@@ -19,7 +20,8 @@ export class EditProfilePage implements OnInit {
constructor(private modalController:ModalController,
private animationController: AnimationController,
public platform: Platform,
private backgroundservice: BackgroundService
private backgroundservice: BackgroundService,
private themeservice: ThemeService
) {}
ngOnInit() {}
@@ -115,13 +117,7 @@ export class EditProfilePage implements OnInit {
}
changeTheme(name) {
/* this.theme.setTheme(themes[name]); */
if(name == 'grey') {
this.backgroundservice.greyTheme();
} else if (name == 'blue') {
this.backgroundservice.blueTheme();
}
this.themeservice.setTheme(name)
}
}
src/app/services/background.service.ts
+13
View File
@@ -58,6 +58,13 @@ export class BackgroundService {
document.body.style.setProperty(`--header-container-background`, "#fff");
document.body.style.setProperty(`--headercolor`, "#000");
document.body.style.setProperty(`--login-background`, "linear-gradient(180deg, #c63527 60%, #000 100%) !important");
document.body.style.setProperty(`--button-hover`, "#ffb81c");
document.body.style.setProperty(`--inicio-open-page-from-box`, "#c63527");
document.body.style.setProperty(`--header-tab-top-border`, "#000");
document.body.style.setProperty(`--header-tab-text-white`, "rgb(0, 0, 0)");
document.body.style.setProperty(`--header-tab-text-white`, "rgb(0, 0, 0)");
document.body.style.setProperty(`--header-bottom-line-background`, "rgb(255, 0, 0)");
document.body.style.setProperty(`--header-bottom-line-background-image`, "linear-gradient(to right, #C63527, #FFB81C, #FFC72C)");
}
@@ -76,6 +83,12 @@ export class BackgroundService {
document.body.style.setProperty(`--header-bottom-line-background`, "linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important");
document.body.style.setProperty(`--header-bottom-line-background-image`, "linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important");
document.body.style.setProperty(`--login-background`, "linear-gradient(180deg, #42b9fe 0%, #0782c9 100%) !importantt");
document.body.style.setProperty(`--button-hover`, "#42b9fe");
document.body.style.setProperty(`--inicio-open-page-from-box`, "#42b9fe");
document.body.style.setProperty(`--header-tab-top-border`, "white");
document.body.style.setProperty(`--header-tab-text-white`, "white");
}
default() {
src/app/services/theme.service.ts
+1
View File
@@ -20,6 +20,7 @@ export class ThemeService {
document.body.classList.remove("default");
document.body.classList.add(theme);
this.currentTheme = theme
console.log('Current theme', theme)
}
src/index.html
+1 -1
View File
@@ -67,7 +67,7 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body id="body-index" class="gov">
<body class='body'>
<app-root></app-root>
</body>
src/theme/variables.scss
+8 -1
View File
@@ -630,6 +630,10 @@ body {
--header-tab-top-border: #000;
--header-tab-text-white: rgb(0, 0, 0);
--header-container-background: #fff;
--header-bottom-line-background: rgb(255, 0, 0);
--header-bottom-line-background-image: linear-gradient(to right, #C63527, #FFB81C, #FFC72C);
--color: #D9D9D9;
--color2: #f0f0f0;
@@ -640,11 +644,14 @@ body {
.default {
--login-background: linear-gradient(180deg, #42b9fe 0%, #0782c9 100%) !important;
--button-hover: #42b9fe;
--button-hover: #bfcbd1;
--inicio-open-page-from-box: #42b9fe;
--header-tab-top-border: white;
--header-tab-text-white: white;
--header-container-background: linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important;
--header-bottom-line-background: linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important;
--header-bottom-line-background-image: linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important;
--color: #0782c9;
--color2: #45baff;