Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Info

This page is relevant to you when you want to create your own Material Angular application theme for Blueriq using The Angular framework for Blueriq

Info

The Blueriq Material Theming Theme can be used from with Blueriq 10.x and furtheronward.


This will explain on how to get your own material theme up and running so you can start create your own theming theme based on this kickstarter

Setup the Blueriq Material

...

Theme

The following steps should be taken to get Material Design with Angular the Angular based Blueriq Material Theme running

  1. Download/fork our theme kickstarter here: https://github.com/blueriq/blueriq-material 
  2. Configure the `proxy.conf.js` correctly. Read the README.md on how to set the environment variable
  3. Configure the baseUrl in `environment.ts
  4. https://my.blueriq.com/ApiDocs/npm-libs/blueriq-angular/0.6.1-beta.316/additional-documentation/getting-started.html 
  5. Remove the yarn.lock file that is distributed with the kickstarter theme (see yarn.lock section below)
  6. Run the following command `yarn install` to install all packages
  7. Run the following command `yarn start` to see your theme in action. This which will open up a browser that navigates to the `default` shortcut that you configured or use `localhost:4200/flow/<project>/<flow>` 
    For other possible routes please look at the `app.module.ts` routes.

Customization

The next step would be to customize it to your liking. Take a look at the theme folder and read the 'THEMING.md' to get the best practice on how to do so.

Anchor
yarn.lock
yarn.lock
yarn.lock
file

The yarn.lock file that is distributed with the kickstarter theme is used by Blueriq's CI servers. It references Blueriq's internal Artifactory server, as the CI servers cannot connect to the internet directly.

Therefore, when initially using the kickstarter project, you should remove the yarn.lock file before performing `yarn install`. You should check the resulting new yarn.lock file into your version control system.

In production

For more information on this subject please read the following: Angular