fix(SW-813): More content page fixes
This commit is contained in:
@@ -29,6 +29,7 @@ export default function TableBlock({ data }: TableBlockProps) {
|
||||
header: col.header,
|
||||
size: col.width,
|
||||
}))
|
||||
const hasHeader = columns.some((col) => col.header)
|
||||
|
||||
const table = useReactTable({
|
||||
columns: columnDefs,
|
||||
@@ -49,9 +50,7 @@ export default function TableBlock({ data }: TableBlockProps) {
|
||||
|
||||
return (
|
||||
<SectionContainer>
|
||||
{heading ? (
|
||||
<SectionHeader preamble={data.preamble} title={heading} />
|
||||
) : null}
|
||||
{heading ? <SectionHeader preamble={preamble} title={heading} /> : null}
|
||||
<div className={styles.tableWrapper}>
|
||||
<ScrollWrapper>
|
||||
<Table
|
||||
@@ -61,23 +60,26 @@ export default function TableBlock({ data }: TableBlockProps) {
|
||||
layout="fixed"
|
||||
borderRadius="none"
|
||||
>
|
||||
<Table.THead>
|
||||
{table.getHeaderGroups().map((headerGroup) => (
|
||||
<Table.TR key={headerGroup.id}>
|
||||
{headerGroup.headers.map((header) => (
|
||||
<Table.TH
|
||||
key={header.id}
|
||||
width={`${header.column.columnDef.size}%`}
|
||||
>
|
||||
{flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext()
|
||||
)}
|
||||
</Table.TH>
|
||||
))}
|
||||
</Table.TR>
|
||||
))}
|
||||
</Table.THead>
|
||||
{hasHeader ? (
|
||||
<Table.THead>
|
||||
{table.getHeaderGroups().map((headerGroup) => (
|
||||
<Table.TR key={headerGroup.id}>
|
||||
{headerGroup.headers.map((header) => (
|
||||
<Table.TH
|
||||
key={header.id}
|
||||
width={`${header.column.columnDef.size}%`}
|
||||
>
|
||||
{flexRender(
|
||||
header.column.columnDef.header,
|
||||
header.getContext()
|
||||
)}
|
||||
</Table.TH>
|
||||
))}
|
||||
</Table.TR>
|
||||
))}
|
||||
</Table.THead>
|
||||
) : null}
|
||||
|
||||
<Table.TBody>
|
||||
{table.getRowModel().rows.map((row) => (
|
||||
<Table.TR key={row.id}>
|
||||
|
||||
@@ -33,6 +33,8 @@
|
||||
|
||||
.contentContainer {
|
||||
padding: var(--Spacing-x4) var(--Spacing-x2) 0;
|
||||
max-width: var(--max-width-content);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.content .contentContainer {
|
||||
@@ -67,9 +69,7 @@
|
||||
}
|
||||
|
||||
.contentContainer {
|
||||
max-width: var(--max-width-content);
|
||||
padding: var(--Spacing-x4) 0 0;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.content .contentContainer {
|
||||
|
||||
@@ -65,7 +65,6 @@ export const renderOptions: RenderOptions = {
|
||||
next: RTENext,
|
||||
fullRenderOptions: RenderOptions
|
||||
) => {
|
||||
console.log({ RTE_A_NODE: node })
|
||||
if (node.attrs.url) {
|
||||
const props = extractPossibleAttributes(node.attrs)
|
||||
return (
|
||||
|
||||
@@ -10,10 +10,6 @@
|
||||
padding-top: var(--Spacing-x4);
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: var(--Spacing-x0) var(--Spacing-x2);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1367px) {
|
||||
.aside {
|
||||
align-content: flex-start;
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--Spacing-x1);
|
||||
gap: var(--Spacing-x-one-and-half) var(--Spacing-x2);
|
||||
cursor: pointer;
|
||||
color: var(--Base-Text-High-contrast);
|
||||
font-family: var(--typography-Body-Bold-fontFamily);
|
||||
@@ -29,7 +29,7 @@
|
||||
}
|
||||
|
||||
.accordionItem.card .summary {
|
||||
padding: var(--Spacing-x1) var(--Spacing-x-one-and-half);
|
||||
padding: var(--Spacing-x-one-and-half) var(--Spacing-x2);
|
||||
border-radius: var(--Corner-radius-Medium);
|
||||
}
|
||||
|
||||
@@ -38,7 +38,7 @@
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: var(--Spacing-x1) var(--Spacing-x-one-and-half) var(--Spacing-x1);
|
||||
padding: var(--Spacing-x-one-and-half) var(--Spacing-x2) var(--Spacing-x1);
|
||||
overflow: hidden;
|
||||
max-height: 0;
|
||||
transition: max-height 0.3s;
|
||||
@@ -46,6 +46,7 @@
|
||||
|
||||
.chevron {
|
||||
transition: transform 0.3s;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
details[open] .chevron {
|
||||
transform: rotate(180deg);
|
||||
|
||||
@@ -19,9 +19,7 @@
|
||||
|
||||
.th {
|
||||
padding: var(--Spacing-x2);
|
||||
|
||||
text-align: left;
|
||||
text-wrap: nowrap;
|
||||
}
|
||||
|
||||
.td {
|
||||
|
||||
Reference in New Issue
Block a user