@fattureincloud/fic-design-system 0.10.2 → 0.11.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (14) hide show
  1. package/dist/assets/index-7ee742e8.css +154 -0
  2. package/dist/assets/index-9fc4893a.css +155 -0
  3. package/dist/assets/index.esm-bff8cd71.css +155 -0
  4. package/dist/assets/index.esm-c9d742c9.css +154 -0
  5. package/dist/components/modals/types.d.ts +4 -1
  6. package/dist/components/switch/Switch.d.ts +1 -1
  7. package/dist/components/switch/styled.d.ts +0 -1
  8. package/dist/components/switch/types.d.ts +1 -2
  9. package/dist/index.css +154 -0
  10. package/dist/index.esm.js +3 -3
  11. package/dist/index.esm.js.map +1 -1
  12. package/dist/index.js +3 -3
  13. package/dist/index.js.map +1 -1
  14. package/package.json +1 -1
package/dist/index.css ADDED
@@ -0,0 +1,154 @@
1
+ :root {
2
+ --columns-breakpoint-width: 100px; /* default value */
3
+ --table-breakpoint: px100; /* relates to TableBreakpoints enum */
4
+ }
5
+
6
+ .Table-container {
7
+ container-type: inline-size;
8
+ container-name: var(--table-breakpoint);
9
+ }
10
+
11
+ /* width breakpoints corresponds to TableBreakpoints enum */
12
+ @container px100 (width < 100px) {
13
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
14
+ min-width: var(--columns-breakpoint-width);
15
+ max-width: var(--columns-breakpoint-width);
16
+ }
17
+
18
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
19
+ min-width: var(--columns-breakpoint-width);
20
+ max-width: var(--columns-breakpoint-width);
21
+ }
22
+ }
23
+
24
+ @container px200 (width < 200px) {
25
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
26
+ min-width: var(--columns-breakpoint-width);
27
+ max-width: var(--columns-breakpoint-width);
28
+ }
29
+
30
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
31
+ min-width: var(--columns-breakpoint-width);
32
+ max-width: var(--columns-breakpoint-width);
33
+ }
34
+ }
35
+
36
+ @container px300 (width < 300px) {
37
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
38
+ min-width: var(--columns-breakpoint-width);
39
+ max-width: var(--columns-breakpoint-width);
40
+ }
41
+
42
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
43
+ min-width: var(--columns-breakpoint-width);
44
+ max-width: var(--columns-breakpoint-width);
45
+ }
46
+ }
47
+
48
+ @container px400 (width < 400px) {
49
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
50
+ min-width: var(--columns-breakpoint-width);
51
+ max-width: var(--columns-breakpoint-width);
52
+ }
53
+
54
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
55
+ min-width: var(--columns-breakpoint-width);
56
+ max-width: var(--columns-breakpoint-width);
57
+ }
58
+ }
59
+
60
+ @container px500 (width < 500px) {
61
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
62
+ min-width: var(--columns-breakpoint-width);
63
+ max-width: var(--columns-breakpoint-width);
64
+ }
65
+
66
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
67
+ min-width: var(--columns-breakpoint-width);
68
+ max-width: var(--columns-breakpoint-width);
69
+ }
70
+ }
71
+
72
+ @container px600 (width < 600px) {
73
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
74
+ min-width: var(--columns-breakpoint-width);
75
+ max-width: var(--columns-breakpoint-width);
76
+ }
77
+
78
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
79
+ min-width: var(--columns-breakpoint-width);
80
+ max-width: var(--columns-breakpoint-width);
81
+ }
82
+ }
83
+
84
+ @container px700 (width < 700px) {
85
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
86
+ min-width: var(--columns-breakpoint-width);
87
+ max-width: var(--columns-breakpoint-width);
88
+ }
89
+
90
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
91
+ min-width: var(--columns-breakpoint-width);
92
+ max-width: var(--columns-breakpoint-width);
93
+ }
94
+ }
95
+
96
+ @container px800 (width < 800px) {
97
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
98
+ min-width: var(--columns-breakpoint-width);
99
+ max-width: var(--columns-breakpoint-width);
100
+ }
101
+
102
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
103
+ min-width: var(--columns-breakpoint-width);
104
+ max-width: var(--columns-breakpoint-width);
105
+ }
106
+ }
107
+
108
+ @container px900 (width < 900px) {
109
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
110
+ min-width: var(--columns-breakpoint-width);
111
+ max-width: var(--columns-breakpoint-width);
112
+ }
113
+
114
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
115
+ min-width: var(--columns-breakpoint-width);
116
+ max-width: var(--columns-breakpoint-width);
117
+ }
118
+ }
119
+
120
+ @container px1000 (width < 1000px) {
121
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
122
+ min-width: var(--columns-breakpoint-width);
123
+ max-width: var(--columns-breakpoint-width);
124
+ }
125
+
126
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
127
+ min-width: var(--columns-breakpoint-width);
128
+ max-width: var(--columns-breakpoint-width);
129
+ }
130
+ }
131
+
132
+ @container px1100 (width < 1100px) {
133
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
134
+ min-width: var(--columns-breakpoint-width);
135
+ max-width: var(--columns-breakpoint-width);
136
+ }
137
+
138
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
139
+ min-width: var(--columns-breakpoint-width);
140
+ max-width: var(--columns-breakpoint-width);
141
+ }
142
+ }
143
+
144
+ @container px1200 (width < 1200px) {
145
+ .DS-rt-th:not(.DS-header-tour-checkbox, .DS-header-row-actions) {
146
+ min-width: var(--columns-breakpoint-width);
147
+ max-width: var(--columns-breakpoint-width);
148
+ }
149
+
150
+ .DS-rt-td:not(.DS-tour-checkbox, .DS-row-actions) {
151
+ min-width: var(--columns-breakpoint-width);
152
+ max-width: var(--columns-breakpoint-width);
153
+ }
154
+ }