diff --git a/package-lock.json b/package-lock.json
index 3062b69a56e4db0ae0d05978b08402d5ebf2a733..6d87e8e6f50b2d9b3b8554b35dae3fe78475ecba 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -53,7 +53,7 @@
"normalize.css": "8.0.1",
"patch-package": "6.4.7",
"rxjs": "7.5.2",
- "solidify-frontend": "3.0.12",
+ "solidify-frontend": "3.0.13",
"tiff.js": "1.0.0",
"tslib": "2.3.1",
"videojs-wavesurfer": "3.8.0",
@@ -19674,9 +19674,9 @@
}
},
"node_modules/solidify-frontend": {
- "version": "3.0.12",
- "resolved": "https://nexus.unige.ch/repository/npm-all/solidify-frontend/-/solidify-frontend-3.0.12.tgz",
- "integrity": "sha512-YbWDp06LSOlOLd/5q7KVHv9PbJY/OG4tieZP4kEBBMM8iIAif0vN76XPKnrS6JDvd9bmmmQpHpXNFMFYcUrrYQ==",
+ "version": "3.0.13",
+ "resolved": "https://nexus.unige.ch/repository/npm-all/solidify-frontend/-/solidify-frontend-3.0.13.tgz",
+ "integrity": "sha512-6/crKKjFB1wkg9gO/Qkb6gF1i4JTTDyQ9CN3g21UIeGz/xxWCuTTNUEbS6ySN8X7Ip33WbCffeKVt4SZ1lvshw==",
"license": "GPL-2.0-or-later",
"dependencies": {
"tslib": "^2.3.0"
@@ -35891,9 +35891,9 @@
}
},
"solidify-frontend": {
- "version": "3.0.12",
- "resolved": "https://nexus.unige.ch/repository/npm-all/solidify-frontend/-/solidify-frontend-3.0.12.tgz",
- "integrity": "sha512-YbWDp06LSOlOLd/5q7KVHv9PbJY/OG4tieZP4kEBBMM8iIAif0vN76XPKnrS6JDvd9bmmmQpHpXNFMFYcUrrYQ==",
+ "version": "3.0.13",
+ "resolved": "https://nexus.unige.ch/repository/npm-all/solidify-frontend/-/solidify-frontend-3.0.13.tgz",
+ "integrity": "sha512-6/crKKjFB1wkg9gO/Qkb6gF1i4JTTDyQ9CN3g21UIeGz/xxWCuTTNUEbS6ySN8X7Ip33WbCffeKVt4SZ1lvshw==",
"requires": {
"tslib": "^2.3.0"
}
diff --git a/package.json b/package.json
index 8c3df3c073143fdf85528a2f55367e95b2e7a83a..091c9523d1fb434b4242493e7d7cceae2c8dd944 100644
--- a/package.json
+++ b/package.json
@@ -97,7 +97,7 @@
"normalize.css": "8.0.1",
"patch-package": "6.4.7",
"rxjs": "7.5.2",
- "solidify-frontend": "3.0.12",
+ "solidify-frontend": "3.0.13",
"tiff.js": "1.0.0",
"tslib": "2.3.1",
"videojs-wavesurfer": "3.8.0",
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 106c22a856cb139157bd8579621aa70ccfed9789..c25ffd933a537d9f07ef0df2f2cc6fd7d71e9245 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -26,8 +26,9 @@
(navigateChange)="navigate($event)"
(searchChange)="search($event)"
(themeChange)="themeChange($event)"
+ (darkModeChange)="darkThemeChange($event)"
(userGuideOpen)="openUserGuideSidebar()"
- [currentLanguage]="appLanguageObs | async"
+ [language]="appLanguageObs | async"
[currentPath]="currentModule"
[displayCart]="displayCart"
[isHomePage]="isHomePage"
@@ -38,6 +39,7 @@
[numberPendingRequestNotificationInbox]="numberPendingRequestNotificationInboxObs | async"
[photoUser]="currentPhotoUserObs | async"
[theme]="themeObs | async"
+ [darkMode]="darkModeObs | async"
[userRoles]="userRolesObs | async"
[user]="currentUserObs | async"
>
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 3c31dd84fd76e41d579e5f7a2cff44a77b29f1cc..6c67a5d78c5cab1e7540ef76b1e058aaaf57bc9a 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -91,8 +91,18 @@
}
}
-:host-context(body[theme='olos']) {
- .breadcrumb-banner-wrapper {
- background-color: $background-grey;
+@include isInDarkMode {
+ .app-wrapper {
+ .header {
+ .breadcrumb-banner-wrapper {
+ background-color: $dark-mode-toolbar;
+ }
+ }
+ }
+
+ .spinner-general-wrapper {
+ > .spinner-background {
+ background-color: $dark-mode-background;
+ }
}
}
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index a6371bbb9690922e73308433cf2a5dd16c63140c..6f4451a2987f2e83a5617a0d423efd72eb2e686e 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -99,6 +99,7 @@ import {
HIGHLIGHT_OPTIONS,
HighlightModule,
} from "ngx-highlightjs";
+import {HighlightOptions} from "ngx-highlightjs/lib/highlight.model";
import {
TourMatMenuModule,
TourService,
@@ -322,7 +323,8 @@ export const HttpLoaderFactory: (http: HttpClient) => HttpTranslateLoaderExtra =
xml: () => import("highlight.js/lib/languages/xml"),
json: () => import("highlight.js/lib/languages/json"),
},
- },
+ themePath: "assets/highlightjs",
+ } as HighlightOptions,
},
],
bootstrap: [AppComponent],
diff --git a/src/app/components/container/footer/footer.container.html b/src/app/components/container/footer/footer.container.html
index 3b0ff9b9cb2393b54896b7d233b286c2ee2c9b07..77ce5234fb8420ec7398c60973019b6609e3905d 100644
--- a/src/app/components/container/footer/footer.container.html
+++ b/src/app/components/container/footer/footer.container.html
@@ -25,7 +25,7 @@
target="_blank"
>University
of Geneva</a>
- <solidify-icon [iconName]="iconNameEnum.unigeBlack"
+ <solidify-icon [iconName]="(darkModeObs | async) ? iconNameEnum.unigeWhite : iconNameEnum.unigeBlack"
class="size-20 unige"
></solidify-icon>
</div>
diff --git a/src/app/components/container/footer/footer.container.scss b/src/app/components/container/footer/footer.container.scss
index 5621749a09e69435e9f16135b42a8fad952f2b76..c15f8fcdd7a12a713e721ba045520a7ada35dad1 100644
--- a/src/app/components/container/footer/footer.container.scss
+++ b/src/app/components/container/footer/footer.container.scss
@@ -14,7 +14,6 @@ $color-text: $grey;
align-items: center;
z-index: $z-index-footer;
-
.left,
.right {
display: grid;
@@ -38,7 +37,6 @@ $color-text: $grey;
//display: none;
}
}
-
}
.copyrights {
@@ -98,3 +96,22 @@ $color-text: $grey;
}
}
+
+@include isInDarkMode {
+ background-color: $dark-mode-toolbar;
+ color: $dark-mode-text-color;
+
+ .copyrights {
+ a {
+ color: $dark-mode-text-color;
+ }
+ }
+
+ .right {
+ .toc {
+ ::ng-deep .open-button {
+ color: $dark-mode-text-color;
+ }
+ }
+ }
+}
diff --git a/src/app/components/container/footer/footer.container.ts b/src/app/components/container/footer/footer.container.ts
index e402da58e050519e2b97ad5a733582a3376f8a8d..fa7fe4db53101a57be7e2a7201196e3d6154bda2 100644
--- a/src/app/components/container/footer/footer.container.ts
+++ b/src/app/components/container/footer/footer.container.ts
@@ -28,6 +28,7 @@ import {
Output,
} from "@angular/core";
import {appActionNameSpace} from "@app/stores/app.action";
+import {AppState} from "@app/stores/app.state";
import {AppTocState} from "@app/stores/toc/app-toc.state";
import {Store} from "@ngxs/store";
import {SharedAbstractContainer} from "@shared/components/containers/shared-abstract/shared-abstract.container";
@@ -54,6 +55,7 @@ export class FooterContainer extends SharedAbstractContainer {
integrationGuideObs: Observable<string> = MemoizedUtil.select(this._store, AppTocState, state => state.integrationGuide);
apisObs: Observable<string> = MemoizedUtil.select(this._store, AppTocState, state => state.apis);
userDocumentationObs: Observable<string> = MemoizedUtil.select(this._store, AppTocState, state => state.userDocumentation);
+ darkModeObs: Observable<boolean> = MemoizedUtil.select(this._store, AppState, state => state.darkMode);
@Input()
updateVersion: string | undefined;
diff --git a/src/app/components/dialogs/privacy-policy-terms-of-use-approval/privacy-policy-terms-of-use-approval.dialog.html b/src/app/components/dialogs/privacy-policy-terms-of-use-approval/privacy-policy-terms-of-use-approval.dialog.html
index 9af4abcc1751e7d8436f0dac3fc1df042b0da293..e3296990789b4fbacda003be94257a1195b84dd1 100644
--- a/src/app/components/dialogs/privacy-policy-terms-of-use-approval/privacy-policy-terms-of-use-approval.dialog.html
+++ b/src/app/components/dialogs/privacy-policy-terms-of-use-approval/privacy-policy-terms-of-use-approval.dialog.html
@@ -1,5 +1,5 @@
<solidify-base-action-dialog [titleToTranslate]="'app.privacy-policy-terms-of-use-approval.dialog.title' | translate"
- solidifyFocusFirstElement
+ solidifyFocusFirstElement
>
<span>{{'app.privacy-policy-terms-of-use-approval.dialog.link' | translate}}</span>
<form (ngSubmit)="onSubmit()"
@@ -32,6 +32,7 @@
>
<button [mat-dialog-close]=""
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/components/dialogs/user/user.dialog.html b/src/app/components/dialogs/user/user.dialog.html
index 9792fcda99e86ef5cb99a99f15b5044fb3f28a49..e39e1a7e66631f7bbf07cac6190fc136489cda94 100644
--- a/src/app/components/dialogs/user/user.dialog.html
+++ b/src/app/components/dialogs/user/user.dialog.html
@@ -42,6 +42,7 @@
<div mat-dialog-actions>
<button [mat-dialog-close]=""
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}</button>
<button (click)="validate()"
(onEnter)="validate()"
diff --git a/src/app/components/dialogs/user/user.dialog.scss b/src/app/components/dialogs/user/user.dialog.scss
index 6ac475e12b1280da68fe29dbb3052dc057d698c9..a5c48d9c5e9acff8f066dc49a8216762d43720ea 100644
--- a/src/app/components/dialogs/user/user.dialog.scss
+++ b/src/app/components/dialogs/user/user.dialog.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
.dialog-body {
@@ -34,3 +34,11 @@
}
}
}
+
+@include isInDarkMode {
+ .dialog-body {
+ .title {
+ border-bottom-color: $dark-mode-line;
+ }
+ }
+}
diff --git a/src/app/components/presentationals/main-toolbar/abstract-main-toolbar/abstract-main-toolbar.presentational.ts b/src/app/components/presentationals/main-toolbar/abstract-main-toolbar/abstract-main-toolbar.presentational.ts
index e3e34e6f70b6817e7013dc8e8c24eca8dc430309..9c4957da158a73dcc8b25523e4319438f549b298 100644
--- a/src/app/components/presentationals/main-toolbar/abstract-main-toolbar/abstract-main-toolbar.presentational.ts
+++ b/src/app/components/presentationals/main-toolbar/abstract-main-toolbar/abstract-main-toolbar.presentational.ts
@@ -50,6 +50,7 @@ import {
ObservableUtil,
SOLIDIFY_CONSTANTS,
} from "solidify-frontend";
+import LanguageEnum = Enums.Language.LanguageEnum;
@Directive()
export abstract class AbstractMainToolbarPresentational extends SharedAbstractPresentational {
@@ -59,9 +60,6 @@ export abstract class AbstractMainToolbarPresentational extends SharedAbstractPr
@Input()
currentPath: string;
- @Input()
- currentLanguage: Enums.Language.LanguageEnum;
-
@Input()
user: User;
@@ -84,10 +82,15 @@ export abstract class AbstractMainToolbarPresentational extends SharedAbstractPr
// Theme
private readonly _themeBS: BehaviorSubject<ThemeEnum | undefined> = new BehaviorSubject<ThemeEnum | undefined>(undefined);
-
@Output("themeChange")
readonly themeObs: Observable<ThemeEnum | undefined> = ObservableUtil.asObservable(this._themeBS);
+ // Dark mode
+ private readonly _darkModeBS: BehaviorSubject<boolean | undefined> = new BehaviorSubject<boolean | undefined>(undefined);
+
+ @Output("darkModeChange")
+ readonly darkModeObs: Observable<boolean | undefined> = ObservableUtil.asObservable(this._darkModeBS);
+
isProduction: boolean = environment.production;
isDemoMode: boolean = environment.isDemoMode;
isOpen: boolean = false;
@@ -109,15 +112,49 @@ export abstract class AbstractMainToolbarPresentational extends SharedAbstractPr
this._theme = theme;
}
+ private get _language(): LanguageEnum | undefined {
+ return this._languageBS.getValue();
+ }
+
+ private set _language(value: LanguageEnum | undefined) {
+ this._languageBS.next(value);
+ }
+
+ get language(): LanguageEnum | undefined {
+ return this._language;
+ }
+
+ @Input()
+ set language(language: LanguageEnum | undefined) {
+ this._language = language;
+ }
+
+ private get _darkMode(): boolean | undefined {
+ return this._darkModeBS.getValue();
+ }
+
+ private set _darkMode(value: boolean | undefined) {
+ this._darkModeBS.next(value);
+ }
+
+ get darkMode(): boolean | undefined {
+ return this._darkMode;
+ }
+
+ @Input()
+ set darkMode(darkMode: boolean | undefined) {
+ this._darkMode = darkMode;
+ }
+
// Navigate
protected readonly _navigateBS: BehaviorSubject<string | undefined> = new BehaviorSubject<string | undefined>(undefined);
@Output("navigateChange")
readonly navigateObs: Observable<string | undefined> = ObservableUtil.asObservable(this._navigateBS);
// Language
- private readonly _languageBS: BehaviorSubject<Enums.Language.LanguageEnum | undefined> = new BehaviorSubject<Enums.Language.LanguageEnum | undefined>(undefined);
+ private readonly _languageBS: BehaviorSubject<LanguageEnum | undefined> = new BehaviorSubject<LanguageEnum | undefined>(undefined);
@Output("languageChange")
- readonly languageObs: Observable<Enums.Language.LanguageEnum | undefined> = ObservableUtil.asObservable(this._languageBS);
+ readonly languageObs: Observable<LanguageEnum | undefined> = ObservableUtil.asObservable(this._languageBS);
// Logout
private readonly _logoutBS: BehaviorSubject<void | undefined> = new BehaviorSubject<void | undefined>(undefined);
@@ -222,10 +259,6 @@ export abstract class AbstractMainToolbarPresentational extends SharedAbstractPr
this._navigateBS.next(path);
}
- useLanguage(language: Enums.Language.LanguageEnum): void {
- this._languageBS.next(language);
- }
-
toggleMenu(): void {
this.isOpen = !this.isOpen;
}
@@ -249,10 +282,6 @@ export abstract class AbstractMainToolbarPresentational extends SharedAbstractPr
logout(): void {
this._logoutBS.next();
}
-
- navigateToInstitution(): void {
- window.open(this.institutionUrl, "_blank");
- }
}
export interface MenuToolbar {
diff --git a/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.html b/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.html
index ad96fd74705dbd9f64245c27265355d04a761ede..615a5176189f252c9dbaa59691a9084722f3a72a 100644
--- a/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.html
+++ b/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.html
@@ -80,8 +80,7 @@
</solidify-icon>
</button>
- <solidify-language-selector (languageChange)="useLanguage($event)"
- [currentLanguage]="currentLanguage"
+ <solidify-language-selector [(language)]="language"
class="language-selector"
>
</solidify-language-selector>
@@ -106,6 +105,7 @@
<dlcm-user-menu (logoutChange)="logout()"
(userGuideOpen)="openUserGuide()"
[(theme)]="theme"
+ [(darkMode)]="darkMode"
[listMenuAdmin]="getListMenuAdmin()"
[photoUser]="photoUser"
[user]="user"
diff --git a/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.scss b/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.scss
index 4e857ee74b6084b9e921ad29df3c22a0b570a956..af279e03318a285f5ee4d5c1d2c7e10cf33692ae 100644
--- a/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.scss
+++ b/src/app/components/presentationals/main-toolbar/main-toolbar-desktop-horizontal/main-toolbar-desktop-horizontal.presentational.scss
@@ -1,16 +1,4 @@
-@import "src/sass/abstracts/abstracts";
-
-:host-context(body[theme='dlcm']), :host-context(body[theme='olos']) {
- .toolbar {
- // Boilerplate for theming scss depending of environment conf
- }
-}
-
-:host-context(body[theme='olos']) {
- .instance-logo {
- filter: invert(100%);
- }
-}
+@import "abstracts/abstracts";
:host {
.toolbar {
@@ -147,3 +135,16 @@
}
}
}
+
+@include isInDarkMode {
+ .toolbar {
+ background-color: $dark-mode-toolbar;
+ color: $dark-mode-text-color;
+
+ .right-part {
+ .separator {
+ background-color: $dark-mode-line;
+ }
+ }
+ }
+}
diff --git a/src/app/components/presentationals/main-toolbar/main-toolbar-mobile/main-toolbar-mobile.presentational.html b/src/app/components/presentationals/main-toolbar/main-toolbar-mobile/main-toolbar-mobile.presentational.html
index 910cbaa39333a0a311c8c31af908944030f45072..4b1539ad911ed4a5aba2d430e571c73d2723d53a 100644
--- a/src/app/components/presentationals/main-toolbar/main-toolbar-mobile/main-toolbar-mobile.presentational.html
+++ b/src/app/components/presentationals/main-toolbar/main-toolbar-mobile/main-toolbar-mobile.presentational.html
@@ -39,10 +39,7 @@
</ng-template>
</li>
<li class="language-selector-line">
- <solidify-language-selector (languageChange)="useLanguage($event)"
- [currentLanguage]="currentLanguage"
- >
- </solidify-language-selector>
+ <solidify-language-selector [(language)]="language"></solidify-language-selector>
</li>
<ng-template [ngIfElse]="loggedOut"
diff --git a/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.html b/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.html
index 0c2aa7b4447559a9eb6ff1ce51f38dad9ef6bbba..026692a648e158e4f5fa3f81fdc8296f5eda147c 100644
--- a/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.html
+++ b/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.html
@@ -4,8 +4,9 @@
(navigateChange)="changeNavigate($event)"
(searchChange)="search($event)"
(themeChange)="changeTheme($event)"
+ (darkModeChange)="changeDarkMode($event)"
(userGuideOpen)="openUserGuide()"
- [currentLanguage]="currentLanguage"
+ [language]="language"
[currentPath]="currentPath"
[displayCart]="displayCart"
[isHomePage]="isHomePage"
@@ -16,6 +17,7 @@
[numberPendingRequestNotificationInbox]="numberPendingRequestNotificationInbox"
[photoUser]="photoUser"
[theme]="theme"
+ [darkMode]="darkMode"
[userRoles]="userRoles"
[user]="user"
class="horizontal-toolbar"
@@ -27,13 +29,15 @@
(logoutChange)="logout()"
(navigateChange)="changeNavigate($event)"
(themeChange)="changeTheme($event)"
- [currentLanguage]="currentLanguage"
+ (darkModeChange)="changeDarkMode($event)"
+ [language]="language"
[currentPath]="currentPath"
[logged]="logged"
[numberArchiveInCart]="numberArchiveInCart"
[numberMyOrderReadyNew]="numberMyOrderReadyNew"
[numberPendingRequestNotificationInbox]="numberPendingRequestNotificationInbox"
[theme]="theme"
+ [darkMode]="darkMode"
[userRoles]="userRoles"
class="mobile-toolbar"
>
diff --git a/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.ts b/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.ts
index 7b44b624e76f1a363eeb5393d9c1d867d7133dd3..374f2184671ea2f4bcdd2245c493258839a375f0 100644
--- a/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.ts
+++ b/src/app/components/presentationals/main-toolbar/main-toolbar/main-toolbar.presentational.ts
@@ -51,7 +51,7 @@ export class MainToolbarPresentational extends SharedAbstractPresentational {
currentPath: string;
@Input()
- currentLanguage: Enums.Language.LanguageEnum;
+ language: Enums.Language.LanguageEnum;
@Input()
userRoles: Enums.UserApplicationRole.UserApplicationRoleEnum[];
@@ -74,6 +74,9 @@ export class MainToolbarPresentational extends SharedAbstractPresentational {
@Input()
theme: ThemeEnum;
+ @Input()
+ darkMode: boolean;
+
@Input()
logo: string;
@@ -87,6 +90,10 @@ export class MainToolbarPresentational extends SharedAbstractPresentational {
@Output("themeChange")
readonly themeObs: Observable<ThemeEnum | undefined> = ObservableUtil.asObservable(this._themeBS);
+ private readonly _darkModeBS: BehaviorSubject<boolean | undefined> = new BehaviorSubject<boolean | undefined>(undefined);
+ @Output("darkModeChange")
+ readonly darkModeObs: Observable<boolean | undefined> = ObservableUtil.asObservable(this._darkModeBS);
+
// Navigate
private readonly _navigateBS: BehaviorSubject<string | undefined> = new BehaviorSubject<string | undefined>(undefined);
@Output("navigateChange")
@@ -123,6 +130,12 @@ export class MainToolbarPresentational extends SharedAbstractPresentational {
}
}
+ changeDarkMode(darkMode: boolean): void {
+ if (this._darkModeBS.value !== darkMode) {
+ this._darkModeBS.next(darkMode);
+ }
+ }
+
changeLanguage(language: Enums.Language.LanguageEnum): void {
if (this._languageBS.value !== language) {
this._languageBS.next(language);
diff --git a/src/app/components/presentationals/user-menu/user-menu.presentational.html b/src/app/components/presentationals/user-menu/user-menu.presentational.html
index 53710881f69030710b9a7bd22b8bb68386459a98..102eed51f19776296df4546d7b3d0b51e67eb5f6 100644
--- a/src/app/components/presentationals/user-menu/user-menu.presentational.html
+++ b/src/app/components/presentationals/user-menu/user-menu.presentational.html
@@ -67,12 +67,11 @@
</button>
<button (click)="toggleDarkMode()"
(onEnter)="toggleDarkMode()"
- [disabled]="true"
mat-menu-item
solidifyShortCuts
>
- <solidify-icon [iconName]="iconNameEnum.darkMode"></solidify-icon>
- <span>{{'app.module.darkMode' | translate}}</span>
+ <solidify-icon [iconName]="darkMode ? iconNameEnum.lightMode : iconNameEnum.darkMode"></solidify-icon>
+ <span>{{(darkMode ? labelTranslateEnum.lightMode : labelTranslateEnum.darkMode) | translate}}</span>
</button>
<button (click)="logout()"
mat-menu-item
diff --git a/src/app/components/presentationals/user-menu/user-menu.presentational.ts b/src/app/components/presentationals/user-menu/user-menu.presentational.ts
index fd85d54501490ed5903aba3af973c1b4db66ca8e..5bdf873ffbd33b3038e96e144decd25f14e62637 100644
--- a/src/app/components/presentationals/user-menu/user-menu.presentational.ts
+++ b/src/app/components/presentationals/user-menu/user-menu.presentational.ts
@@ -80,6 +80,23 @@ export class UserMenuPresentational extends SharedAbstractPresentational {
this._theme = theme;
}
+ private get _darkMode(): boolean | undefined {
+ return this._darkModeChangeBS.getValue();
+ }
+
+ private set _darkMode(value: boolean | undefined) {
+ this._darkModeChangeBS.next(value);
+ }
+
+ get darkMode(): boolean | undefined {
+ return this._darkMode;
+ }
+
+ @Input()
+ set darkMode(darkMode: boolean | undefined) {
+ this._darkMode = darkMode;
+ }
+
@Input()
listMenuAdmin: MenuToolbar[];
@@ -100,6 +117,10 @@ export class UserMenuPresentational extends SharedAbstractPresentational {
@Output("themeChange")
readonly themeChangeObs: Observable<ThemeEnum | undefined> = ObservableUtil.asObservable(this._themeChangeBS);
+ private readonly _darkModeChangeBS: BehaviorSubject<boolean | undefined> = new BehaviorSubject<boolean | undefined>(undefined);
+ @Output("darkModeChange")
+ readonly darkModeChangeObs: Observable<boolean | undefined> = ObservableUtil.asObservable(this._darkModeChangeBS);
+
constructor(private readonly _dialog: MatDialog) {
super();
}
@@ -130,6 +151,6 @@ export class UserMenuPresentational extends SharedAbstractPresentational {
}
toggleDarkMode(): void {
-
+ this._darkModeChangeBS.next(!this._darkModeChangeBS.value);
}
}
diff --git a/src/app/features/admin/language/components/dialogs/admin-language-create-edit/admin-language-create-edit.dialog.html b/src/app/features/admin/language/components/dialogs/admin-language-create-edit/admin-language-create-edit.dialog.html
index fbea1a2b2d7d2528790f6d35898259704e4f797a..4ae5b145c5354aaa5c4b643cebb0f2e89f7270b3 100644
--- a/src/app/features/admin/language/components/dialogs/admin-language-create-edit/admin-language-create-edit.dialog.html
+++ b/src/app/features/admin/language/components/dialogs/admin-language-create-edit/admin-language-create-edit.dialog.html
@@ -14,6 +14,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>
{{KEY_CANCEL_BUTTON | translate}}
</button>
diff --git a/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-detail-create-update/admin-organizational-unit-additional-fields-detail-create-update.dialog.html b/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-detail-create-update/admin-organizational-unit-additional-fields-detail-create-update.dialog.html
index 4ec3c2cff15c3b53f785a4cc284e8d478bc31dd8..23e927e13f5b3f7ab11a6bc6f3900441d74bdd5a 100644
--- a/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-detail-create-update/admin-organizational-unit-additional-fields-detail-create-update.dialog.html
+++ b/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-detail-create-update/admin-organizational-unit-additional-fields-detail-create-update.dialog.html
@@ -14,6 +14,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>
{{labelTranslateEnum.close | translate}}
</button>
diff --git a/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-rename/admin-organizational-unit-additional-fields-rename.dialog.html b/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-rename/admin-organizational-unit-additional-fields-rename.dialog.html
index ac82058f5538e0613ec035c63ee478af0da437aa..b2644e22027c990b93bd74320e2e83c25501f6ae 100644
--- a/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-rename/admin-organizational-unit-additional-fields-rename.dialog.html
+++ b/src/app/features/admin/organizational-unit/components/dialogs/admin-organizational-unit-additional-fields-rename/admin-organizational-unit-additional-fields-rename.dialog.html
@@ -25,6 +25,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/admin/research-domain/components/dialogs/admin-research-domain-create-edit/admin-research-domain-create-edit.dialog.html b/src/app/features/admin/research-domain/components/dialogs/admin-research-domain-create-edit/admin-research-domain-create-edit.dialog.html
index c8ab25b8875b51179132ce9e0ef7f191013a939a..52c9e68d6e30a6a59e4197ab455b5d63fd1718e1 100644
--- a/src/app/features/admin/research-domain/components/dialogs/admin-research-domain-create-edit/admin-research-domain-create-edit.dialog.html
+++ b/src/app/features/admin/research-domain/components/dialogs/admin-research-domain-create-edit/admin-research-domain-create-edit.dialog.html
@@ -15,6 +15,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>
{{KEY_CANCEL_BUTTON | translate}}
</button>
diff --git a/src/app/features/admin/user/components/dialogs/admin-user-edit-role-current-user/admin-user-edit-role-current-user.dialog.html b/src/app/features/admin/user/components/dialogs/admin-user-edit-role-current-user/admin-user-edit-role-current-user.dialog.html
index a100ee17d794c03ba5f4e15e621878974d6c5caa..7fafe858db6b185bd943c7da17a8242e79af5f22 100644
--- a/src/app/features/admin/user/components/dialogs/admin-user-edit-role-current-user/admin-user-edit-role-current-user.dialog.html
+++ b/src/app/features/admin/user/components/dialogs/admin-user-edit-role-current-user/admin-user-edit-role-current-user.dialog.html
@@ -32,6 +32,7 @@
<button [mat-dialog-close]=""
[solidifyFocusFirstElement]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.cancel | translate}}</button>
<button (click)="confirm()"
(onEnter)="confirm()"
diff --git a/src/app/features/deposit/components/containers/deposit-file/deposit-file.container.scss b/src/app/features/deposit/components/containers/deposit-file/deposit-file.container.scss
index a5bad7f6bdcc341283d3685d62b5b3dad0d82492..6ad277ba48454c4929e6a815e2101641cbbb0e94 100644
--- a/src/app/features/deposit/components/containers/deposit-file/deposit-file.container.scss
+++ b/src/app/features/deposit/components/containers/deposit-file/deposit-file.container.scss
@@ -1,5 +1,5 @@
@import "solidify-frontend/lib/components/routables/abstract-detail-edit-common/abstract-detail-edit-common.routable";
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
padding: 0;
@@ -79,3 +79,17 @@
}
}
}
+
+@include isInDarkMode {
+ .header {
+ .left-part {
+ .selector-file-view-mode {
+ a {
+ &:not(.is-active) {
+ color: $dark-mode-text-disabled;
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.html b/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.html
index 585257286ac77f333de35bce991c277400867a31..c7254dab59c7bdfb83ed8fc1f31c6de40f45bf23 100644
--- a/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.html
@@ -1,11 +1,11 @@
<solidify-base-action-dialog [titleToTranslate]="'deposit.aip.modal.title.main' | translate">
<h2>{{'deposit.aip.modal.title.search' | translate }}</h2>
<solidify-search-input (valueChange)="search($event)"
- [appearance]="appearanceInputMaterial"
- [labelToTranslate]="labelTranslateEnum.nameLabel"
- [searchAutoFocus]="false"
- [value]="searchObs | async"
- class="search-bar"
+ [appearance]="appearanceInputMaterial"
+ [labelToTranslate]="labelTranslateEnum.nameLabel"
+ [searchAutoFocus]="false"
+ [value]="searchObs | async"
+ class="search-bar"
>
</solidify-search-input>
@@ -39,6 +39,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.scss b/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.scss
index 2edf8273ca6ca488089999763e6e99e99e2a0819..08ad6a78db3700e7e531c7f2e8b9dfc31ebc41cc 100644
--- a/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.scss
+++ b/src/app/features/deposit/components/dialogs/deposit-aip-upload/deposit-aip-upload.dialog.scss
@@ -1,19 +1,37 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
-li {
- &.aip-item {
- background-color: $extra-light-grey;
- margin: 0;
- padding: 8px 10px;
- cursor: pointer;
- }
+:host {
+ li {
+ &.aip-item {
+ background-color: $extra-light-grey;
+ margin: 0;
+ padding: 8px 10px;
+ cursor: pointer;
+ }
+
+ &:nth-child(odd) {
+ background-color: $extra-ultra-light-grey;
+ }
- &:nth-child(odd) {
- background-color: $extra-ultra-light-grey;
+ &.selected {
+ background-color: $primary-color;
+ color: $white;
+ }
}
+}
+
+@include isInDarkMode {
+ li {
+ &.aip-item {
+ background-color: $dark-mode-background;
+ }
+
+ &:nth-child(odd) {
+ background-color: $dark-mode-toolbar;
+ }
- &.selected {
- background-color: $primary-color;
- color: $white;
+ &.selected {
+ background-color: $primary-color;
+ }
}
}
diff --git a/src/app/features/deposit/components/dialogs/deposit-file-change-data-category/deposit-file-change-data-category.dialog.html b/src/app/features/deposit/components/dialogs/deposit-file-change-data-category/deposit-file-change-data-category.dialog.html
index 6458434fa84272b035805e50edb79c493467cca5..6603d30dcf34b8f37af579c4db8fff9fc744122a 100644
--- a/src/app/features/deposit/components/dialogs/deposit-file-change-data-category/deposit-file-change-data-category.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-file-change-data-category/deposit-file-change-data-category.dialog.html
@@ -59,6 +59,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/dialogs/deposit-file-move/deposit-file-move.dialog.html b/src/app/features/deposit/components/dialogs/deposit-file-move/deposit-file-move.dialog.html
index 0bd38cf077446dd9cabc8b0ac8ed3048e95e9396..96a6e7bb22b7e10de5eccc2dbdc5aec2e8b78ae1 100644
--- a/src/app/features/deposit/components/dialogs/deposit-file-move/deposit-file-move.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-file-move/deposit-file-move.dialog.html
@@ -24,6 +24,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/dialogs/deposit-file-upload-archive/deposit-file-upload-archive.dialog.html b/src/app/features/deposit/components/dialogs/deposit-file-upload-archive/deposit-file-upload-archive.dialog.html
index a5493637f0e315b39f52ca5decbff478b7ee39ba..6ee024e28c58eda7d4886ff9172967b3b19fc2c7 100644
--- a/src/app/features/deposit/components/dialogs/deposit-file-upload-archive/deposit-file-upload-archive.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-file-upload-archive/deposit-file-upload-archive.dialog.html
@@ -115,6 +115,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.html b/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.html
index 62cf736207c86a591833bb9ec68f38df2930d882..accff98f76139cc6a720031f5f552754e3a471a6 100644
--- a/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.html
@@ -115,7 +115,8 @@
{{labelTranslateEnum.provideChecksums | translate}}
</mat-checkbox>
<div class="checksum-generated-indicator">{{labelTranslateEnum.checksums | translate}} :
- <span *ngIf="formValidationHelper.getFormControl(formGroup, formDefinitionChecksum.checksumGeneratedIsLoadingCounter)?.value > 0; else noPending"
+ <span *ngIf="formValidationHelper.getFormControl(formGroup, formDefinitionChecksum.checksumGeneratedIsLoadingCounter)?.value > 0; else
+ noPending"
class="calculating"
>
{{labelTranslateEnum.calculating | translate}}
@@ -248,6 +249,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.scss b/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.scss
index a98dac6d08fc8d5ea0d84e78557173476c00642a..911b298823711734f6d864d73f70634fffb3453c 100644
--- a/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.scss
+++ b/src/app/features/deposit/components/dialogs/deposit-file-upload/deposit-file-upload.dialog.scss
@@ -59,3 +59,15 @@
opacity: 1;
}
}
+
+@include isInDarkMode {
+ .expansion-panel {
+ .checksum-header-wrapper {
+ .checksum-generated-indicator {
+ .calculating {
+ background-color: $dark-mode-toolbar;
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/features/deposit/components/dialogs/deposit-order-author/deposit-order-author.dialog.html b/src/app/features/deposit/components/dialogs/deposit-order-author/deposit-order-author.dialog.html
index 12f7f0c97b84fa2ea377454c78f08334793fb4ee..abe74da23d2ee4baea2acc31204413d85e1e95e2 100644
--- a/src/app/features/deposit/components/dialogs/deposit-order-author/deposit-order-author.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-order-author/deposit-order-author.dialog.html
@@ -33,6 +33,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}</button>
<button (click)="validate()"
color="primary"
diff --git a/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.html b/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.html
index 8c35b2a2e94fd3be97b7b610ecfde01406fd78ae..05a354ba1f52ecc466c317d8e458a82bcc3122b0 100644
--- a/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.html
@@ -52,6 +52,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}</button>
<button (click)="submit(selectedDepositPerson)"
[disabled]="!selectedDepositPerson"
diff --git a/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.scss b/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.scss
index 0c6a2e1b202401e8f19e5bacc0a657f83dc4fe84..2c3a7ada758bed6eb2f55a4f138c023fce21a663 100644
--- a/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.scss
+++ b/src/app/features/deposit/components/dialogs/deposit-person-alternative/deposit-person-alternative.dialog.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
::ng-deep {
@@ -63,4 +63,18 @@
}
}
+@include isInDarkMode {
+ ::ng-deep .mat-list-item {
+ &:nth-child(even) {
+ background-color: $dark-mode-toolbar;
+ }
+
+ &:focus {
+ background-color: $dark-mode-menu-active;
+ }
+ &.is-active {
+ background-color: $primary-color;
+ }
+ }
+}
diff --git a/src/app/features/deposit/components/dialogs/deposit-person/deposit-person.dialog.html b/src/app/features/deposit/components/dialogs/deposit-person/deposit-person.dialog.html
index 5c3b1f2d4691d594d73e1a0ab349416336fc1cbc..ee8e60a3c0df959df3f89470e6899f7a5981baab 100644
--- a/src/app/features/deposit/components/dialogs/deposit-person/deposit-person.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-person/deposit-person.dialog.html
@@ -12,6 +12,7 @@
<button [mat-dialog-close]=""
[solidifyAutoFocus]="true"
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}</button>
<button (click)="formPresentational?.onSubmit()"
[disabled]="!formPresentational?.form.valid || !formPresentational?.form.dirty || (isLoadingPersonObs | async)"
diff --git a/src/app/features/deposit/components/dialogs/deposit-reject/deposit-reject.dialog.html b/src/app/features/deposit/components/dialogs/deposit-reject/deposit-reject.dialog.html
index 1c61995118a1f7925207c3af2f30f065baede884..60bf7a4ea6aef66f46674b51cc36e9ca46695566 100644
--- a/src/app/features/deposit/components/dialogs/deposit-reject/deposit-reject.dialog.html
+++ b/src/app/features/deposit/components/dialogs/deposit-reject/deposit-reject.dialog.html
@@ -25,6 +25,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/deposit/components/presentationals/deposit-form/deposit-form.presentational.scss b/src/app/features/deposit/components/presentationals/deposit-form/deposit-form.presentational.scss
index 904464be1a37389fa39b1ff2b123c60c3a98b88a..84e6ba0d2e91e0e34bd5a049709ab04c793240b1 100644
--- a/src/app/features/deposit/components/presentationals/deposit-form/deposit-form.presentational.scss
+++ b/src/app/features/deposit/components/presentationals/deposit-form/deposit-form.presentational.scss
@@ -2,9 +2,7 @@
@import "abstracts/abstracts";
:host {
-
form {
-
.header {
display: grid;
grid-template-columns: max-content max-content;
@@ -15,7 +13,6 @@
}
.org-unit {
-
font-size: 20px;
padding-bottom: 18px;
white-space: nowrap;
@@ -105,3 +102,19 @@
}
}
}
+
+@include isInDarkMode {
+ form {
+ .header {
+ .org-unit {
+ .label {
+ color: $dark-mode-text-disabled;
+ }
+
+ .name {
+ color: $dark-mode-text-color;
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/features/deposit/components/routables/deposit-list/deposit-list.routable.scss b/src/app/features/deposit/components/routables/deposit-list/deposit-list.routable.scss
index 72e109fd72b48254c3361195e940a01bbb61f4ac..e6d6639256cb1a5ebf2597d057cef75ef7b76966 100644
--- a/src/app/features/deposit/components/routables/deposit-list/deposit-list.routable.scss
+++ b/src/app/features/deposit/components/routables/deposit-list/deposit-list.routable.scss
@@ -1,7 +1,6 @@
@import "solidify-frontend/lib/components/routables/abstract-list/abstract-list.routable";
@import "abstracts/abstracts";
-
:host {
.toolbar-wrapper {
display: flex;
@@ -74,3 +73,23 @@
}
}
}
+
+@include isInDarkMode {
+ .toolbar-wrapper {
+ background-color: $dark-mode-background;
+ box-shadow: 0 0 0 $dark-mode-background, 0 -2px 0 $dark-mode-background; // avoid glitch when play with zooming on browser
+
+ }
+
+ .tab-header {
+ background-color: $dark-mode-background;
+
+ ::ng-deep {
+ .mat-tab-labels {
+ .mat-tab-label {
+ color: $dark-mode-text-color;
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/features/home/components/dialogs/archive-restricted-request-access/home-archive-restricted-request-access-dialog.component.html b/src/app/features/home/components/dialogs/archive-restricted-request-access/home-archive-restricted-request-access-dialog.component.html
index 25819b3271f1825ec06c5cb6894be30f3b6103ff..866edc1edcb0642edb011a0bc4ae0a2b9518e785 100644
--- a/src/app/features/home/components/dialogs/archive-restricted-request-access/home-archive-restricted-request-access-dialog.component.html
+++ b/src/app/features/home/components/dialogs/archive-restricted-request-access/home-archive-restricted-request-access-dialog.component.html
@@ -25,6 +25,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/features/home/components/presentationals/home-archive-form/home-archive-detail.presentational.scss b/src/app/features/home/components/presentationals/home-archive-form/home-archive-detail.presentational.scss
index 84467a113e7fdf2161b3ddfd01818d8261e35698..5de47af17e0bee434b6cd730656be474a7693790 100644
--- a/src/app/features/home/components/presentationals/home-archive-form/home-archive-detail.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-archive-form/home-archive-detail.presentational.scss
@@ -184,7 +184,7 @@ $padding-bottom-desktop: 20px;
line-height: 1.42857143;
word-break: break-all;
word-wrap: break-word;
- background-color: #f5f5f5;
+ background-color: $white;
border: 1px solid #ccc;
border-radius: 4px;
overflow-x: auto;
@@ -243,3 +243,22 @@ $padding-bottom-desktop: 20px;
padding-top: 20px;
}
}
+
+
+@include isInDarkMode {
+ .shared-detail-presentation {
+ .image-wrapper {
+ border-color: $dark-mode-line;
+ }
+
+ .title {
+ color: $dark-mode-text-color;
+ }
+ }
+
+ .pre {
+ border-color: $dark-mode-line;
+ background-color: #0d1117;
+ }
+}
+
diff --git a/src/app/features/home/components/presentationals/home-main-page-content/home-main-page-content.presentational.scss b/src/app/features/home/components/presentationals/home-main-page-content/home-main-page-content.presentational.scss
index ebca9d8b8b6d2a363e52702a110438235625ce50..ba7b80cfd09784eb2b915666f51b72e3432957e9 100644
--- a/src/app/features/home/components/presentationals/home-main-page-content/home-main-page-content.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-main-page-content/home-main-page-content.presentational.scss
@@ -5,10 +5,10 @@
grid-template-columns: 1fr max-content;
grid-gap: 20px;
background-color: $extra-ultra-light-grey;
- border-radius: 2px;
padding: 20px;
align-items: center;
max-height: 420px;
+ border-radius: 8px;
.buttons {
height: 100%;
@@ -30,3 +30,7 @@
}
}
}
+
+@include isInDarkMode {
+ background-color: $dark-mode-toolbar;
+}
diff --git a/src/app/features/home/components/presentationals/home-partners/home-partners.presentational.scss b/src/app/features/home/components/presentationals/home-partners/home-partners.presentational.scss
index cdcd99ed84ef2eb3ac10dfad4cf062456d01598f..17f04bac279df9a8d7b1fb1c2d9e8a275ec43a67 100644
--- a/src/app/features/home/components/presentationals/home-partners/home-partners.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-partners/home-partners.presentational.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
.title {
@@ -73,3 +73,14 @@
}
}
}
+
+@include isInDarkMode {
+ .title {
+ border-bottom-color: $dark-mode-line;
+ }
+
+ .list-logo-wrapper {
+ background-color: $white;
+ border-radius: 8px;
+ }
+}
diff --git a/src/app/features/home/components/presentationals/home-rss-wrapper/home-rss-wrapper.presentational.scss b/src/app/features/home/components/presentationals/home-rss-wrapper/home-rss-wrapper.presentational.scss
index 0a265777058833a812faffdeb1def368289f3d97..5b48eaa1055f057e65009085a9f6af167d44f63f 100644
--- a/src/app/features/home/components/presentationals/home-rss-wrapper/home-rss-wrapper.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-rss-wrapper/home-rss-wrapper.presentational.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
.rss-wrapper {
display: flex;
diff --git a/src/app/features/home/components/presentationals/home-search-bar/home-search-bar.presentational.scss b/src/app/features/home/components/presentationals/home-search-bar/home-search-bar.presentational.scss
index afee336b2bd3958063a1d9375b2e33efee1e4373..57360f8c677972424738af146e29cc60dd79587f 100644
--- a/src/app/features/home/components/presentationals/home-search-bar/home-search-bar.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-search-bar/home-search-bar.presentational.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
display: block;
@@ -13,9 +13,12 @@
height: 35px;
.input {
+ border: none;
+ background-color: transparent;
padding-left: 20px;
text-align: left;
padding-top: 4px;
+ color: $text-color;
}
}
}
diff --git a/src/app/features/home/components/presentationals/home-search-facet/home-search-facet.presentational.scss b/src/app/features/home/components/presentationals/home-search-facet/home-search-facet.presentational.scss
index 774e2c2ba8dbd346661be530f6ab28aa76d41323..595508e504d8d7c434ffcc258fc8862c3e010e06 100644
--- a/src/app/features/home/components/presentationals/home-search-facet/home-search-facet.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-search-facet/home-search-facet.presentational.scss
@@ -105,3 +105,9 @@ $padding-left-right: 20px;
}
}
+
+@include isInDarkMode {
+ .panel {
+ background: $dark-mode-toolbar;
+ }
+}
diff --git a/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.scss b/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..9dab6e2be3cb760f9a68789dcb7f2fc8bfef9169 100644
--- a/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.scss
+++ b/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.scss
@@ -0,0 +1,2 @@
+@import "abstracts/abstracts";
+
diff --git a/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.ts b/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.ts
index 860eb789fef64eba791d3690b1d616f4d0b888cb..059d91fd22b5c4562f33c9fee74fe17470ab543e 100644
--- a/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.ts
+++ b/src/app/features/home/components/presentationals/home-tweet-detail/home-twitter-widget.presentational.ts
@@ -40,11 +40,17 @@ import {
} from "@app/features/home/models/twitter-widget.model";
import {TwitterService} from "@app/features/home/services/twitter.service";
import {SharedAbstractPresentational} from "@app/shared/components/presentationals/shared-abstract/shared-abstract.presentational";
+import {AppState} from "@app/stores/app.state";
+import {Store} from "@ngxs/store";
import {
catchError,
+ take,
tap,
} from "rxjs/operators";
-import {LoggingService} from "solidify-frontend";
+import {
+ LoggingService,
+ MemoizedUtil,
+} from "solidify-frontend";
@Component({
selector: "dlcm-home-twitter-widget-presentational",
@@ -75,12 +81,13 @@ export class HomeTwitterWidgetPresentational extends SharedAbstractPresentationa
height: number | undefined;
@Input()
- chrome: TwitterChromeEnum[] = [TwitterChromeEnum.noborders];
+ chrome: TwitterChromeEnum[] = [TwitterChromeEnum.noborders, TwitterChromeEnum.transparent];
constructor(private readonly _renderer: Renderer2,
private readonly _element: ElementRef,
private readonly _twitterService: TwitterService,
private readonly _loggingService: LoggingService,
+ private readonly _store: Store,
@Inject(WINDOW) private readonly _window: Window) {
super();
}
@@ -89,6 +96,7 @@ export class HomeTwitterWidgetPresentational extends SharedAbstractPresentationa
// https://developer.twitter.com/en/docs/twitter-for-websites/javascript-api/guides/scripting-factory-functions
this.subscribe(this._twitterService.loadScript(this._renderer)
.pipe(
+ take(1),
tap((twitterMetadata: TwitterMetadata) => {
const nativeElement: Element = this._element.nativeElement;
const dataSource: DataSource = {
@@ -97,6 +105,7 @@ export class HomeTwitterWidgetPresentational extends SharedAbstractPresentationa
userId: this.userId,
};
const options: Options = {
+ theme: MemoizedUtil.selectSnapshot(this._store, AppState, state => state.darkMode) ? "dark" : undefined,
tweetLimit: this.tweetLimit,
height: this.height,
chrome: this.chrome,
@@ -104,11 +113,19 @@ export class HomeTwitterWidgetPresentational extends SharedAbstractPresentationa
borderColor: this.borderColor,
};
- twitterMetadata.widgets.createTimeline(dataSource, nativeElement, options)
- .then((iframe: any) => {})
- .catch((message: string) => {
- this._loggingService.logWarning("Twitter : Could not create widget", message);
- });
+ this.subscribe(MemoizedUtil.select(this._store, AppState, state => state.darkMode).pipe(
+ tap(enabled => {
+ const list: NodeList = this._element.nativeElement.querySelectorAll("iframe");
+ list.forEach(node => {
+ this._element.nativeElement.removeChild(node);
+ });
+ options.theme = enabled ? "dark" : undefined;
+ twitterMetadata.widgets.createTimeline(dataSource, nativeElement, options)
+ .then((iframe: any) => {})
+ .catch((message: string) => {
+ this._loggingService.logWarning("Twitter : Could not create widget", message);
+ });
+ })));
}),
catchError((err: any) => {
this._loggingService.logWarning("Twitter : Error loading twitter widget", err);
diff --git a/src/app/features/home/components/presentationals/home-tweet-wrapper/home-tweeter-wrapper.presentational.ts b/src/app/features/home/components/presentationals/home-tweet-wrapper/home-tweeter-wrapper.presentational.ts
index 84f5e90da3fb0971845bbf5ea9a44ae704156472..45a2c4134eabd251f30ea873842b8a8e11a184af 100644
--- a/src/app/features/home/components/presentationals/home-tweet-wrapper/home-tweeter-wrapper.presentational.ts
+++ b/src/app/features/home/components/presentationals/home-tweet-wrapper/home-tweeter-wrapper.presentational.ts
@@ -28,7 +28,7 @@ import {
import {TwitterChromeEnum} from "@app/features/home/enums/twitter-chrome.enum";
import {TwitterSourceTypeEnum} from "@app/features/home/enums/twitter-source-type.enum";
import {SharedAbstractPresentational} from "@app/shared/components/presentationals/shared-abstract/shared-abstract.presentational";
-import {environment} from "../../../../../../environments/environment";
+import {environment} from "@environments/environment";
@Component({
selector: "dlcm-home-twitter-wrapper-presentational",
@@ -40,5 +40,5 @@ export class HomeTwitterWrapperPresentational extends SharedAbstractPresentation
readonly sourceType: string = TwitterSourceTypeEnum.profile;
readonly screenName: string = environment.twitterAccount;
readonly tweetLimit: number = environment.twitterTweetToDisplay;
- readonly chrome: TwitterChromeEnum[] = [TwitterChromeEnum.noborders];
+ readonly chrome: TwitterChromeEnum[] = [TwitterChromeEnum.noborders, TwitterChromeEnum.transparent];
}
diff --git a/src/app/features/home/components/routables/home-page/home-page.routable.scss b/src/app/features/home/components/routables/home-page/home-page.routable.scss
index 809777af941addfd8ace355af4a586418d4c9cb9..b0b71e43f94774d5ea880997460db2667344a0e7 100644
--- a/src/app/features/home/components/routables/home-page/home-page.routable.scss
+++ b/src/app/features/home/components/routables/home-page/home-page.routable.scss
@@ -117,9 +117,10 @@
@include content();
}
-:host-context(body[theme='election']) {
- .toolbar-size-guard,
- .toolbar-wrapper {
- height: 600px;
+@include isInDarkMode {
+ .news-wrapper {
+ > .separator {
+ border-color: $dark-mode-line;
+ }
}
}
diff --git a/src/app/features/home/models/twitter-widget.model.ts b/src/app/features/home/models/twitter-widget.model.ts
index 668048792db05bca9ffaaa4785f5282fb0c4fb3d..16fe2d5206e65630adfc64f0119323caf1df770b 100644
--- a/src/app/features/home/models/twitter-widget.model.ts
+++ b/src/app/features/home/models/twitter-widget.model.ts
@@ -36,6 +36,7 @@ export class DataSource {
export class Options {
tweetLimit?: number;
+ theme?: string;
height?: number;
chrome?: TwitterChromeEnum[];
ariaPolite?: string;
diff --git a/src/app/features/order/features/all-order/components/presentationals/all-order-form/order-all-order-form.presentational.scss b/src/app/features/order/features/all-order/components/presentationals/all-order-form/order-all-order-form.presentational.scss
index 6ead70cb312b81a3d1a557d607e5210839c9e742..1c081bca258a568550eaf891cae3c719bce8af8a 100644
--- a/src/app/features/order/features/all-order/components/presentationals/all-order-form/order-all-order-form.presentational.scss
+++ b/src/app/features/order/features/all-order/components/presentationals/all-order-form/order-all-order-form.presentational.scss
@@ -1,2 +1,2 @@
@import "solidify-frontend/lib/components/presentationals/abstract-form/abstract-form.presentational";
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
diff --git a/src/app/features/order/features/all-order/components/routables/all-order-detail-edit/order-all-order-detail-edit.routable.scss b/src/app/features/order/features/all-order/components/routables/all-order-detail-edit/order-all-order-detail-edit.routable.scss
index a923ff10611f534601b845bdbc364444296aa729..b233b4b0f14bcb69f2f7c601ae291ff005857a1f 100644
--- a/src/app/features/order/features/all-order/components/routables/all-order-detail-edit/order-all-order-detail-edit.routable.scss
+++ b/src/app/features/order/features/all-order/components/routables/all-order-detail-edit/order-all-order-detail-edit.routable.scss
@@ -1,5 +1,5 @@
@import "solidify-frontend/lib/components/routables/abstract-detail-edit-common/abstract-detail-edit-common.routable";
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
.wrapper {
@@ -12,7 +12,6 @@
display: flex;
flex-direction: column;
align-items: center;
- background-color: $white;
h2 {
margin: 0;
diff --git a/src/app/features/order/features/my-order/components/presentationals/my-order/order-my-order.presentational.scss b/src/app/features/order/features/my-order/components/presentationals/my-order/order-my-order.presentational.scss
index 8bd2e26402d69aaaa0ead1a3947deb68e8f1e0fd..71febb516721db38d28d2e872417cd928b8eb551 100644
--- a/src/app/features/order/features/my-order/components/presentationals/my-order/order-my-order.presentational.scss
+++ b/src/app/features/order/features/my-order/components/presentationals/my-order/order-my-order.presentational.scss
@@ -134,3 +134,9 @@
}
}
}
+
+@include isInDarkMode {
+ .archives {
+ border-right-color: $dark-mode-line;
+ }
+}
diff --git a/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-access/preservation-space-organizational-unit-request-access.dialog.html b/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-access/preservation-space-organizational-unit-request-access.dialog.html
index 6127a20ccc91aa954c809214510d5b02c875a6f0..99c2e581b1fa7a64201a6bfdd29b7a1894c30bb0 100644
--- a/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-access/preservation-space-organizational-unit-request-access.dialog.html
+++ b/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-access/preservation-space-organizational-unit-request-access.dialog.html
@@ -46,6 +46,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="validate()"
diff --git a/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-creation/preservation-space-organizational-unit-request-creation.dialog.html b/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-creation/preservation-space-organizational-unit-request-creation.dialog.html
index 67688445fc9489879a41543764ae1ed31568e90c..b86d47f4f4113136ec9637ae514d1cef2533f754 100644
--- a/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-creation/preservation-space-organizational-unit-request-creation.dialog.html
+++ b/src/app/features/preservation-space/organizational-unit/components/dialogs/organizational-unit-request-creation/preservation-space-organizational-unit-request-creation.dialog.html
@@ -42,6 +42,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/icons.ts b/src/app/icons.ts
index 2d17ea1a6d48a141bffd09fb097ebbdfec067cce..7cd66e51f93e80a260c7813db71abb91d718fb24 100644
--- a/src/app/icons.ts
+++ b/src/app/icons.ts
@@ -726,7 +726,12 @@ export const icons: IconInfos[] = [
{
name: IconNameEnum.darkMode,
lib: IconLibEnum.materialIcon,
- icon: "brightness_medium",
+ icon: "bedtime",
+ },
+ {
+ name: IconNameEnum.lightMode,
+ lib: IconLibEnum.materialIcon,
+ icon: "brightness_5",
},
{
name: IconNameEnum.creationDate,
diff --git a/src/app/label-translate-solidify.ts b/src/app/label-translate-solidify.ts
index da122e32b38b9bb6470d83ebbdc839473f4992a1..9229d8bedac9b8c708e3cb8296fbe7e042f516b9 100644
--- a/src/app/label-translate-solidify.ts
+++ b/src/app/label-translate-solidify.ts
@@ -164,6 +164,8 @@ export const labelTranslateSolidify: LabelTranslateInterface = {
cookieConsentDownloadTokenTitle: MARK_AS_TRANSLATABLE("cookieConsentSidebar.downloadToken.title"),
cookieConsentSidebarLanguageDescription: MARK_AS_TRANSLATABLE("cookieConsentSidebar.language.description"),
cookieConsentSidebarLanguageTitle: MARK_AS_TRANSLATABLE("cookieConsentSidebar.language.title"),
+ cookieConsentSidebarDarkModeDescription: MARK_AS_TRANSLATABLE("cookieConsentSidebar.darkMode.description"),
+ cookieConsentSidebarDarkModeTitle: MARK_AS_TRANSLATABLE("cookieConsentSidebar.darkMode.title"),
cookieConsentSidebarPersonalizeCookieDescription: MARK_AS_TRANSLATABLE("cookieConsentSidebar.personalizeCookie.description"),
cookieConsentSidebarPersonalizeCookieTitle: MARK_AS_TRANSLATABLE("cookieConsentSidebar.personalizeCookie.title"),
cookieConsentSidebarTitle: MARK_AS_TRANSLATABLE("cookieConsentSidebar.title"),
diff --git a/src/app/shared/components/containers/shared-file-and-aip-information/shared-file-and-aip-information.container.scss b/src/app/shared/components/containers/shared-file-and-aip-information/shared-file-and-aip-information.container.scss
index 1b5403d7205a46b6719da9f6c344d8f76d3f5bc3..804f7979b0307fd2d51d8c5e10a1e3ba40ecd6ca 100644
--- a/src/app/shared/components/containers/shared-file-and-aip-information/shared-file-and-aip-information.container.scss
+++ b/src/app/shared/components/containers/shared-file-and-aip-information/shared-file-and-aip-information.container.scss
@@ -162,3 +162,30 @@
}
}
+
+@include isInDarkMode {
+ .container {
+ .visualization {
+ &.fullscreen {
+ background-color: $dark-mode-background;
+ }
+ }
+
+ .informations {
+ .item-content {
+ .key {
+ color: $dark-mode-text-disabled;
+ }
+ }
+ }
+
+ .no-preview {
+ border-color: $dark-mode-line;
+
+ .package {
+ background: $white;
+ color: $black;
+ }
+ }
+ }
+}
diff --git a/src/app/shared/components/containers/shared-image-upload-wrapper/shared-image-upload-wrapper.container.scss b/src/app/shared/components/containers/shared-image-upload-wrapper/shared-image-upload-wrapper.container.scss
index ad311d123dd79579b97e3924c03bae9b48653e14..70ddaa746648656c8371926f110a23e28c031504 100644
--- a/src/app/shared/components/containers/shared-image-upload-wrapper/shared-image-upload-wrapper.container.scss
+++ b/src/app/shared/components/containers/shared-image-upload-wrapper/shared-image-upload-wrapper.container.scss
@@ -40,3 +40,9 @@ $size-height: 300px;
}
}
}
+
+@include isInDarkMode {
+ .wrapper-avatar {
+ border-color: $dark-mode-line;
+ }
+}
diff --git a/src/app/shared/components/containers/shared-table-person-orgunit-role/shared-table-person-orgunit-role.container.scss b/src/app/shared/components/containers/shared-table-person-orgunit-role/shared-table-person-orgunit-role.container.scss
index 774110de493780925f0f15ed7d36d04b54b6f79a..65455ffeb99ea56b7b92089ebb4e511ac40a6267 100644
--- a/src/app/shared/components/containers/shared-table-person-orgunit-role/shared-table-person-orgunit-role.container.scss
+++ b/src/app/shared/components/containers/shared-table-person-orgunit-role/shared-table-person-orgunit-role.container.scss
@@ -12,7 +12,6 @@
table {
width: 100%;
border-spacing: 0;
- padding-bottom: 10px;
thead {
background-color: $primary-color;
@@ -61,9 +60,32 @@
}
.no-item {
- padding-top: 10px;
+ padding: 20px 10px;
text-align: center;
color: $light-grey;
font-size: 16px;
}
}
+
+@include isInDarkMode {
+ :host(.disabled) {
+ .no-item {
+ color: $dark-mode-text-disabled;
+ }
+ }
+
+ table {
+ tbody {
+ tr {
+ &:nth-child(odd) {
+ background-color: $dark-mode-toolbar;
+ }
+ }
+ }
+ }
+
+ .no-item {
+ background-color: $dark-mode-toolbar;
+ color: $dark-mode-text-color;
+ }
+}
diff --git a/src/app/shared/components/containers/shared-userguide-sidebar/shared-userguide-sidebar.container.scss b/src/app/shared/components/containers/shared-userguide-sidebar/shared-userguide-sidebar.container.scss
index f2d6b05a6a0759e8fc96a487d82c20f65148fd2c..af86c72a509d7c960d2592ff4c299ce5d94035e5 100644
--- a/src/app/shared/components/containers/shared-userguide-sidebar/shared-userguide-sidebar.container.scss
+++ b/src/app/shared/components/containers/shared-userguide-sidebar/shared-userguide-sidebar.container.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
display: flex;
@@ -8,7 +8,7 @@
top: 0;
right: 0;
width: 400px;
- background: white;
+ background: $white;
height: 100vh;
z-index: $z-index-main-toolbar-userguide-sidebar;
box-shadow: 0 8px 10px -4px #5858582e;
@@ -83,3 +83,23 @@
:host(.hide) {
display: none;
}
+
+@include isInDarkMode {
+ .user-guide-sidebar {
+ background: $dark-mode-background;
+
+ .list ::ng-deep {
+ ul {
+ li {
+ a {
+ color: $dark-mode-text-color;
+
+ &:hover {
+ background-color: $dark-mode-menu-active;
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/shared/components/dialogs/shared-upload-image/shared-upload-image.dialog.html b/src/app/shared/components/dialogs/shared-upload-image/shared-upload-image.dialog.html
index 6358c89e46b60259df1d39f3758093182554e684..938b87d0cdc448b2ab384b647f8661b35fad98fb 100644
--- a/src/app/shared/components/dialogs/shared-upload-image/shared-upload-image.dialog.html
+++ b/src/app/shared/components/dialogs/shared-upload-image/shared-upload-image.dialog.html
@@ -28,6 +28,7 @@
>
<button [mat-dialog-close]=""
mat-button
+ color="primary"
>{{labelTranslateEnum.cancel | translate}}</button>
<button (click)="confirm()"
[disabled]="(imageCropped | isNullOrUndefined)"
diff --git a/src/app/shared/components/presentationals/shared-archive-tile/shared-archive-tile.presentational.scss b/src/app/shared/components/presentationals/shared-archive-tile/shared-archive-tile.presentational.scss
index 18d0fcd613686090232230b64fa87bd055ac5bc0..c093a07586074e9098a901463aa2ff37c37052fa 100644
--- a/src/app/shared/components/presentationals/shared-archive-tile/shared-archive-tile.presentational.scss
+++ b/src/app/shared/components/presentationals/shared-archive-tile/shared-archive-tile.presentational.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
$size-image: 125px;
@@ -197,3 +197,7 @@ $size-image: 125px;
}
}
}
+
+@include isInDarkMode {
+ border-color: $dark-mode-line;
+}
diff --git a/src/app/shared/components/presentationals/shared-checksum-item/shared-checksum-item.presentational.scss b/src/app/shared/components/presentationals/shared-checksum-item/shared-checksum-item.presentational.scss
index 3b47ce8fbe550463f54a47e32aedc21b0b390f67..066e1e0db9dde0b5c8dcbeaf543f94ab952085e1 100644
--- a/src/app/shared/components/presentationals/shared-checksum-item/shared-checksum-item.presentational.scss
+++ b/src/app/shared/components/presentationals/shared-checksum-item/shared-checksum-item.presentational.scss
@@ -27,3 +27,10 @@
font-size: 10px;
}
}
+
+@include isInDarkMode {
+ .algo {
+ color: $white;
+ background-color: $dark-mode-toolbar;
+ }
+}
diff --git a/src/app/shared/components/presentationals/shared-folder-tree/shared-folder-tree.presentational.scss b/src/app/shared/components/presentationals/shared-folder-tree/shared-folder-tree.presentational.scss
index b16031262914832b27e6cd518bf6943f0d3e7314..c064371c42be21372dcd5ea9cf05de1f1f6fa11e 100644
--- a/src/app/shared/components/presentationals/shared-folder-tree/shared-folder-tree.presentational.scss
+++ b/src/app/shared/components/presentationals/shared-folder-tree/shared-folder-tree.presentational.scss
@@ -1,4 +1,4 @@
-@import "src/sass/abstracts/abstracts";
+@import "abstracts/abstracts";
:host {
$line-item-size: 30px;
@@ -91,4 +91,20 @@
}
}
+@include isInDarkMode {
+ .file-tree {
+ background-color: transparent;
+
+ .folder-node {
+ color: $dark-mode-text-color;
+ .mat-icon-button {
+ &[disabled="true"] {
+ ::ng-deep {
+ color: $dark-mode-text-disabled;
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/src/app/shared/components/routables/shared-abstract-file-aip-detail/shared-abstract-file-aip-detail.routable.scss b/src/app/shared/components/routables/shared-abstract-file-aip-detail/shared-abstract-file-aip-detail.routable.scss
index 53fcb0507e7da8964d14022757ba83b5729a2754..998dff9aa891479cde720ec20fdff239be2d2f09 100644
--- a/src/app/shared/components/routables/shared-abstract-file-aip-detail/shared-abstract-file-aip-detail.routable.scss
+++ b/src/app/shared/components/routables/shared-abstract-file-aip-detail/shared-abstract-file-aip-detail.routable.scss
@@ -7,7 +7,11 @@
left: 0;
right: 0;
z-index: $z-index-file-detail;
- background-color: #ffffff;
+ background-color: $white;
min-height: 300px;
display: block;
}
+
+@include isInDarkMode {
+ background-color: $dark-mode-background;
+}
diff --git a/src/app/shared/enums/icon-name.enum.ts b/src/app/shared/enums/icon-name.enum.ts
index df1853a63fc03cbbaf53494f9e0dcd6baf611baf..5be3587b04b6496023092775e04fc53b61541f78 100644
--- a/src/app/shared/enums/icon-name.enum.ts
+++ b/src/app/shared/enums/icon-name.enum.ts
@@ -165,6 +165,7 @@ export class IconNameEnum extends IconNamePartialEnum {
@PropertyName() static unigeWhite: string;
@PropertyName() static theme: string;
@PropertyName() static darkMode: string;
+ @PropertyName() static lightMode: string;
@PropertyName() static creationDate: string;
@PropertyName() static defaultValue: string;
@PropertyName() static change: string;
diff --git a/src/app/shared/enums/label-translate.enum.ts b/src/app/shared/enums/label-translate.enum.ts
index 309630c2a290d6f6810f780ac0d65343acf2c7ef..e99926da8aa63acb31d444046aa029f699df5a3a 100644
--- a/src/app/shared/enums/label-translate.enum.ts
+++ b/src/app/shared/enums/label-translate.enum.ts
@@ -126,6 +126,8 @@ export class LabelTranslateEnum {
static personalize: string = MARK_AS_TRANSLATABLE("general.button.personalize");
static deleteDeposit: string = MARK_AS_TRANSLATABLE("general.button.deleteDeposit");
static putInError: string = MARK_AS_TRANSLATABLE("general.button.putInError");
+ static lightMode: string = MARK_AS_TRANSLATABLE("general.button.lightMode");
+ static darkMode: string = MARK_AS_TRANSLATABLE("general.button.darkMode");
static home: string = MARK_AS_TRANSLATABLE("general.label.home");
static uploadAvatar: string = MARK_AS_TRANSLATABLE("general.label.uploadAvatar");
diff --git a/src/app/shared/features/aip/components/dialogs/aip-approve-disposal/shared-aip-approve-disposal.dialog.html b/src/app/shared/features/aip/components/dialogs/aip-approve-disposal/shared-aip-approve-disposal.dialog.html
index 6b6d5e260d836ed78b871b288a7905c35e86a7d5..ebebe1fe3dac128ce7b132fa58520cbe3babd7b6 100644
--- a/src/app/shared/features/aip/components/dialogs/aip-approve-disposal/shared-aip-approve-disposal.dialog.html
+++ b/src/app/shared/features/aip/components/dialogs/aip-approve-disposal/shared-aip-approve-disposal.dialog.html
@@ -26,6 +26,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/shared/features/aip/components/dialogs/aip-extend-retention/shared-aip-extend-retention.dialog.html b/src/app/shared/features/aip/components/dialogs/aip-extend-retention/shared-aip-extend-retention.dialog.html
index d0cd3a989fa52be996d38962b9e535afe114e48a..9bc2b7474d8dacbd246833d4e00a63e8c2f5f132 100644
--- a/src/app/shared/features/aip/components/dialogs/aip-extend-retention/shared-aip-extend-retention.dialog.html
+++ b/src/app/shared/features/aip/components/dialogs/aip-extend-retention/shared-aip-extend-retention.dialog.html
@@ -13,6 +13,7 @@
<button [mat-dialog-close]=""
cdkFocusInitial
mat-button
+ color="primary"
>{{labelTranslateEnum.close | translate}}
</button>
<button (click)="onSubmit()"
diff --git a/src/app/stores/app.state.ts b/src/app/stores/app.state.ts
index 96566eb05b7b13584172b2952010926ce37bca0d..9fa13662642014a3bcc01e252809ce0a156edef5 100644
--- a/src/app/stores/app.state.ts
+++ b/src/app/stores/app.state.ts
@@ -101,6 +101,7 @@ import {LabelTranslateEnum} from "@shared/enums/label-translate.enum";
import {LocalStorageEnum} from "@shared/enums/local-storage.enum";
import {ShortDoi} from "@shared/models/short-doi.model";
import {Token} from "@shared/models/token.model";
+import {HighlightLoader} from "ngx-highlightjs";
import {Observable} from "rxjs";
import {
catchError,
@@ -183,6 +184,7 @@ export class AppState extends SolidifyAppState<AppStateModel> {
protected readonly _apiService: ApiService,
protected readonly _httpClient: HttpClient,
protected readonly _notificationService: NotificationService,
+ protected readonly _hljsLoader: HighlightLoader,
public readonly _dialog: MatDialog) {
super(_store,
_translate,
@@ -214,7 +216,8 @@ export class AppState extends SolidifyAppState<AppStateModel> {
forceLogin: false,
loadModule: true,
},
- environment);
+ environment,
+ _hljsLoader);
}
@Selector()
diff --git a/src/assets/highlightjs/dark.css b/src/assets/highlightjs/dark.css
new file mode 100644
index 0000000000000000000000000000000000000000..03b6da8bf4301dbc9853f46f9fe3362236f61a82
--- /dev/null
+++ b/src/assets/highlightjs/dark.css
@@ -0,0 +1,10 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+ Theme: GitHub Dark
+ Description: Dark theme as seen on github.com
+ Author: github.com
+ Maintainer: @Hirse
+ Updated: 2021-05-15
+
+ Outdated base version: https://github.com/primer/github-syntax-dark
+ Current colors taken from GitHub's CSS
+*/.hljs{color:#c9d1d9;background:#0d1117}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ff7b72}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#d2a8ff}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#79c0ff}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#a5d6ff}.hljs-built_in,.hljs-symbol{color:#ffa657}.hljs-code,.hljs-comment,.hljs-formula{color:#8b949e}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#7ee787}.hljs-subst{color:#c9d1d9}.hljs-section{color:#1f6feb;font-weight:700}.hljs-bullet{color:#f2cc60}.hljs-emphasis{color:#c9d1d9;font-style:italic}.hljs-strong{color:#c9d1d9;font-weight:700}.hljs-addition{color:#aff5b4;background-color:#033a16}.hljs-deletion{color:#ffdcd7;background-color:#67060c}
\ No newline at end of file
diff --git a/src/assets/highlightjs/light.css b/src/assets/highlightjs/light.css
new file mode 100644
index 0000000000000000000000000000000000000000..275239a7aa96a8cfea155167b8ce57db3ab5f469
--- /dev/null
+++ b/src/assets/highlightjs/light.css
@@ -0,0 +1,10 @@
+pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
+ Theme: GitHub
+ Description: Light theme as seen on github.com
+ Author: github.com
+ Maintainer: @Hirse
+ Updated: 2021-05-15
+
+ Outdated base version: https://github.com/primer/github-syntax-light
+ Current colors taken from GitHub's CSS
+*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#005cc5}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-code,.hljs-comment,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}
\ No newline at end of file
diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json
index 0be59a4999ea8addf80ea18e26dee6b0e3499cc8..218d0a7b9300e9ef3b028fd7083e1349077c3f91 100644
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -505,8 +505,7 @@
"title": "{{name}}: Statusverlauf"
},
"module": {
- "cart": "Daten herunterladen",
- "darkMode": "Dunkler Hintergrund"
+ "cart": "Daten herunterladen"
},
"notFound": {
"title": "Die angeforderte Ressource existiert nicht oder nicht mehr..."
@@ -590,6 +589,10 @@
"description": "cookieConsentSidebar.cart.description",
"title": "cookieConsentSidebar.cart.title"
},
+ "darkMode": {
+ "description": "cookieConsentSidebar.darkMode.description",
+ "title": "cookieConsentSidebar.darkMode.title"
+ },
"downloadToken": {
"description": "cookieConsentSidebar.downloadToken.description",
"title": "cookieConsentSidebar.downloadToken.title"
@@ -1115,6 +1118,7 @@
"copyIdToClipboard": "ID in die Zwischenablage kopieren",
"create": "Erstellen",
"createDeposit": "Datenablage erstellen",
+ "darkMode": "general.button.darkMode",
"decline": "Ablehnen",
"deepChecksums": "Genaue Prüfsummen",
"delete": "Löschen",
@@ -1136,6 +1140,7 @@
"fullscreen": "Vollbild",
"goToAip": "Weiter zu AIP",
"init": "Initialisieren",
+ "lightMode": "general.button.lightMode",
"login": "Anmeldung",
"logout": "Abmeldung",
"markAsDone": "Als erledigt markieren",
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index 875c8c4d51047ae02914d5e8ddfe1bb972efc368..88dc48e97938e09b4c43fde8ca5da3026e88e375 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -505,8 +505,7 @@
"title": "{{name}}: Status history"
},
"module": {
- "cart": "Download order",
- "darkMode": "Dark mode"
+ "cart": "Download order"
},
"notFound": {
"title": "The requested resource does not exist or no longer exists..."
@@ -590,6 +589,10 @@
"description": "Allows you to use the archive download order to group archive downloads",
"title": "Archive download order"
},
+ "darkMode": {
+ "description": "Permet de sauvegarder le dernier mode de luminosité",
+ "title": "Brightness mode"
+ },
"downloadToken": {
"description": "Allows you to download files",
"title": "Download token"
@@ -1115,6 +1118,7 @@
"copyIdToClipboard": "Copy ID to clipboard",
"create": "Create",
"createDeposit": "Create new deposit",
+ "darkMode": "Dark mode",
"decline": "Decline",
"deepChecksums": "Deep checksums",
"delete": "Delete",
@@ -1136,6 +1140,7 @@
"fullscreen": "Fullscreen",
"goToAip": "Go to AIP",
"init": "Init",
+ "lightMode": "Light mode",
"login": "Login",
"logout": "Logout",
"markAsDone": "Mark as done",
diff --git a/src/assets/i18n/fr.json b/src/assets/i18n/fr.json
index 83957bb630613ba57412031bf98e4de2aab64fc1..52aafa4fe3e44eb2329fef61590e6ad88f1e0c11 100644
--- a/src/assets/i18n/fr.json
+++ b/src/assets/i18n/fr.json
@@ -505,8 +505,7 @@
"title": "{{name}} : Historique des statuts"
},
"module": {
- "cart": "Demande de Téléchargement",
- "darkMode": "Mode sombre"
+ "cart": "Demande de Téléchargement"
},
"notFound": {
"title": "La resource demandée n'existe pas ou plus..."
@@ -590,6 +589,10 @@
"description": "Permet d'utiliser la demande de téléchargement d'archives pour grouper le téléchargement d'archives",
"title": "Demande de téléchargement d'archives"
},
+ "darkMode": {
+ "description": "Permet de sauvegarder le dernier mode de luminosité",
+ "title": "Mode de luminosité"
+ },
"downloadToken": {
"description": "Permet de pouvoir télécharger des fichiers",
"title": "Jeton de téléchargement"
@@ -599,8 +602,8 @@
"title": "Google Analytics"
},
"language": {
- "description": "Permet de sauvegarder votre language favorie pour charger le site dans la bonne langue lors de votre prochaine visite",
- "title": "Langage favori"
+ "description": "Permet de sauvegarder votre language favori pour charger le site dans la bonne langue lors de votre prochaine visite",
+ "title": "Language favori"
},
"multiSelectLastSelectionContributor": {
"description": "Permet de proposer en premier les contributeurs que vous avez utilisés dernièrement",
@@ -1115,6 +1118,7 @@
"copyIdToClipboard": "Copier l'identifiant dans le presse-papiers",
"create": "Créer",
"createDeposit": "Créer un nouveau dépôt",
+ "darkMode": "Mode sombre",
"decline": "Décliner",
"deepChecksums": "Profond checksums",
"delete": "Supprimer",
@@ -1136,6 +1140,7 @@
"fullscreen": "Plein écran",
"goToAip": "Aller à l'AIP",
"init": "Initialiser",
+ "lightMode": "Mode lumineux",
"login": "Connexion",
"logout": "Déconnexion",
"markAsDone": "Marquer comme traité",
diff --git a/src/assets/language-icons/de.svg b/src/assets/language-icons/de.svg
deleted file mode 100644
index 61412de91ce7c45197b5d8c03b7dd927339f3a3f..0000000000000000000000000000000000000000
--- a/src/assets/language-icons/de.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.88 10.05"><title>DE</title><path d="M10,9.69a5.62,5.62,0,0,1-.36,2.05,4.65,4.65,0,0,1-1,1.59,4.58,4.58,0,0,1-1.58,1,5.53,5.53,0,0,1-2,.37H1.19V4.66H5A5.33,5.33,0,0,1,7,5a4.58,4.58,0,0,1,1.58,1,4.65,4.65,0,0,1,1,1.59A5.62,5.62,0,0,1,10,9.69Zm-1.52,0a4.77,4.77,0,0,0-.25-1.61,3.37,3.37,0,0,0-.69-1.2,3,3,0,0,0-1.09-.75A3.69,3.69,0,0,0,5,5.87H2.69v7.64H5a3.69,3.69,0,0,0,1.44-.26A3,3,0,0,0,7.5,12.5a3.37,3.37,0,0,0,.69-1.2A4.73,4.73,0,0,0,8.44,9.69Z" transform="translate(-1.19 -4.66)"/><path d="M18.08,13.5v1.22H11.84V4.66h6.23V5.87H13.34V9.06h3.81v1.17H13.34V13.5Z" transform="translate(-1.19 -4.66)"/></svg>
\ No newline at end of file
diff --git a/src/assets/language-icons/en.svg b/src/assets/language-icons/en.svg
deleted file mode 100644
index b8e640c2e1c4dcd4ac82eb5288e1008a6b38e61a..0000000000000000000000000000000000000000
--- a/src/assets/language-icons/en.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.31 10.05"><title>EN</title><path d="M7.88,13.68v1.21H1.65v-10H7.88V6.05H3.15V9.24H7v1.17H3.15v3.27Z" transform="translate(-1.65 -4.84)"/><path d="M18,4.84V14.89H17.2a.65.65,0,0,1-.29-.06.82.82,0,0,1-.23-.2L11,7.29c0,.12,0,.25,0,.37s0,.23,0,.34v6.89H9.73v-10h.77a.72.72,0,0,1,.29,0A.69.69,0,0,1,11,5.1l5.69,7.34a2.56,2.56,0,0,1,0-.39c0-.13,0-.25,0-.36V4.84Z" transform="translate(-1.65 -4.84)"/></svg>
\ No newline at end of file
diff --git a/src/assets/language-icons/fr.svg b/src/assets/language-icons/fr.svg
deleted file mode 100644
index d104588f204f7d53c1c1970d73c10b785a5f0278..0000000000000000000000000000000000000000
--- a/src/assets/language-icons/fr.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg id="Calque_1" data-name="Calque 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 15.46 10.05"><title>FR</title><path d="M3.39,6.93v3.36h4V11.5h-4v4.27H1.89V5.71H8.13V6.93Z" transform="translate(-1.89 -5.71)"/><path d="M17.35,15.77H16a.62.62,0,0,1-.58-.32L13,12a.76.76,0,0,0-.26-.25,1,1,0,0,0-.42-.08h-1v4.13H9.81V5.71h2.9a6.34,6.34,0,0,1,1.68.2,3.49,3.49,0,0,1,1.16.57,2.36,2.36,0,0,1,.68.89,2.86,2.86,0,0,1,.22,1.16,3.21,3.21,0,0,1-.16,1,2.77,2.77,0,0,1-.48.83,3,3,0,0,1-.76.63,3.39,3.39,0,0,1-1,.4,1.54,1.54,0,0,1,.48.47Zm-4.69-5.21a3.42,3.42,0,0,0,1-.14,2,2,0,0,0,.73-.4,1.59,1.59,0,0,0,.45-.61A2.13,2.13,0,0,0,15,8.63a1.56,1.56,0,0,0-.57-1.31,2.8,2.8,0,0,0-1.71-.44H11.3v3.68Z" transform="translate(-1.89 -5.71)"/></svg>
\ No newline at end of file
diff --git a/src/sass/abstracts/_variables.scss b/src/sass/abstracts/_variables.scss
index 938401a7d0afdcd07c956d7db35a72a2f13eb87a..bf0bb0af7df3766e121d9641f0368105de1571d0 100644
--- a/src/sass/abstracts/_variables.scss
+++ b/src/sass/abstracts/_variables.scss
@@ -16,3 +16,11 @@ $toolbar-width: 60px;
$main-toolbar-height: 80px;
$header-mobile-toolbar: 54px;
$breadcrumb-height: 38px;
+
+// ------------
+// THEMES
+// ------------
+$theme-yareta: 'yareta';
+$theme-olos: 'olos';
+$theme-dlcm: 'dlcm';
+$theme-centella: 'centella';
diff --git a/src/sass/main.scss b/src/sass/main.scss
index a29138e8aa07c244de8605619889e521f284dae2..2022d24f55f918adba31f4bb7c7e81da4d264ee0 100644
--- a/src/sass/main.scss
+++ b/src/sass/main.scss
@@ -6,12 +6,12 @@
@import "abstracts/mixins";
@import "base/typography";
@import "layout/dialogs";
-@import "src/sass/override/material-override";
-@import "themes/basic-theme";
+@import "override/dark-mode-override";
+@import "override/material-override";
@import "themes/yareta-theme";
@import "themes/dlcm-theme";
@import "themes/olos-theme";
@import "themes/centella-theme";
-@import "highlight.js/styles/github.css";
+//@import "highlight.js/styles/github.css";
@import "@angular/cdk/overlay-prebuilt.css";
diff --git a/src/sass/override/dark-mode-override.scss b/src/sass/override/dark-mode-override.scss
new file mode 100644
index 0000000000000000000000000000000000000000..ac6eb9213f1e10d59597341479026a9894a6f23e
--- /dev/null
+++ b/src/sass/override/dark-mode-override.scss
@@ -0,0 +1,6 @@
+@import "solidify-frontend/lib/scss/override/dark-mode-override";
+@import "abstracts/abstracts";
+
+@mixin dlcm-dark-mode-override {
+ @include solidify-dark-mode-override-rules;
+}
diff --git a/src/sass/override/material-override.scss b/src/sass/override/material-override.scss
index 79fd083f9a0e28f2095e0c186b1700a536b9b335..1cd50a648818318f25666e871c365c6d5efbfc37 100644
--- a/src/sass/override/material-override.scss
+++ b/src/sass/override/material-override.scss
@@ -1,6 +1,3 @@
-@import "abstracts/mixins";
@import "solidify-frontend/lib/scss/override/material-override";
+@import "abstracts/abstracts";
-mat-error {
- @include truncate-with-ellipsis;
-}
diff --git a/src/sass/themes/basic-theme.scss b/src/sass/themes/basic-theme.scss
deleted file mode 100644
index eff0d1f86389822015b96a4f9a08a8b36cc61de4..0000000000000000000000000000000000000000
--- a/src/sass/themes/basic-theme.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-@use '@angular/material' as mat;
-@import "themes/yareta-theme";
-
-$basic-theme: $yareta-theme;
-
-// Load basic theme
-@include mat.all-component-themes($basic-theme);
-@include material-label;
diff --git a/src/sass/themes/centella-theme.scss b/src/sass/themes/centella-theme.scss
index 8cd6111ca8ed5124e3e924e7f710338428c10196..05c260b05318c18e7bd0102bcbba78ed11f5d200 100644
--- a/src/sass/themes/centella-theme.scss
+++ b/src/sass/themes/centella-theme.scss
@@ -91,12 +91,26 @@ $centella-theme: mat.define-light-theme(
$warn
);
+$centella-dark-theme: mat.define-dark-theme(
+ $primary,
+ $accent,
+ $warn
+);
+
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
-body[theme=centella] {
- @include mat.all-component-themes($centella-theme);
- @include material-label;
+@include isInTheme($theme-centella, true) {
--primary-color: #{map-get($mat-centella-primary, 950)};
--primary-color-lighter: #{map-get($mat-centella-primary, 800)};
+
+ &:not([dark-mode='true']) {
+ @include mat.all-component-themes($centella-theme);
+ @include material-label;
+ }
+
+ &[dark-mode='true'] {
+ @include mat.all-component-colors($centella-dark-theme);
+ @include dlcm-dark-mode-override;
+ }
}
diff --git a/src/sass/themes/dlcm-theme.scss b/src/sass/themes/dlcm-theme.scss
index 7d999a0d2265aa042d8bcd87f57b338ad5c1d361..a3ca6bf08fcac422e6df83874f0fb34805ba53f8 100644
--- a/src/sass/themes/dlcm-theme.scss
+++ b/src/sass/themes/dlcm-theme.scss
@@ -15,9 +15,23 @@ $dlcm-theme: mat.define-light-theme(
$warn
);
-body[theme=dlcm] {
- @include mat.all-component-themes($dlcm-theme);
- @include material-label;
+$dlcm-dark-theme: mat.define-dark-theme(
+ $primary,
+ $accent,
+ $warn
+);
+
+@include isInTheme($theme-dlcm, true) {
--primary-color: #{map-get($primary, 800)};
--primary-color-lighter: #028dd6;
+
+ &:not([dark-mode='true']) {
+ @include mat.all-component-themes($dlcm-theme);
+ @include material-label;
+ }
+
+ &[dark-mode='true'] {
+ @include mat.all-component-colors($dlcm-dark-theme);
+ @include dlcm-dark-mode-override;
+ }
}
diff --git a/src/sass/themes/olos-theme.scss b/src/sass/themes/olos-theme.scss
index 39509ad0300b674695d74dc43f8158902190becd..853288e88d8266abbdd283be294e24f914adfe4e 100644
--- a/src/sass/themes/olos-theme.scss
+++ b/src/sass/themes/olos-theme.scss
@@ -54,9 +54,23 @@ $olos-theme: mat.define-light-theme(
$warn
);
-body[theme=olos] {
- @include mat.all-component-themes($olos-theme);
- @include material-label;
+$olos-dark-theme: mat.define-dark-theme(
+ $primary,
+ $accent,
+ $warn
+);
+
+@include isInTheme($theme-olos, true) {
--primary-color: #{map-get($olos-red, 900)};
--primary-color-lighter: #{map-get($olos-red, 700)};
+
+ &:not([dark-mode='true']) {
+ @include mat.all-component-themes($olos-theme);
+ @include material-label;
+ }
+
+ &[dark-mode='true'] {
+ @include mat.all-component-colors($olos-dark-theme);
+ @include dlcm-dark-mode-override;
+ }
}
diff --git a/src/sass/themes/yareta-theme.scss b/src/sass/themes/yareta-theme.scss
index 63fb9a702f843f3a281c44f4a745faed20958ee2..10d16fcce1c8cdabf5737166b247a05496fc5760 100644
--- a/src/sass/themes/yareta-theme.scss
+++ b/src/sass/themes/yareta-theme.scss
@@ -91,12 +91,26 @@ $yareta-theme: mat.define-light-theme(
$warn
);
+$yareta-dark-theme: mat.define-dark-theme(
+ $primary,
+ $accent,
+ $warn
+);
+
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
-body[theme=yareta] {
- @include mat.all-component-themes($yareta-theme);
- @include material-label;
+@include isInTheme($theme-yareta, true) {
--primary-color: #{map-get($mat-yareta-primary, 950)};
--primary-color-lighter: #{map-get($mat-yareta-primary, 800)};
+
+ &:not([dark-mode='true']) {
+ @include mat.all-component-themes($yareta-theme);
+ @include material-label;
+ }
+
+ &[dark-mode='true'] {
+ @include mat.all-component-colors($yareta-dark-theme);
+ @include dlcm-dark-mode-override;
+ }
}