@beacon-interactive-systems-llc/beacon-platform-ui 19.2.8 → 19.2.10
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 +56 -56
- package/assets/fonts/fonts.scss +35 -35
- package/assets/icons/icon_Dash.svg +7 -7
- package/assets/icons/icon_Slash.svg +7 -7
- package/assets/icons/icon_X.svg +7 -7
- package/assets/icons/input-clear-icon.svg +5 -5
- package/fesm2022/beacon-interactive-systems-llc-beacon-platform-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/styles/_apploading.scss +60 -60
- package/styles/_bootstrap-datepicker.scss +12 -0
- package/styles/_bootstrap-tabs.scss +57 -57
- package/styles/_calendar.scss +244 -244
- package/styles/_checkboxes.scss +14 -0
- package/styles/_forms.scss +9 -0
- package/styles/_keyframes.scss +29 -29
- package/styles/_leftnav.scss +359 -359
- package/styles/_menus.scss +31 -31
- package/styles/_ngx-datepicker.scss +3 -3
- package/styles/_palette.scss +151 -151
- package/styles/_toast.scss +148 -148
- package/styles/_widgets.scss +69 -22
package/README.md
CHANGED
|
@@ -1,57 +1,57 @@
|
|
|
1
|
-
# Beacon Platform UI
|
|
2
|
-
|
|
3
|
-
### About
|
|
4
|
-
This library is intended to define styles for Beacon Platform projects and create useful components that can be shared across apps.
|
|
5
|
-
|
|
6
|
-
It also contains style overrides for elements from commonly used dependencies like:
|
|
7
|
-
|
|
8
|
-
"@angular/material"
|
|
9
|
-
"ngx-bootstrap"
|
|
10
|
-
"ngx-infinite-scroll"
|
|
11
|
-
"@ng-select/ng-select"
|
|
12
|
-
"ngx-mask"
|
|
13
|
-
"ngx-quill"
|
|
14
|
-
"ngx-toastr"
|
|
15
|
-
|
|
16
|
-
### Using in a Beacon Platform application
|
|
17
|
-
|
|
18
|
-
First determine which version of Angular is or will be used in the frontend application.
|
|
19
|
-
The MAJOR version of Angular will match 1-to-1 with the Beacon Platform UI, so Angular 18 apps will use Beacon Platform UI version 18, Angular 16 will use Beacon Platform UI version 16, etc.
|
|
20
|
-
|
|
21
|
-
Example:
|
|
22
|
-
1. The frontend application will use Angular 17.X.X
|
|
23
|
-
2. The Beacon Platform UI version to use would be v17 and should include the latest minor and patch updates, which can be installed like this:
|
|
24
|
-
|
|
25
|
-
```
|
|
26
|
-
$ npm install @beacon-interactive-systems-llc/beacon-platform-ui@^17,
|
|
27
|
-
```
|
|
28
|
-
Be sure that core dependencies of the Angular application match those of the Beacon Platform UI.
|
|
29
|
-
|
|
30
|
-
Then, add this line to the application `styles.scss`
|
|
31
|
-
`@import "@beacon-interactive-systems-llc/beacon-platform-ui/styles/styles.scss";`
|
|
32
|
-
|
|
33
|
-
That's it!
|
|
34
|
-
|
|
35
|
-
### Documentation
|
|
36
|
-
|
|
37
|
-
The library defines and exports several key dependencies: stylesheets, static assets and shared components
|
|
38
|
-
|
|
39
|
-
#### Stylesheets
|
|
40
|
-
|
|
41
|
-
Defined in `node_modules\@beacon-interactive-systems-llc\beacon-platform-ui\styles`, these stylesheets are named after the components/dependency/library they affect:
|
|
42
|
-
|
|
43
|
-
`_material_drawer.scss` will contain style overrides for the Angular Material `DrawerModule`
|
|
44
|
-
`_forms.scss` will contain styling for form inputs, dropdowns
|
|
45
|
-
`_theming.scss` will contain important definitions for DEFAULT, DARK and HIGH_CONTRAST modes
|
|
46
|
-
etc.
|
|
47
|
-
|
|
48
|
-
Any further customization that is required should be done at the component level in the application itself, or, if a global change is warranted a request should be made to Platform UI developers (Nina P, Andy S, Nathan B) so a new patched version can be created and pushed for all apps to use.
|
|
49
|
-
|
|
50
|
-
#### Static Assets
|
|
51
|
-
Beacon Platform apps will use variations of Roboto fonts, found in `/fonts`
|
|
52
|
-
Custom icons (as in, those not added using the Angular Material Icons library) will be added over time to `/icons`
|
|
53
|
-
|
|
54
|
-
#### Shared Components
|
|
55
|
-
Two useful support components are available in `/lib`
|
|
56
|
-
1. `DeviceDetector` can be used to find important information and device resolution, operating system etc.
|
|
1
|
+
# Beacon Platform UI
|
|
2
|
+
|
|
3
|
+
### About
|
|
4
|
+
This library is intended to define styles for Beacon Platform projects and create useful components that can be shared across apps.
|
|
5
|
+
|
|
6
|
+
It also contains style overrides for elements from commonly used dependencies like:
|
|
7
|
+
|
|
8
|
+
"@angular/material"
|
|
9
|
+
"ngx-bootstrap"
|
|
10
|
+
"ngx-infinite-scroll"
|
|
11
|
+
"@ng-select/ng-select"
|
|
12
|
+
"ngx-mask"
|
|
13
|
+
"ngx-quill"
|
|
14
|
+
"ngx-toastr"
|
|
15
|
+
|
|
16
|
+
### Using in a Beacon Platform application
|
|
17
|
+
|
|
18
|
+
First determine which version of Angular is or will be used in the frontend application.
|
|
19
|
+
The MAJOR version of Angular will match 1-to-1 with the Beacon Platform UI, so Angular 18 apps will use Beacon Platform UI version 18, Angular 16 will use Beacon Platform UI version 16, etc.
|
|
20
|
+
|
|
21
|
+
Example:
|
|
22
|
+
1. The frontend application will use Angular 17.X.X
|
|
23
|
+
2. The Beacon Platform UI version to use would be v17 and should include the latest minor and patch updates, which can be installed like this:
|
|
24
|
+
|
|
25
|
+
```
|
|
26
|
+
$ npm install @beacon-interactive-systems-llc/beacon-platform-ui@^17,
|
|
27
|
+
```
|
|
28
|
+
Be sure that core dependencies of the Angular application match those of the Beacon Platform UI.
|
|
29
|
+
|
|
30
|
+
Then, add this line to the application `styles.scss`
|
|
31
|
+
`@import "@beacon-interactive-systems-llc/beacon-platform-ui/styles/styles.scss";`
|
|
32
|
+
|
|
33
|
+
That's it!
|
|
34
|
+
|
|
35
|
+
### Documentation
|
|
36
|
+
|
|
37
|
+
The library defines and exports several key dependencies: stylesheets, static assets and shared components
|
|
38
|
+
|
|
39
|
+
#### Stylesheets
|
|
40
|
+
|
|
41
|
+
Defined in `node_modules\@beacon-interactive-systems-llc\beacon-platform-ui\styles`, these stylesheets are named after the components/dependency/library they affect:
|
|
42
|
+
|
|
43
|
+
`_material_drawer.scss` will contain style overrides for the Angular Material `DrawerModule`
|
|
44
|
+
`_forms.scss` will contain styling for form inputs, dropdowns
|
|
45
|
+
`_theming.scss` will contain important definitions for DEFAULT, DARK and HIGH_CONTRAST modes
|
|
46
|
+
etc.
|
|
47
|
+
|
|
48
|
+
Any further customization that is required should be done at the component level in the application itself, or, if a global change is warranted a request should be made to Platform UI developers (Nina P, Andy S, Nathan B) so a new patched version can be created and pushed for all apps to use.
|
|
49
|
+
|
|
50
|
+
#### Static Assets
|
|
51
|
+
Beacon Platform apps will use variations of Roboto fonts, found in `/fonts`
|
|
52
|
+
Custom icons (as in, those not added using the Angular Material Icons library) will be added over time to `/icons`
|
|
53
|
+
|
|
54
|
+
#### Shared Components
|
|
55
|
+
Two useful support components are available in `/lib`
|
|
56
|
+
1. `DeviceDetector` can be used to find important information and device resolution, operating system etc.
|
|
57
57
|
2. `NetworkConnectionService` will track changes in the status of the network connection and provide interfaces for `isOnline` and `isOffline`
|
package/assets/fonts/fonts.scss
CHANGED
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
@font-face {
|
|
2
|
-
font-display: block;
|
|
3
|
-
font-family: roboto-black;
|
|
4
|
-
src: url(./Roboto-Black.ttf) format("truetype");
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
@font-face {
|
|
8
|
-
font-display: block;
|
|
9
|
-
font-family: roboto-bold;
|
|
10
|
-
src: url(./Roboto-Bold.ttf) format("truetype");
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
@font-face {
|
|
14
|
-
font-display: block;
|
|
15
|
-
font-family: roboto-italic;
|
|
16
|
-
src: url(./Roboto-Italic.ttf) format("truetype");
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
@font-face {
|
|
20
|
-
font-display: block;
|
|
21
|
-
font-family: roboto-light;
|
|
22
|
-
src: url(./Roboto-Light.ttf) format("truetype");
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
@font-face {
|
|
26
|
-
font-display: block;
|
|
27
|
-
font-family: roboto-medium;
|
|
28
|
-
src: url(./Roboto-Medium.ttf) format("truetype");
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
@font-face {
|
|
32
|
-
font-display: block;
|
|
33
|
-
font-family: roboto-regular;
|
|
34
|
-
src: url(./Roboto-Regular.ttf) format("truetype");
|
|
35
|
-
}
|
|
1
|
+
@font-face {
|
|
2
|
+
font-display: block;
|
|
3
|
+
font-family: roboto-black;
|
|
4
|
+
src: url(./Roboto-Black.ttf) format("truetype");
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
@font-face {
|
|
8
|
+
font-display: block;
|
|
9
|
+
font-family: roboto-bold;
|
|
10
|
+
src: url(./Roboto-Bold.ttf) format("truetype");
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@font-face {
|
|
14
|
+
font-display: block;
|
|
15
|
+
font-family: roboto-italic;
|
|
16
|
+
src: url(./Roboto-Italic.ttf) format("truetype");
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
@font-face {
|
|
20
|
+
font-display: block;
|
|
21
|
+
font-family: roboto-light;
|
|
22
|
+
src: url(./Roboto-Light.ttf) format("truetype");
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
@font-face {
|
|
26
|
+
font-display: block;
|
|
27
|
+
font-family: roboto-medium;
|
|
28
|
+
src: url(./Roboto-Medium.ttf) format("truetype");
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@font-face {
|
|
32
|
+
font-display: block;
|
|
33
|
+
font-family: roboto-regular;
|
|
34
|
+
src: url(./Roboto-Regular.ttf) format("truetype");
|
|
35
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
-
<g id="surface1">
|
|
4
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(14.901961%,60%,98.431373%);fill-opacity:1;" d="M 8 0 C 12.417969 0 16 3.582031 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 Z M 8 0 "/>
|
|
5
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 2.597656 7.398438 L 13.261719 7.398438 L 13.261719 8.464844 L 2.597656 8.464844 Z M 2.597656 7.398438 "/>
|
|
6
|
-
</g>
|
|
7
|
-
</svg>
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
+
<g id="surface1">
|
|
4
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(14.901961%,60%,98.431373%);fill-opacity:1;" d="M 8 0 C 12.417969 0 16 3.582031 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 Z M 8 0 "/>
|
|
5
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 2.597656 7.398438 L 13.261719 7.398438 L 13.261719 8.464844 L 2.597656 8.464844 Z M 2.597656 7.398438 "/>
|
|
6
|
+
</g>
|
|
7
|
+
</svg>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
-
<g id="surface1">
|
|
4
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,84.313725%,0%);fill-opacity:1;" d="M 8 0 C 12.417969 0 16 3.582031 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 Z M 8 0 "/>
|
|
5
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 3.78125 11.324219 L 11.324219 3.78125 L 12.078125 4.535156 L 4.535156 12.078125 Z M 3.78125 11.324219 "/>
|
|
6
|
-
</g>
|
|
7
|
-
</svg>
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
+
<g id="surface1">
|
|
4
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,84.313725%,0%);fill-opacity:1;" d="M 8 0 C 12.417969 0 16 3.582031 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 Z M 8 0 "/>
|
|
5
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 3.78125 11.324219 L 11.324219 3.78125 L 12.078125 4.535156 L 4.535156 12.078125 Z M 3.78125 11.324219 "/>
|
|
6
|
+
</g>
|
|
7
|
+
</svg>
|
package/assets/icons/icon_X.svg
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
-
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
-
<g id="surface1">
|
|
4
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(89.019608%,32.156863%,1.960784%);fill-opacity:1;" d="M 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 C 12.417969 0 16 3.582031 16 8 Z M 16 8 "/>
|
|
5
|
-
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 7.929688 8.683594 L 4.535156 12.078125 L 3.78125 11.324219 L 7.175781 7.929688 L 3.78125 4.535156 L 4.535156 3.78125 L 7.929688 7.175781 L 11.324219 3.78125 L 12.078125 4.535156 L 8.683594 7.929688 L 12.078125 11.324219 L 11.324219 12.078125 Z M 7.929688 8.683594 "/>
|
|
6
|
-
</g>
|
|
7
|
-
</svg>
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16px" height="16px" viewBox="0 0 16 16" version="1.1">
|
|
3
|
+
<g id="surface1">
|
|
4
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(89.019608%,32.156863%,1.960784%);fill-opacity:1;" d="M 16 8 C 16 12.417969 12.417969 16 8 16 C 3.582031 16 0 12.417969 0 8 C 0 3.582031 3.582031 0 8 0 C 12.417969 0 16 3.582031 16 8 Z M 16 8 "/>
|
|
5
|
+
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 7.929688 8.683594 L 4.535156 12.078125 L 3.78125 11.324219 L 7.175781 7.929688 L 3.78125 4.535156 L 4.535156 3.78125 L 7.929688 7.175781 L 11.324219 3.78125 L 12.078125 4.535156 L 8.683594 7.929688 L 12.078125 11.324219 L 11.324219 12.078125 Z M 7.929688 8.683594 "/>
|
|
6
|
+
</g>
|
|
7
|
+
</svg>
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
|
2
|
-
<g id="_Trailing_Icon" data-name="📍Trailing Icon" transform="translate(0)">
|
|
3
|
-
<path id="_Color" data-name=" ↳Color" d="M6,12A6,6,0,0,1,1.756,1.756a6,6,0,0,1,8.489,8.489A5.962,5.962,0,0,1,6,12ZM6,6.846H6L8.154,9,9,8.154,6.846,6,9,3.846,8.154,3,6,5.154,3.846,3,3,3.846,5.154,6,3,8.154,3.846,9,6,6.847Z" transform="translate(0)" fill="#b1b1b1"/>
|
|
4
|
-
</g>
|
|
5
|
-
</svg>
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
|
|
2
|
+
<g id="_Trailing_Icon" data-name="📍Trailing Icon" transform="translate(0)">
|
|
3
|
+
<path id="_Color" data-name=" ↳Color" d="M6,12A6,6,0,0,1,1.756,1.756a6,6,0,0,1,8.489,8.489A5.962,5.962,0,0,1,6,12ZM6,6.846H6L8.154,9,9,8.154,6.846,6,9,3.846,8.154,3,6,5.154,3.846,3,3,3.846,5.154,6,3,8.154,3.846,9,6,6.847Z" transform="translate(0)" fill="#b1b1b1"/>
|
|
4
|
+
</g>
|
|
5
|
+
</svg>
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"beacon-interactive-systems-llc-beacon-platform-ui.mjs","sources":["../../../projects/platform-ui/src/lib/network-connection.service.ts","../../../projects/platform-ui/src/lib/device-detector.service.ts","../../../projects/platform-ui/src/lib/platform-ui.service.ts","../../../projects/platform-ui/src/lib/platform-ui.component.ts","../../../projects/platform-ui/src/lib/platform-ui.module.ts","../../../projects/platform-ui/src/beacon-interactive-systems-llc-beacon-platform-ui.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\
|
|
1
|
+
{"version":3,"file":"beacon-interactive-systems-llc-beacon-platform-ui.mjs","sources":["../../../projects/platform-ui/src/lib/network-connection.service.ts","../../../projects/platform-ui/src/lib/device-detector.service.ts","../../../projects/platform-ui/src/lib/platform-ui.service.ts","../../../projects/platform-ui/src/lib/platform-ui.component.ts","../../../projects/platform-ui/src/lib/platform-ui.module.ts","../../../projects/platform-ui/src/beacon-interactive-systems-llc-beacon-platform-ui.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\nimport { Subject } from 'rxjs';\n\ndeclare const window: any;\n\n@Injectable({\n providedIn: 'root'\n})\nexport class NetworkConnectionService {\n constructor() {\n window.addEventListener('online', () => this.updateOnlineStatus());\n window.addEventListener('offline', () => this.updateOnlineStatus());\n }\n\n private networkConnectionChange = new Subject<boolean>();\n public connectionChanged$ = this.networkConnectionChange.asObservable();\n public lastOnlineAt: Date = new Date();\n\n get isOnline() {\n return !!window.navigator.onLine;\n }\n\n get isOffline() {\n return !this.isOnline;\n }\n\n private updateOnlineStatus() {\n this.networkConnectionChange.next(window.navigator.onLine);\n if (window.navigator.offLine) this.lastOnlineAt = new Date();\n }\n}\n","import { Injectable } from '@angular/core';\n\nconst CUTOFFS = {\n mobile: 767,\n tablet: 1200\n}\n\n@Injectable({\n providedIn: 'root'\n})\nexport class DeviceDetectorService {\n get isMobile() { return window.screen.width <= CUTOFFS.mobile }\n\n get isTablet() {\n return window.screen.width >= CUTOFFS.mobile && window.screen.width <= CUTOFFS.tablet;\n }\n\n // assume desktop is anything > 1200\n get isDesktop() { return window.screen.width > CUTOFFS.tablet }\n\n\n getBrowser() {\n if (!!navigator.userAgent.match(/Chrome/) && !navigator.userAgent.match(/Edg/)) { return \"Chrome\"; }\n else if (!!navigator.userAgent.match(/Opera/) || !!navigator.userAgent.match(/OPR/)) { return \"Opera\"; }\n else if (!!navigator.userAgent.match(/Firefox/) && !navigator.userAgent.match(/Safari/)) { return \"Firefox\"; }\n else if (!!navigator.userAgent.match(/Safari/) && !navigator.userAgent.match(/Edg/)) { return \"Safari\"; }\n else if (!!navigator.userAgent.match(/MSIE/)) { return \"IE\"; }\n else if (!!navigator.userAgent.match(/Edg/)) { return \"Microsoft Edge\"; }\n else { return \"Unknown\" }\n }\n\n getOperatingSystem() {\n if (!!navigator.userAgent.match(/Win/)) { return \"Windows OS\"; }\n else if (!!navigator.userAgent.match(/Mac/)) { return \"MacOS\"; }\n else if (!!navigator.userAgent.match(/X11/)) { return \"UNIX OS\"; }\n else if (!!navigator.userAgent.match(/Linux/)) { return \"Linux OS\"; }\n else { return \"Unknown\"; }\n }\n\n getDeviceType() {\n if (this.isDesktop) { return \"Desktop\"; }\n else if (this.isMobile) { return \"Mobile\"; }\n else if (this.isTablet) { return \"Tablet\"; }\n else { return \"Unknown\"; }\n }\n}","import { Injectable } from '@angular/core';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class PlatformUiService {\n\n constructor() { }\n}\n","import { Component, OnInit } from '@angular/core';\n\n@Component({\n selector: 'lib-platform-ui',\n template: `\n <p>\n platform-ui works!\n </p>\n `,\n styles: [],\n standalone: false\n})\nexport class PlatformUiComponent implements OnInit {\n\n constructor() { }\n\n ngOnInit(): void {\n }\n\n}\n","import { NgModule } from '@angular/core';\nimport { PlatformUiComponent } from './platform-ui.component';\n\n\n\n@NgModule({\n declarations: [\n PlatformUiComponent\n ],\n imports: [\n ],\n exports: [\n PlatformUiComponent\n ]\n})\nexport class PlatformUiModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
package/styles/_apploading.scss
CHANGED
|
@@ -1,60 +1,60 @@
|
|
|
1
|
-
@keyframes rotate {
|
|
2
|
-
100% {
|
|
3
|
-
transform: rotate(360deg);
|
|
4
|
-
}
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
@keyframes rotate-cc {
|
|
8
|
-
100% {
|
|
9
|
-
transform: rotate(-360deg);
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
.app-loading {
|
|
14
|
-
position: relative;
|
|
15
|
-
display: flex;
|
|
16
|
-
flex-direction: column;
|
|
17
|
-
align-items: center;
|
|
18
|
-
justify-content: center;
|
|
19
|
-
height: 100%;
|
|
20
|
-
|
|
21
|
-
.logo {
|
|
22
|
-
width: 200px;
|
|
23
|
-
height: 200px;
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
.spinner {
|
|
27
|
-
transform-origin: center center;
|
|
28
|
-
position: absolute;
|
|
29
|
-
top: 0;
|
|
30
|
-
bottom: 0;
|
|
31
|
-
left: 0;
|
|
32
|
-
right: 0;
|
|
33
|
-
margin: auto;
|
|
34
|
-
|
|
35
|
-
&.clockwise {
|
|
36
|
-
height: 280px;
|
|
37
|
-
width: 280px;
|
|
38
|
-
animation: rotate 3s linear infinite;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
&.counterclockwise {
|
|
42
|
-
height: 300px;
|
|
43
|
-
width: 300px;
|
|
44
|
-
animation: rotate-cc 3s linear infinite;
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.path {
|
|
48
|
-
stroke-linecap: round;
|
|
49
|
-
stroke-dasharray: 42%;
|
|
50
|
-
|
|
51
|
-
&.outer {
|
|
52
|
-
stroke: $platform-blue-400;
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
&.inner {
|
|
56
|
-
stroke: $platform-orange-600;
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
}
|
|
1
|
+
@keyframes rotate {
|
|
2
|
+
100% {
|
|
3
|
+
transform: rotate(360deg);
|
|
4
|
+
}
|
|
5
|
+
}
|
|
6
|
+
|
|
7
|
+
@keyframes rotate-cc {
|
|
8
|
+
100% {
|
|
9
|
+
transform: rotate(-360deg);
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.app-loading {
|
|
14
|
+
position: relative;
|
|
15
|
+
display: flex;
|
|
16
|
+
flex-direction: column;
|
|
17
|
+
align-items: center;
|
|
18
|
+
justify-content: center;
|
|
19
|
+
height: 100%;
|
|
20
|
+
|
|
21
|
+
.logo {
|
|
22
|
+
width: 200px;
|
|
23
|
+
height: 200px;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.spinner {
|
|
27
|
+
transform-origin: center center;
|
|
28
|
+
position: absolute;
|
|
29
|
+
top: 0;
|
|
30
|
+
bottom: 0;
|
|
31
|
+
left: 0;
|
|
32
|
+
right: 0;
|
|
33
|
+
margin: auto;
|
|
34
|
+
|
|
35
|
+
&.clockwise {
|
|
36
|
+
height: 280px;
|
|
37
|
+
width: 280px;
|
|
38
|
+
animation: rotate 3s linear infinite;
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
&.counterclockwise {
|
|
42
|
+
height: 300px;
|
|
43
|
+
width: 300px;
|
|
44
|
+
animation: rotate-cc 3s linear infinite;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
.path {
|
|
48
|
+
stroke-linecap: round;
|
|
49
|
+
stroke-dasharray: 42%;
|
|
50
|
+
|
|
51
|
+
&.outer {
|
|
52
|
+
stroke: $platform-blue-400;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
&.inner {
|
|
56
|
+
stroke: $platform-orange-600;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
|
@@ -109,3 +109,15 @@ mat-icon.calendar-icon {
|
|
|
109
109
|
input[type="time"]::-webkit-calendar-picker-indicator {
|
|
110
110
|
background: none;
|
|
111
111
|
}
|
|
112
|
+
|
|
113
|
+
input[type="time"] {
|
|
114
|
+
-webkit-appearance: textfield; /* or none */
|
|
115
|
+
-moz-appearance: textfield;
|
|
116
|
+
appearance: textfield;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
input[type="time"]::-webkit-calendar-picker-indicator,
|
|
120
|
+
input[type="time"]::-webkit-clear-button,
|
|
121
|
+
input[type="time"]::-webkit-inner-spin-button {
|
|
122
|
+
display: none;
|
|
123
|
+
}
|
|
@@ -1,57 +1,57 @@
|
|
|
1
|
-
// May not be in use - Material Tabs are preferred
|
|
2
|
-
|
|
3
|
-
$platform_bootstraptab_contrasts: (
|
|
4
|
-
light: (
|
|
5
|
-
tabBorder: $beacon-gray-200,
|
|
6
|
-
tabActive: $beacon-orange-400
|
|
7
|
-
),
|
|
8
|
-
dark: (
|
|
9
|
-
tabBorder: $beacon-gray-200,
|
|
10
|
-
tabActive: $beacon-orange-400
|
|
11
|
-
),
|
|
12
|
-
highcontrast: (
|
|
13
|
-
tabBorder: $beacon-white,
|
|
14
|
-
tabActive: $highcontrast-bright-orange-100
|
|
15
|
-
)
|
|
16
|
-
);
|
|
17
|
-
|
|
18
|
-
tabset.tab-container {
|
|
19
|
-
ul.nav.nav-tabs {
|
|
20
|
-
li.nav-item {
|
|
21
|
-
a.nav-link {
|
|
22
|
-
@include font-weight--semibold;
|
|
23
|
-
@include font-color--default;
|
|
24
|
-
|
|
25
|
-
border-radius: 0px;
|
|
26
|
-
height: 48px;
|
|
27
|
-
font-size: 14px;
|
|
28
|
-
padding-top: 12px;
|
|
29
|
-
width: 160px;
|
|
30
|
-
|
|
31
|
-
&:not(.active){
|
|
32
|
-
@include themify($platform_bootstraptab_contrasts) {
|
|
33
|
-
background: apply('tabBorder');
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
&.active {
|
|
38
|
-
@include themify($platform_bootstraptab_contrasts) {
|
|
39
|
-
border-bottom: 1px solid apply('tabBorder');
|
|
40
|
-
border-top: 1px solid apply('tabActive');
|
|
41
|
-
}
|
|
42
|
-
margin-top: auto !important;
|
|
43
|
-
margin-bottom: auto !important;
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
.tab-content {
|
|
50
|
-
@include themify($platform_bootstraptab_contrasts) {
|
|
51
|
-
border-bottom: 1px solid apply('tabBorder');
|
|
52
|
-
border-left: 1px solid apply('tabBorder');
|
|
53
|
-
border-right: 1px solid apply('tabBorder');
|
|
54
|
-
}
|
|
55
|
-
border-top: 0;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
1
|
+
// May not be in use - Material Tabs are preferred
|
|
2
|
+
|
|
3
|
+
$platform_bootstraptab_contrasts: (
|
|
4
|
+
light: (
|
|
5
|
+
tabBorder: $beacon-gray-200,
|
|
6
|
+
tabActive: $beacon-orange-400
|
|
7
|
+
),
|
|
8
|
+
dark: (
|
|
9
|
+
tabBorder: $beacon-gray-200,
|
|
10
|
+
tabActive: $beacon-orange-400
|
|
11
|
+
),
|
|
12
|
+
highcontrast: (
|
|
13
|
+
tabBorder: $beacon-white,
|
|
14
|
+
tabActive: $highcontrast-bright-orange-100
|
|
15
|
+
)
|
|
16
|
+
);
|
|
17
|
+
|
|
18
|
+
tabset.tab-container {
|
|
19
|
+
ul.nav.nav-tabs {
|
|
20
|
+
li.nav-item {
|
|
21
|
+
a.nav-link {
|
|
22
|
+
@include font-weight--semibold;
|
|
23
|
+
@include font-color--default;
|
|
24
|
+
|
|
25
|
+
border-radius: 0px;
|
|
26
|
+
height: 48px;
|
|
27
|
+
font-size: 14px;
|
|
28
|
+
padding-top: 12px;
|
|
29
|
+
width: 160px;
|
|
30
|
+
|
|
31
|
+
&:not(.active){
|
|
32
|
+
@include themify($platform_bootstraptab_contrasts) {
|
|
33
|
+
background: apply('tabBorder');
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
&.active {
|
|
38
|
+
@include themify($platform_bootstraptab_contrasts) {
|
|
39
|
+
border-bottom: 1px solid apply('tabBorder');
|
|
40
|
+
border-top: 1px solid apply('tabActive');
|
|
41
|
+
}
|
|
42
|
+
margin-top: auto !important;
|
|
43
|
+
margin-bottom: auto !important;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
.tab-content {
|
|
50
|
+
@include themify($platform_bootstraptab_contrasts) {
|
|
51
|
+
border-bottom: 1px solid apply('tabBorder');
|
|
52
|
+
border-left: 1px solid apply('tabBorder');
|
|
53
|
+
border-right: 1px solid apply('tabBorder');
|
|
54
|
+
}
|
|
55
|
+
border-top: 0;
|
|
56
|
+
}
|
|
57
|
+
}
|