https://github.com/mat3e/ux
Set of small components (HTML, CSS, JS) which should have a positive impact on the UX
https://github.com/mat3e/ux
Last synced: about 1 year ago
JSON representation
Set of small components (HTML, CSS, JS) which should have a positive impact on the UX
- Host: GitHub
- URL: https://github.com/mat3e/ux
- Owner: mat3e
- License: isc
- Created: 2017-05-01T18:00:20.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2023-01-07T17:46:48.000Z (over 3 years ago)
- Last Synced: 2025-07-05T00:08:12.370Z (about 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 1.05 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 27
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
[](https://lerna.js.org/)
# UX
Set of small Web Components which should have a positive impact on the web app UX.
[**demo**](https://mat3e.github.io/ux/)
## Components
* [m3-switch](https://github.com/mat3e/ux/tree/master/packages/switch)
* [m3-stars](https://github.com/mat3e/ux/tree/master/packages/stars)
### Inspirations
#### Ideas
- [clickable reactions](https://dev.to/binarforge/seven-useful-programming-habits) (e.g. with [Font Awesome](https://fontawesome.io/))
- highlighted text options - as [here](https://medium.com/@ttemplier/angular2-decorators-and-class-inheritance-905921dbd1b7)
- paragraph link - as [here](https://olingo.apache.org/doc/odata4/tutorials/action/tutorial_action.html#implement-an-action-processor)
- opening link in a new tab - option when `:hover` (extenstion for an anchor)
- estimated reading time - calculating as on [Medium](https://medium.com/@ttemplier/angular2-decorators-and-class-inheritance-905921dbd1b7); TL;DR option
- star rating (voting)
#### Nice libraries
- [Scrolline](https://github.com/anthonyly/Scrolline.js) - how much untill the end of the page
- [iziToast](https://github.com/dolce/iziToast) - perfect notifications
- [favico.js](https://github.com/ejci/favico.js) - whole new level of using favicons
## Roadmap
[] Minify published npm code and skip publishing *.spec.js files; publishing all-in version and modules separately
[] `m3-switch` as the checkbox extension?
[] Use JS private and static fields (when available in all the browsers). Or maybe just TypeScript?
[] [Form-associated custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-face-example); [another source](https://web.dev/more-capable-form-controls/)