I'M using library table react-data-table-component, trying to have one row get free overflow.

import DataTable from 'react-data-table-component'
<DataTable
data={data}
tableColumns={orderListColumns}
emptyText="Geen gegevens aan te tonen..."
disablePagination={false}
hasFilter={true}
loading={loading}
paginationRowsPerPageOptions={[
20, 40, 80, 120, 200, 400, 800,
]}
paginationPerPage={20}
t={t}
/>
<DataTable
data={data}
tableColumns={orderListColumns}
emptyText="Geen gegevens aan te tonen..."
disablePagination={false}
hasFilter={true}
loading={loading}
paginationRowsPerPageOptions={[
20, 40, 80, 120, 200, 400, 800,
]}
paginationPerPage={20}
t={t}
/>
Column
{
name: '',
selector: (row: any) => (
<>
{outOfStockHandler(row) ? (
<div
style={{ height: 16, width: 16 }}
className="mx-auto rounded-circle bg-secondary-green ml-auto"
/>
) : (
<div
style={{ height: 16, width: 16 }}
className="mx-auto rounded-circle bg-danger ml-5 ml-auto"
/>
)}

{row?.new_status && (
<div
className="position-absolute "
style={{ top: -14, left: -40, height: 80, width: 80, zIndex: 99 }}
>
<Image
style={{ height: 160, width: 160 }}
height="160"
width="160"
className="img-new"
src={require(locale === 'de'
? `@/assets/logos/new_de.png`
: locale === 'en'
? `@/assets/logos/new_en.png`
: `@/assets/logos/new_nl.png`)}
/>{' '}
</div>
)}
</>
),
width: '40px',
style: { zIndex: '90000' },
compact: true,
allowOverflow: true,
right: true,
},
{
name: '',
selector: (row: any) => (
<>
{outOfStockHandler(row) ? (
<div
style={{ height: 16, width: 16 }}
className="mx-auto rounded-circle bg-secondary-green ml-auto"
/>
) : (
<div
style={{ height: 16, width: 16 }}
className="mx-auto rounded-circle bg-danger ml-5 ml-auto"
/>
)}

{row?.new_status && (
<div
className="position-absolute "
style={{ top: -14, left: -40, height: 80, width: 80, zIndex: 99 }}
>
<Image
style={{ height: 160, width: 160 }}
height="160"
width="160"
className="img-new"
src={require(locale === 'de'
? `@/assets/logos/new_de.png`
: locale === 'en'
? `@/assets/logos/new_en.png`
: `@/assets/logos/new_nl.png`)}
/>{' '}
</div>
)}
</>
),
width: '40px',
style: { zIndex: '90000' },
compact: true,
allowOverflow: true,
right: true,
},
0 Replies
No replies yetBe the first to reply to this messageJoin
Want results from more Discord servers?
Add your server