Open Closed

Issues with Menu in Angular LeptonX #4346


User avatar
0
dkaczor created
  • ABP Framework version: v7.0.0
  • UI type: Angular
  • DB provider: EF Core
  • Tiered (MVC) or Identity Server Separated (Angular): no
  • Steps to reproduce the issue: Open ABP Suite, create new project with Angular as frontend Lepton X as theme

I found two problems with lepton X in angular.

  1. Collapse button is missing: It is visible in demo but when I create my own project, it is hidden

  2. TopMenu is not working: I changed SideMenuLayoutModule to TopMenuLayoutModule in app.module.ts and this is the result.


6 Answer(s)
  • User Avatar
    0
    muhammedaltug created

    Hello,

    You need to change layout-bundle css file in angular.json

    {
        "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/top-menu/layout-bundle.css",
        "inject": false,
        "bundleName": "layout-bundle"
    },
    
  • User Avatar
    0
    dkaczor created

    Hello,

    You need to change layout-bundle css file in angular.json

    I tried. It does not look any better

  • User Avatar
    0
    muhammedaltug created

    Hello,

    Can you send your app.module.ts?

  • User Avatar
    0
    muhammedaltug created

    Also you need to remove side menu's CSS

    {
        "input": "node_modules/@volosoft/ngx-lepton-x/assets/css/side-menu/layout-bundle.css",
        "inject": false,
        "bundleName": "layout-bundle"
    },
    
  • User Avatar
    0
    dkaczor created

    I found the issue, I didn't import the TopMenuLayoutModule after changing the angular.json file. Works fine now, thanks.

    Any updates about the first issue? (Collapse menu button missing).

  • User Avatar
    0
    muhammedaltug created

    Hello,

    We created an internal issue for this bug.

Made with ❤️ on ABP v8.2.0-preview Updated on March 25, 2024, 15:11