mirror of
https://github.com/Alfresco/alfresco-content-app.git
synced 2026-09-09 18:02:54 +00:00
[ACS-10448] Move theme variables from ADF to ACA (#4823)
* [ACS-10448] Move theme variables from ADF to ACA * [ACS-10448] Use latest ADF alphas
This commit is contained in:
MichalKinas
Generated
+31
-30
@@ -9,11 +9,11 @@
|
||||
"version": "7.2.0",
|
||||
"license": "LGPL-3.0",
|
||||
"dependencies": {
|
||||
"@alfresco/adf-content-services": "8.4.0-18010361913",
|
||||
"@alfresco/adf-core": "8.4.0-18010361913",
|
||||
"@alfresco/adf-extensions": "8.4.0-18010361913",
|
||||
"@alfresco/eslint-plugin-eslint-angular": "8.4.0-18010361913",
|
||||
"@alfresco/js-api": "9.4.0-18010361913",
|
||||
"@alfresco/adf-content-services": "8.4.0-18161598994",
|
||||
"@alfresco/adf-core": "8.4.0-18161598994",
|
||||
"@alfresco/adf-extensions": "8.4.0-18161598994",
|
||||
"@alfresco/eslint-plugin-eslint-angular": "8.4.0-18161598994",
|
||||
"@alfresco/js-api": "9.4.0-18161598994",
|
||||
"@angular/animations": "19.2.6",
|
||||
"@angular/cdk": "19.2.9",
|
||||
"@angular/common": "19.2.6",
|
||||
@@ -46,7 +46,7 @@
|
||||
"zone.js": "0.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@alfresco/adf-cli": "8.4.0-18010361913",
|
||||
"@alfresco/adf-cli": "8.4.0-18161598994",
|
||||
"@angular-devkit/build-angular": "19.2.15",
|
||||
"@angular-devkit/core": "19.2.7",
|
||||
"@angular-devkit/schematics": "19.2.7",
|
||||
@@ -114,13 +114,13 @@
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/@alfresco/adf-cli": {
|
||||
"version": "8.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-cli/-/adf-cli-8.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-8CcwCS6FpUuaN3gU8Ys74T0/0fcXLFrq3slz4bMCZ430h5K3A6rG6Qclz4nmulWDTFWsOhGUCVNImRCH10oObw==",
|
||||
"version": "8.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-cli/-/adf-cli-8.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-yvRQWM002i+YHIEO7H1tLdH+UcVezxqT8P9XTqadLRqHhpg7/PRDVjnKabgmUX3XXLhrcWLsDI2L4hSC6gaDag==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"@alfresco/js-api": ">=9.4.0-18010361913",
|
||||
"@alfresco/js-api": ">=9.4.0-18161598994",
|
||||
"commander": "^6.2.1",
|
||||
"ejs": "^3.1.10",
|
||||
"license-checker": "^25.0.1",
|
||||
@@ -135,16 +135,16 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@alfresco/adf-content-services": {
|
||||
"version": "8.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-content-services/-/adf-content-services-8.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-1vni4CvgJ0Juo6ZFSJ5CRRRWVGSFxEs4OzWIUbXFGJK25ShYqYiL3mQXgU3bfPy9P7juUTlYyxqekdXDr2JZxA==",
|
||||
"version": "8.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-content-services/-/adf-content-services-8.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-U6OJP9s/xOFi+BOEW9n6WLihaZ7lVHI0A2hhpoNAkz/NCJmxVipYcplZnDUlOPbcbWh+gvgB4PUTswSgAG7rhw==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"tslib": "^2.3.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@alfresco/adf-core": ">=8.4.0-18010361913",
|
||||
"@alfresco/js-api": ">=9.4.0-18010361913",
|
||||
"@alfresco/adf-core": ">=8.4.0-18161598994",
|
||||
"@alfresco/js-api": ">=9.4.0-18161598994",
|
||||
"@angular/animations": ">=14.1.3",
|
||||
"@angular/cdk": ">=14.1.2",
|
||||
"@angular/common": ">=14.1.3",
|
||||
@@ -159,9 +159,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@alfresco/adf-core": {
|
||||
"version": "8.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-core/-/adf-core-8.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-17TIMWt0uRUfpFPWEHSiYMzc6n5Ni6p+cZ/v4eV16kKqle42B86amUuWaKCMLHvnxpyixKaQluMO0kCvxKw9/g==",
|
||||
"version": "8.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-core/-/adf-core-8.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-dOFK2VA8TY5di4V7hQ58uAOUj9PnaDKRhLo842jKKY3ISZxYcHKlHJE0tfasYuB7M4A4k1LpACzcVJ6gXQ3OSw==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"angular-oauth2-oidc": "17.0.2",
|
||||
@@ -172,8 +172,8 @@
|
||||
"tslib": "^2.3.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@alfresco/adf-extensions": ">=8.4.0-18010361913",
|
||||
"@alfresco/js-api": ">=9.4.0-18010361913",
|
||||
"@alfresco/adf-extensions": ">=8.4.0-18161598994",
|
||||
"@alfresco/js-api": ">=9.4.0-18161598994",
|
||||
"@angular/animations": ">=16.0.0",
|
||||
"@angular/cdk": ">=16.0.0",
|
||||
"@angular/common": ">=16.0.0",
|
||||
@@ -206,29 +206,29 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@alfresco/adf-extensions": {
|
||||
"version": "8.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-extensions/-/adf-extensions-8.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-xyh/DpwMkLW3MpEKADPqyaF3sbNCFsUDJnjQwFqJHYCypdPC5Myo9lUGkOkAdgiPTJZzmnM7nBW/hMmZospd5g==",
|
||||
"version": "8.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/adf-extensions/-/adf-extensions-8.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-bh8GwqiGs9wlyH78Gr1bJSrGs5uHPNKCr5vJeqgyGGeCx0pNfD9QiYJGzJiMvvhZYvC04+x3+4m/KLgOnrPO4A==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"tslib": "^2.3.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@alfresco/js-api": ">=9.4.0-18010361913",
|
||||
"@alfresco/js-api": ">=9.4.0-18161598994",
|
||||
"@angular/common": ">=14.1.3",
|
||||
"@angular/core": ">=14.1.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@alfresco/eslint-plugin-eslint-angular": {
|
||||
"version": "8.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/eslint-plugin-eslint-angular/-/eslint-plugin-eslint-angular-8.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-KccttXrVcvz0anRDKrm/EW1XBi6KuxyxrRVdC0rvHqP9HQaqePht7dWkUBNI5b6pnRL7NfFcPK+h8X+CItigHQ==",
|
||||
"version": "8.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/eslint-plugin-eslint-angular/-/eslint-plugin-eslint-angular-8.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-KgdUKjNJ8dCj36yyhpDItoNgNiwrfjU7VwmrXU0vk8gT3yDRhTL3UTYF+lAY4FYIqzQTKSU+LCUfUTSYXwcxsw==",
|
||||
"license": "Apache-2.0"
|
||||
},
|
||||
"node_modules/@alfresco/js-api": {
|
||||
"version": "9.4.0-18010361913",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-9.4.0-18010361913.tgz",
|
||||
"integrity": "sha512-HD0nC60f84w43cX4PGawNRvlb25X3aC9RSUrGEiH8SIjJaD730D1yixx3Ywg7B3PQgoeImb2lv7DQHSGwBAD/A==",
|
||||
"version": "9.4.0-18161598994",
|
||||
"resolved": "https://registry.npmjs.org/@alfresco/js-api/-/js-api-9.4.0-18161598994.tgz",
|
||||
"integrity": "sha512-BIVuqXpup0P/WjgfEIt2AeXxHmWsMDXHgXXRA6+0f22iXIMIbF3h+jnKLX3Zp+bFjfy/fZt0AVWmHdMNcNztHQ==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"eventemitter3": "^5.0.1",
|
||||
@@ -28891,6 +28891,7 @@
|
||||
"version": "9.0.2",
|
||||
"resolved": "https://registry.npmjs.org/superagent/-/superagent-9.0.2.tgz",
|
||||
"integrity": "sha512-xuW7dzkUpcJq7QnhOsnNUgtYp3xRwpt2F7abdRYIpCsAt0hhUqia0EdxyXZQQpNmGtsCzYHryaKSV3q3GJnq7w==",
|
||||
"deprecated": "Please upgrade to superagent v10.2.2+, see release notes at https://github.com/forwardemail/superagent/releases/tag/v10.2.2 - maintenance is supported by Forward Email @ https://forwardemail.net",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"component-emitter": "^1.3.0",
|
||||
|
||||
+6
-6
@@ -40,11 +40,11 @@
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@alfresco/adf-content-services": "8.4.0-18010361913",
|
||||
"@alfresco/adf-core": "8.4.0-18010361913",
|
||||
"@alfresco/adf-extensions": "8.4.0-18010361913",
|
||||
"@alfresco/eslint-plugin-eslint-angular": "8.4.0-18010361913",
|
||||
"@alfresco/js-api": "9.4.0-18010361913",
|
||||
"@alfresco/adf-content-services": "8.4.0-18161598994",
|
||||
"@alfresco/adf-core": "8.4.0-18161598994",
|
||||
"@alfresco/adf-extensions": "8.4.0-18161598994",
|
||||
"@alfresco/eslint-plugin-eslint-angular": "8.4.0-18161598994",
|
||||
"@alfresco/js-api": "9.4.0-18161598994",
|
||||
"@angular/animations": "19.2.6",
|
||||
"@angular/cdk": "19.2.9",
|
||||
"@angular/common": "19.2.6",
|
||||
@@ -77,7 +77,7 @@
|
||||
"zone.js": "0.15.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@alfresco/adf-cli": "8.4.0-18010361913",
|
||||
"@alfresco/adf-cli": "8.4.0-18161598994",
|
||||
"@angular-devkit/build-angular": "19.2.15",
|
||||
"@angular-devkit/core": "19.2.7",
|
||||
"@angular-devkit/schematics": "19.2.7",
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
/* stylelint-disable value-keyword-case */
|
||||
@use '@angular/material' as mat;
|
||||
@use '@mat-datetimepicker/core/datetimepicker/datetimepicker-theme' as datetimepicker-theme;
|
||||
@import './overrides/adf-style-fixes.theme';
|
||||
@import './overrides/adf-pagination.theme';
|
||||
@import './overrides/ay11';
|
||||
@import './overrides/adf-about.theme';
|
||||
@import './overrides/adf-variables';
|
||||
@import './colors';
|
||||
|
||||
$mat-primary-palette: mat.m2-define-palette($aca-primary-blue, A100);
|
||||
@@ -37,7 +39,8 @@ $custom-theme: mat.m2-define-light-theme(
|
||||
|
||||
@mixin custom-theme($theme) {
|
||||
@include mat.all-component-themes($theme);
|
||||
@include adf-core-theme($theme);
|
||||
@include provide-adf-variables($theme);
|
||||
@include datetimepicker-theme.mat-datetimepicker-theme($theme);
|
||||
@include adf-style-fixes($theme);
|
||||
@include adf-pagination-theme($theme);
|
||||
@include ay11-theme;
|
||||
|
||||
@@ -0,0 +1,105 @@
|
||||
@use '@alfresco/adf-core/theming' as adf-core;
|
||||
@use '@angular/material' as mat;
|
||||
/* stylelint-disable scss/no-global-function-names */
|
||||
|
||||
@mixin provide-adf-variables($theme) {
|
||||
$foreground: map-get($theme, foreground);
|
||||
$background: map-get($theme, background);
|
||||
$warn: map-get($theme, warn);
|
||||
$accent: map-get($theme, accent);
|
||||
$primary: map-get($theme, primary);
|
||||
$typography: map-get($theme, typography);
|
||||
|
||||
// map SCSS variables to expose as CSS variables
|
||||
$defaults: (
|
||||
// theme colors
|
||||
--theme-primary-color: mat.m2-get-color-from-palette($primary),
|
||||
--theme-primary-color-default-contrast: mat.m2-get-color-from-palette($primary, default-contrast),
|
||||
--theme-header-text-color: mat.m2-get-color-from-palette($primary, default-contrast),
|
||||
--adf-theme-primary-50: mat.m2-get-color-from-palette($primary, 50),
|
||||
--adf-theme-primary-100: mat.m2-get-color-from-palette($primary, 100),
|
||||
--adf-theme-primary-300: mat.m2-get-color-from-palette($primary, 300),
|
||||
--adf-theme-primary-900: mat.m2-get-color-from-palette($primary, 900),
|
||||
--theme-warn-color: mat.m2-get-color-from-palette($warn),
|
||||
--theme-warn-color-a700: mat.m2-get-color-from-palette($warn, A700),
|
||||
--theme-warn-color-default-contrast: mat.m2-get-color-from-palette($warn, default-contrast),
|
||||
--theme-accent-color: mat.m2-get-color-from-palette($accent),
|
||||
--theme-accent-color-a200: mat.m2-get-color-from-palette($accent, A200),
|
||||
--theme-accent-color-default-contrast: mat.m2-get-color-from-palette($accent, default-contrast),
|
||||
--theme-accent-500: mat.m2-get-color-from-palette($accent, 500),
|
||||
--adf-theme-foreground-base-color: mat.m2-get-color-from-palette($foreground, base),
|
||||
--adf-theme-foreground-base-color-065: mat.m2-get-color-from-palette($foreground, base, 0.65),
|
||||
--adf-theme-foreground-base-color-045: mat.m2-get-color-from-palette($foreground, base, 0.45),
|
||||
--adf-theme-foreground-disabled-text-color: mat.m2-get-color-from-palette($foreground, disabled-text),
|
||||
--adf-theme-foreground-divider-color: mat.m2-get-color-from-palette($foreground, divider),
|
||||
--adf-theme-foreground-icon-color: mat.m2-get-color-from-palette($foreground, icon),
|
||||
--adf-theme-foreground-icon-color-054: mat.m2-get-color-from-palette($foreground, icon, 0.54),
|
||||
--adf-theme-foreground-secondary-text-color: mat.m2-get-color-from-palette($foreground, secondary-text),
|
||||
--adf-theme-foreground-text-color: mat.m2-get-color-from-palette($foreground, text),
|
||||
--adf-theme-foreground-text-color-087: mat.m2-get-color-from-palette($foreground, text, 0.87),
|
||||
--adf-theme-foreground-text-color-075: mat.m2-get-color-from-palette($foreground, text, 0.75),
|
||||
--adf-theme-foreground-text-color-064: mat.m2-get-color-from-palette($foreground, text, 0.64),
|
||||
--adf-theme-foreground-text-color-054: mat.m2-get-color-from-palette($foreground, text, 0.54),
|
||||
--adf-theme-foreground-text-color-040: mat.m2-get-color-from-palette($foreground, text, 0.4),
|
||||
--adf-theme-foreground-text-color-027: mat.m2-get-color-from-palette($foreground, text, 0.27),
|
||||
--adf-theme-foreground-text-color-025: mat.m2-get-color-from-palette($foreground, text, 0.25),
|
||||
--adf-theme-foreground-text-color-014: mat.m2-get-color-from-palette($foreground, text, 0.14),
|
||||
--adf-theme-foreground-text-color-007: mat.m2-get-color-from-palette($foreground, text, 0.07),
|
||||
--adf-theme-background-card-color: mat.m2-get-color-from-palette($background, card),
|
||||
--adf-theme-background-card-color-087: mat.m2-get-color-from-palette($background, card, 0.87),
|
||||
--theme-background-color: mat.m2-get-color-from-palette($background, background),
|
||||
--adf-theme-background-dialog-color: mat.m2-get-color-from-palette($background, dialog),
|
||||
--adf-theme-background-hover-color: mat.m2-get-color-from-palette($background, hover),
|
||||
--adf-theme-background-selected-button-color: mat.m2-get-color-from-palette($background, selected-button),
|
||||
--adf-theme-background-status-bar-color: mat.m2-get-color-from-palette($background, status-bar),
|
||||
--adf-theme-background-unselected-chip-color: mat.m2-get-color-from-palette($background, unselected-chip),
|
||||
// typography
|
||||
--theme-font-family: mat.m2-font-family($typography),
|
||||
--theme-font-weight: normal,
|
||||
--theme-body-1-font-size: mat.m2-font-size($typography, body-2),
|
||||
--theme-body-2-font-size: mat.m2-font-size($typography, subtitle-2),
|
||||
--theme-body-1-line-height: mat.m2-line-height($typography, body-2),
|
||||
--theme-display-1-font-size: mat.m2-font-size($typography, headline-4),
|
||||
--theme-display-3-font-size: mat.m2-font-size($typography, headline-2),
|
||||
--theme-display-4-font-size: mat.m2-font-size($typography, headline-1),
|
||||
--theme-caption-font-size: mat.m2-font-size($typography, caption),
|
||||
--theme-title-font-size: mat.m2-font-size($typography, headline-6),
|
||||
--theme-subheading-1-font-size: mat.m2-font-size($typography, body-1),
|
||||
--theme-subheading-2-font-size: mat.m2-font-size($typography, subtitle-1),
|
||||
--theme-button-font-size: mat.m2-font-size($typography, button),
|
||||
--theme-headline-font-size: mat.m2-font-size($typography, headline-5),
|
||||
--theme-headline-line-height: mat.m2-line-height($typography, headline-5),
|
||||
--theme-adf-icon-1-font-size: 24px,
|
||||
--theme-adf-picture-1-font-size: 16px,
|
||||
--theme-adf-task-footer-font-size: 12px,
|
||||
--theme-adf-task-title-font-size: 14px,
|
||||
// specific colors
|
||||
--adf-theme-mat-grey-color-a200: mat.m2-get-color-from-palette(mat.$m2-grey-palette, 'A200'),
|
||||
--adf-theme-mat-grey-color-a400: mat.m2-get-color-from-palette(mat.$m2-grey-palette, 'A400'),
|
||||
--adf-theme-mat-grey-color-50: mat.m2-get-color-from-palette(mat.$m2-grey-palette, 50),
|
||||
// spacing
|
||||
--adf-theme-spacing: 8px,
|
||||
// components
|
||||
--adf-metadata-property-panel-border-color: rgba(0, 0, 0, 0.12),
|
||||
--adf-metadata-buttons-background-color: rgba(33, 33, 33, 0.05),
|
||||
--adf-metadata-action-button-clear-color: rgba(33, 35, 40, 0.698),
|
||||
--adf-metadata-property-panel-text-color: rgba(33, 35, 40, 0.7),
|
||||
--adf-metadata-property-panel-label-color: rgba(33, 33, 33, 0.24),
|
||||
--adf-metadata-property-panel-title-color: rgb(33, 33, 33),
|
||||
--adf-error-color: #ba1b1b,
|
||||
--adf-secondary-button-background: #2121210d,
|
||||
--adf-secondary-modal-text-color: #212121,
|
||||
--adf-disabled-button-background: rgba(0, 0, 0, 0.12),
|
||||
--adf-chip-border-color: #757575,
|
||||
--adf-sidenav-active-text-color: rgba(0, 48, 100, 1)
|
||||
);
|
||||
|
||||
// propagates SCSS variables into the CSS variables scope
|
||||
:root {
|
||||
@each $name, $value in $defaults {
|
||||
#{$name}: #{$value};
|
||||
}
|
||||
}
|
||||
|
||||
@include adf-core.globals;
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
@use '@angular/material' as mat;
|
||||
@use './mat-selectors' as ms;
|
||||
@import '@alfresco/adf-core/theming';
|
||||
@use '@alfresco/adf-core/theming' as adf-core;
|
||||
@import './custom-theme';
|
||||
@import './variables/variables';
|
||||
@include custom-theme($custom-theme);
|
||||
|
||||
Reference in New Issue
Block a user