{"id":18751164,"url":"https://github.com/appzic/layout-css-modules","last_synced_at":"2026-01-30T01:03:58.818Z","repository":{"id":152511289,"uuid":"625104190","full_name":"appzic/layout-css-modules","owner":"appzic","description":"Layout made easy with CSS modules grid system inspired by Bootstrap","archived":false,"fork":false,"pushed_at":"2024-07-14T04:02:16.000Z","size":293,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-01-29T20:49:18.232Z","etag":null,"topics":["12-column","bootstrap-grid-system","css-layout","css-module","css-modules","flexbox-grid","flexbox-layout","mobile-first","responsive-layout","responsive-web-design"],"latest_commit_sha":null,"homepage":"https://appzic.com/open-source-projects/layout-css-modules","language":"CSS","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/appzic.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-08T04:44:45.000Z","updated_at":"2023-11-03T15:55:03.000Z","dependencies_parsed_at":"2024-11-15T22:31:40.750Z","dependency_job_id":"f2a1ed88-5d88-4dc4-b83e-9c17b149ebb3","html_url":"https://github.com/appzic/layout-css-modules","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appzic%2Flayout-css-modules","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appzic%2Flayout-css-modules/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appzic%2Flayout-css-modules/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/appzic%2Flayout-css-modules/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/appzic","download_url":"https://codeload.github.com/appzic/layout-css-modules/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241389166,"owners_count":19955107,"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":["12-column","bootstrap-grid-system","css-layout","css-module","css-modules","flexbox-grid","flexbox-layout","mobile-first","responsive-layout","responsive-web-design"],"created_at":"2024-11-07T17:14:43.124Z","updated_at":"2026-01-30T01:03:58.758Z","avatar_url":"https://github.com/appzic.png","language":"CSS","readme":"\u003cp align=\"center\"\u003e\n    \u003cimg alt=\"layout-css-modules logo\" src=\"./logo/layout-css-modules.jpg\"/\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eLayout CSS Modules\u003c/h1\u003e\n\n\u003cp align=\"center\"\u003e\u003cb\u003eLayout made easy with CSS modules grid system inspired by Bootstrap.\u003c/b\u003e\u003c/p\u003e\n\n\u003cp align=\"center\" style=\"align: center;\"\u003e\n    \u003ca href=\"https://www.npmjs.com/package/layout-css-modules\"\u003e\n        \u003cimg alt=\"npm\" src=\"https://img.shields.io/npm/v/layout-css-modules\"\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://www.npmjs.com/package/layout-css-modules\"\u003e\n        \u003cimg alt=\"npm\" src=\"https://img.shields.io/npm/dw/layout-css-modules\"\u003e\n    \u003c/a\u003e\n    \u003ca href=\"https://github.com/appzic/layout-css-modules/blob/main/LICENSE\"\u003e\n        \u003cimg alt=\"GitHub\" src=\"https://img.shields.io/github/license/appzic/layout-css-modules\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n## Table of Contents\n- [Table of Contents](#table-of-contents)\n- [Introduction](#introduction)\n- [Features](#features)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Contributing](#contributing)\n- [License](#license)\n\n\n## Introduction\nLayout CSS Modules is a mobile-first, twelve column system based on a flexbox layout, that takes advantage of CSS modules for simpler styling and maintenance, allowing you to easily create responsive layouts for your web applications inspired by Bootstrap.\n\n## Features\n- Mobile-first design approach\n- Based on a flexbox layout\n- Twelve-column grid system\n- Uses CSS modules for simpler styling and maintenance\n- TypeScript support for type checking and improved development experience\n- Encapsulation of CSS rules and styles to prevent conflicts\n- Reusable styles across components for consistent designs\n- Reduced duplicate code in your application\n- Improved performance through unique class names generated at build time.\n\n## Installation\n\nYou can install Layout CSS Modules using npm:\n\n```bash\nnpm install layout-css-modules\n```\n\n## Usage\n\n```astro\n---\nimport { container, row, col12, colXL4 } from \"layout-css-modules/index.module.css\";\n---\n\n\u003cdiv class:list={[container]}\u003e\n\t\u003cdiv class:list={[row]}\u003e\n\t\t\u003cdiv class:list={[col12, colXL4]}\u003eColumn\u003c/div\u003e\n\t\t\u003cdiv class:list={[col12, colXL4]}\u003eColumn\u003c/div\u003e\n\t\t\u003cdiv class:list={[col12, colXL4]}\u003eColumn\u003c/div\u003e\n\t\u003c/div\u003e\n\u003c/div\u003e\n\n```\n\n## Contributing\n\nWe welcome contributions from the community! Please take a look at our [CONTRIBUTING.md](https://github.com/appzic/layout-css-modules/blob/main/CONTRIBUTING.md) file for more information on how to get started. We appreciate all kinds of contributions, from bug reports and feature requests to code contributions and documentation improvements. Thank you for considering contributing to our project!\n\n## License\n\nLayout CSS Modules is licensed under the [MIT](https://github.com/appzic/layout-css-modules/blob/main/LICENSE) License.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fappzic%2Flayout-css-modules","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fappzic%2Flayout-css-modules","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fappzic%2Flayout-css-modules/lists"}