@operato/data-grist 7.0.0-rc.5 → 7.0.0-rc.6

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 (24) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/dist/src/data-card/data-card.js +1 -1
  3. package/dist/src/data-card/data-card.js.map +1 -1
  4. package/dist/src/data-card/record-card.js +1 -0
  5. package/dist/src/data-card/record-card.js.map +1 -1
  6. package/dist/src/data-grid/data-grid-accum-field.js +1 -1
  7. package/dist/src/data-grid/data-grid-accum-field.js.map +1 -1
  8. package/dist/src/data-grid/data-grid-body.js +1 -1
  9. package/dist/src/data-grid/data-grid-body.js.map +1 -1
  10. package/dist/src/data-list/record-partial.js +1 -1
  11. package/dist/src/data-list/record-partial.js.map +1 -1
  12. package/dist/src/filters/filter-styles.js +3 -3
  13. package/dist/src/filters/filter-styles.js.map +1 -1
  14. package/dist/tsconfig.tsbuildinfo +1 -1
  15. package/package.json +6 -6
  16. package/src/data-card/data-card.ts +1 -1
  17. package/src/data-card/record-card.ts +1 -0
  18. package/src/data-grid/data-grid-accum-field.ts +1 -1
  19. package/src/data-grid/data-grid-body.ts +1 -1
  20. package/src/data-list/record-partial.ts +1 -1
  21. package/src/filters/filter-styles.ts +3 -3
  22. package/themes/dark.css +54 -47
  23. package/themes/grist-theme.css +2 -2
  24. package/themes/light.css +49 -42
package/src/data-list/record-partial.ts CHANGED
@@ -98,7 +98,7 @@ export class RecordPartial extends LitElement {
98
98
 
99
99
  ox-list-field[desc] {
100
100
  font: var(--data-list-item-disc-font);
101
- color: var(--data-list-item-disc-color, var(--md-sys-color-tertiary));
101
+ color: var(--data-list-item-disc-color, var(--md-sys-color-on-tertiary-container));
102
102
  }
103
103
  `
104
104
  ]
package/src/filters/filter-styles.ts CHANGED
@@ -14,18 +14,18 @@ export const FilterStyles = css`
14
14
  --ox-filters-input-background-color: transparent;
15
15
 
16
16
  --ox-filters-form-gap: var(--input-gap-vertical, 8px) var(--input-gap-horizontal, 16px);
17
- --ox-filters-input-padding: var(--input-padding, 6px 2px);
17
+ --ox-filters-input-padding: var(--spacing-small, 4px);
18
18
 
19
19
  --ox-select-padding: var(--ox-filters-input-padding);
20
20
  --ox-checkbox-background-color: var(--ox-filters-input-background-color, transparent);
21
21
  }
22
22
 
23
23
  label {
24
- font: var(--ox-filters-label-font);
25
- color: var(--ox-filters-label-color, var(--md-sys-color-on-surface));
24
+ color: var(--ox-filters-label-color, var(--md-sys-color-on-primary-container));
26
25
  }
27
26
 
28
27
  span {
28
+ font-weight:var(--md-sys-typescale-label-medium-weight);
29
29
  text-transform: capitalize;
30
30
  }
31
31
 
package/themes/dark.css CHANGED
@@ -1,53 +1,60 @@
1
1
  .dark {
2
- --md-sys-color-primary: rgb(178 197 255);
3
- --md-sys-color-surface-tint: rgb(178 197 255);
4
- --md-sys-color-on-primary: rgb(24 46 96);
5
- --md-sys-color-primary-container: rgb(49 69 120);
6
- --md-sys-color-on-primary-container: rgb(218 226 255);
7
- --md-sys-color-secondary: rgb(143 207 243);
8
- --md-sys-color-on-secondary: rgb(0 53 73);
9
- --md-sys-color-secondary-container: rgb(0 76 104);
10
- --md-sys-color-on-secondary-container: rgb(195 232 255);
11
- --md-sys-color-tertiary: #cffce3;
12
- --md-sys-color-on-tertiary: rgb(0 56 35);
13
- --md-sys-color-tertiary-container: #005234;
14
- --md-sys-color-on-tertiary-container: #cffce3;
15
- --md-sys-color-error: #fbafa9;
16
- --md-sys-color-on-error: #fe594e;
17
- --md-sys-color-error-container: #fe594e;
18
- --md-sys-color-on-error-container: #fbafa9;
19
- --md-sys-color-background: rgb(18 19 24);
20
- --md-sys-color-on-background: rgb(227 226 233);
21
- --md-sys-color-surface: rgb(18 19 24);
22
- --md-sys-color-on-surface: rgb(227 226 233);
23
- --md-sys-color-surface-variant: rgb(69 70 79);
24
- --md-sys-color-on-surface-variant: rgb(197 198 208);
25
- --md-sys-color-outline: rgb(143 144 154);
26
- --md-sys-color-outline-variant: rgb(69 70 79);
2
+ --md-sys-color-primary: rgb(77 168 252); /* for header bar bg*/
3
+ --md-sys-color-surface-tint: rgb(125 208 255);
4
+ --md-sys-color-on-primary: rgb(0 20 30); /* for header bar font */
5
+ --md-sys-color-primary-container: rgb(26 40 52);
6
+ --md-sys-color-on-primary-container: rgb(255 255 255);
7
+
8
+ --md-sys-color-secondary: rgb(179 201 227);
9
+ --md-sys-color-on-secondary: rgb(28 50 71);
10
+ --md-sys-color-secondary-container: rgb(41 44 48);
11
+ --md-sys-color-on-secondary-container: rgb(197 219 246);
12
+
13
+ --md-sys-color-tertiary: rgb(148 232 86);
14
+ --md-sys-color-on-tertiary: rgb(29 68 1);
15
+ --md-sys-color-tertiary-container: rgb(37 49 27);
16
+ --md-sys-color-on-tertiary-container: rgb(229 246 217);
17
+
18
+ --md-sys-color-error: rgb(248 90 87);
19
+ --md-sys-color-on-error: rgb(255 234 192);
20
+ --md-sys-color-error-container: rgb(51 28 27);
21
+ --md-sys-color-on-error-container: rgb(255 255 255);
22
+
23
+ --md-sys-color-background: rgb(21 39 58); /* for content bg */
24
+ --md-sys-color-on-background: rgb(222 227 227);
25
+ --md-sys-color-surface: rgb(15 20 20);
26
+ --md-sys-color-on-surface: rgb(222 227 227);
27
+ --md-sys-color-surface-variant: rgb(61 73 73); /* for more pannel bg */
28
+ --md-sys-color-on-surface-variant: rgb(218 236 255);
29
+
30
+ --md-sys-color-outline: rgba(255,255,255,.25);
31
+ --md-sys-color-outline-variant: rgba(255,255,255,.15);
27
32
  --md-sys-color-shadow: rgb(0 0 0);
28
33
  --md-sys-color-scrim: rgb(0 0 0);
29
- --md-sys-color-inverse-surface: rgb(227 226 233);
30
- --md-sys-color-inverse-on-surface: rgb(47 48 54);
31
- --md-sys-color-inverse-primary: rgb(73 93 146);
32
- --md-sys-color-primary-fixed: rgb(218 226 255);
33
- --md-sys-color-on-primary-fixed: rgb(0 24 72);
34
- --md-sys-color-primary-fixed-dim: rgb(178 197 255);
35
- --md-sys-color-on-primary-fixed-variant: rgb(49 69 120);
36
- --md-sys-color-secondary-fixed: rgb(195 232 255);
37
- --md-sys-color-on-secondary-fixed: rgb(0 30 44);
38
- --md-sys-color-secondary-fixed-dim: rgb(143 207 243);
39
- --md-sys-color-on-secondary-fixed-variant: rgb(0 76 104);
40
- --md-sys-color-tertiary-fixed: #c7e6d5;
41
- --md-sys-color-on-tertiary-fixed: rgb(0 33 19);
42
- --md-sys-color-tertiary-fixed-dim: #c7e6d5;
43
- --md-sys-color-on-tertiary-fixed-variant: rgb(0 82 52);
44
- --md-sys-color-surface-dim: rgb(18 19 24);
45
- --md-sys-color-surface-bright: rgb(56 57 63);
46
- --md-sys-color-surface-container-lowest: rgb(13 14 19);
47
- --md-sys-color-surface-container-low: rgb(26 27 33);
48
- --md-sys-color-surface-container: rgb(30 31 37);
49
- --md-sys-color-surface-container-high: rgb(41 42 47);
50
- --md-sys-color-surface-container-highest: rgb(51 52 58);
34
+ --md-sys-color-inverse-surface: rgb(222 227 227);
35
+ --md-sys-color-inverse-on-surface: rgb(44 49 49);
36
+ --md-sys-color-inverse-primary: rgb(53 118 177); /* for header bar bg */
37
+
38
+ --md-sys-color-primary-fixed: rgb(106 183 254);
39
+ --md-sys-color-on-primary-fixed: rgb(255 255 255);
40
+ --md-sys-color-primary-fixed-dim: rgb(85 146 203);
41
+ --md-sys-color-on-primary-fixed-variant: rgba(255, 255, 255,.8);
42
+ --md-sys-color-secondary-fixed: rgb(59 110 160);
43
+ --md-sys-color-on-secondary-fixed: rgb(211 233 254); /* for more pannel text color */
44
+ --md-sys-color-secondary-fixed-dim: rgb(47 88 128); /* for more pannel bg */
45
+ --md-sys-color-on-secondary-fixed-variant: rgba(211, 233, 254,.8);
46
+ --md-sys-color-tertiary-fixed: rgb(117 208 57);
47
+ --md-sys-color-on-tertiary-fixed: rgb(255 255 255);
48
+ --md-sys-color-tertiary-fixed-dim: rgb(94 166 46);
49
+ --md-sys-color-on-tertiary-fixed-variant: rgba(255, 255, 255,.8);
50
+
51
+ --md-sys-color-surface-dim: rgb(15 20 20);
52
+ --md-sys-color-surface-bright: rgb(53 58 58);
53
+ --md-sys-color-surface-container-lowest: rgb(10 15 15);
54
+ --md-sys-color-surface-container-low: rgb(23 29 29);
55
+ --md-sys-color-surface-container: rgb(27 33 33);
56
+ --md-sys-color-surface-container-high: rgb(37 43 43);
57
+ --md-sys-color-surface-container-highest: rgb(48 54 54);
51
58
 
52
59
  /* primary palette */
53
60
  --md-ref-palette-primary0:#000000;
package/themes/grist-theme.css CHANGED
@@ -81,7 +81,7 @@ body {
81
81
  --data-list-item-name-font: bold 1.1em var(--theme-font, 'Roboto');
82
82
  --data-list-item-name-color: var(--md-sys-color-secondary);
83
83
  --data-list-item-disc-font: normal 0.9em var(--theme-font, 'Roboto');
84
- --data-list-item-disc-color: var(--md-sys-color-tertiary);
84
+ --data-list-item-disc-color: var(--md-sys-color-on-tertiary-container);
85
85
  --data-list-item-etc-label-font: bold 1em/1em var(--theme-font, 'Roboto');
86
86
  --data-list-item-etc-font: normal 0.9em/1em var(--theme-font, 'Roboto');
87
87
  --data-list-item-etc-color: var(--md-ref-palette-neutral50);
@@ -94,7 +94,7 @@ body {
94
94
  --data-list-fab-shadow: var(--box-shadow);
95
95
 
96
96
  --data-card-background-color: var(--md-sys-color-surface-container);
97
- --data-card-record-card-background-color: var(--md-sys-color-surface);
97
+ --data-card-record-card-background-color: var(--md-sys-color-surface-container-lowest);
98
98
  --data-card-record-card-border: var(--grid-container-border-color);
99
99
  --data-card-record-card-border-hover: 1px solid var(--md-sys-color-primary);
100
100
  --data-card-record-card-boxshadow-hover: 1px 1px 2px 1px rgba(0, 0, 0, 0.15);
package/themes/light.css CHANGED
@@ -1,53 +1,60 @@
1
1
  .light {
2
- --md-sys-color-primary: rgb(73 93 146);
3
- --md-sys-color-surface-tint: rgb(73 93 146);
4
- --md-sys-color-on-primary: rgb(255 255 255);
5
- --md-sys-color-primary-container: #e4eaf9;
6
- --md-sys-color-on-primary-container: rgb(0 24 72);
7
- --md-sys-color-secondary: rgb(27 101 133);
2
+ --md-sys-color-primary: rgb(46 121 190); /* for header bar bg, auth UI bg, grist header top border, grist header th color, menu icon, menu active */
3
+ --md-sys-color-surface-tint: rgb(51 149 241);
4
+ --md-sys-color-on-primary: rgba(255,255,255,.9); /* for header bar font */
5
+ --md-sys-color-primary-container: rgb(215 231 241);
6
+ --md-sys-color-on-primary-container: rgb(50 66 82); /* for default text bg */
7
+
8
+ --md-sys-color-secondary: rgb(38 59 80);
8
9
  --md-sys-color-on-secondary: rgb(255 255 255);
9
- --md-sys-color-secondary-container: rgb(195 232 255);
10
- --md-sys-color-on-secondary-container: rgb(0 30 44);
11
- --md-sys-color-tertiary: rgb(37 106 75);
10
+ --md-sys-color-secondary-container: rgb(214 222 225);
11
+ --md-sys-color-on-secondary-container: rgb(63 88 113);
12
+
13
+ --md-sys-color-tertiary: rgb(76 187 73);
12
14
  --md-sys-color-on-tertiary: rgb(255 255 255);
13
- --md-sys-color-tertiary-container: rgb(171 242 201);
14
- --md-sys-color-on-tertiary-container: rgb(0 33 19);
15
- --md-sys-color-error: #fe594e;
15
+ --md-sys-color-tertiary-container: rgb(220 241 224);
16
+ --md-sys-color-on-tertiary-container: rgb(72 148 70);
17
+
18
+ --md-sys-color-error: rgb(225 87 87);
16
19
  --md-sys-color-on-error: rgb(255 255 255);
17
- --md-sys-color-error-container: rgb(255 218 215);
18
- --md-sys-color-on-error-container: #fe594e;
19
- --md-sys-color-background: rgb(250 248 255);
20
- --md-sys-color-on-background: rgb(26 27 33);
21
- --md-sys-color-surface: rgb(250 248 255);
22
- --md-sys-color-on-surface: rgb(26 27 33);
23
- --md-sys-color-surface-variant: rgb(225 226 236);
24
- --md-sys-color-on-surface-variant: rgb(69 70 79);
20
+ --md-sys-color-error-container: rgb(242 226 226);
21
+ --md-sys-color-on-error-container: rgb(225 87 87);
22
+
23
+ --md-sys-color-background: rgb(245 250 250); /* for content bg */
24
+ --md-sys-color-on-background: var(--md-sys-color-on-primary-container);
25
+ --md-sys-color-surface: rgb(229 242 254);
26
+ --md-sys-color-on-surface: var(--md-sys-color-on-primary-container);
27
+ --md-sys-color-surface-variant: rgb(207 227 246);
28
+ --md-sys-color-on-surface-variant: var(--md-sys-color-on-primary-container);
29
+
25
30
  --md-sys-color-outline: rgba(0,0,0,.25);
26
- --md-sys-color-outline-variant: rgb(197 198 208);
31
+ --md-sys-color-outline-variant: rgba(0,0,0,.15);
27
32
  --md-sys-color-shadow: rgb(0 0 0);
28
33
  --md-sys-color-scrim: rgb(0 0 0);
29
- --md-sys-color-inverse-surface: rgb(47 48 54);
30
- --md-sys-color-inverse-on-surface: rgb(241 240 247);
31
- --md-sys-color-inverse-primary: #c9d4f4;
32
- --md-sys-color-primary-fixed: rgb(218 226 255);
33
- --md-sys-color-on-primary-fixed: rgb(0 24 72);
34
- --md-sys-color-primary-fixed-dim: #c9d4f4;
35
- --md-sys-color-on-primary-fixed-variant: rgb(49 69 120);
36
- --md-sys-color-secondary-fixed: rgb(195 232 255);
37
- --md-sys-color-on-secondary-fixed: rgb(0 30 44);
38
- --md-sys-color-secondary-fixed-dim: rgb(143 207 243);
39
- --md-sys-color-on-secondary-fixed-variant: rgb(0 76 104);
40
- --md-sys-color-tertiary-fixed: #e5f6da;
41
- --md-sys-color-on-tertiary-fixed: #005234;
42
- --md-sys-color-tertiary-fixed-dim: #c8eabc;
43
- --md-sys-color-on-tertiary-fixed-variant: #005234;
44
- --md-sys-color-surface-dim: rgb(218 217 224);
45
- --md-sys-color-surface-bright: rgb(250 248 255);
34
+ --md-sys-color-inverse-surface: rgb(35 74 110);
35
+ --md-sys-color-inverse-on-surface: rgba(229,246,255,.9);
36
+ --md-sys-color-inverse-primary: rgba(51, 149, 241,.25); /* for grist edit cell bg */
37
+
38
+ --md-sys-color-primary-fixed: rgb(106 183 254);
39
+ --md-sys-color-on-primary-fixed: rgb(255 255 255);
40
+ --md-sys-color-primary-fixed-dim: rgb(85 146 203);
41
+ --md-sys-color-on-primary-fixed-variant: rgba(255, 255, 255,.8);
42
+ --md-sys-color-secondary-fixed: rgb(59 110 160);
43
+ --md-sys-color-on-secondary-fixed: rgb(211 233 254); /* for more pannel text color */
44
+ --md-sys-color-secondary-fixed-dim: rgb(47 88 128); /* for more pannel bg */
45
+ --md-sys-color-on-secondary-fixed-variant: rgba(211, 233, 254,.8);
46
+ --md-sys-color-tertiary-fixed: rgb(117 208 57);
47
+ --md-sys-color-on-tertiary-fixed: rgb(255 255 255);
48
+ --md-sys-color-tertiary-fixed-dim: rgb(94 166 46);
49
+ --md-sys-color-on-tertiary-fixed-variant: rgba(255, 255, 255,.8);
50
+
51
+ --md-sys-color-surface-dim: rgb(214 219 218);
52
+ --md-sys-color-surface-bright: rgb(245 250 250);
46
53
  --md-sys-color-surface-container-lowest: rgb(255 255 255);
47
- --md-sys-color-surface-container-low: rgb(244 243 250);
48
- --md-sys-color-surface-container: rgb(238 237 244);
49
- --md-sys-color-surface-container-high: rgb(232 231 239);
50
- --md-sys-color-surface-container-highest: rgb(227 226 233);
54
+ --md-sys-color-surface-container-low: rgb(239 245 244);
55
+ --md-sys-color-surface-container: rgb(234 239 238);
56
+ --md-sys-color-surface-container-high: rgb(228 233 232);
57
+ --md-sys-color-surface-container-highest: rgb(222 227 227);
51
58
 
52
59
  /* primary palette */
53
60
  --md-ref-palette-primary0:#000000;