bz-genome-styles

Genome

Create the new Bizagi world. Better interfaces for better products.

macOS step by step

Please remember to have installed Xcode app from the App Store. If you have trouble with EACCES, please execute sudo npm -g config set user root

1. Ask for permissions to access and clone the code of genome
2. Open new Terminal at folder code: System Preferences > Keyboard > Shortcuts > Services Enable New Terminal at Folder
3. Install Node.js
4. Install Grunt's command line interface (CLI) sudo npm install -g grunt-cli
5. Install Angular CLI sudo npm install -g @angular/cli
6. Install Compass sudo gem install sass
7. Install npm packages sudo npm install
8. Run sudo npm start and in another tab sudo grunt to get Genome running

How to create a new page

1. Duplicate page-base folder
2. Go to page-base.component.ts and rename PageBaseComponent (component name), page-base.component (component path) accordingly to your component name and path
3. Go to page-base.component.spec.ts and replicate the rename process of component name and path
4. Rename folder and files accordingly to your component name
5. Go to app-routing.module.ts and import the new component, adittionaly add the menu path in routes { path: 'base', component: PageBaseComponent}
6. Go to app.module.ts and import the new component
7. Go to genome.d.ts and declare the component module
8. Go to menu.component.html and add the path menu item of the component

Ejecucion paralela para hacer debug y ver los cambios en un proyecto que usa la libreria

1. En la carpeta node_modules del proyecto principal (Ej. customer portal) elimine la carpeta correspondiente a bz-genome-styles

2. Cree un link simbolico

 mklink /J "C:\dv\customer-portal\CustomerPortal.Web\WebContent\node_modules\bz-genome-styles" "C:\dv\GenomeAngular\dist\bz-genome-angular"

3. instale grunt de manera global

npm install -g grunt-cli

4. Ejecute grunt desde una consola sobre la raiz del proyecto de genome

cd C:\Users\Julian\Documents\bizagi\genome grunt

5. en el proyecto principal en la hoja styles.css importe el genome que se encuentra en el link simbolico

@import '~bz-genome-styles/themes/cloud/main.scss';