mirror of
https://github.com/collinbarrett/FilterLists.git
synced 2026-03-11 09:04:27 +00:00
mostly fix gutter before Description column on ultra-wide viewport
ref https://github.com/collinbarrett/FilterLists/issues/970
This commit is contained in:
parent
cbb215873c
commit
3508ba2a6a
2 changed files with 14 additions and 3 deletions
|
|
@ -70,7 +70,12 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
|
|||
style: { float: "left", margin: "4px 4px" },
|
||||
pageSize: tablePageSize.pageSize
|
||||
}}
|
||||
scroll={{ x: tablePageSize.isNarrowWindow ? undefined : 1892 }}
|
||||
scroll={{
|
||||
x:
|
||||
tablePageSize.isNarrowWindow || tablePageSize.isWideWindow
|
||||
? undefined
|
||||
: 1892
|
||||
}}
|
||||
onChange={(
|
||||
_pagination: PaginationConfig,
|
||||
_filters: Record<keyof List, string[]>,
|
||||
|
|
@ -108,7 +113,11 @@ export const ListsTable = (props: RouteComponentProps & Props) => {
|
|||
title="Description"
|
||||
key="Description"
|
||||
dataIndex={nameof<List>("description")}
|
||||
width={423}
|
||||
width={
|
||||
!tablePageSize.isNarrowWindow && !tablePageSize.isWideWindow
|
||||
? 423
|
||||
: undefined
|
||||
}
|
||||
className={styles.nogrow}
|
||||
filterDropdown={searchDescriptionColumn.filterDropdown}
|
||||
filterIcon={searchDescriptionColumn.filterIcon}
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@ import { useEffect, useState } from "react";
|
|||
interface TablePageSize {
|
||||
pageSize: number;
|
||||
isNarrowWindow: boolean;
|
||||
isWideWindow: boolean;
|
||||
}
|
||||
|
||||
export const useTablePageSizer = () => {
|
||||
|
|
@ -17,5 +18,6 @@ export const useTablePageSizer = () => {
|
|||
|
||||
const calculateSize = () => ({
|
||||
pageSize: Math.floor((window.innerHeight - 184) / 57),
|
||||
isNarrowWindow: window.innerWidth < 576 ? true : false
|
||||
isNarrowWindow: window.innerWidth < 576 ? true : false,
|
||||
isWideWindow: window.innerWidth > 1918 ? true : false
|
||||
});
|
||||
|
|
|
|||
Loading…
Reference in a new issue