https://github.com/phucbm/js-gist
🩹 JavaScript Snippets
https://github.com/phucbm/js-gist
es6 javascript snippets
Last synced: 9 months ago
JSON representation
🩹 JavaScript Snippets
- Host: GitHub
- URL: https://github.com/phucbm/js-gist
- Owner: phucbm
- Created: 2021-09-23T15:36:04.000Z (almost 5 years ago)
- Default Branch: main
- Last Pushed: 2022-11-14T08:20:39.000Z (over 3 years ago)
- Last Synced: 2025-03-17T10:22:36.432Z (over 1 year ago)
- Topics: es6, javascript, snippets
- Language: JavaScript
- Homepage: https://phucbm.github.io/js-gist/
- Size: 16.6 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🩹 JavaScript Snippets
## Table of Content
- [Copy text to clipboard](/copy-text-to-clipboard.js)
- [Format datetime](/format-datetime.js)
- [Check is valid URL](/is-valid-url.js)
- [Responsive Object](/responsive-object.js)
- [Sort array of object by value](/sort-array-by-object-value.js)
- [String to slug](/string-to-slug.js)
- [Time Since](/time-since.js)
- [Generate unique ID](/unique-id.js)
## Usage
### Responsive Object v1.0.1 - [demo](/examples/responsive-object.html)
Return the correct setting object based on the current breakpoint using `matchMedia()`
```js
const config = {
screen: 'desktop',
color: 'white',
responsive: [
{
breakpoint: 1280,
settings: {
screen: '1280',
color: 'blue',
isTablet: true
}
},
{
breakpoint: 768,
settings: {
screen: '768',
}
}
]
};
new ResponsiveObject({
object: config,
onMatched: (data) => {
// do something
console.log('onMatched', data);
}
});
```