@happeouikit/content-renderer 3.2.23 → 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.es.js CHANGED
@@ -5291,7 +5291,7 @@ const ui = ii(), si = new RegExp(tt, "gi"), di = new RegExp(
5291
5291
  })
5292
5292
  ] });
5293
5293
  }, mi = At.div`
5294
- position: relative;
5294
+ position: absolute;
5295
5295
  display: inline-block;
5296
5296
  margin-inline-start: var(--space-sm);
5297
5297
  vertical-align: middle;
@@ -5415,6 +5415,20 @@ const ui = ii(), si = new RegExp(tt, "gi"), di = new RegExp(
5415
5415
  border: 1px solid var(--color-gray100);
5416
5416
  }
5417
5417
 
5418
+ // when wide tables are displayed on small screens they look terrible unless
5419
+ // we add horizontal scrolling: but this requires giving overflow-x: auto to
5420
+ // to the table's container, i.e. this entire content renderer
5421
+ @media (max-width: 521px) { // (using "var(--breakpoint-md, 521px)" fails in storybook for some reason)
5422
+ overflow-x: auto;
5423
+ table {
5424
+ table-layout: auto !important; // overrides 'fixed' set here
5425
+
5426
+ td,
5427
+ th {
5428
+ word-break: normal !important; // overrides 'break-word' set for some components
5429
+ }
5430
+ }
5431
+ }
5418
5432
  /* Table styles */
5419
5433
  // this code is duplicated:
5420
5434
  // - in the happeouikit ContentRenderer (used for viewed content)