@things-factory/operato-board 7.0.1-alpha.99 → 7.0.1-beta.0

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.
Files changed (14) hide show
  1. package/_index.html +3 -2
  2. package/dist-client/themes/app-theme.css +21 -22
  3. package/dist-client/themes/dark.css +43 -43
  4. package/dist-client/themes/light.css +37 -37
  5. package/dist-client/themes/oops-theme.css +2 -2
  6. package/dist-client/themes/report-theme.css +3 -3
  7. package/dist-client/tsconfig.tsbuildinfo +1 -1
  8. package/dist-server/tsconfig.tsbuildinfo +1 -1
  9. package/package.json +36 -36
  10. package/views/auth-page.html +2 -1
  11. package/views/public/home.html +2 -1
  12. package/dist-client/themes/grist-theme.css +0 -217
  13. package/dist-client/themes/layout-theme.css +0 -92
  14. package/dist-client/themes/material-theme.css +0 -18
package/_index.html CHANGED
@@ -70,7 +70,8 @@
70
70
  line-height: 1.5;
71
71
  -webkit-font-smoothing: antialiased;
72
72
 
73
- accent-color: var(--primary-color);
73
+ accent-color: var(--md-sys-color-primary);
74
+ background-color: var(--md-sys-color-background);
74
75
  }
75
76
  </style>
76
77
 
@@ -95,7 +96,7 @@
95
96
  </script>
96
97
  </head>
97
98
  <body class="light">
98
- <things-app class="light"></things-app>
99
+ <things-app></things-app>
99
100
  <noscript> Please enable JavaScript to view this website. </noscript>
100
101
  <!-- Load webcomponents-loader.js to check and load any polyfills your browser needs -->
101
102
  <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
package/dist-client/themes/app-theme.css CHANGED
@@ -5,15 +5,14 @@ body {
5
5
  --secondary-color-rgb: 78, 78, 90;
6
6
  --secondary-color: rgb(var(--secondary-color-rgb));
7
7
  --focus-color: var(--theme-white-color);
8
- --primary-background-color: var(--secondary-color);
8
+ --primary-background-color: var(--md-sys-color-secondary);
9
9
  --secondary-background-color: #283644;
10
- --main-section-background-color: #f5f2ee;
11
10
  --theme-white-color: #fff;
12
11
  --theme-black-color: rgba(0, 0, 0, 0.9);
13
12
 
14
- --focus-background-color: var(--primary-color);
13
+ --focus-background-color: var(--md-sys-color-primary);
15
14
  --primary-text-color: #3c3938;
16
- --secondary-text-color: var(--primary-color);
15
+ --secondary-text-color: var(--md-sys-color-primary);
17
16
 
18
17
  --opacity-dark-color: rgba(0, 0, 0, 0.4);
19
18
  --opacity-light-color: rgba(255, 255, 255, 0.8);
@@ -41,7 +40,7 @@ body {
41
40
  --padding-wide: var(--margin-wide);
42
41
 
43
42
  --scrollbar-thumb-color: rgba(57, 78, 100, 0.5);
44
- --scrollbar-thumb-hover-color: var(--primary-color);
43
+ --scrollbar-thumb-hover-color: var(--md-sys-color-primary);
45
44
 
46
45
  --fontsize-default: 14px;
47
46
  --fontsize-small: 13px;
@@ -53,7 +52,7 @@ body {
53
52
  /* title & description style */
54
53
  --title-margin: var(--margin-narrow) 0;
55
54
  --title-font: bold 24px var(--theme-font);
56
- --title-text-color: var(--secondary-color);
55
+ --title-text-color: var(--md-sys-color-secondary);
57
56
  --title-font-mobile: bold 20px var(--theme-font);
58
57
 
59
58
  --page-description-margin: var(--margin-narrow) 0 var(--margin-wide) 0;
@@ -62,8 +61,8 @@ body {
62
61
 
63
62
  --subtitle-padding: 12px 5px 3px 5px;
64
63
  --subtitle-font: bold 18px var(--theme-font);
65
- --subtitle-text-color: var(--primary-color);
66
- --subtitle-border-bottom: 1px solid var(--primary-color);
64
+ --subtitle-text-color: var(--md-sys-color-primary);
65
+ --subtitle-border-bottom: 1px solid var(--md-sys-color-primary);
67
66
 
68
67
  /* icon style */
69
68
  --icon-tiny-size: 24px;
@@ -75,21 +74,21 @@ body {
75
74
  --mdc-theme-on-primary: var(--theme-white-color);
76
75
  --mdc-theme-primary: var(--secondary-text-color);
77
76
  --mdc-theme-on-secondary: var(--theme-white-color);
78
- --mdc-theme-secondary: var(--primary-color);
79
- --mdc-button-outline-color: var(--primary-color);
77
+ --mdc-theme-secondary: var(--md-sys-color-primary);
78
+ --mdc-button-outline-color: var(--md-sys-color-primary);
80
79
  --mdc-danger-button-primary-color: var(--status-danger-color);
81
80
  --mdc-danger-button-outline-color: var(--status-danger-color);
82
81
  --mdc-button-outline-width: 1px;
83
82
  --mdc-button-horizontal-padding: 16px;
84
83
 
85
- --md-fab-container-color: var(--primary-color);
84
+ --md-fab-container-color: var(--md-sys-color-primary);
86
85
  --md-fab-icon-color: var(--focus-color);
87
86
 
88
87
  --md-theme-on-primary: var(--theme-white-color);
89
88
  --md-theme-primary: var(--secondary-text-color);
90
89
  --md-theme-on-secondary: var(--theme-white-color);
91
- --md-theme-secondary: var(--primary-color);
92
- --md-button-outline-color: var(--primary-color);
90
+ --md-theme-secondary: var(--md-sys-color-primary);
91
+ --md-button-outline-color: var(--md-sys-color-primary);
93
92
  --md-danger-button-primary-color: var(--status-danger-color);
94
93
  --md-danger-button-outline-color: var(--status-danger-color);
95
94
  --md-button-outline-width: 1px;
@@ -97,21 +96,21 @@ body {
97
96
 
98
97
  /* button style */
99
98
  --button-background-color: #fafbfc;
100
- --button-background-focus-color: var(--primary-color);
99
+ --button-background-focus-color: var(--md-sys-color-primary);
101
100
  --button-border: var(--border-dark-color);
102
101
  --button-border-radius: var(--border-radius);
103
102
  --button-margin: var(--margin-default) var(--margin-default) var(--margin-default) 0;
104
103
  --button-padding: calc(var(--padding-narrow) * 1.5) var(--padding-wide);
105
- --button-color: var(--secondary-color);
104
+ --button-color: var(--md-sys-color-secondary);
106
105
  --button-font: 600 var(--fontsize-default) var(--theme-font);
107
106
  --button-text-transform: capitalize;
108
107
  --button-active-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.2);
109
- --button-activ-border: 1px solid var(--primary-color);
110
- --button-activ-background-color: var(--primary-color);
108
+ --button-activ-border: 1px solid var(--md-sys-color-primary);
109
+ --button-activ-background-color: var(--md-sys-color-primary);
111
110
  --button-activ-color: var(--theme-white-color);
112
111
  --iconbtn-padding: var(--padding-narrow);
113
112
 
114
- --button-primary-background-color: var(--primary-color);
113
+ --button-primary-background-color: var(--md-sys-color-primary);
115
114
  --button-primary-active-background-color: var(--status-success-color);
116
115
  --button-primary-padding: var(--margin-default) var(--margin-wide);
117
116
  --button-primary-color: var(--theme-white-color);
@@ -119,25 +118,25 @@ body {
119
118
 
120
119
  /* table style */
121
120
  --th-padding: var(--padding-default);
122
- --th-border-top: 2px solid var(--secondary-color);
121
+ --th-border-top: 2px solid var(--md-sys-color-secondary);
123
122
  --th-text-transform: capitalize;
124
123
  --th-font: bold var(--fontsize-small) var(--theme-font);
125
124
  --th-color: rgba(var(--secondary-color-rgb), 0.8);
126
125
 
127
- --tr-background-color: var(--theme-white-color);
126
+ --tr-background-color: var(--md-sys-color-surface-variant);
128
127
  --tr-background-odd-color: rgba(255, 255, 255, 0.4);
129
128
  --tr-background-hover-color: #e1f5fe;
130
129
  --td-border-line: 1px solid rgba(0, 0, 0, 0.05);
131
130
  --td-border-bottom: 1px solid rgba(0, 0, 0, 0.09);
132
131
  --td-padding: var(--padding-default);
133
132
  --td-font: normal 13px var(--theme-font);
134
- --td-color: var(--secondary-color);
133
+ --td-color: var(--md-sys-color-secondary);
135
134
 
136
135
  --label-cell-background-color: #f6f6f6; /* th or td common background color */
137
136
 
138
137
  /* form style */
139
138
  --label-font: normal var(--fontsize-default) var(--theme-font);
140
- --label-color: var(--secondary-color);
139
+ --label-color: var(--md-sys-color-on-surface);
141
140
  --label-text-transform: capitalize;
142
141
  --input-margin: var(--margin-narrow) 0;
143
142
  --input-padding: 6px 2px;
package/dist-client/themes/dark.css CHANGED
@@ -1,51 +1,51 @@
1
1
  .dark {
2
- --md-sys-color-primary: rgb(255 181 153);
3
- --md-sys-color-surface-tint: rgb(255 181 153);
4
- --md-sys-color-on-primary: rgb(85 32 9);
5
- --md-sys-color-primary-container: rgb(113 54 29);
6
- --md-sys-color-on-primary-container: rgb(255 219 206);
7
- --md-sys-color-secondary: rgb(190 194 255);
8
- --md-sys-color-on-secondary: rgb(38 43 96);
9
- --md-sys-color-secondary-container: rgb(61 66 121);
10
- --md-sys-color-on-secondary-container: rgb(224 224 255);
11
- --md-sys-color-tertiary: rgb(212 199 142);
12
- --md-sys-color-on-tertiary: rgb(56 48 6);
13
- --md-sys-color-tertiary-container: rgb(80 71 26);
14
- --md-sys-color-on-tertiary-container: rgb(241 227 168);
2
+ --md-sys-color-primary: rgb(223 192 181);
3
+ --md-sys-color-surface-tint: rgb(223 192 181);
4
+ --md-sys-color-on-primary: rgb(63 44 37);
5
+ --md-sys-color-primary-container: rgb(120 96 87);
6
+ --md-sys-color-on-primary-container: rgb(255 255 255);
7
+ --md-sys-color-secondary: rgb(198 197 211);
8
+ --md-sys-color-on-secondary: rgb(47 47 59);
9
+ --md-sys-color-secondary-container: rgb(69 69 81);
10
+ --md-sys-color-on-secondary-container: rgb(223 221 236);
11
+ --md-sys-color-tertiary: rgb(255 240 198);
12
+ --md-sys-color-on-tertiary: rgb(59 47 0);
13
+ --md-sys-color-tertiary-container: rgb(232 196 49);
14
+ --md-sys-color-on-tertiary-container: rgb(66 53 0);
15
15
  --md-sys-color-error: rgb(255 180 171);
16
16
  --md-sys-color-on-error: rgb(105 0 5);
17
17
  --md-sys-color-error-container: rgb(147 0 10);
18
18
  --md-sys-color-on-error-container: rgb(255 218 214);
19
- --md-sys-color-background: rgb(26 17 14);
20
- --md-sys-color-on-background: rgb(241 223 217);
21
- --md-sys-color-surface: rgb(26 17 14);
22
- --md-sys-color-on-surface: rgb(241 223 217);
23
- --md-sys-color-surface-variant: rgb(83 67 62);
24
- --md-sys-color-on-surface-variant: rgb(216 194 187);
25
- --md-sys-color-outline: rgb(160 141 134);
26
- --md-sys-color-outline-variant: rgb(83 67 62);
19
+ --md-sys-color-background: rgb(21 19 18);
20
+ --md-sys-color-on-background: rgb(232 225 223);
21
+ --md-sys-color-surface: rgb(21 19 18);
22
+ --md-sys-color-on-surface: rgb(232 225 223);
23
+ --md-sys-color-surface-variant: rgb(79 68 65);
24
+ --md-sys-color-on-surface-variant: rgb(211 195 190);
25
+ --md-sys-color-outline: rgb(156 142 137);
26
+ --md-sys-color-outline-variant: rgb(79 68 65);
27
27
  --md-sys-color-shadow: rgb(0 0 0);
28
28
  --md-sys-color-scrim: rgb(0 0 0);
29
- --md-sys-color-inverse-surface: rgb(241 223 217);
30
- --md-sys-color-inverse-on-surface: rgb(57 46 42);
31
- --md-sys-color-inverse-primary: rgb(142 76 50);
32
- --md-sys-color-primary-fixed: rgb(255 219 206);
33
- --md-sys-color-on-primary-fixed: rgb(55 14 0);
34
- --md-sys-color-primary-fixed-dim: rgb(255 181 153);
35
- --md-sys-color-on-primary-fixed-variant: rgb(113 54 29);
36
- --md-sys-color-secondary-fixed: rgb(224 224 255);
37
- --md-sys-color-on-secondary-fixed: rgb(16 20 75);
38
- --md-sys-color-secondary-fixed-dim: rgb(190 194 255);
39
- --md-sys-color-on-secondary-fixed-variant: rgb(61 66 121);
40
- --md-sys-color-tertiary-fixed: rgb(241 227 168);
41
- --md-sys-color-on-tertiary-fixed: rgb(33 27 0);
42
- --md-sys-color-tertiary-fixed-dim: rgb(212 199 142);
43
- --md-sys-color-on-tertiary-fixed-variant: rgb(80 71 26);
44
- --md-sys-color-surface-dim: rgb(26 17 14);
45
- --md-sys-color-surface-bright: rgb(66 55 51);
46
- --md-sys-color-surface-container-lowest: rgb(20 12 9);
47
- --md-sys-color-surface-container-low: rgb(35 26 22);
48
- --md-sys-color-surface-container: rgb(39 30 26);
49
- --md-sys-color-surface-container-high: rgb(50 40 36);
50
- --md-sys-color-surface-container-highest: rgb(61 50 47);
29
+ --md-sys-color-inverse-surface: rgb(232 225 223);
30
+ --md-sys-color-inverse-on-surface: rgb(51 48 47);
31
+ --md-sys-color-inverse-primary: rgb(113 89 81);
32
+ --md-sys-color-primary-fixed: rgb(252 220 208);
33
+ --md-sys-color-on-primary-fixed: rgb(40 23 17);
34
+ --md-sys-color-primary-fixed-dim: rgb(223 192 181);
35
+ --md-sys-color-on-primary-fixed-variant: rgb(88 66 58);
36
+ --md-sys-color-secondary-fixed: rgb(227 225 240);
37
+ --md-sys-color-on-secondary-fixed: rgb(26 27 37);
38
+ --md-sys-color-secondary-fixed-dim: rgb(198 197 211);
39
+ --md-sys-color-on-secondary-fixed-variant: rgb(70 70 81);
40
+ --md-sys-color-tertiary-fixed: rgb(255 225 120);
41
+ --md-sys-color-on-tertiary-fixed: rgb(35 27 0);
42
+ --md-sys-color-tertiary-fixed-dim: rgb(232 196 49);
43
+ --md-sys-color-on-tertiary-fixed-variant: rgb(85 69 0);
44
+ --md-sys-color-surface-dim: rgb(21 19 18);
45
+ --md-sys-color-surface-bright: rgb(60 56 55);
46
+ --md-sys-color-surface-container-lowest: rgb(16 14 13);
47
+ --md-sys-color-surface-container-low: rgb(30 27 26);
48
+ --md-sys-color-surface-container: rgb(34 31 30);
49
+ --md-sys-color-surface-container-high: rgb(44 41 40);
50
+ --md-sys-color-surface-container-highest: rgb(55 52 51);
51
51
  }
package/dist-client/themes/light.css CHANGED
@@ -1,51 +1,51 @@
1
1
  .light {
2
- --md-sys-color-primary: rgb(141, 116, 107);
3
- --md-sys-color-surface-tint: rgb(142 76 50);
2
+ --md-sys-color-primary: rgb(91 69 61);
3
+ --md-sys-color-surface-tint: rgb(113 89 81);
4
4
  --md-sys-color-on-primary: rgb(255 255 255);
5
- --md-sys-color-primary-container: rgb(214, 192, 184);
6
- --md-sys-color-on-primary-container: rgb(55 14 0);
7
- --md-sys-color-secondary: rgb(85 90 146);
5
+ --md-sys-color-primary-container: rgb(130 105 96);
6
+ --md-sys-color-on-primary-container: rgb(255 255 255);
7
+ --md-sys-color-secondary: rgb(58 58 70);
8
8
  --md-sys-color-on-secondary: rgb(255 255 255);
9
- --md-sys-color-secondary-container: rgb(224 224 255);
10
- --md-sys-color-on-secondary-container: rgb(16 20 75);
11
- --md-sys-color-tertiary: rgb(104 94 48);
9
+ --md-sys-color-secondary-container: rgb(93 93 105);
10
+ --md-sys-color-on-secondary-container: rgb(255 255 255);
11
+ --md-sys-color-tertiary: rgb(113 93 0);
12
12
  --md-sys-color-on-tertiary: rgb(255 255 255);
13
- --md-sys-color-tertiary-container: rgb(241 227 168);
14
- --md-sys-color-on-tertiary-container: rgb(33 27 0);
13
+ --md-sys-color-tertiary-container: rgb(244 207 61);
14
+ --md-sys-color-on-tertiary-container: rgb(75 60 0);
15
15
  --md-sys-color-error: rgb(186 26 26);
16
16
  --md-sys-color-on-error: rgb(255 255 255);
17
17
  --md-sys-color-error-container: rgb(255 218 214);
18
18
  --md-sys-color-on-error-container: rgb(65 0 2);
19
19
  --md-sys-color-background: rgb(255 248 246);
20
- --md-sys-color-on-background: rgb(35 26 22);
20
+ --md-sys-color-on-background: rgb(30 27 26);
21
21
  --md-sys-color-surface: rgb(255 248 246);
22
- --md-sys-color-on-surface: rgb(35 26 22);
23
- --md-sys-color-surface-variant: rgb(236, 223, 213);
24
- --md-sys-color-on-surface-variant: rgb(83 67 62);
25
- --md-sys-color-outline: rgb(133 115 109);
26
- --md-sys-color-outline-variant: rgb(216 194 187);
22
+ --md-sys-color-on-surface: rgb(30 27 26);
23
+ --md-sys-color-surface-variant: rgb(240 223 218);
24
+ --md-sys-color-on-surface-variant: rgb(79 68 65);
25
+ --md-sys-color-outline: rgb(129 116 112);
26
+ --md-sys-color-outline-variant: rgb(211 195 190);
27
27
  --md-sys-color-shadow: rgb(0 0 0);
28
28
  --md-sys-color-scrim: rgb(0 0 0);
29
- --md-sys-color-inverse-surface: rgb(57 46 42);
30
- --md-sys-color-inverse-on-surface: rgb(237, 220, 215);
31
- --md-sys-color-inverse-primary: rgb(255 181 153);
32
- --md-sys-color-primary-fixed: rgb(233, 202, 191);
33
- --md-sys-color-on-primary-fixed: rgb(55 14 0);
34
- --md-sys-color-primary-fixed-dim: rgb(255 181 153);
35
- --md-sys-color-on-primary-fixed-variant: rgb(113 54 29);
36
- --md-sys-color-secondary-fixed: rgb(224 224 255);
37
- --md-sys-color-on-secondary-fixed: rgb(16 20 75);
38
- --md-sys-color-secondary-fixed-dim: rgb(190 194 255);
39
- --md-sys-color-on-secondary-fixed-variant: rgb(61 66 121);
40
- --md-sys-color-tertiary-fixed: rgb(241 227 168);
41
- --md-sys-color-on-tertiary-fixed: rgb(33 27 0);
42
- --md-sys-color-tertiary-fixed-dim: rgb(212 199 142);
43
- --md-sys-color-on-tertiary-fixed-variant: rgb(80 71 26);
44
- --md-sys-color-surface-dim: rgb(232 214 209);
45
- --md-sys-color-surface-bright: rgb(239, 233, 231);
29
+ --md-sys-color-inverse-surface: rgb(51 48 47);
30
+ --md-sys-color-inverse-on-surface: rgb(246 239 237);
31
+ --md-sys-color-inverse-primary: rgb(223 192 181);
32
+ --md-sys-color-primary-fixed: rgb(252 220 208);
33
+ --md-sys-color-on-primary-fixed: rgb(40 23 17);
34
+ --md-sys-color-primary-fixed-dim: rgb(223 192 181);
35
+ --md-sys-color-on-primary-fixed-variant: rgb(88 66 58);
36
+ --md-sys-color-secondary-fixed: rgb(227 225 240);
37
+ --md-sys-color-on-secondary-fixed: rgb(26 27 37);
38
+ --md-sys-color-secondary-fixed-dim: rgb(198 197 211);
39
+ --md-sys-color-on-secondary-fixed-variant: rgb(70 70 81);
40
+ --md-sys-color-tertiary-fixed: rgb(255 225 120);
41
+ --md-sys-color-on-tertiary-fixed: rgb(35 27 0);
42
+ --md-sys-color-tertiary-fixed-dim: rgb(232 196 49);
43
+ --md-sys-color-on-tertiary-fixed-variant: rgb(85 69 0);
44
+ --md-sys-color-surface-dim: rgb(223 217 215);
45
+ --md-sys-color-surface-bright: rgb(255 248 246);
46
46
  --md-sys-color-surface-container-lowest: rgb(255 255 255);
47
- --md-sys-color-surface-container-low: rgb(255 241 236);
48
- --md-sys-color-surface-container: rgb(252 234 228);
49
- --md-sys-color-surface-container-high: rgb(247 228 223);
50
- --md-sys-color-surface-container-highest: rgb(241 223 217);
47
+ --md-sys-color-surface-container-low: rgb(249 242 240);
48
+ --md-sys-color-surface-container: rgb(243 236 234);
49
+ --md-sys-color-surface-container-high: rgb(238 231 229);
50
+ --md-sys-color-surface-container-highest: rgb(232 225 223);
51
51
  }
package/dist-client/themes/oops-theme.css CHANGED
@@ -11,9 +11,9 @@ body {
11
11
  --oops-note-icon-padding: var(--padding-default);
12
12
  --oops-note-title-margin: 7px 0 2px 0;
13
13
  --oops-note-title-font: bold 14px var(--theme-font);
14
- --oops-note-title-color: var(--secondary-color);
14
+ --oops-note-title-color: var(--md-sys-color-secondary);
15
15
  --oops-note-description-font: normal 12px var(--theme-font);
16
- --oops-note-description-color: var(--primary-color);
16
+ --oops-note-description-color: var(--md-sys-color-primary);
17
17
  }
18
18
  @media only screen and (max-width: 460px) {
19
19
  body {
package/dist-client/themes/report-theme.css CHANGED
@@ -1,10 +1,10 @@
1
1
  body {
2
- --report-background-color: var(--main-section-background-color);
2
+ --report-background-color: var(--md-sys-color-background);
3
3
  --report-padding: 15px;
4
4
  --report-title-margin: 0 0 0 10px;
5
5
  --report-title-border: none;
6
- --report-title-color: var(--secondary-color);
7
- --report-title-icon-color: var(--primary-color);
6
+ --report-title-color: var(--md-sys-color-secondary);
7
+ --report-title-icon-color: var(--md-sys-color-primary);
8
8
  --report-title-icon-margin: 0 3px 2px 0;
9
9
  --report-title-icon-size: 14px;
10
10
  --report-title-with-grid-padding: 0;