@happeouikit/content-renderer 3.2.11 → 3.2.12

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 CHANGED
@@ -251,10 +251,13 @@
251
251
  width: 100%;
252
252
  margin: var(--space-md) 0;
253
253
  text-align: left;
254
- border-spacing: 0;
255
- border-collapse: separate; // doubles internal borders, but needed to allow more customization
256
- > tbody > tr > td {
257
- padding: 0.25em 0.5em;
254
+ border-collapse: collapse; // doubles internal borders, but needed to allow more customization
255
+ thead th {
256
+ background: rgba(0, 0, 0, 0.1);
257
+ }
258
+ th,
259
+ td {
260
+ padding: 0.5em;
258
261
  border: 0.5px solid rgba(0, 0, 0, 0.12);
259
262
  &.fr-selected-cell {
260
263
  border: 0.5px solid var(--color-active-primary);
@@ -284,19 +287,20 @@
284
287
  }
285
288
  // to "cancel" the separate borders style, we halve all borders to 0.5px
286
289
  // but override with 1px for external borders
287
- & > tbody > {
290
+ & {
288
291
  tr:first-child > td { border-top-width: 1px; }
289
292
  tr:last-child > td { border-bottom-width: 1px; }
290
293
  tr > td:first-child { border-left-width: 1px; }
291
294
  tr > td:last-child { border-right-width: 1px; }
292
295
  }
293
- &.invisible-borders > tbody > tr > {
296
+ &.invisible-borders {
297
+ th:not(.fr-selected-cell),
294
298
  td:not(.fr-selected-cell) {
295
299
  // keeping a transparent border so that selection doesn't push things by 1 pixel
296
300
  border: 1px dashed transparent;
297
301
  }
298
302
  }
299
- &.alternating-rows > tbody > {
303
+ &.alternating-rows {
300
304
  tr:nth-child(odd) {
301
305
  background: rgba(255, 255, 255, 0.05);
302
306
  }
@@ -304,7 +308,7 @@
304
308
  background: rgba(0, 0, 0, 0.05);
305
309
  }
306
310
  }
307
- &.round-corners > tbody > {
311
+ &.round-corners {
308
312
  tr:first-child { border-radius: 6px 6px 0 0; }
309
313
  tr:first-child > td:first-child { border-top-left-radius: 6px; }
310
314
  tr:first-child > td:last-child { border-top-right-radius: 6px; }
@@ -312,12 +316,12 @@
312
316
  tr:last-child > td:first-child { border-bottom-left-radius: 6px; }
313
317
  tr:last-child > td:last-child { border-bottom-right-radius: 6px; }
314
318
  }
315
- &.highlight-first-row > tbody > {
319
+ &.highlight-first-row {
316
320
  tr:first-child > td {
317
321
  font-weight: bold;
318
322
  }
319
323
  }
320
- &.highlight-first-column > tbody > {
324
+ &.highlight-first-column {
321
325
  tr > td:first-child {
322
326
  font-weight: bold;
323
327
  }