repos / neovimcraft

commit

5bf3e06

parent

491f21a

author

Eric Bower

date

2021-07-20 03:44:08 +0000 UTC

revert pagination for now

 1@@ -90,24 +90,6 @@
 2   export let plugins: Plugin[] = [];
 3   export let tags: Tag[] = [];
 4   $: filterTotal = filterPlugins({ search, plugins });
 5-
 6-  function paginate(p: number, items: Plugin[]) {
 7-    const PER_PAGE = 15;
 8-    const total = Math.ceil(items.length / PER_PAGE);
 9-    const first = p === 1;
10-    const last = p === total;
11-    const end = p * PER_PAGE;
12-    const start = end - PER_PAGE;
13-    return { results: items.slice(start, end), first, last, total };
14-  }
15-  let curPage = 1;
16-  $: pager = paginate(curPage, filterTotal);
17-  const changePage = (next: number) => {
18-    curPage = next;
19-    document.getElementById('plugins_list').scrollTo(0, 0);
20-  };
21-  const prev = () => changePage(curPage - 1);
22-  const next = () => changePage(curPage + 1);
23 </script>
24 
25 <div class="container">
26@@ -144,14 +126,9 @@
27   <div class="plugins">
28     <div class="plugins_list" id="plugins_list">
29       <div class="search_results">{filterTotal.length} results</div>
30-      {#each pager.results as plugin}
31+      {#each filterTotal as plugin}
32         <PluginItem {plugin} tags={getTags(plugin.tags)} {onSearch} />
33       {/each}
34-      <div class="paginate">
35-        <button on:click={prev} disabled={pager.first}>prev</button>
36-        <div>{curPage} of {pager.total}</div>
37-        <button on:click={next} disabled={pager.last}>next</button>
38-      </div>
39     </div>
40   </div>
41 </div>
42@@ -165,12 +142,6 @@
43     overflow-y: hidden;
44   }
45 
46-  .paginate {
47-    margin: 30px 0;
48-    display: flex;
49-    align-items: center;
50-  }
51-
52   .desc {
53     margin-bottom: 5px;
54   }
55@@ -249,26 +220,6 @@
56     overflow-x: hidden;
57   }
58 
59-  button {
60-    padding: 10px 15px;
61-    margin: 0 10px;
62-    background-color: var(--highlight-color);
63-    color: var(--primary-color);
64-    cursor: pointer;
65-    outline: 0;
66-    border: 1px solid var(--primary-color);
67-    border-radius: 3px;
68-  }
69-
70-  button:disabled {
71-    cursor: default;
72-    background-color: var(--primary-color);
73-  }
74-
75-  button:hover:enabled {
76-    background-color: var(--highlight-secondary);
77-  }
78-
79   @media only screen and (max-width: 700px) {
80     .container {
81       grid-template-columns: 1fr;

 1@@ -90,3 +90,23 @@ input:focus {
 2   border-bottom: 1px solid var(--highlight-secondary);
 3   color: var(--highlight-secondary);
 4 }
 5+
 6+button {
 7+    padding: 10px 15px;
 8+    margin: 0 10px;
 9+    background-color: var(--highlight-color);
10+    color: var(--primary-color);
11+    cursor: pointer;
12+    outline: 0;
13+    border: 1px solid var(--primary-color);
14+    border-radius: 3px;
15+  }
16+
17+  button:disabled {
18+    cursor: default;
19+    background-color: var(--primary-color);
20+  }
21+
22+  button:hover:enabled {
23+    background-color: var(--highlight-secondary);
24+  }