Installation

Installing ACoreX is very easy and simple, first you need to create your Angular project development environment using nx or angular cli or any other tools.

Our suggestion is to set the style type to Sass(.scss) when creating the project.

To install ACoreX, it is enough to install core, components and styles packages using npm or yarn or any similar tool.

NPM

Yarn

PNPM

Add ACoreX style into main style file (style.scss)

styles.scss

Instead of using the default theme, you can copy the variables of the node_modules/@acorex/styles/src/themes/default.scss file into a new file and change the colors and sizes and call your own theme in the styles.scss file instead of the default theme.

styles.scss

In the next step, you choose the icon style file according to your needs. By default, ACoreX supports font-awesome and material-icons. Load these files into the styles.scss file and then import the fontawesome or material style. You can see more on the icons page.

In fact, these variables and classes are used inside ACoreX components and can be compatible with any icon font. It is enough to add the desired icon font to the project according to your needs and override or rewrite the scss file variables of the icon.

Fontawesome

Material icons

Huge icon

Finally, our styles.scss file should look like this

Fontawesome

Material icons

Huge icon

if you want use tailwindcss add acorex-presets to tailwind.config.js and also add Tailwind directives to your styles.scss

tailwind.config.js

In the last step, you must add Translate to the project, this is a mandatory and necessary item to display fixed texts in the project, without calling that text, different parts will not be displayed correctly.