@assecosolutions/common NPM

🦊 Fox - Future Open Experience

This lib bundle all styles used inside assecosolutions applications. If you use styles / icons directly from the common folder you can brand your applications CI based on Assecosolutions recommendations and Guidelines and stay up to date when there are new changes.

Installation

npm i @assecosolutions/common

Usage

Inside the common folder we have 3 base folder:

Images

Here we host our images for all applications and use it like.

<img src="./node_modules/@assecosolutions/common/images/asseco_solutions.png" />

Interfaces

The library also contains several intefaces to be used like this.

import { TableColumnConfiguration } from '@assecosolutions/common';

Styles

Here we host our application styles, themes and variables for public usage

//for all styles
@import '@assecosolutions/common/styles/base.app.styles.scss';
//only variables
@import '@assecosolutions/common/styles/variables.scss';
//only grid
@import '@assecosolutions/common/styles/grid.scss';
. . .

Font

We Import our fonts via cdn and not local (if needed local, contact us).

<link
  href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&display=swap"
  rel="stylesheet"
/>
<link
  href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,400;1,900&display=swap"
  rel="stylesheet"
/>
<link
  href="https://fonts.googleapis.com/icon?family=Material+Icons"
  rel="stylesheet"
/>

Usage Demo and Docs

We use Storybook to deliver an interactive documentation of our Design system. There you can find Multiple examples, guidelines and the documentation of all FOX web components.