@infinite-table/infinite-react 7.3.2 → 7.3.4

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 (12) hide show
  1. package/index.css +1 -1
  2. package/index.d.ts +10 -1
  3. package/index.dev.js +12562 -12528
  4. package/index.dev.mjs +11635 -11601
  5. package/index.js +8 -8
  6. package/index.mjs +8 -8
  7. package/package.json +2 -2
  8. package/theme/balsam.css +107 -105
  9. package/theme/default.css +630 -628
  10. package/theme/minimalist.css +124 -122
  11. package/theme/ocean.css +127 -125
  12. package/theme/shadcn.css +109 -107
package/theme/minimalist.css CHANGED
@@ -1,128 +1,89 @@
1
1
  /* vanilla-extract-css-ns:src/components/InfiniteTable/theme-minimalist.css.ts.vanilla.css?source=#H4sIAAAAAAAAA+2YwYrbMBCG73kKQaDsQhWStGWLeyl0u7SPIVvjWESWhCQngbLvXqSYxJvYspx4CwUfAsGa+WckjecbvGAiZ4JZwLaAErAgJWBcMsFKwpmxiZbSfkSLHjP0Z4YQxierAggFjTPgHKdSu/+abQqbICEFfOszbjXLGbegMVBmpcYpybYbLStBE7Qj+qFhqOUeS0obJo8dESWX+srdP+3waEZtSdFvYYBqzokpmNiEdkOyDITt8a9USMJUWQbG9GhQuRchFdBa6naNEkTVte/TkbQ6BeJ1X5/3ZBZKTJkhKQca0rmI0y1GMst20FdZhdy9KYRuPaXBmHBuMYJcEopLYrbYwsHedmJnjaG35DJshrSaCKOIBmEvLJ2FcoVkpeQpCb6i3Zme+0uCzv2l1aiUFBLEXV+5WG9G3hfMXr2nx0OYr58/PX3+2rLjt+0jtGt/3QYU0cTKU0uZ/3x+Wb88tbWHuh1aqRK0UgdkJGc0wkETyiqToGWoe0a0p1qOQ97ejeN6dtNqz6gtErRUhwuj+oXytkxQlvkjYsKATdBaHfz+659z/YAWv2vfX35XP4BzjxaEfO37a8ilLhNUKQU6I8YnhlAuhcV7OOabSk6PjzlYxwyjSMbEJkHLxfILlG7tdfY6u6SaKyiMfUENWLpkYd/6NU0b4r2kDXqPK3wF+YD8fd6hvKfJYpospslimiymyWKaLP7zyYISvY1fGWuucNrvR3+vPjF6YvTE6InR/57Rrv0EED1fkVW+Tjsg3UrGUSDdiv8QpHsdJkiPDunvJVBG0IPSkIOuGyQ2mSuvY2U9+uh9ZBzyjXwgJ6NJOSorb6FlLC+HE/N+Zo5DzXG4eSM572HnyPQcn5/vQNBxGHoPRYdwdCySRrK0l6YxPO0h6lCmDqPqDVyNI+sgtkbSNZavkYS9i7FhyvZytpO0IdY62nri/gUVKqaubR4AAA== */
2
- .infinite-theme-name--minimalist:root,
3
- .infinite-theme-name--minimalist {
4
- --infinite-header-cell-border-right: none;
5
- --infinite-header-cell-border: none;
6
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
7
- --infinite-header-color: var(--infinite-color);
8
- --infinite-header-background: none;
9
- --infinite-cell-color: var(--infinite-color);
10
- --infinite-flashing-background: var(--infinite-accent-color);
11
- --infinite-flashing-up-background: var(--infinite-success-color);
12
- --infinite-flashing-down-background: var(--infinite-error-color);
13
- --infinite-menu-color: var(--infinite-cell-color);
14
- --infinite-menu-background: var(--infinite-background);
15
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
16
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
17
- --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
18
- --infinite-load-mask-text-background: var(--infinite-background);
19
- --infinite-load-mask-color: var(--infinite-cell-color);
20
- --infinite-row-background: transparent;
21
- --infinite-grouping-toolbar-background: var(--infinite-background);
22
- --infinite-theme-name: minimalist;
23
- --infinite-theme-mode: light;
24
- --infinite-background: white;
25
- --infinite-color: #2D3748;
26
- --infinite-row-odd-background: transparent;
27
- --infinite-menu-separator-color: #EDF2F7;
28
- --infinite-cell-border-top: 1px solid #EDF2F7;
29
- --infinite-cell-border-radius: 0;
30
- --infinite-header-cell-background: none;
31
- --infinite-cell-border-left: none;
32
- --infinite-cell-border-right: none;
33
- --infinite-cell-border-width: 0px;
34
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
35
- & .InfiniteHeaderCell {
36
- text-transform: uppercase;
37
- font-weight: bold;
38
- letter-spacing: 0.05em;
39
- }
40
- }
41
- .infinite-theme-mode--light.infinite-theme-mode--light.infinite-theme-name--minimalist.infinite-theme-name--minimalist,
42
- .infinite-theme-mode--light .infinite-theme-name--minimalist,
43
- .infinite-theme-mode--light.infinite-theme-mode--light .infinite-theme-name--minimalist,
44
- .infinite-theme-name--minimalist .infinite-theme-mode--light,
45
- .infinite-theme-name--minimalist .infinite-theme-mode--light.infinite-theme-mode--light {
46
- --infinite-header-cell-border-right: none;
47
- --infinite-header-cell-border: none;
48
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
49
- --infinite-header-color: var(--infinite-color);
50
- --infinite-header-background: none;
51
- --infinite-cell-color: var(--infinite-color);
52
- --infinite-flashing-background: var(--infinite-accent-color);
53
- --infinite-flashing-up-background: var(--infinite-success-color);
54
- --infinite-flashing-down-background: var(--infinite-error-color);
55
- --infinite-menu-color: var(--infinite-cell-color);
56
- --infinite-menu-background: var(--infinite-background);
57
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
58
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
59
- --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
60
- --infinite-load-mask-text-background: var(--infinite-background);
61
- --infinite-load-mask-color: var(--infinite-cell-color);
62
- --infinite-row-background: transparent;
63
- --infinite-grouping-toolbar-background: var(--infinite-background);
64
- --infinite-theme-name: minimalist;
65
- --infinite-theme-mode: light;
66
- --infinite-background: white;
67
- --infinite-color: #2D3748;
68
- --infinite-row-odd-background: transparent;
69
- --infinite-menu-separator-color: #EDF2F7;
70
- --infinite-cell-border-top: 1px solid #EDF2F7;
71
- --infinite-cell-border-radius: 0;
72
- --infinite-header-cell-background: none;
73
- --infinite-cell-border-left: none;
74
- --infinite-cell-border-right: none;
75
- --infinite-cell-border-width: 0px;
76
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
77
- & .InfiniteHeaderCell {
78
- text-transform: uppercase;
79
- font-weight: bold;
80
- letter-spacing: 0.05em;
81
- }
82
- }
83
- .infinite-theme-mode--dark.infinite-theme-mode--dark.infinite-theme-name--minimalist.infinite-theme-name--minimalist,
84
- .infinite-theme-mode--dark .infinite-theme-name--minimalist,
85
- .infinite-theme-name--minimalist .infinite-theme-mode--dark {
86
- --infinite-header-cell-border-right: none;
87
- --infinite-header-cell-border: none;
88
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
89
- --infinite-header-color: var(--infinite-color);
90
- --infinite-header-background: none;
91
- --infinite-cell-color: var(--infinite-color);
92
- --infinite-flashing-background: var(--infinite-accent-color);
93
- --infinite-flashing-up-background: var(--infinite-success-color);
94
- --infinite-flashing-down-background: var(--infinite-error-color);
95
- --infinite-menu-color: var(--infinite-cell-color);
96
- --infinite-menu-background: var(--infinite-background);
97
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
98
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
99
- --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
100
- --infinite-load-mask-text-background: var(--infinite-background);
101
- --infinite-load-mask-color: var(--infinite-cell-color);
102
- --infinite-row-background: transparent;
103
- --infinite-grouping-toolbar-background: var(--infinite-background);
104
- --infinite-theme-name: minimalist;
105
- --infinite-theme-mode: dark;
106
- --infinite-background: #1a1f2b;
107
- --infinite-color: #EDF2F7;
108
- --infinite-row-odd-background: transparent;
109
- --infinite-menu-separator-color: #2D3748;
110
- --infinite-cell-border-top: 1px solid #2D3748;
111
- --infinite-cell-border-radius: 0;
112
- --infinite-header-cell-background: none;
113
- --infinite-cell-border-left: none;
114
- --infinite-cell-border-right: none;
115
- --infinite-cell-border-width: 0px;
116
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
117
- & .InfiniteHeaderCell {
118
- text-transform: uppercase;
119
- font-weight: bold;
120
- letter-spacing: 0.05em;
121
- }
122
- }
123
- @media (prefers-color-scheme: dark) {
2
+ @layer infinite-table {
124
3
  .infinite-theme-name--minimalist:root,
125
4
  .infinite-theme-name--minimalist {
5
+ --infinite-header-cell-border-right: none;
6
+ --infinite-header-cell-border: none;
7
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
8
+ --infinite-header-color: var(--infinite-color);
9
+ --infinite-header-background: none;
10
+ --infinite-cell-color: var(--infinite-color);
11
+ --infinite-flashing-background: var(--infinite-accent-color);
12
+ --infinite-flashing-up-background: var(--infinite-success-color);
13
+ --infinite-flashing-down-background: var(--infinite-error-color);
14
+ --infinite-menu-color: var(--infinite-cell-color);
15
+ --infinite-menu-background: var(--infinite-background);
16
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
17
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
18
+ --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
19
+ --infinite-load-mask-text-background: var(--infinite-background);
20
+ --infinite-load-mask-color: var(--infinite-cell-color);
21
+ --infinite-row-background: transparent;
22
+ --infinite-grouping-toolbar-background: var(--infinite-background);
23
+ --infinite-theme-name: minimalist;
24
+ --infinite-theme-mode: light;
25
+ --infinite-background: white;
26
+ --infinite-color: #2D3748;
27
+ --infinite-row-odd-background: transparent;
28
+ --infinite-menu-separator-color: #EDF2F7;
29
+ --infinite-cell-border-top: 1px solid #EDF2F7;
30
+ --infinite-cell-border-radius: 0;
31
+ --infinite-header-cell-background: none;
32
+ --infinite-cell-border-left: none;
33
+ --infinite-cell-border-right: none;
34
+ --infinite-cell-border-width: 0px;
35
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
36
+ & .InfiniteHeaderCell {
37
+ text-transform: uppercase;
38
+ font-weight: bold;
39
+ letter-spacing: 0.05em;
40
+ }
41
+ }
42
+ .infinite-theme-mode--light.infinite-theme-mode--light.infinite-theme-name--minimalist.infinite-theme-name--minimalist,
43
+ .infinite-theme-mode--light .infinite-theme-name--minimalist,
44
+ .infinite-theme-mode--light.infinite-theme-mode--light .infinite-theme-name--minimalist,
45
+ .infinite-theme-name--minimalist .infinite-theme-mode--light,
46
+ .infinite-theme-name--minimalist .infinite-theme-mode--light.infinite-theme-mode--light {
47
+ --infinite-header-cell-border-right: none;
48
+ --infinite-header-cell-border: none;
49
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
50
+ --infinite-header-color: var(--infinite-color);
51
+ --infinite-header-background: none;
52
+ --infinite-cell-color: var(--infinite-color);
53
+ --infinite-flashing-background: var(--infinite-accent-color);
54
+ --infinite-flashing-up-background: var(--infinite-success-color);
55
+ --infinite-flashing-down-background: var(--infinite-error-color);
56
+ --infinite-menu-color: var(--infinite-cell-color);
57
+ --infinite-menu-background: var(--infinite-background);
58
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
59
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
60
+ --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
61
+ --infinite-load-mask-text-background: var(--infinite-background);
62
+ --infinite-load-mask-color: var(--infinite-cell-color);
63
+ --infinite-row-background: transparent;
64
+ --infinite-grouping-toolbar-background: var(--infinite-background);
65
+ --infinite-theme-name: minimalist;
66
+ --infinite-theme-mode: light;
67
+ --infinite-background: white;
68
+ --infinite-color: #2D3748;
69
+ --infinite-row-odd-background: transparent;
70
+ --infinite-menu-separator-color: #EDF2F7;
71
+ --infinite-cell-border-top: 1px solid #EDF2F7;
72
+ --infinite-cell-border-radius: 0;
73
+ --infinite-header-cell-background: none;
74
+ --infinite-cell-border-left: none;
75
+ --infinite-cell-border-right: none;
76
+ --infinite-cell-border-width: 0px;
77
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
78
+ & .InfiniteHeaderCell {
79
+ text-transform: uppercase;
80
+ font-weight: bold;
81
+ letter-spacing: 0.05em;
82
+ }
83
+ }
84
+ .infinite-theme-mode--dark.infinite-theme-mode--dark.infinite-theme-name--minimalist.infinite-theme-name--minimalist,
85
+ .infinite-theme-mode--dark .infinite-theme-name--minimalist,
86
+ .infinite-theme-name--minimalist .infinite-theme-mode--dark {
126
87
  --infinite-header-cell-border-right: none;
127
88
  --infinite-header-cell-border: none;
128
89
  --infinite-filter-editor-background: var(--infinite-row-odd-background);
@@ -160,4 +121,45 @@
160
121
  letter-spacing: 0.05em;
161
122
  }
162
123
  }
124
+ @media (prefers-color-scheme: dark) {
125
+ .infinite-theme-name--minimalist:root,
126
+ .infinite-theme-name--minimalist {
127
+ --infinite-header-cell-border-right: none;
128
+ --infinite-header-cell-border: none;
129
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
130
+ --infinite-header-color: var(--infinite-color);
131
+ --infinite-header-background: none;
132
+ --infinite-cell-color: var(--infinite-color);
133
+ --infinite-flashing-background: var(--infinite-accent-color);
134
+ --infinite-flashing-up-background: var(--infinite-success-color);
135
+ --infinite-flashing-down-background: var(--infinite-error-color);
136
+ --infinite-menu-color: var(--infinite-cell-color);
137
+ --infinite-menu-background: var(--infinite-background);
138
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
139
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
140
+ --infinite-menu-item-pressed-background: var(--infinite-row-hover-background);
141
+ --infinite-load-mask-text-background: var(--infinite-background);
142
+ --infinite-load-mask-color: var(--infinite-cell-color);
143
+ --infinite-row-background: transparent;
144
+ --infinite-grouping-toolbar-background: var(--infinite-background);
145
+ --infinite-theme-name: minimalist;
146
+ --infinite-theme-mode: dark;
147
+ --infinite-background: #1a1f2b;
148
+ --infinite-color: #EDF2F7;
149
+ --infinite-row-odd-background: transparent;
150
+ --infinite-menu-separator-color: #2D3748;
151
+ --infinite-cell-border-top: 1px solid #2D3748;
152
+ --infinite-cell-border-radius: 0;
153
+ --infinite-header-cell-background: none;
154
+ --infinite-cell-border-left: none;
155
+ --infinite-cell-border-right: none;
156
+ --infinite-cell-border-width: 0px;
157
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
158
+ & .InfiniteHeaderCell {
159
+ text-transform: uppercase;
160
+ font-weight: bold;
161
+ letter-spacing: 0.05em;
162
+ }
163
+ }
164
+ }
163
165
  }
package/theme/ocean.css CHANGED
@@ -1,131 +1,91 @@
1
1
  /* vanilla-extract-css-ns:src/components/InfiniteTable/theme-ocean.css.ts.vanilla.css?source=#H4sIAAAAAAAAA+3Z3Y7iIBQA4HufgsRsMpPIxGrtuN2bfRUKp0qmhQZwNNn47pt2zVj7Q6tlZi6WCxMjhwOlcPgSX7hIueAGsNlDDliQHDCWFIiIlZRmgV76I9CfGUIYfwTsgTBQmEKW4USq8rviu72JUVCckJYZZ4jKTCqc89MTF0irXbJARhGhC6JAmAV6J+qplrIKf0bh8sfzr6HB4lbna1uzd8ozAwoD40YqnBD6tlPyIFgrh5JHLBmrhfRNpJxpewrV/Lt7WEatP9xevt8EN7NVQXeMnmZE77nY2cYnlIIwA/0PhS2FPlAKWg/kYPIobFlAKam6c+QgDn3P/bEknZ1GLnz/kldZuIEcM65JkgGz5WyM2Z+MUMPfYWg3Du2Ha75Cgdb2ufWnySRhOCf6DRs4mak57n1P5YM+NGT5a1HuLCNllhDrKevPci11MapKXWd7LhnEKCtLXKO9fn5iNN8mG5pGjZj6xOYsgG1Kmyf70n0ZrtZr1mi8OV8xmkchhShsBNWOT4zmKY020cZWR+tTemVs3ZqSrTDFaL7eJizddhWoy31gZDH9Ngjat0F9jAxSEyMhBViCLhfTQNSRM7OP0bI4tV5wdVSrWC4Yp6S8R7jQYGK0Kk7VM14+HVv79kaJu9ah4+TX9usCHffcAFq1l6KrRjxY58pUGjKgxl5F7rmubnK25zluJTomZVuSqiRqKIiqXtPlPEzZfOdZ00VlMcC4KgZ3NNU0ZWlqK6yW0iY0a0dnOesktCR9uKNtop6gnqCeoJ6gnqCeoJ6gnqCeoIyot/Et0wBaZnRtxSqnZ51nnWedZ91/zbqyEk5V3XK9omHao7qfEVkSMqC64DUKg1er6jYQhEETfr2q67TkgOqWqyBdN93oUHXX7eJpV3OMl93giriBXWv/nWe/c2CcoKdCQQrqch6xpmWB+FcbnismWYQ18i/cL6bWVGw55dYj4HJNrvvRNZ1dbuDlhl4P4ssVvxwDzD3BnCHMDcOmQGwCxVxhbJhjgyAbR7IxKBtg2UiYjaLZvTh7jGdfCLSRRBuLtJFMmwS1T6eaU6x9Dte+BWxfQTaEzrPzX0lMGv1RJwAA */
2
- .infinite-theme-name--ocean:root,
3
- .infinite-theme-name--ocean {
4
- --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
5
- --infinite-header-cell-border: var(--infinite-cell-border);
6
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
7
- --infinite-header-color: var(--infinite-color);
8
- --infinite-header-background: var(--infinite-header-cell-hover-background);
9
- --infinite-cell-color: var(--infinite-color);
10
- --infinite-flashing-background: var(--infinite-accent-color);
11
- --infinite-flashing-up-background: var(--infinite-success-color);
12
- --infinite-flashing-down-background: var(--infinite-error-color);
13
- --infinite-menu-color: var(--infinite-cell-color);
14
- --infinite-menu-background: var(--infinite-header-cell-background);
15
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
16
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
17
- --infinite-menu-item-pressed-background: var(--infinite-background);
18
- --infinite-load-mask-text-background: var(--infinite-background);
19
- --infinite-load-mask-color: var(--infinite-cell-color);
20
- --infinite-row-background: var(--infinite-background);
21
- --infinite-grouping-toolbar-background: var(--infinite-background);
22
- --infinite-theme-name: ocean;
23
- --infinite-theme-mode: light;
24
- --infinite-accent-color: #8b5cf6;
25
- --infinite-background: #d1e8fc;
26
- --infinite-color: #04233d;
27
- --infinite-success-color: #64ce64;
28
- --infinite-error-color: #fc6565;
29
- --infinite-header-cell-background: #7dd3fc;
30
- --infinite-header-cell-hover-background: #38bdf8;
31
- --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 10%);
32
- --infinite-cell-border-left: none;
33
- --infinite-cell-border-right: none;
34
- --infinite-cell-border-width: 0px;
35
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
36
- --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 20%);
37
- --infinite-row-hover-background: var(--infinite-header-cell-background);
38
- --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
39
- --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 20%);
40
- --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-color) 10%);
41
- }
42
- .infinite-theme-mode--light.infinite-theme-mode--light.infinite-theme-name--ocean.infinite-theme-name--ocean,
43
- .infinite-theme-mode--light .infinite-theme-name--ocean,
44
- .infinite-theme-mode--light.infinite-theme-mode--light .infinite-theme-name--ocean,
45
- .infinite-theme-name--ocean .infinite-theme-mode--light,
46
- .infinite-theme-name--ocean .infinite-theme-mode--light.infinite-theme-mode--light {
47
- --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
48
- --infinite-header-cell-border: var(--infinite-cell-border);
49
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
50
- --infinite-header-color: var(--infinite-color);
51
- --infinite-header-background: var(--infinite-header-cell-hover-background);
52
- --infinite-cell-color: var(--infinite-color);
53
- --infinite-flashing-background: var(--infinite-accent-color);
54
- --infinite-flashing-up-background: var(--infinite-success-color);
55
- --infinite-flashing-down-background: var(--infinite-error-color);
56
- --infinite-menu-color: var(--infinite-cell-color);
57
- --infinite-menu-background: var(--infinite-header-cell-background);
58
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
59
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
60
- --infinite-menu-item-pressed-background: var(--infinite-background);
61
- --infinite-load-mask-text-background: var(--infinite-background);
62
- --infinite-load-mask-color: var(--infinite-cell-color);
63
- --infinite-row-background: var(--infinite-background);
64
- --infinite-grouping-toolbar-background: var(--infinite-background);
65
- --infinite-theme-name: ocean;
66
- --infinite-theme-mode: light;
67
- --infinite-accent-color: #8b5cf6;
68
- --infinite-background: #d1e8fc;
69
- --infinite-color: #04233d;
70
- --infinite-success-color: #64ce64;
71
- --infinite-error-color: #fc6565;
72
- --infinite-header-cell-background: #7dd3fc;
73
- --infinite-header-cell-hover-background: #38bdf8;
74
- --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 10%);
75
- --infinite-cell-border-left: none;
76
- --infinite-cell-border-right: none;
77
- --infinite-cell-border-width: 0px;
78
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
79
- --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 20%);
80
- --infinite-row-hover-background: var(--infinite-header-cell-background);
81
- --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
82
- --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 20%);
83
- --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-color) 10%);
84
- }
85
- .infinite-theme-mode--dark.infinite-theme-mode--dark.infinite-theme-name--ocean.infinite-theme-name--ocean,
86
- .infinite-theme-mode--dark .infinite-theme-name--ocean,
87
- .infinite-theme-name--ocean .infinite-theme-mode--dark {
88
- --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
89
- --infinite-header-cell-border: var(--infinite-cell-border);
90
- --infinite-filter-editor-background: var(--infinite-row-odd-background);
91
- --infinite-header-color: var(--infinite-color);
92
- --infinite-header-background: var(--infinite-header-cell-hover-background);
93
- --infinite-cell-color: var(--infinite-color);
94
- --infinite-flashing-background: var(--infinite-accent-color);
95
- --infinite-flashing-up-background: var(--infinite-success-color);
96
- --infinite-flashing-down-background: var(--infinite-error-color);
97
- --infinite-menu-color: var(--infinite-cell-color);
98
- --infinite-menu-background: var(--infinite-header-cell-background);
99
- --infinite-menu-item-disabled-background: var(--infinite-menu-background);
100
- --infinite-menu-item-active-background: var(--infinite-row-hover-background);
101
- --infinite-menu-item-pressed-background: var(--infinite-background);
102
- --infinite-load-mask-text-background: var(--infinite-background);
103
- --infinite-load-mask-color: var(--infinite-cell-color);
104
- --infinite-row-background: var(--infinite-background);
105
- --infinite-grouping-toolbar-background: var(--infinite-background);
106
- --infinite-theme-name: ocean;
107
- --infinite-theme-mode: dark;
108
- --infinite-accent-color: #8b5cf6;
109
- --infinite-background: #032c4f;
110
- --infinite-color: #96a0aa;
111
- --infinite-success-color: #176417;
112
- --infinite-error-color: #5e1414;
113
- --infinite-header-cell-background: #04233d;
114
- --infinite-header-cell-hover-background: #021f35;
115
- --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-cell-color) 10%);
116
- --infinite-cell-border-left: none;
117
- --infinite-cell-border-right: none;
118
- --infinite-cell-border-width: 0px;
119
- --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
120
- --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 2%);
121
- --infinite-row-hover-background: var(--infinite-header-cell-background);
122
- --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
123
- --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 2%);
124
- --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-cell-color) 10%);
125
- }
126
- @media (prefers-color-scheme: dark) {
2
+ @layer infinite-table {
127
3
  .infinite-theme-name--ocean:root,
128
4
  .infinite-theme-name--ocean {
5
+ --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
6
+ --infinite-header-cell-border: var(--infinite-cell-border);
7
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
8
+ --infinite-header-color: var(--infinite-color);
9
+ --infinite-header-background: var(--infinite-header-cell-hover-background);
10
+ --infinite-cell-color: var(--infinite-color);
11
+ --infinite-flashing-background: var(--infinite-accent-color);
12
+ --infinite-flashing-up-background: var(--infinite-success-color);
13
+ --infinite-flashing-down-background: var(--infinite-error-color);
14
+ --infinite-menu-color: var(--infinite-cell-color);
15
+ --infinite-menu-background: var(--infinite-header-cell-background);
16
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
17
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
18
+ --infinite-menu-item-pressed-background: var(--infinite-background);
19
+ --infinite-load-mask-text-background: var(--infinite-background);
20
+ --infinite-load-mask-color: var(--infinite-cell-color);
21
+ --infinite-row-background: var(--infinite-background);
22
+ --infinite-grouping-toolbar-background: var(--infinite-background);
23
+ --infinite-theme-name: ocean;
24
+ --infinite-theme-mode: light;
25
+ --infinite-accent-color: #8b5cf6;
26
+ --infinite-background: #d1e8fc;
27
+ --infinite-color: #04233d;
28
+ --infinite-success-color: #64ce64;
29
+ --infinite-error-color: #fc6565;
30
+ --infinite-header-cell-background: #7dd3fc;
31
+ --infinite-header-cell-hover-background: #38bdf8;
32
+ --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 10%);
33
+ --infinite-cell-border-left: none;
34
+ --infinite-cell-border-right: none;
35
+ --infinite-cell-border-width: 0px;
36
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
37
+ --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 20%);
38
+ --infinite-row-hover-background: var(--infinite-header-cell-background);
39
+ --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
40
+ --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 20%);
41
+ --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-color) 10%);
42
+ }
43
+ .infinite-theme-mode--light.infinite-theme-mode--light.infinite-theme-name--ocean.infinite-theme-name--ocean,
44
+ .infinite-theme-mode--light .infinite-theme-name--ocean,
45
+ .infinite-theme-mode--light.infinite-theme-mode--light .infinite-theme-name--ocean,
46
+ .infinite-theme-name--ocean .infinite-theme-mode--light,
47
+ .infinite-theme-name--ocean .infinite-theme-mode--light.infinite-theme-mode--light {
48
+ --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
49
+ --infinite-header-cell-border: var(--infinite-cell-border);
50
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
51
+ --infinite-header-color: var(--infinite-color);
52
+ --infinite-header-background: var(--infinite-header-cell-hover-background);
53
+ --infinite-cell-color: var(--infinite-color);
54
+ --infinite-flashing-background: var(--infinite-accent-color);
55
+ --infinite-flashing-up-background: var(--infinite-success-color);
56
+ --infinite-flashing-down-background: var(--infinite-error-color);
57
+ --infinite-menu-color: var(--infinite-cell-color);
58
+ --infinite-menu-background: var(--infinite-header-cell-background);
59
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
60
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
61
+ --infinite-menu-item-pressed-background: var(--infinite-background);
62
+ --infinite-load-mask-text-background: var(--infinite-background);
63
+ --infinite-load-mask-color: var(--infinite-cell-color);
64
+ --infinite-row-background: var(--infinite-background);
65
+ --infinite-grouping-toolbar-background: var(--infinite-background);
66
+ --infinite-theme-name: ocean;
67
+ --infinite-theme-mode: light;
68
+ --infinite-accent-color: #8b5cf6;
69
+ --infinite-background: #d1e8fc;
70
+ --infinite-color: #04233d;
71
+ --infinite-success-color: #64ce64;
72
+ --infinite-error-color: #fc6565;
73
+ --infinite-header-cell-background: #7dd3fc;
74
+ --infinite-header-cell-hover-background: #38bdf8;
75
+ --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 10%);
76
+ --infinite-cell-border-left: none;
77
+ --infinite-cell-border-right: none;
78
+ --infinite-cell-border-width: 0px;
79
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
80
+ --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 20%);
81
+ --infinite-row-hover-background: var(--infinite-header-cell-background);
82
+ --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
83
+ --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 20%);
84
+ --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-color) 10%);
85
+ }
86
+ .infinite-theme-mode--dark.infinite-theme-mode--dark.infinite-theme-name--ocean.infinite-theme-name--ocean,
87
+ .infinite-theme-mode--dark .infinite-theme-name--ocean,
88
+ .infinite-theme-name--ocean .infinite-theme-mode--dark {
129
89
  --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
130
90
  --infinite-header-cell-border: var(--infinite-cell-border);
131
91
  --infinite-filter-editor-background: var(--infinite-row-odd-background);
@@ -164,4 +124,46 @@
164
124
  --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 2%);
165
125
  --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-cell-color) 10%);
166
126
  }
127
+ @media (prefers-color-scheme: dark) {
128
+ .infinite-theme-name--ocean:root,
129
+ .infinite-theme-name--ocean {
130
+ --infinite-header-cell-border-right: 1px solid color-mix(in srgb, transparent, var(--infinite-color) 40%);
131
+ --infinite-header-cell-border: var(--infinite-cell-border);
132
+ --infinite-filter-editor-background: var(--infinite-row-odd-background);
133
+ --infinite-header-color: var(--infinite-color);
134
+ --infinite-header-background: var(--infinite-header-cell-hover-background);
135
+ --infinite-cell-color: var(--infinite-color);
136
+ --infinite-flashing-background: var(--infinite-accent-color);
137
+ --infinite-flashing-up-background: var(--infinite-success-color);
138
+ --infinite-flashing-down-background: var(--infinite-error-color);
139
+ --infinite-menu-color: var(--infinite-cell-color);
140
+ --infinite-menu-background: var(--infinite-header-cell-background);
141
+ --infinite-menu-item-disabled-background: var(--infinite-menu-background);
142
+ --infinite-menu-item-active-background: var(--infinite-row-hover-background);
143
+ --infinite-menu-item-pressed-background: var(--infinite-background);
144
+ --infinite-load-mask-text-background: var(--infinite-background);
145
+ --infinite-load-mask-color: var(--infinite-cell-color);
146
+ --infinite-row-background: var(--infinite-background);
147
+ --infinite-grouping-toolbar-background: var(--infinite-background);
148
+ --infinite-theme-name: ocean;
149
+ --infinite-theme-mode: dark;
150
+ --infinite-accent-color: #8b5cf6;
151
+ --infinite-background: #032c4f;
152
+ --infinite-color: #96a0aa;
153
+ --infinite-success-color: #176417;
154
+ --infinite-error-color: #5e1414;
155
+ --infinite-header-cell-background: #04233d;
156
+ --infinite-header-cell-hover-background: #021f35;
157
+ --infinite-cell-border-top: 1px solid color-mix(in srgb, transparent, var(--infinite-cell-color) 10%);
158
+ --infinite-cell-border-left: none;
159
+ --infinite-cell-border-right: none;
160
+ --infinite-cell-border-width: 0px;
161
+ --infinite-active-cell-indicator-inset: 2px 1px 1px 1px;
162
+ --infinite-row-odd-background: color-mix(in srgb, var(--infinite-row-background), white 2%);
163
+ --infinite-row-hover-background: var(--infinite-header-cell-background);
164
+ --infinite-row-selected-background: var(--infinite-header-cell-hover-background);
165
+ --infinite-row-selected-hover-background: color-mix(in srgb, var(--infinite-row-selected-background), white 2%);
166
+ --infinite-menu-separator-color: color-mix(in srgb, transparent, var(--infinite-cell-color) 10%);
167
+ }
168
+ }
167
169
  }