diff --git a/src/FilterLists.Web/ClientApp/components/Home.tsx b/src/FilterLists.Web/ClientApp/components/Home.tsx
index e9be38b6f..8392ff991 100644
--- a/src/FilterLists.Web/ClientApp/components/Home.tsx
+++ b/src/FilterLists.Web/ClientApp/components/Home.tsx
@@ -11,6 +11,7 @@ interface IHomeState {
loadingLists: boolean;
ruleCount: number;
loadingRuleCount: boolean;
+ pageSize: number;
}
export class Home extends React.Component, IHomeState> {
@@ -20,8 +21,10 @@ export class Home extends React.Component, IHomeState> {
lists: [],
loadingLists: true,
ruleCount: 0,
- loadingRuleCount: true
+ loadingRuleCount: true,
+ pageSize: 20
};
+ this.updatePageSize = this.updatePageSize.bind(this);
}
render() {
@@ -31,7 +34,7 @@ export class Home extends React.Component, IHomeState> {
:
{Home.renderTagline(this.state)}
- {Home.renderFilterListsTable(this.state.lists)}
+ {Home.renderFilterListsTable(this.state)}
;
return
{contents}
@@ -39,6 +42,8 @@ export class Home extends React.Component
, IHomeState> {
}
componentDidMount() {
+ this.updatePageSize();
+ window.addEventListener("resize", this.updatePageSize);
fetch("https://filterlists.com/api/v1/lists")
.then(response => response.json() as Promise)
.then(data => {
@@ -57,6 +62,14 @@ export class Home extends React.Component, IHomeState> {
});
}
+ componentWillUnmount() {
+ window.removeEventListener("resize", this.updatePageSize);
+ }
+
+ updatePageSize() {
+ this.setState({ pageSize: (window.innerHeight - 200) / 50 });
+ }
+
private static renderTagline(state: IHomeState) {
return
The independent, comprehensive directory of {state.ruleCount.toLocaleString()
@@ -65,10 +78,13 @@ export class Home extends React.Component, IHomeState> {
;
}
- private static renderFilterListsTable(filterLists: IListDto[]) {
+ private static renderFilterListsTable(state: IHomeState) {
return
+ title={
+"Subscribe to list with browser extension supporting \"abp:\" protcool (e.g. uBlock Origin, AdBlock Plus)."}>
Subscribe
;
}
\ No newline at end of file