@shopify/polaris/build/esnext/components/IndexTable/IndexTable.css

Shopify’s admin product component library

.Polaris-IndexTable_14ou9{ position:relative; overflow:hidden; border-radius:inherit; }

.Polaris-IndexTable__LoadingContainer--enter_pborr{ opacity:0; transform:translateY(-100%); }

.Polaris-IndexTable--loadingContainerEnterActive_g73ly{ opacity:1; transition:opacity 100ms ease-out, transform 100ms ease-out; transform:translateY(0); }

.Polaris-IndexTable__LoadingContainer--exit_12qdn{ opacity:1; transform:translateY(0); }

.Polaris-IndexTable--loadingContainerExitActive_1mc5y{ opacity:0; transform:translateY(-100%); transition:opacity 100ms ease-in, transform 100ms ease-in; }

.Polaris-IndexTable__LoadingPanel_2h3bc{ position:absolute; z-index:37; top:0; left:0; display:flex; width:100%; justify-content:center; align-items:center; background:var(--p-surface); padding:0.8rem 1.6rem; box-shadow:0 0 0 1px rgba(63, 63, 68, 0.05), 0 1px 3px 0 rgba(63, 63, 68, 0.15); }

.Polaris-IndexTable__LoadingPanel_2h3bc .Polaris-IndexTable__LoadingPanelRow_lfpzp{ display:flex; flex-wrap:nowrap; width:100%; background:var(--p-surface-highlight-subdued); padding:0.8rem; padding-bottom:0.4rem; border-radius:var(--p-border-radius-base); }

.Polaris-IndexTable__LoadingPanelText_1o2zz{ margin-left:1.2rem; color:var(--p-text); }

.Polaris-IndexTable__Table_2qj3m{ width:100%; min-width:100%; border-collapse:collapse; }

.Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd, .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableHeading--first_7e0t3, .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableHeading--second_13zlr{ visibility:visible; background-color:var(--p-surface); }

.Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableHeading--first_7e0t3{ filter:drop-shadow(0.1rem 0 0 var(--p-divider)); }

@media (min-width: 28.625em){ .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd, .Polaris-IndexTable__Table--scrolling_1wn6c .Polaris-IndexTable__TableHeading--second_13zlr{ filter:drop-shadow(0.1rem 0 0 var(--p-divider)); } }

.Polaris-IndexTable__Table--scrolling_1wn6c.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable__TableHeading--second_13zlr, .Polaris-IndexTable__Table--scrolling_1wn6c.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable__TableCell_14vwd:first-child{ visibility:visible; filter:drop-shadow(0.1rem 0 0 var(--p-divider)); }

.Polaris-IndexTable__TableRow_1a85o{ background-color:var(--p-surface); cursor:pointer; filter:drop-shadow(0 -0.1rem 0 var(--p-divider)); }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--unclickable_a4od4{ cursor:auto; }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSuccess_pc5rl, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSuccess_pc5rl .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSuccess_pc5rl .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ background-color:var(--p-surface-primary-selected); }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSubdued_cwcww, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSubdued_cwcww .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable--statusSubdued_cwcww .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ background-color:var(--p-surface-subdued); }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ background-color:var(--p-surface-hovered); }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--selected_1twnz, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableHeading--first_7e0t3, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableHeading--second_13zlr, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ background-color:var(--p-surface-selected); }

.Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg.Polaris-IndexTable__TableRow--selected_1twnz, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableCell--first_1h1n6, .Polaris-IndexTable__TableRow_1a85o.Polaris-IndexTable__TableRow--hovered_ef3tg.Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ background-color:var(--p-surface-selected-hovered); }

.Polaris-IndexTable__TableRow--subdued_fuznb{ color:var(--p-text-subdued); }

.Polaris-IndexTable__TableHeading_1e5bf{ padding:1.6rem; text-align:left; font-weight:500; white-space:nowrap; border:0; }

.Polaris-IndexTable__TableHeading--first_7e0t3{ position:sticky; left:0; padding-left:1.4rem; padding-right:1.8rem; }

.Polaris-IndexTable__ColumnHeaderCheckboxWrapper_wbe3v{ display:flex; }

.Polaris-IndexTable__FirstStickyHeaderElement_t5ww3{ margin-left:-0.2rem; padding-right:0.2rem; }

.Polaris-IndexTable__TableHeading--second_13zlr:not(.Polaris-IndexTable__TableHeading--unselectable_w9xsx){ padding-left:0; }

@media (min-width: 28.625em){ .Polaris-IndexTable__TableHeading--second_13zlr:not(.Polaris-IndexTable__TableHeading--unselectable_w9xsx){ position:sticky; z-index:auto; left:0; } }

.Polaris-IndexTable__TableHeading--second_13zlr.Polaris-IndexTable__TableHeading--unselectable_w9xsx{ position:sticky; z-index:auto; left:0; }

.Polaris-IndexTable__TableCell_14vwd{ z-index:1; text-align:left; padding:0.8rem 1.6rem; white-space:nowrap; }

.Polaris-IndexTable__TableCell--flush_1ofni{ padding:0; }

.Polaris-IndexTable__TableCell--first_1h1n6{ position:sticky; left:0; z-index:31; padding:0; }

.Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ left:var(--p-checkbox-offset); padding-left:0; }

@media (min-width: 28.625em){ .Polaris-IndexTable__TableCell--first_1h1n6 + .Polaris-IndexTable__TableCell_14vwd{ position:sticky; z-index:31; padding:0; } }

.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable__TableCell_14vwd:first-child{ left:0; background-color:var(--p-surface); position:sticky; z-index:31; }

.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable--statusSuccess_pc5rl .Polaris-IndexTable__TableCell_14vwd:first-child{ background-color:var(--p-surface-primary-selected); }

.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable--statusSubdued_cwcww .Polaris-IndexTable__TableCell_14vwd:first-child{ background-color:var(--p-surface-subdued); }

.Polaris-IndexTable__Table--unselectable_2x68i .Polaris-IndexTable__TableRow--hovered_ef3tg .Polaris-IndexTable__TableCell_14vwd:first-child{ background-color:var(--p-surface-hovered); }

@media (min-width: 28.625em){ .Polaris-IndexTable--tableStickyScrolling_19kr9 .Polaris-IndexTable__TableCell_14vwd:last-child, .Polaris-IndexTable--tableStickyScrolling_19kr9 .Polaris-IndexTable__TableHeading--last_qqggd{ filter:drop-shadow(-0.1rem 0 0 var(--p-divider)); } }

@media (min-width: 28.625em){ .Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable__TableCell_14vwd:last-child{ position:sticky; right:0; background-color:var(--p-surface); z-index:31; } }

@media (min-width: 28.625em){ .Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable__TableHeading--last_qqggd{ position:sticky; right:0; background-color:var(--p-surface); z-index:auto; } }

.Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable--statusSuccess_pc5rl .Polaris-IndexTable__TableCell_14vwd:last-child{ background-color:var(--p-surface-primary-selected); }

.Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable--statusSubdued_cwcww .Polaris-IndexTable__TableCell_14vwd:last-child{ background-color:var(--p-surface-subdued); }

.Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable__TableRow--hovered_ef3tg .Polaris-IndexTable__TableCell_14vwd:last-child{ background-color:var(--p-surface-hovered); }

.Polaris-IndexTable--tableStickyLast_1kdje .Polaris-IndexTable__TableRow--selected_1twnz .Polaris-IndexTable__TableCell_14vwd:last-child{ background-color:var(--p-surface-selected); }

.Polaris-IndexTable__StickyTable_1swiu{ position:relative; top:0; left:0; right:0; visibility:hidden; z-index:37; }

.Polaris-IndexTable__StickyTableHeader_1ytkn{ position:absolute; display:flex; width:100%; }

.Polaris-IndexTable__StickyTableHeader_1ytkn:not(.Polaris-IndexTable__StickyTableHeader--isSticky_1sidr){ top:-100rem; left:-100rem; }

.Polaris-IndexTable__StickyTableColumnHeader_3fyec{ flex:0 0 auto; }

.Polaris-IndexTable__StickyTableColumnHeader--isScrolling_pjnvm{ box-shadow:1px 1px 0 0 var(--p-divider), 1px 0 1px 1px rgba(63, 63, 68, 0.05), 1px 0 3px 0 rgba(63, 63, 68, 0.15); }

.Polaris-IndexTable__StickyTableHeadings_c6d08{ overflow:hidden; flex:1 1 auto; display:flex; }

.Polaris-IndexTable__StickyTableHeading--second_7u33u{ padding-left:0; }

@media (min-width: 28.625em){ .Polaris-IndexTable__StickyTableHeading--second_7u33u{ display:none; } }

.Polaris-IndexTable__StickyTableHeading--second_7u33u.Polaris-IndexTable--unselectable_vpzgl{ display:none; }

.Polaris-IndexTable--stickyTableHeadingSecondScrolling_18frd{ padding:0 0.06rem 0 1.6rem; display:none; }

@media (min-width: 28.625em){ .Polaris-IndexTable--stickyTableHeadingSecondScrolling_18frd{ display:block; } }

.Polaris-IndexTable__StickyTableHeader--isSticky_1sidr{ visibility:visible; background-color:var(--p-surface); box-shadow:0 0 0 1px rgba(63, 63, 68, 0.05), 0 1px 3px 0 rgba(63, 63, 68, 0.15); }

.Polaris-IndexTable_14ou9:hover .Polaris-IndexTable__ScrollLeft_1ccqr{ display:block; }

.Polaris-IndexTable_14ou9:hover .Polaris-IndexTable__ScrollRight_4u2ec{ display:block; }

.Polaris-IndexTable_14ou9 .Polaris-IndexTable__ScrollRight--onboarding_1x8yb{ display:block; }

.Polaris-IndexTable__BulkActionsWrapper_9c77q{ visibility:visible; position:relative; z-index:36; top:0; left:0; right:0; padding:0.8rem; background:var(--p-surface); }

.Polaris-IndexTable__ScrollBarContainer_1rt01{ position:sticky; z-index:35; bottom:0; padding:0.2rem; border-top:0.1rem solid var(--p-divider); background-color:var(--p-surface); border-bottom-right-radius:var(--p-border-radius-base); border-bottom-left-radius:var(--p-border-radius-base); }

.Polaris-IndexTable--scrollBarContainerCondensed_x4kca{ visibility:hidden; pointer-events:none; }

.Polaris-IndexTable__ScrollBar_1du2f{ overflow-x:scroll; width:100%; margin:0; padding:0; }

.Polaris-IndexTable__ScrollBar_1du2f::-webkit-scrollbar-track{ border-radius:0.4rem; background-color:transparent; }

.Polaris-IndexTable__ScrollBar_1du2f::-webkit-scrollbar{ -webkit-appearance:none; appearance:none; height:0.8rem; width:0.8rem; background-color:transparent; }

.Polaris-IndexTable__ScrollBar_1du2f::-webkit-scrollbar-thumb{ border-radius:0.4rem; background-color:var(--p-border-neutral-subdued); -webkit-transition:background-color 100ms ease-out; transition:background-color 100ms ease-out; }

.Polaris-IndexTable__ScrollBar_1du2f:hover::-webkit-scrollbar-thumb{ background-color:var(--p-border-depressed); }

.Polaris-IndexTable--disableTextSelection_1rwab{ -webkit-user-select:none; user-select:none; }

.Polaris-IndexTable--selectMode_4098j{ transform:translateY(-5.2rem); margin-bottom:-5.2rem; }

.Polaris-IndexTable__EmptySearchResultWrapper_ainc2{ padding:1.6rem; }

.Polaris-IndexTable--condensedRow_1bwvn{ width:calc(100% + 3.4rem); transform:translateX(-3.4rem); transition:transform cubic-bezier(0.25, 0.1, 0.25, 1) 200ms; display:flex; border-top:0.1rem solid var(--p-divider); filter:none; align-items:center; }

[data-selectmode='true'] .Polaris-IndexTable--condensedRow_1bwvn{ transform:none; }

.Polaris-IndexTable__CondensedList_agren{ list-style-type:none; margin:0; padding:0; overflow:hidden; }

.Polaris-IndexTable__HeaderWrapper_9w2pa{ position:relative; display:flex; align-items:flex-start; width:100%; min-height:5.6rem; padding:1rem 1.6rem; background-color:var(--p-surface); }

.Polaris-IndexTable__HeaderWrapper_9w2pa.Polaris-IndexTable--unselectable_vpzgl{ min-height:auto; padding:0; }

.Polaris-IndexTable__StickyTable--condensed_g7gz8{ visibility:visible; }

.Polaris-IndexTable__StickyTableHeader--condensed_d52ci{ padding:1.6rem 1.6rem 0.8rem; }

.Polaris-IndexTable__ScrollBarContent_1iz36{ height:1px; width:var(--p-scroll-bar-content-width); }