Open Closed

Change nav-items to toolbar in mobile view #3933


User avatar
0
FPT_TuyenDN1 created
  • ABP Framework version: v5.3.0
  • UI type: Angular
  • DB provider: EF Core
  • Tiered (MVC) or Identity Server Separated (Angular): yes

Hi team I want to move nav-items to the top like this in mobile view. How I can do it?


2 Answer(s)
  • User Avatar
    0
    fatih.kilic created

    If you want to add component to navbar, you can replace Navbar and NavbarMobile.

    constructor(replaceableComponents: ReplaceableComponentsService) {
    
      replaceableComponents.add({
        component: YourComponent,    key: eThemeLeptonComponents.Navbar,  });  
    
    replaceableComponents.add({
        component: YourMobileComponent,    key: eThemeLeptonComponents.NavbarMobile,  });}
    

    and also you can import like below.

    import { ReplaceableComponentsService } from '@abp/ng.core';
    import { eThemeLeptonComponents } from '@volo/abp.ng.theme.lepton';
    
  • User Avatar
    0
    FPT_TuyenDN1 created

    If you want to add component to navbar, you can replace Navbar and NavbarMobile.

    constructor(replaceableComponents: ReplaceableComponentsService) { 
     
      replaceableComponents.add({ 
        component: YourComponent,    key: eThemeLeptonComponents.Navbar,  });   
     
    replaceableComponents.add({ 
        component: YourMobileComponent,    key: eThemeLeptonComponents.NavbarMobile,  });} 
    

    and also you can import like below.

    import { ReplaceableComponentsService } from '@abp/ng.core'; 
    import { eThemeLeptonComponents } from '@volo/abp.ng.theme.lepton'; 
    

    Thanks it worked

Made with ❤️ on ABP v9.1.0-preview. Updated on December 12, 2024, 07:15