Elephas Design System was created to build consistent user interfaces across different teams and products at Center of Financial Technologies. Our goal is to maintain great developer experience for software engineers, no matter which platform they are building on.
Elephas Angular is a library that implements Elephas Design System components using Angular. It has a Storybook documentation describing all available components.
- Install Elephas Angular and CSS packages.
npm install @elephas/core @elephas/layout @elephas/angular-core @elephas/angular-layout
- Make sure you have installed peer dependencies.
npm install @angular/common @angular/compiler @angular/core @angular/forms @angular/router @types/mime mime
-
Add Inter font to your project.
-
Add CSS to
angular.json
.
"styles": [
"src/styles.scss",
"node_modules/@elephas/layout/styles.min.css"
"node_modules/@elephas/core/styles.min.css",
]
- Add component modules to imports of
app.module.ts
.
import { EButtonModule, EInfoModule } from '@elephas/angular-core';
@NgModule({
imports: [
EButtonModule,
EInfoModule,
],
})
export class AppModule { }
- Use components as following:
<e-info appearance="warning">Warning info text</e-info>
<button eButton appearance="primary">Click Me</button>
Source code is under a custom license based on MIT. The license restricts Elephas usage to applications that integrate or interoperate with Center of Financial Technologies software or services, with additional restrictions for external, stand-alone applications.