{"id":15022317,"url":"https://github.com/mat3e/ux","last_synced_at":"2025-07-21T04:32:32.098Z","repository":{"id":20451435,"uuid":"89948424","full_name":"mat3e/ux","owner":"mat3e","description":"Set of small components (HTML, CSS, JS) which should have a positive impact on the UX","archived":false,"fork":false,"pushed_at":"2023-01-07T17:46:48.000Z","size":1105,"stargazers_count":2,"open_issues_count":27,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-05T00:08:12.370Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"isc","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mat3e.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-01T18:00:20.000Z","updated_at":"2020-05-09T17:33:52.000Z","dependencies_parsed_at":"2023-01-11T20:51:07.444Z","dependency_job_id":null,"html_url":"https://github.com/mat3e/ux","commit_stats":null,"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"purl":"pkg:github/mat3e/ux","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mat3e%2Fux","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mat3e%2Fux/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mat3e%2Fux/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mat3e%2Fux/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mat3e","download_url":"https://codeload.github.com/mat3e/ux/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mat3e%2Fux/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266240857,"owners_count":23898062,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-09-24T19:57:47.126Z","updated_at":"2025-07-21T04:32:32.065Z","avatar_url":"https://github.com/mat3e.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![build](https://github.com/mat3e/ux/workflows/Node.js%20CI/badge.svg)\n[![lerna](https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg)](https://lerna.js.org/)\n\n# UX\nSet of small Web Components which should have a positive impact on the web app UX.\n\n[**demo**](https://mat3e.github.io/ux/)\n\n## Components\n* [m3-switch](https://github.com/mat3e/ux/tree/master/packages/switch)\n* [m3-stars](https://github.com/mat3e/ux/tree/master/packages/stars)\n\n### Inspirations\n\n#### Ideas\n- [clickable reactions](https://dev.to/binarforge/seven-useful-programming-habits) (e.g. with [Font Awesome](https://fontawesome.io/))\n- highlighted text options - as [here](https://medium.com/@ttemplier/angular2-decorators-and-class-inheritance-905921dbd1b7)\n- paragraph link - as [here](https://olingo.apache.org/doc/odata4/tutorials/action/tutorial_action.html#implement-an-action-processor)\n- opening link in a new tab - option when `:hover` (extenstion for an anchor)\n- estimated reading time - calculating as on [Medium](https://medium.com/@ttemplier/angular2-decorators-and-class-inheritance-905921dbd1b7); TL;DR option\n- star rating (voting)\n\n#### Nice libraries\n- [Scrolline](https://github.com/anthonyly/Scrolline.js) - how much untill the end of the page\n- [iziToast](https://github.com/dolce/iziToast) - perfect notifications\n- [favico.js](https://github.com/ejci/favico.js) - whole new level of using favicons\n\n## Roadmap\n[] Minify published npm code and skip publishing *.spec.js files; publishing all-in version and modules separately\n\n[] `m3-switch` as the checkbox extension?\n\n[] Use JS private and static fields (when available in all the browsers). Or maybe just TypeScript?\n\n[] [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/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmat3e%2Fux","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmat3e%2Fux","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmat3e%2Fux/lists"}