Thank you for your response. I have created an bug report. It will fixed soon.
yarn add @volo/abp.ng.theme.lepton.
Remove leptonX codes on angular.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"
},
add lepton bundle files
{
"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"
},
optional: Customize your logo. Add these codes in Styles.scss file.
--logo: url('/assets/images/logo/logo-light.png') !important;
--logo-reverse: url(/assets/images/logo/logo-dark.png); !important;
First, based on the kind of authentication flow, the solution changes. The Abp, for instance, makes use of Openiddict or identity-server. Your account, log-in, registration, etc. are all angular components if you use Resource Owner Password Flow. These components can be swapped out with our custom ones. Otherwise, you can't alter your components with Angular as they are server-side components.
See the docs for Resource Owner Password Flow https://docs.abp.io/en/abp/latest/UI/Angular/Account-Module#resource-owner-password-flow
1- If you are using external login or don't want to change the register form
app-routing.module.ts.
-The guard checks the logic and redirects the validation page.2- If you want to change the register component.
When you are using Resource owner flow, you can change the registration form via the replaceable component system. The key is eAccountComponents.Register
see the https://docs.abp.io/en/abp/latest/UI/Angular/Component-Replacement
You say your version is 6.0.0, but are you sure? I created an app that version is 6.0 and tested it. I cannot create the same issue. There was no validation message issue it was show error message, also the button was not disabled.
Additionally, when I press the save button, an error message appears.
Could you give me more information, please?
The role has an extra-properties feature. Your "private" state can be saved in the role's extra-properties.
https://docs.abp.io/en/abp/latest/Object-Extensions
With PermissionDefinitionProvider, you can modify the permission management tree as needed.
https://docs.abp.io/en/abp/latest/Authorization#defining-permissions
Could you share your package.json ?
Can you switch tab in edit modal?
I did notice the error, but it is an Angular-related problem. Neither the module system nor the abp have any bugs. We apologize, but we do not provide help for angular or programming concerns.
I send the
user.componentfile to you by email, please have a look. Thank you!
I've added the user component to my project. It works as well as expected. There is no error in cli or browser console. The component can edit and create a new user.
I send the
user.componentfile to you by email, please have a look. Thank you!
This time, I got the email . I am looking. I will inform you soon
Yes, The question is still exist, I'll resend again, but I worried about you still can't receive the email from me, so I'll comment it.
"dependencies": { "@abp/ng.components": "~5.3.3", "@abp/ng.core": "~5.3.3", "@abp/ng.setting-management": "~5.3.3", "@abp/ng.theme.shared": "~5.3.3", "@angular/animations": "~13.3.11", "@angular/common": "~13.3.11", "@angular/compiler": "~13.3.11", "@angular/core": "~13.3.11", "@angular/forms": "~13.3.11", "@angular/localize": "~13.3.11", "@angular/platform-browser": "~13.3.11", "@angular/platform-browser-dynamic": "~13.3.11", "@angular/router": "~13.3.11", "@uppy/core": "^1.13.2", "@uppy/dashboard": "^1.12.6", "@uppy/xhr-upload": "^1.6.4", "@volo/abp.commercial.ng.ui": "~5.3.3", "@volo/abp.ng.account": "~5.3.3", "@volo/abp.ng.audit-logging": "~5.3.3", "@volo/abp.ng.identity": "~5.3.3", "@volo/abp.ng.identity-server": "~5.3.3", "@volo/abp.ng.language-management": "~5.3.3", "@volo/abp.ng.saas": "~5.3.3", "@volo/abp.ng.text-template-management": "~5.3.3", "@volo/abp.ng.theme.lepton": "~5.3.3", "codelyzer": "^6.0.2", "flag-icon-css": "^4.1.7", "rxjs": "~6.6.0", "tslib": "^2.1.0", "tslint": "^6.1.3", "zone.js": "~0.11.4" }, "devDependencies": { "@abp/ng.schematics": "~5.3.3", "@angular-devkit/build-angular": "^13.3.7", "@angular-eslint/builder": "~13.2.1", "@angular-eslint/eslint-plugin": "~13.2.1", "@angular-eslint/eslint-plugin-template": "~13.2.1", "@angular-eslint/schematics": "~13.2.1", "@angular-eslint/template-parser": "~13.2.1", "@angular/cli": "^13.3.7", "@angular/compiler-cli": "~13.3.11", "@angular/language-service": "~13.3.11", "@types/jasmine": "~3.6.0", "@types/node": "^12.11.1", "@typescript-eslint/eslint-plugin": "5.3.0", "@typescript-eslint/parser": "5.3.0", "eslint": "^8.2.0", "jasmine-core": "~3.7.0", "karma": "~6.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage": "~2.1.0", "karma-jasmine": "~4.0.0", "karma-jasmine-html-reporter": "^1.7.0", "ng-packagr": "^13.1.2", "typescript": "~4.5.4" }
Sorry I couldn't produce the issue with your information. I've created An abp angular app with 5.3.3 add source code of identity module. Copied your code on my role.component.ts Adding missing variables and I have couldn't see the error. Could you sent whole role.component.ts and role.component.html ?
let's check, Your goal is 'how to convert the right menu to the top menu on leptonX like lepton' Am I right? We are not supported this feature for a now. New multiple layout types are planned for the lepton x in the future. Your suggestion may implement in the future.
LeptonX is a new template. It is not just color schema. The Lepton-X has its own approach for a design-decisions. If you want to make customization. You should make and use your own layout component and replace the component with the replaceable component.
https://docs.abp.io/en/abp/latest/UI/Angular/Component-Replacement
