@happeouikit/content-renderer 3.2.24 → 3.2.25
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/index.cjs.js +14 -0
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +14 -0
- package/dist/index.es.js.map +1 -1
- package/package.json +2 -2
package/dist/index.cjs.js
CHANGED
|
@@ -259,6 +259,20 @@
|
|
|
259
259
|
border: 1px solid var(--color-gray100);
|
|
260
260
|
}
|
|
261
261
|
|
|
262
|
+
// when wide tables are displayed on small screens they look terrible unless
|
|
263
|
+
// we add horizontal scrolling: but this requires giving overflow-x: auto to
|
|
264
|
+
// to the table's container, i.e. this entire content renderer
|
|
265
|
+
@media (max-width: 521px) { // (using "var(--breakpoint-md, 521px)" fails in storybook for some reason)
|
|
266
|
+
overflow-x: auto;
|
|
267
|
+
table {
|
|
268
|
+
table-layout: auto !important; // overrides 'fixed' set here
|
|
269
|
+
|
|
270
|
+
td,
|
|
271
|
+
th {
|
|
272
|
+
word-break: normal !important; // overrides 'break-word' set for some components
|
|
273
|
+
}
|
|
274
|
+
}
|
|
275
|
+
}
|
|
262
276
|
/* Table styles */
|
|
263
277
|
// this code is duplicated:
|
|
264
278
|
// - in the happeouikit ContentRenderer (used for viewed content)
|