{"id":17225146,"url":"https://github.com/mikekovarik/flexus-next","last_synced_at":"2025-03-25T17:22:41.048Z","repository":{"id":100879096,"uuid":"160359190","full_name":"MikeKovarik/flexus-next","owner":"MikeKovarik","description":"👓 Multiplatform APP UI development framework","archived":false,"fork":false,"pushed_at":"2020-09-06T17:23:49.000Z","size":46079,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-30T15:16:02.345Z","etag":null,"topics":["fluent-design","framework","material-design","ui"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MikeKovarik.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,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2018-12-04T13:09:34.000Z","updated_at":"2022-12-27T14:39:07.000Z","dependencies_parsed_at":"2023-06-02T10:00:30.029Z","dependency_job_id":null,"html_url":"https://github.com/MikeKovarik/flexus-next","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MikeKovarik%2Fflexus-next","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MikeKovarik%2Fflexus-next/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MikeKovarik%2Fflexus-next/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MikeKovarik%2Fflexus-next/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MikeKovarik","download_url":"https://codeload.github.com/MikeKovarik/flexus-next/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245507658,"owners_count":20626647,"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":["fluent-design","framework","material-design","ui"],"created_at":"2024-10-15T04:12:51.400Z","updated_at":"2025-03-25T17:22:41.018Z","avatar_url":"https://github.com/MikeKovarik.png","language":"JavaScript","readme":"This is reimplementation of [flexus](https://github.com/MikeKovarik/flexus) ui framework which was an experiment back in time when Shadow DOM V1 wasn't finished, CSS Variables nor position:sticky were widely available and Fluent Design System \u0026 Material Design Language were just a rumours.\n\nThis repo tries to take the good parts of the experiment and build it into production ready app framework.\n\n## Warning. Work in progress, ugly code\n\n**TL:DR;** The code is crap because the framework is still under heavy development.\n\nIdeas come and go. Some are outlined, some prototyped, some even fully implemented. Most of them stick around and wait for polishing. `test/` directory is a melting pot of ideas of components, whereas examples `demos/` present how it could all works together in an actual app.\n\nThe examples are written more or less ugly, with a lot of inline styles and !important rules. That's because they are usually a quickly-put-together proof of concept and the `demos/` and `test/` files are in various stages of implementation or experimentation.\n\n## Demos\n\n\n\u003cimg align=\"right\" src=\"https://raw.githubusercontent.com/MikeKovarik/flexus-next/master/flexus-animations.gif\" width=\"300\"\u003e\n\nThere are some great demos, though not finished yet.\n\nNOTE: these demos aren't responsive yet and they don't scale well! They exist to showcase animations or to recreate certain existing app or concept. Plus the framework is still in development.\n\nAlso it's only been developed/tested in chrome for now.\n\n* [demos/venue.html](https://flexus-next.netlify.com/demos/venue.html) Phone only. Transition between two views with pivot.\n* [demos/google-photos/grid-detail.html](https://flexus-next.netlify.com/demos/google-photos/grid-detail.html)\n* [demos/cart/transition-overlap.html](https://flexus-next.netlify.com/demos/cart/transition-overlap.html) Phone only. Built vith vue.js\n* [demos/cart/transition-blend-all.html](https://flexus-next.netlify.com/demos/cart/transition-blend-all.html) Phone only. Built vith vue.js\n* [test/toolbar-collapsible.html](https://flexus-next.netlify.com/test/toolbar-collapsible.html) Showcase of various collapsible toolbars\n* [demos/google-translate.html](https://flexus-next.netlify.com/demos/google-translate.html) Recreation of Google Translate's website\n* [demos/material-music/albums.html](https://flexus-next.netlify.com/demos/material-music/albums.html) Full blown demo with transitions. Tablet mode only for now. Not responsive yet.\n* [demos/material-music/artists.html](https://flexus-next.netlify.com/demos/material-music/artists.html) Different portion of the music app. Showcases different transition animation.\n* [test/transition-img-practical.html](https://flexus-next.netlify.com/test/transition-img-practical.html) SHOWCASE OF IMAGE AIMATIONS !!!\n* [test/transition-collapsible-fab.html](https://flexus-next.netlify.com/test/transition-collapsible-fab.html) Collapsible FAB button.\n\nStatic mockups\n* [demos/shazam.html](https://flexus-next.netlify.com/demos/shazam.html) non-interactive mockup\n* [test/app-material-mail.html](https://flexus-next.netlify.com/test/app-material-mail.html) Tablet only. Inspired by Google's material mail concept\n* [test/grid.html](https://flexus-next.netlify.com/test/grid.html) Grids\n* [test/layout-flexbox.html](https://flexus-next.netlify.com/test/layout-flexbox.html) Flexbox layouts\n* [test/toolbar-floating.html](https://flexus-next.netlify.com/test/toolbar-floating.html) Floating toolbar\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikekovarik%2Fflexus-next","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmikekovarik%2Fflexus-next","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmikekovarik%2Fflexus-next/lists"}