Home The grid system is implemented using Vanilla Grid, a lightweight CSS grid solution, which is imported dynamically through a separate JavaScript file. This modular approach ensures that the grid-related logic is decoupled from the main HTML.
# | Column 1 | Column 2 | Column 3 |
1 | Data 1 | Data 2 | Data 3 |
2 | Data 1 | Data 2 | Data 3 |
3 | Data 1 | Data 2 | Data 3 |
4 | Data 1 | Data 2 | Data 3 |
5 | Data 1 | Data 2 | Data 3 |
6 | Data 1 | Data 2 | Data 3 |
7 | Data 1 | Data 2 | Data 3 |
8 | Data 1 | Data 2 | Data 3 |
9 | Data 1 | Data 2 | Data 3 |
10 | Data 1 | Data 2 | Data 3 |
11 | Data 1 | Data 2 | Data 3 |
12 | Data 1 | Data 2 | Data 3 |
13 | Data 1 | Data 2 | Data 3 |
14 | Data 1 | Data 2 | Data 3 |
15 | Data 1 | Data 2 | Data 3 |
16 | Data 1 | Data 2 | Data 3 |
17 | Data 1 | Data 2 | Data 3 |
18 | Data 1 | Data 2 | Data 3 |
19 | Data 1 | Data 2 | Data 3 |
20 | Data 1 | Data 2 | Data 3 |
21 | Data 1 | Data 2 | Data 3 |
22 | Data 1 | Data 2 | Data 3 |
23 | Data 1 | Data 2 | Data 3 |
24 | Data 1 | Data 2 | Data 3 |
25 | Data 1 | Data 2 | Data 3 |
import { VanillaGrid } from '@skriptx2/vanillagrid';
window.addEventListener('DOMContentLoaded', function(){
const table = document.querySelector("table");
new VanillaGrid(table, {
itemsPerPage:4,
info:'Showing :start to :end of :total entries',
})
})