{"id":28673197,"url":"https://github.com/ayoton/ayoflex","last_synced_at":"2025-10-30T21:09:22.857Z","repository":{"id":41176417,"uuid":"508546360","full_name":"ayoton/ayoflex","owner":"ayoton","description":"Advanced CSS layout utility library","archived":false,"fork":false,"pushed_at":"2023-07-18T05:55:43.000Z","size":53,"stargazers_count":7,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-02T21:03:49.161Z","etag":null,"topics":["advanced","css","flex","flexbox","layout","library","responsive","utility"],"latest_commit_sha":null,"homepage":"https://ayoflex.com","language":"SCSS","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/ayoton.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-06-29T04:35:32.000Z","updated_at":"2023-08-03T01:37:49.000Z","dependencies_parsed_at":"2022-09-10T03:23:00.415Z","dependency_job_id":null,"html_url":"https://github.com/ayoton/ayoflex","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayoton%2Fayoflex","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayoton%2Fayoflex/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayoton%2Fayoflex/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayoton%2Fayoflex/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ayoton","download_url":"https://codeload.github.com/ayoton/ayoflex/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ayoton%2Fayoflex/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":258828298,"owners_count":22763942,"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":["advanced","css","flex","flexbox","layout","library","responsive","utility"],"created_at":"2025-06-13T20:07:51.019Z","updated_at":"2025-10-30T21:09:17.813Z","avatar_url":"https://github.com/ayoton.png","language":"SCSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"### No more unnecessary container, negative margin-padding and extra divs to make gap between rows and columns.\n\n---\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://ayoflex.ayoton.com/\"\u003e\n    \u003cimg src=\"https://ayoflex.ayoton.com/ayoflex.png\" alt=\"Ayoflex logo\" width=\"216\" height=\"100\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n# Advanced CSS layout utility library\n\nAyoFlex is a modern open source CSS layout utility library based on `flex` layout module with twelve columns grid system to build mobile first responsive web interfaces. Ayoflex includes six default breakpoints known as responsive modifiers. These breakpoints can be customized using our source Sass file.\n\n## Documentation\n\n### You can find everything fully documented at the [Official Website](https://ayoflex.ayoton.com).\n\n## Installation\n\nTo use AyoFlex on your project, you can use the pre-compiled css file and also can install the scss files so that you can customize it by yourself.\n\n## Packages\n\nUse your favorite package manager to install AyoFlex\n\n### NPM:\n\n```bash\n$ npm install ayoflex\n```\n\nor\n\n```bash\n$ npm i ayoflex\n```\n\n### Yarn:\n\n```bash\n$ yarn add ayoflex\n```\n\n## Import ayoflex in your project\n\nTo import ayoflex in your project use the following code in your js file:\n\n```bash\nimport 'ayoflex';\n```\n\n#### or\n\n```bash\nimport 'ayoflex/dist/ayoflex.min.css';\n```\n\n\u003cbr\u003e\n\nAlso you can easily import style to your existing CSS/SCSS/SASS file:\n\n#### Import css in your stylesheet\n\n```css\n@import \"ayoflex/dist/ayoflex.min.css\";\n```\n\n#### or\n\n#### Import scss in your SASS file\n\n```scss\n@import \"ayoflex/src/ayoflex\";\n```\n\n## CDN\n\nYou can also add AyoFlex in your project from CDN:\n\n```html\n\u003clink\n  rel=\"stylesheet\"\n  href=\"https://unpkg.com/ayoflex@1.0.4/dist/ayoflex.min.css\"\n/\u003e\n```\n\nIf you don't need responsiveness you can install a lite version:\n\n```html\n\u003clink\n  rel=\"stylesheet\"\n  href=\"https://unpkg.com/ayoflex@1.0.4/dist/ayoflex-no-responsive.min.css\"\n/\u003e\n```\n\n---\n\n## Copyright and license\n\nCode and documentation copyright 2022 [Ayoton](https://ayoton.com). Code released under the [MIT License](https://github.com/ayoton/ayoflex/blob/main/LICENSE). Docs released under [Creative Commons](https://creativecommons.org/licenses/by/3.0/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fayoton%2Fayoflex","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fayoton%2Fayoflex","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fayoton%2Fayoflex/lists"}