diff --git a/src/FilterLists.Web.V2/src/modules/allListsTable/AllListsTable.tsx b/src/FilterLists.Web.V2/src/modules/allListsTable/AllListsTable.tsx index 293f9330a..24b485c2a 100644 --- a/src/FilterLists.Web.V2/src/modules/allListsTable/AllListsTable.tsx +++ b/src/FilterLists.Web.V2/src/modules/allListsTable/AllListsTable.tsx @@ -9,6 +9,7 @@ interface State { data: List[]; pageSize: number; pageSizeOptions: string[]; + isNarrowWindow: boolean; } export class AllListsTable extends React.Component<{}, State> { @@ -17,7 +18,8 @@ export class AllListsTable extends React.Component<{}, State> { this.state = { data: [], pageSize: 0, - pageSizeOptions: [] + pageSizeOptions: [], + isNarrowWindow: false }; this.updatePageSize = this.updatePageSize.bind(this); } @@ -39,7 +41,8 @@ export class AllListsTable extends React.Component<{}, State> { const pageSize = Math.floor((window.innerHeight - 275.5) / 59); this.setState({ pageSize: pageSize, - pageSizeOptions: [5, 10, 20, 500, 2000, pageSize].sort((a, b) => a - b).map(String) + pageSizeOptions: [5, 10, 20, 500, 2000, pageSize].sort((a, b) => a - b).map(String), + isNarrowWindow: window.innerWidth < 576 ? true : false }); } @@ -55,11 +58,12 @@ export class AllListsTable extends React.Component<{}, State> { pageSize: this.state.pageSize, showSizeChanger: true, pageSizeOptions: this.state.pageSizeOptions - }} > + }} + scroll={{ x: this.state.isNarrowWindow ? 576 : 1600 }}> title="Name" dataIndex={nameof("name")} - width={250} + width={200} fixed="left" render={(text: string) =>
{text}
} /> @@ -69,7 +73,7 @@ export class AllListsTable extends React.Component<{}, State> { title="Subscribe" dataIndex={nameof("viewUrl")} width={123} - fixed="right" + fixed={this.state.isNarrowWindow ? undefined : "right"} render={(text: string, record: List, index: number) => } />