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

add theme to login

Browse Source
This commit is contained in:
Peter Maquiran
2021-10-21 14:15:50 +01:00
parent 2a2bfc1886
commit 6d1d461ba7
7 changed files with 54 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/login/login.page.scss
+5 -7
View File
@@ -9,7 +9,7 @@ ion-content{
} }
.main-wrapper{ .main-wrapper{
background: linear-gradient(180deg, #42B9FE 0%, #0782C9 100%) !important; background: var(--login-background);
display: flex; display: flex;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
@@ -101,14 +101,13 @@ ion-item{
border-radius: 22.5px; border-radius: 22.5px;
margin: 10px 0 10px 0; margin: 10px 0 10px 0;
} }
.btn-login{ .btn-login{
font-size: 16px; font-size: 16px;
} }
.btn-login:hover{
background-color: var(--button-hover);;
}
.div-top-header{ .div-top-header{
margin: 0 em(20px); margin: 0 em(20px);
@@ -128,7 +127,6 @@ ion-item{
} }
.circle{ .circle{
color: white; color: white;
width: 70px; width: 70px;
src/app/services/theme.service.spec.ts
+16
View File
@@ -0,0 +1,16 @@
import { TestBed } from '@angular/core/testing';
import { ThemeService } from './theme.service';
describe('ThemeService', () => {
let service: ThemeService;
beforeEach(() => {
TestBed.configureTestingModule({});
service = TestBed.inject(ThemeService);
});
it('should be created', () => {
expect(service).toBeTruthy();
});
});
src/app/services/theme.service.ts
+17
View File
@@ -0,0 +1,17 @@
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class ThemeService {
themes = [
'gov',
'default'
]
constructor() { }
setTheme() {}
}
src/app/shared/header/header.page.scss
+7 -2
View File
@@ -86,10 +86,10 @@
} }
.tab:hover{ .tab:hover{
border-top: 7px solid white; border-top: 7px solid var(--header-tab-text-white);
} }
.active{ .active{
border-top: 7px solid white; border-top: 7px solid var(--header-tab-text-white);
} }
@@ -113,3 +113,8 @@
width: 20px; width: 20px;
} }
} }
.tab {
color: var(--header-tab-text-white);
}
src/global.scss
+3 -3
View File
@@ -748,14 +748,14 @@ app-header-no-search .ion-toolbar{
body, .blue-background{ background: var(--color) !important;} body, .blue-background{ background: var(--color) !important;}
// desktop
@media only screen and (min-width: 1365px) { @media only screen and (min-width: 1365px) {
// set color to body
body{ body{
background: linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important; background: linear-gradient(270deg, var(--color2) 0%, var(--color3) 23.44%, var(--color4) 78.13%, var(--color5) 100%) !important;
} }
.blue-background {
background: linear-gradient(270deg, #45BAFF 0%, #0782C9 23.44%, rgba(7, 130, 201, 0.9425) 78.13%, #45BAFF 100%) !important;
}
} }
src/index.html
+1 -1
View File
@@ -67,7 +67,7 @@
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head> </head>
<body> <body class="gov">
<app-root></app-root> <app-root></app-root>
</body> </body>
src/theme/variables.scss
+4 -23
View File
@@ -613,39 +613,20 @@ body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; }
.gov{ .gov{
--login-background: linear-gradient(180deg, #C63527 60%, #000 100%) !important;
--button-hover: #42B9FE;
--inicio-open-page-from-box: #42B9FE;
--color : hsl(195, 3%, 77%);
--color2: #f0f0f0;
--color3: #D9D9D9;
--color4: #d9d9d9ee;
--color5: #ececec;
--header-tab-top-border: #000;
}
.gov2{
--login-background: linear-gradient(180deg, #C63527 60%, #000 100%) !important; --login-background: linear-gradient(180deg, #C63527 60%, #000 100%) !important;
--button-hover: #FFB81C; --button-hover: #FFB81C;
--inicio-open-page-from-box: #C63527; --inicio-open-page-from-box: #C63527;
--color : hsl(0, 69%, 44%);
--color2: #681a13e8;
--color3: #C63527;
--color4: #c63427e7;
--color5: #681a13e8;
--header-tab-top-border: #000; --header-tab-top-border: #000;
--header-tab-text-white: rgb(0, 0, 0);
} }
.default { .default {
--login-background: linear-gradient(180deg, #42B9FE 0%, #0782C9 100%) !important; --login-background: linear-gradient(180deg, #42B9FE 0%, #0782C9 100%) !important;
--button-hover: #42B9FE; --button-hover: #42B9FE;
--inicio-open-page-from-box: #42B9FE; --inicio-open-page-from-box: #42B9FE;
--color : hsl(195, 3%, 77%);
--color2: #f0f0f0;
--color3: #D9D9D9;
--color4: #d9d9d9ee;
--color5: #ececec;
--header-tab-top-border: white; --header-tab-top-border: white;
--header-tab-text-white: white;
} }