Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/Vestride/Shuffle

Categorize, sort, and filter a responsive grid of items
https://github.com/Vestride/Shuffle

filter grid layout masonry responsive sort

Last synced: 19 days ago
JSON representation

Categorize, sort, and filter a responsive grid of items

Awesome Lists containing this project

README

        

# [Shuffle][homepage] ![Build Status][actions-img] [![Dependabot Status][dependabot-img]][dependabot-url] [![NPM version][npm-img]][npm-url]

Categorize, sort, and filter a responsive grid of items.

```bash
npm install shufflejs
```

## Docs and Demos

[All found here][homepage]

### Usage (with ES6)

```js
import Shuffle from 'shufflejs';

const shuffleInstance = new Shuffle(document.getElementById('grid'), {
itemSelector: '.js-item',
sizer: '.js-shuffle-sizer',
});
```

## Inspiration

This project was inspired by [Isotope](http://isotope.metafizzy.co/) and [Packery](http://packery.metafizzy.co/).

[homepage]: https://vestride.github.io/Shuffle/
[actions-img]: https://github.com/Vestride/Shuffle/actions/workflows/build.yml/badge.svg?branch=main
[npm-url]: https://www.npmjs.com/package/shufflejs
[npm-img]: https://img.shields.io/npm/v/shufflejs.svg
[dependabot-url]: https://docs.github.com/en/code-security/supply-chain-security/managing-vulnerabilities-in-your-projects-dependencies/configuring-dependabot-security-updates
[dependabot-img]: https://img.shields.io/badge/Dependabot-enabled-blue.svg