@festo-ui/angular 8.2.0-dev.629 → 8.2.0-dev.637
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +64 -64
- package/fesm2022/festo-ui-angular.mjs +106 -106
- package/fesm2022/festo-ui-angular.mjs.map +1 -1
- package/package.json +1 -1
- package/scss/base/icons-svg.scss +18 -18
- package/scss/base/image-gallery.scss +3 -3
- package/scss/base/popover.scss +9 -9
- package/scss/base/styles.scss +6 -6
package/README.md
CHANGED
|
@@ -1,64 +1,64 @@
|
|
|
1
|
-
# FESTO UI
|
|
2
|
-
|
|
3
|
-
## Angular Component Library
|
|
4
|
-
|
|
5
|
-
### Getting started
|
|
6
|
-
|
|
7
|
-
Festo Angular comes as a NPM package.
|
|
8
|
-
Oh you don't know NPM? Then you must start a bit further at [Node.js](https://nodejs.org).
|
|
9
|
-
|
|
10
|
-
If you want to use the Festo Angular library with your Angular project then this command is the way to go:
|
|
11
|
-
|
|
12
|
-
`npm install @festo-ui/angular`
|
|
13
|
-
|
|
14
|
-
### Peer dependencies
|
|
15
|
-
|
|
16
|
-
We have set the **@festo-ui/web-essentials** and the **@angular/cdk** as peer dependency. Make sure you have it installed:
|
|
17
|
-
|
|
18
|
-
`npm install @festo-ui/web-essentials`
|
|
19
|
-
|
|
20
|
-
`npm install @angular/cdk`
|
|
21
|
-
|
|
22
|
-
### Required CSS
|
|
23
|
-
|
|
24
|
-
You should add the CSS files to your `angular.json` file to load the styles when your Angular projects get built.
|
|
25
|
-
|
|
26
|
-
Example:
|
|
27
|
-
|
|
28
|
-
```json
|
|
29
|
-
{
|
|
30
|
-
"projects": {
|
|
31
|
-
"projectName": {
|
|
32
|
-
...
|
|
33
|
-
"architect": {
|
|
34
|
-
"build": {
|
|
35
|
-
...
|
|
36
|
-
"options": {
|
|
37
|
-
...
|
|
38
|
-
"styles": [
|
|
39
|
-
...
|
|
40
|
-
"node_modules/@festo-ui/web-essentials/dist/css/festo-web-essentials.min.css",
|
|
41
|
-
"node_modules/@festo-ui/angular/css/bundle.css"
|
|
42
|
-
],
|
|
43
|
-
...
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
If you only want to load the styles for popovers or image gallery you can use following paths:
|
|
47
|
-
- `node_modules/@festo-ui/angular/css/popover.css`
|
|
48
|
-
- `node_modules/@festo-ui/angular/css/iamge-gallery.css`
|
|
49
|
-
|
|
50
|
-
### Modules
|
|
51
|
-
|
|
52
|
-
After installation you have to import the **FestoAngularModule** and the **BrowserAnimationsModule** to your root module (called `app.module.ts` in the majority of projects). Have a look at the following example:
|
|
53
|
-
|
|
54
|
-
```typescript
|
|
55
|
-
import { FestoAngularModule } from '@festo-ui/angular';
|
|
56
|
-
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
|
57
|
-
|
|
58
|
-
@NgModule({
|
|
59
|
-
declarations: [AppComponent],
|
|
60
|
-
imports: [BrowserModule, BrowserAnimationsModule, FormsModule, ReactiveFormsModule, FestoAngularModule, AppRoutingModule],
|
|
61
|
-
providers: []
|
|
62
|
-
})
|
|
63
|
-
export class AppModule {}
|
|
64
|
-
```
|
|
1
|
+
# FESTO UI
|
|
2
|
+
|
|
3
|
+
## Angular Component Library
|
|
4
|
+
|
|
5
|
+
### Getting started
|
|
6
|
+
|
|
7
|
+
Festo Angular comes as a NPM package.
|
|
8
|
+
Oh you don't know NPM? Then you must start a bit further at [Node.js](https://nodejs.org).
|
|
9
|
+
|
|
10
|
+
If you want to use the Festo Angular library with your Angular project then this command is the way to go:
|
|
11
|
+
|
|
12
|
+
`npm install @festo-ui/angular`
|
|
13
|
+
|
|
14
|
+
### Peer dependencies
|
|
15
|
+
|
|
16
|
+
We have set the **@festo-ui/web-essentials** and the **@angular/cdk** as peer dependency. Make sure you have it installed:
|
|
17
|
+
|
|
18
|
+
`npm install @festo-ui/web-essentials`
|
|
19
|
+
|
|
20
|
+
`npm install @angular/cdk`
|
|
21
|
+
|
|
22
|
+
### Required CSS
|
|
23
|
+
|
|
24
|
+
You should add the CSS files to your `angular.json` file to load the styles when your Angular projects get built.
|
|
25
|
+
|
|
26
|
+
Example:
|
|
27
|
+
|
|
28
|
+
```json
|
|
29
|
+
{
|
|
30
|
+
"projects": {
|
|
31
|
+
"projectName": {
|
|
32
|
+
...
|
|
33
|
+
"architect": {
|
|
34
|
+
"build": {
|
|
35
|
+
...
|
|
36
|
+
"options": {
|
|
37
|
+
...
|
|
38
|
+
"styles": [
|
|
39
|
+
...
|
|
40
|
+
"node_modules/@festo-ui/web-essentials/dist/css/festo-web-essentials.min.css",
|
|
41
|
+
"node_modules/@festo-ui/angular/css/bundle.css"
|
|
42
|
+
],
|
|
43
|
+
...
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
If you only want to load the styles for popovers or image gallery you can use following paths:
|
|
47
|
+
- `node_modules/@festo-ui/angular/css/popover.css`
|
|
48
|
+
- `node_modules/@festo-ui/angular/css/iamge-gallery.css`
|
|
49
|
+
|
|
50
|
+
### Modules
|
|
51
|
+
|
|
52
|
+
After installation you have to import the **FestoAngularModule** and the **BrowserAnimationsModule** to your root module (called `app.module.ts` in the majority of projects). Have a look at the following example:
|
|
53
|
+
|
|
54
|
+
```typescript
|
|
55
|
+
import { FestoAngularModule } from '@festo-ui/angular';
|
|
56
|
+
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
|
57
|
+
|
|
58
|
+
@NgModule({
|
|
59
|
+
declarations: [AppComponent],
|
|
60
|
+
imports: [BrowserModule, BrowserAnimationsModule, FormsModule, ReactiveFormsModule, FestoAngularModule, AppRoutingModule],
|
|
61
|
+
providers: []
|
|
62
|
+
})
|
|
63
|
+
export class AppModule {}
|
|
64
|
+
```
|