@meduza/ui-kit-2 0.1.21 → 0.1.22
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/dist/ui-kit-2.cjs.development.js +2 -1
- package/dist/ui-kit-2.cjs.development.js.map +1 -1
- package/dist/ui-kit-2.cjs.production.min.js +1 -1
- package/dist/ui-kit-2.cjs.production.min.js.map +1 -1
- package/dist/ui-kit-2.esm.js +2 -1
- package/dist/ui-kit-2.esm.js.map +1 -1
- package/dist/ui-kit.css +1267 -1261
- package/package.json +1 -1
- package/src/.DS_Store +0 -0
- package/src/Spoiler/Spoiler.module.css +23 -16
- package/src/Spoiler/index.tsx +3 -5
- package/src/Spoiler/mock.json +302 -1
package/package.json
CHANGED
package/src/.DS_Store
CHANGED
|
Binary file
|
|
@@ -29,16 +29,20 @@
|
|
|
29
29
|
display: flex;
|
|
30
30
|
flex-flow: column nowrap;
|
|
31
31
|
justify-content: center;
|
|
32
|
+
|
|
33
|
+
width: 100%;
|
|
34
|
+
max-width: 650px;
|
|
35
|
+
margin-right: auto;
|
|
36
|
+
margin-left: auto;
|
|
32
37
|
}
|
|
33
38
|
|
|
34
39
|
.header h3 {
|
|
35
40
|
margin-top: 0;
|
|
36
41
|
margin-bottom: 18px;
|
|
37
42
|
|
|
38
|
-
font-weight: 700;
|
|
39
|
-
font-size: 21px;
|
|
40
|
-
|
|
41
43
|
font-family: $secondaryFont;
|
|
44
|
+
font-size: 21px;
|
|
45
|
+
font-weight: 700;
|
|
42
46
|
line-height: 26px;
|
|
43
47
|
|
|
44
48
|
@media $mobile {
|
|
@@ -53,8 +57,7 @@
|
|
|
53
57
|
display: none;
|
|
54
58
|
|
|
55
59
|
width: 100%;
|
|
56
|
-
|
|
57
|
-
margin-left: auto;
|
|
60
|
+
|
|
58
61
|
padding-bottom: 13px;
|
|
59
62
|
|
|
60
63
|
@media $mobile {
|
|
@@ -79,48 +82,52 @@
|
|
|
79
82
|
|
|
80
83
|
.footer {
|
|
81
84
|
position: static;
|
|
85
|
+
|
|
86
|
+
width: 100%;
|
|
87
|
+
max-width: 650px;
|
|
88
|
+
margin-right: auto;
|
|
89
|
+
margin-left: auto;
|
|
82
90
|
}
|
|
83
91
|
|
|
84
92
|
.spoiled .footer {
|
|
85
93
|
position: sticky;
|
|
86
|
-
bottom: 0;
|
|
87
94
|
z-index: 10;
|
|
95
|
+
bottom: 0;
|
|
88
96
|
|
|
89
97
|
margin-right: -20px;
|
|
90
98
|
margin-left: -20px;
|
|
91
99
|
padding: 12px 20px 20px;
|
|
92
100
|
|
|
93
|
-
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 64%);
|
|
94
|
-
|
|
95
101
|
animation: spoilerSticky 500ms ease both;
|
|
96
102
|
|
|
103
|
+
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 64%);
|
|
104
|
+
|
|
97
105
|
@media $mobile {
|
|
98
106
|
position: static;
|
|
99
107
|
|
|
100
|
-
margin-right:
|
|
101
|
-
margin-left:
|
|
108
|
+
margin-right: auto;
|
|
109
|
+
margin-left: auto;
|
|
102
110
|
padding: 0;
|
|
103
111
|
|
|
104
|
-
background-image: none;
|
|
105
|
-
|
|
106
112
|
animation: none;
|
|
113
|
+
|
|
114
|
+
background-image: none;
|
|
107
115
|
}
|
|
108
116
|
}
|
|
109
117
|
|
|
110
118
|
.spoiled .footer::after {
|
|
111
119
|
position: absolute;
|
|
120
|
+
z-index: -1;
|
|
112
121
|
top: 100%;
|
|
113
122
|
right: 0;
|
|
114
123
|
left: 0;
|
|
115
|
-
z-index: -1;
|
|
116
124
|
|
|
117
125
|
height: 16px;
|
|
118
126
|
|
|
119
|
-
|
|
120
|
-
|
|
127
|
+
content: '';
|
|
121
128
|
animation: spoilerStickyBg 1ms ease both 500ms;
|
|
122
129
|
|
|
123
|
-
|
|
130
|
+
background-color: #fff;
|
|
124
131
|
|
|
125
132
|
@media $mobile {
|
|
126
133
|
content: none;
|
package/src/Spoiler/index.tsx
CHANGED
|
@@ -45,6 +45,8 @@ export const Spoiler: React.FC<SpoilerProps> = ({
|
|
|
45
45
|
[[styles.spoiled], !!spoiled]
|
|
46
46
|
]
|
|
47
47
|
|
|
48
|
+
const context = ['center'].concat(styleContext)
|
|
49
|
+
|
|
48
50
|
if (styleContext) {
|
|
49
51
|
classNames = makeStyleContext(classNames, styleContext, styles)
|
|
50
52
|
}
|
|
@@ -57,11 +59,7 @@ export const Spoiler: React.FC<SpoilerProps> = ({
|
|
|
57
59
|
<div className={styles.header}>{title && <h3>{title}</h3>}</div>
|
|
58
60
|
<div className={styles.body}>
|
|
59
61
|
{blocks.map((item) => (
|
|
60
|
-
<RenderBlocks
|
|
61
|
-
key={item.id}
|
|
62
|
-
block={item}
|
|
63
|
-
styleContext={styleContext}
|
|
64
|
-
/>
|
|
62
|
+
<RenderBlocks key={item.id} block={item} styleContext={context} />
|
|
65
63
|
))}
|
|
66
64
|
</div>
|
|
67
65
|
<div className={styles.footer}>
|
package/src/Spoiler/mock.json
CHANGED
|
@@ -21,6 +21,307 @@
|
|
|
21
21
|
"length": 147,
|
|
22
22
|
"id": "2-39a95b2b3b5f5bb8dbd23576941020b54b4f5bfade9eac192aa48cc007ec25df"
|
|
23
23
|
},
|
|
24
|
+
{
|
|
25
|
+
"type": "table",
|
|
26
|
+
"table_credit": "кредит в таблице",
|
|
27
|
+
"rows": [
|
|
28
|
+
{
|
|
29
|
+
"key": "9ef452430882269f180f",
|
|
30
|
+
"cells": [
|
|
31
|
+
{
|
|
32
|
+
"val": "первая строка _1",
|
|
33
|
+
"key": "ptijzw",
|
|
34
|
+
"color": "#f4f0f8"
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
"val": "первая строка _2",
|
|
38
|
+
"key": "kdns0e",
|
|
39
|
+
"color": "#f5f5f5"
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
"val": "первая строка опять и снова",
|
|
43
|
+
"color": "#ffffff",
|
|
44
|
+
"key": "3xhcl4"
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
"val": "первая строка опять и снова",
|
|
48
|
+
"color": "#ffffff",
|
|
49
|
+
"key": "3xshdcl4"
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
"val": "первая строка опять и снова",
|
|
53
|
+
"color": "#ffffff",
|
|
54
|
+
"key": "3xhdcl4"
|
|
55
|
+
}
|
|
56
|
+
]
|
|
57
|
+
},
|
|
58
|
+
{
|
|
59
|
+
"key": "8d41ad87004eaa2efcba",
|
|
60
|
+
"cells": [
|
|
61
|
+
{
|
|
62
|
+
"val": "вторая <strong>строка</strong> _1",
|
|
63
|
+
"key": "uu2q3s",
|
|
64
|
+
"color": "#f4f0f8"
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
"val": "<a href=\"https://meduza.io/paragraph/2019/10/30/kak-margarita-simonyan-prishla-na-intervyu-k-ksenii-sobchak-uslyshala-neudobnye-voprosy-i-ushla-v-odnom-abzatse\" target=\"_blank\">вторая строка _3</a>",
|
|
68
|
+
"key": "qfy9e43",
|
|
69
|
+
"color": "#e6f3ff"
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
"val": "ывывыв",
|
|
73
|
+
"color": "#ffffff",
|
|
74
|
+
"key": "flh2yh"
|
|
75
|
+
},
|
|
76
|
+
{
|
|
77
|
+
"val": "<a href=\"https://meduza.io/paragraph/2019/10/30/kak-margarita-simonyan-prishla-na-intervyu-k-ksenii-sobchak-uslyshala-neudobnye-voprosy-i-ushla-v-odnom-abzatse\" target=\"_blank\">вторая строка _3</a>",
|
|
78
|
+
"key": "qfy943",
|
|
79
|
+
"color": "#e6df3ff"
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
"val": "ывывыв",
|
|
83
|
+
"color": "#ffffff",
|
|
84
|
+
"key": "flh2dyh"
|
|
85
|
+
}
|
|
86
|
+
]
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
"key": "1c4b6ce381f928aa2b57",
|
|
90
|
+
"cells": [
|
|
91
|
+
{
|
|
92
|
+
"val": "а тут <strong>болд</strong> с<em> италиком</em> и <a href=\"https://second.meduza.io/feature/2019/10/30/test-tablits-v-ficherah\" target=\"_blank\">ссылкой</a>",
|
|
93
|
+
"key": "cfnbc3",
|
|
94
|
+
"color": "#f4f0f8"
|
|
95
|
+
},
|
|
96
|
+
{
|
|
97
|
+
"val": "llllllll",
|
|
98
|
+
"key": "25yr97",
|
|
99
|
+
"color": "#FFFFFF"
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
"val": "2",
|
|
103
|
+
"color": "#ffffff",
|
|
104
|
+
"key": "q5ssyu"
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
"val": "llllllll",
|
|
108
|
+
"key": "25yrd97",
|
|
109
|
+
"color": "#FFFFFF"
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
"val": "2",
|
|
113
|
+
"color": "#ffffff",
|
|
114
|
+
"key": "q5ssdyu"
|
|
115
|
+
}
|
|
116
|
+
]
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
"key": "2f7722300e13ba0d37b1",
|
|
120
|
+
"cells": [
|
|
121
|
+
{
|
|
122
|
+
"key": "swrdin",
|
|
123
|
+
"color": "#f4f0f8"
|
|
124
|
+
},
|
|
125
|
+
{
|
|
126
|
+
"val": "ии",
|
|
127
|
+
"key": "h9jg6z",
|
|
128
|
+
"color": "#ffffff"
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"val": "3",
|
|
132
|
+
"color": "#ffffff",
|
|
133
|
+
"key": "ag23oa"
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
"val": "ии",
|
|
137
|
+
"key": "h9jdg6z",
|
|
138
|
+
"color": "#ffffff"
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
"val": "3",
|
|
142
|
+
"color": "#ffffff",
|
|
143
|
+
"key": "ag23doa"
|
|
144
|
+
}
|
|
145
|
+
]
|
|
146
|
+
},
|
|
147
|
+
{
|
|
148
|
+
"key": "dbb5a2c10886fea7ee41",
|
|
149
|
+
"cells": [
|
|
150
|
+
{
|
|
151
|
+
"val": "цццццц",
|
|
152
|
+
"color": "#ffffff",
|
|
153
|
+
"key": "3sd3uv"
|
|
154
|
+
},
|
|
155
|
+
{
|
|
156
|
+
"val": "пустая ячейка дальше",
|
|
157
|
+
"color": "#fffde6",
|
|
158
|
+
"key": "pjkssg"
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
"color": "#ffffff",
|
|
162
|
+
"key": "gtjnbr"
|
|
163
|
+
},
|
|
164
|
+
{
|
|
165
|
+
"val": "пустая ячейка дальше",
|
|
166
|
+
"color": "#fffde6",
|
|
167
|
+
"key": "pjksdsg"
|
|
168
|
+
},
|
|
169
|
+
{
|
|
170
|
+
"color": "#ffffff",
|
|
171
|
+
"key": "gtjdnbr"
|
|
172
|
+
}
|
|
173
|
+
]
|
|
174
|
+
},
|
|
175
|
+
{
|
|
176
|
+
"key": "dbb5a2c108f6f3a7ee41",
|
|
177
|
+
"cells": [
|
|
178
|
+
{
|
|
179
|
+
"val": "цццццц",
|
|
180
|
+
"color": "#ffffff",
|
|
181
|
+
"key": "3sd3uv"
|
|
182
|
+
},
|
|
183
|
+
{
|
|
184
|
+
"val": "пустая ячейка дальше",
|
|
185
|
+
"color": "#fffde6",
|
|
186
|
+
"key": "pjkssg"
|
|
187
|
+
},
|
|
188
|
+
{
|
|
189
|
+
"color": "#ffffff",
|
|
190
|
+
"key": "gtjnbr"
|
|
191
|
+
},
|
|
192
|
+
{
|
|
193
|
+
"val": "пустая ячейка дальше",
|
|
194
|
+
"color": "#fffde6",
|
|
195
|
+
"key": "pjksdsg"
|
|
196
|
+
},
|
|
197
|
+
{
|
|
198
|
+
"color": "#ffffff",
|
|
199
|
+
"key": "gtjdnbr"
|
|
200
|
+
}
|
|
201
|
+
]
|
|
202
|
+
},
|
|
203
|
+
{
|
|
204
|
+
"key": "dbb5a2c10886sea7ee41",
|
|
205
|
+
"cells": [
|
|
206
|
+
{
|
|
207
|
+
"val": "цццццц",
|
|
208
|
+
"color": "#ffffff",
|
|
209
|
+
"key": "3sd3uv"
|
|
210
|
+
},
|
|
211
|
+
{
|
|
212
|
+
"val": "пустая ячейка дальше",
|
|
213
|
+
"color": "#fffde6",
|
|
214
|
+
"key": "pjkssg"
|
|
215
|
+
},
|
|
216
|
+
{
|
|
217
|
+
"color": "#ffffff",
|
|
218
|
+
"key": "gtjnbr"
|
|
219
|
+
},
|
|
220
|
+
{
|
|
221
|
+
"val": "пустая ячейка дальше",
|
|
222
|
+
"color": "#fffde6",
|
|
223
|
+
"key": "pjksdsg"
|
|
224
|
+
},
|
|
225
|
+
{
|
|
226
|
+
"color": "#ffffff",
|
|
227
|
+
"key": "gtjdnbr"
|
|
228
|
+
}
|
|
229
|
+
]
|
|
230
|
+
},
|
|
231
|
+
{
|
|
232
|
+
"key": "dbb5s2cf0886fea7ee41",
|
|
233
|
+
"cells": [
|
|
234
|
+
{
|
|
235
|
+
"val": "цццццц",
|
|
236
|
+
"color": "#ffffff",
|
|
237
|
+
"key": "3sd3uv"
|
|
238
|
+
},
|
|
239
|
+
{
|
|
240
|
+
"val": "пустая ячейка дальше",
|
|
241
|
+
"color": "#fffde6",
|
|
242
|
+
"key": "pjkssg"
|
|
243
|
+
},
|
|
244
|
+
{
|
|
245
|
+
"color": "#ffffff",
|
|
246
|
+
"key": "gtjnbr"
|
|
247
|
+
},
|
|
248
|
+
{
|
|
249
|
+
"val": "пустая ячейка дальше",
|
|
250
|
+
"color": "#fffde6",
|
|
251
|
+
"key": "pjksdsg"
|
|
252
|
+
},
|
|
253
|
+
{
|
|
254
|
+
"color": "#ffffff",
|
|
255
|
+
"key": "gtjdnbr"
|
|
256
|
+
}
|
|
257
|
+
]
|
|
258
|
+
},
|
|
259
|
+
{
|
|
260
|
+
"key": "dcb5a2d108f6f3a7ee41",
|
|
261
|
+
"cells": [
|
|
262
|
+
{
|
|
263
|
+
"val": "цццццц",
|
|
264
|
+
"color": "#ffffff",
|
|
265
|
+
"key": "3sd3uv"
|
|
266
|
+
},
|
|
267
|
+
{
|
|
268
|
+
"val": "пустая ячейка дальше",
|
|
269
|
+
"color": "#fffde6",
|
|
270
|
+
"key": "pjkssg"
|
|
271
|
+
},
|
|
272
|
+
{
|
|
273
|
+
"color": "#ffffff",
|
|
274
|
+
"key": "gtjnbr"
|
|
275
|
+
},
|
|
276
|
+
{
|
|
277
|
+
"val": "пустая ячейка дальше",
|
|
278
|
+
"color": "#fffde6",
|
|
279
|
+
"key": "pjksdsg"
|
|
280
|
+
},
|
|
281
|
+
{
|
|
282
|
+
"color": "#ffffff",
|
|
283
|
+
"key": "gtjdnbr"
|
|
284
|
+
}
|
|
285
|
+
]
|
|
286
|
+
},
|
|
287
|
+
{
|
|
288
|
+
"key": "dbb5a2c1088ssea7ee41",
|
|
289
|
+
"cells": [
|
|
290
|
+
{
|
|
291
|
+
"val": "цццццц",
|
|
292
|
+
"color": "#ffffff",
|
|
293
|
+
"key": "3sd3uv"
|
|
294
|
+
},
|
|
295
|
+
{
|
|
296
|
+
"val": "пустая ячейка дальше",
|
|
297
|
+
"color": "#fffde6",
|
|
298
|
+
"key": "pjkssg"
|
|
299
|
+
},
|
|
300
|
+
{
|
|
301
|
+
"color": "#ffffff",
|
|
302
|
+
"key": "gtjnbr"
|
|
303
|
+
},
|
|
304
|
+
{
|
|
305
|
+
"val": "пустая ячейка дальше",
|
|
306
|
+
"color": "#fffde6",
|
|
307
|
+
"key": "pjksdsg"
|
|
308
|
+
},
|
|
309
|
+
{
|
|
310
|
+
"color": "#ffffff",
|
|
311
|
+
"key": "gtjdnbr"
|
|
312
|
+
}
|
|
313
|
+
]
|
|
314
|
+
}
|
|
315
|
+
],
|
|
316
|
+
"columns_widths": [200, 405, 300, 200, 200],
|
|
317
|
+
"options": {
|
|
318
|
+
"num_fixed_rows": 2,
|
|
319
|
+
"num_fixed_columns": 1,
|
|
320
|
+
"header": false
|
|
321
|
+
},
|
|
322
|
+
"display": "full",
|
|
323
|
+
"id": "2-84f2dfff359c2d021666431d5a565e0cf7954ede74cd1fa340771d4c229f6fbd"
|
|
324
|
+
},
|
|
24
325
|
{
|
|
25
326
|
"type": "p",
|
|
26
327
|
"data": "<strong>Андрей Карепов</strong> — бывший сотрудник Фургала. Задержан 19 ноября, находится в СИЗО. Вину не признает. В конце августа, как сообщала его защита, был избит по дороге в следственный комитет. Избившие его люди требовали дать показания на Фургала. ",
|
|
@@ -44,6 +345,6 @@
|
|
|
44
345
|
"expand": "Обвиняемые и свидетели ",
|
|
45
346
|
"collapse": "Свернуть"
|
|
46
347
|
},
|
|
47
|
-
"display": "
|
|
348
|
+
"display": "full",
|
|
48
349
|
"id": "4-e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855"
|
|
49
350
|
}
|