Open Closed

Lepton theme microservices template #1684


User avatar
0
steve.burgess created

Hi,

I have the microservice template up and running with an Angular frontend. I'm attempting to use some components within the Lepton theme (https://leptontheme.com/Layouts/Application/Components/Dropdowns)

However, they don’t appear to work at all.

Doing some investigation, the microservice template doesn't appear to include jquery or popper at all, which are required for bootstrap to work correctly.

Is the intention that these components should work in the microservice template? Or am i just missing something fundamental?

Thanks,

Steve.


4 Answer(s)
  • User Avatar
    0
    gterdem created
    Support Team Senior .NET Developer

    Hello,

    Microservice template has 3 applications:

    1. Back-office/admin application (that can be blazor, angular or mvc)
    2. Public / landing page application. This is a RazorPage/MVC application
    3. Authserver / Identityserver application. This application hosts the login/register and user profile related pages.

    You can make UI developments for all of these applications.

    There are 2 ways to develop UI for microservices; Modular and Monolith. You can check adding ui to apps documentation about these ways.

    Can you share what exactly you're trying to achieve and what seems not working?

  • User Avatar
    0
    steve.burgess created

    Hello,

    Microservice template has 3 applications:

    1. Back-office/admin application (that can be blazor, angular or mvc)
    2. Public / landing page application. This is a RazorPage/MVC application
    3. Authserver / Identityserver application. This application hosts the login/register and user profile related pages.

    You can make UI developments for all of these applications.

    There are 2 ways to develop UI for microservices; Modular and Monolith. You can check adding ui to apps documentation about these ways.

    Can you share what exactly you're trying to achieve and what seems not working?

    Hi,

    I'm using the back-office/admin application. Its running using Angular.

    I've gone to the Lepton Theme site (https://leptontheme.com/) and grabbed the Bootstrap code for a "Split Button" dropdown (https://leptontheme.com/Layouts/Application/Components/Dropdowns).

    I've then dropped this code onto the home page (Home Module > Home component > home.component.html)

    The button appears on the page and is styled correctly, however, clicking on the "arrow" does nothing. It should pop a little menu containing the dropdown values but it doesn't.

    I can see that the bootstrap CSS is in the Angular project (which would explain why the styles are correct) but i can’t see where jquery & popper are included. It's my understanding that without them bootstrap 4 wont function correctly.

    If i manually include jquery and popper it starts working correctly.

    I just want to make sure I’m not missing something fundamental about the way it should be working?

    Cheers,

    Steve.

  • User Avatar
    0
    Mehmet created

    Hi @steve.burgess,

    Code samples in https://leptontheme.com are compatible with MVC UI so they samples do not work with Angular UI.

    ABP Angular UI depends on ng-bootstrap library. You can follow this document to use dropdown component.

    Please see the Angular UI documentation for the further information.

    Regards.

  • User Avatar
    0
    ServiceBot created
    Support Team Automatic process manager

    This question has been automatically marked as stale because it has not had recent activity.

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