NGX CSS Framework An angular abstraction for Squid CSS
See an exemple of all components here
npm install @squidit/css @squidit/ngx-css --savecss and toast js files to your angular.json{
// ...,
"assets": [
// This object inside assets Array
{
"glob": "**/*",
"input": "./node_modules/@squidit/css/dist/fonts",
"output": "./assets/fonts" // Output fonts
},
"src/assets" // Default assets
],
"styles": [
"src/styles.scss"
],
"scripts": [
"node_modules/@squidit/css/src/js/components/toast.js" // JS includes
]
// ...
}style.scss main file$fontsFolderPath: '/assets/fonts'; // Overwrite default font path
@import '@squidit/css/src/scss/squid.scss'; // Import all Framework StylesSquidCSSModule in your *.module.tsimport { SquidCSSModule } from '@squidit/ngx-css'
@NgModule({
// ...
imports: [
// ...
NgxSquidModule
]
// ...
})To use the errors handled in form components, you need to follow the steps below
Install ngx-translate and follow the initial Setup
On you .json files from each language follow the same structure (need one for each supported language of your application):
{
// ...
"forms": {
"search": "Search",
"searchSelectEmpty": "There are no options to select",
"fileSize": "File too large",
"required": "Required field",
"minimumRequired": "The minimum number of selected tags must be greater than or equal to {{ minTags }}",
"email": "Invalid email",
"url": "Invalid URL. Attention: URL must start with https://",
"date": "Invalid Date",
"phone": "Invalid phone number",
"minValueAllowed": "Min value allowed is: {{ min }}",
"maxValueAllowed": "Max value allowed is: {{ max }}",
"rangeDate:": "Date outside valid range"
}
// ...
}Install npm dependences npm install
Run npm start to watch angular library (src directory)
In another window run start:application
This launches an angular pattern that is contained in the application folder. Just use the components inside it, and every change in the files in the src folder will be automatically reflected in the application.
We use compodoc to write docs with jsDocs
Run start:docs and the compodoc will serve the docs. For each change it is necessary to run the command again
Just draft a new release here on Github and an actions will starts
**Important to use the same tag as package.json
See Docs here