From 7d33bf3dbc8ee617b21eaa3bd9d45b0c272e7f89 Mon Sep 17 00:00:00 2001 From: muhammedaltug Date: Tue, 11 Oct 2022 14:07:11 +0300 Subject: [PATCH 1/3] update theme style doc --- docs/en/UI/Angular/Theme-Configurations.md | 220 ++++++++++++++++++++- 1 file changed, 219 insertions(+), 1 deletion(-) diff --git a/docs/en/UI/Angular/Theme-Configurations.md b/docs/en/UI/Angular/Theme-Configurations.md index 85d22040df..bbd2b89c3c 100644 --- a/docs/en/UI/Angular/Theme-Configurations.md +++ b/docs/en/UI/Angular/Theme-Configurations.md @@ -1,3 +1,221 @@ # Angular UI: Theme Configurations -> This document is in draft version. \ No newline at end of file +As of ABP version 6.0, theme packages do not import styles as css modules. In order for theme packages to load styles, the following style configuration must be added to the angular.json file. + +## Lepton X Lite +```json +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.css", + "inject": false, + "bundleName": "bootstrap-dim" +}, +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.css", + "inject": false, + "bundleName": "ng-bundle" +}, +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.css", + "inject": false, + "bundleName": "layout-bundle" +}, +{ + "input": "node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.css", + "inject": false, + "bundleName": "abp-bundle" +}, +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/bootstrap-dim.rtl.css", + "inject": false, + "bundleName": "bootstrap-dim.rtl" +}, +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/ng-bundle.rtl.css", + "inject": false, + "bundleName": "ng-bundle.rtl" +}, +{ + "input": "node_modules/@volo/ngx-lepton-x.lite/assets/css/side-menu/layout-bundle.rtl.css", + "inject": false, + "bundleName": "layout-bundle.rtl" +}, +{ + "input": "node_modules/@abp/ng.theme.lepton-x/assets/css/abp-bundle.rtl.css", + "inject": false, + "bundleName": "abp-bundle.rtl" +}, +``` + +## Theme Basic +```json +{ + "input": "node_modules/bootstrap/dist/css/bootstrap.rtl.min.css", + "inject": false, + "bundleName": "bootstrap-rtl.min" +}, +{ + "input": "node_modules/bootstrap/dist/css/bootstrap.min.css", + "inject": true, + "bundleName": "bootstrap-ltr.min" +}, +``` + +## Lepton X +```json +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/dark.css", + "inject": false, + "bundleName": "dark" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/light.css", + "inject": false, + "bundleName": "light" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/dim.css", + "inject": false, + "bundleName": "dim" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.css", + "inject": false, + "bundleName": "bootstrap-dim" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.css", + "inject": false, + "bundleName": "bootstrap-dark" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.css", + "inject": false, + "bundleName": "bootstrap-light" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.css", + "inject": false, + "bundleName": "ng-bundle" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.css", + "inject": false, + "bundleName": "layout-bundle" +}, +{ + "input": "node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.css", + "inject": false, + "bundleName": "abp-bundle" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/dark.rtl.css", + "inject": false, + "bundleName": "dark.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/light.rtl.css", + "inject": false, + "bundleName": "light.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/dim.rtl.css", + "inject": false, + "bundleName": "dim.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dim.rtl.css", + "inject": false, + "bundleName": "bootstrap-dim.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-dark.rtl.css", + "inject": false, + "bundleName": "bootstrap-dark.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/bootstrap-light.rtl.css", + "inject": false, + "bundleName": "bootstrap-light.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/ng-bundle.rtl.css", + "inject": false, + "bundleName": "ng-bundle.rtl" +}, +{ + "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.rtl.css", + "inject": false, + "bundleName": "layout-bundle.rtl" +}, +{ + "input": "node_modules/@volosoft/abp.ng.theme.lepton-x/assets/css/abp-bundle.rtl.css", + "inject": false, + "bundleName": "abp-bundle.rtl" +} +``` + +## Theme Lepton +```json +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.min.css", + "inject": false, + "bundleName": "lepton1" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.min.css", + "inject": false, + "bundleName": "lepton2" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.min.css", + "inject": false, + "bundleName": "lepton3" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.min.css", + "inject": false, + "bundleName": "lepton4" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.min.css", + "inject": false, + "bundleName": "lepton5" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.min.css", + "inject": false, + "bundleName": "lepton6" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton1.rtl.min.css", + "inject": false, + "bundleName": "lepton1.rtl" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton2.rtl.min.css", + "inject": false, + "bundleName": "lepton2.rtl" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton3.rtl.min.css", + "inject": false, + "bundleName": "lepton3.rtl" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton4.rtl.min.css", + "inject": false, + "bundleName": "lepton4.rtl" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton5.rtl.min.css", + "inject": false, + "bundleName": "lepton5.rtl" +}, +{ + "input": "node_modules/@volo/abp.ng.theme.lepton/dist/global/styles/lepton6.rtl.min.css", + "inject": false, + "bundleName": "lepton6.rtl" +}, +``` + + From 440ba870d6f81e67ca19734b0ff83044d9ae860a Mon Sep 17 00:00:00 2001 From: muhammedaltug Date: Tue, 11 Oct 2022 14:41:44 +0300 Subject: [PATCH 2/3] update doc --- docs/en/UI/Angular/Theme-Configurations.md | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/en/UI/Angular/Theme-Configurations.md b/docs/en/UI/Angular/Theme-Configurations.md index bbd2b89c3c..45301db9d5 100644 --- a/docs/en/UI/Angular/Theme-Configurations.md +++ b/docs/en/UI/Angular/Theme-Configurations.md @@ -1,7 +1,6 @@ # Angular UI: Theme Configurations -As of ABP version 6.0, theme packages do not import styles as css modules. In order for theme packages to load styles, the following style configuration must be added to the angular.json file. - +Theme packages no longer import styles as CSS modules as of ABP version 6.0. The following style setting needs to be included to the angular.json file in order for theme packages to load styles. ## Lepton X Lite ```json { From dce0cf7a6f2db9aa738fa2b15e1d6c2a627ccdc9 Mon Sep 17 00:00:00 2001 From: Hamza Albreem <94292623+braim23@users.noreply.github.com> Date: Mon, 17 Oct 2022 14:17:51 +0300 Subject: [PATCH 3/3] tiny fix --- docs/en/UI/Angular/Theme-Configurations.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/en/UI/Angular/Theme-Configurations.md b/docs/en/UI/Angular/Theme-Configurations.md index 45301db9d5..1ec4f56c5e 100644 --- a/docs/en/UI/Angular/Theme-Configurations.md +++ b/docs/en/UI/Angular/Theme-Configurations.md @@ -1,6 +1,6 @@ # Angular UI: Theme Configurations -Theme packages no longer import styles as CSS modules as of ABP version 6.0. The following style setting needs to be included to the angular.json file in order for theme packages to load styles. +Theme packages no longer import styles as CSS modules as of ABP version 6.0. The following style settings need to be included to the angular.json file in order for theme packages to load styles. ## Lepton X Lite ```json {