Open Closed

How can I apply a custom theme to the Angular UI? #506


User avatar
0
GregB created

Check the docs before asking a question: https://docs.abp.io/en/commercial/latest/ Check the samples, to see the basic tasks: https://docs.abp.io/en/commercial/latest/samples/index The exact solution to your question may have been answered before, please use the search on the homepage.

  • ABP Framework version: v3.2.1
  • UI type: Angular
  • Tiered (MVC) or Identity Server Seperated (Angular): Tiered
  • Exception message and stack trace: N/A
  • Steps to reproduce the issue:

How can I add a custom theme to an ABP app using Angular UI?


5 Answer(s)
  • User Avatar
    0
    armanozak created

    Hi,

    Is it the Lepton themes you are asking about?

  • User Avatar
    0
    GregB created

    Hi @arnanozak.

    No, I'd like to integrate another theme. The specific theme is not really important, it might be a custom theme or something bought from Theme Forrest (or similar). How do I include CSS and JS for another theme and how to I alter the HTML structure of the various components as needed by the theme.

    Another way of thinking about it is how do I build an alternative to the Lepton theme?

    Thanks

  • User Avatar
    0
    armanozak created

    Hi,

    You cannot alter the HTML structure of built-in components, but they are Bootstrap compliant. There is nothing specific to Lepton theme in the HTML.

    In addition, a limited number of components are replaceable: https://docs.abp.io/en/abp/latest/UI/Angular/Component-Replacement

    Including CSS and JS files is described here: https://angular.io/guide/workspace-config#style-script-config

    Please let me know if this answers your question.

  • User Avatar
    0
    GregB created

    (I've removed my last response as it was incorrect).

    I think this information answers my question for now.

    Thanks @armanozak

  • User Avatar
    0
    bilal@mastery365.ca created

    So we cannot change the behavoiur/location of menu e.g If we want to move the meu from top to left in community version of abp?

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