{"id":20258545,"url":"https://github.com/m-spyratos/bootstrap-4-grid","last_synced_at":"2025-05-16T14:05:59.996Z","repository":{"id":16470489,"uuid":"80003491","full_name":"m-spyratos/bootstrap-4-grid","owner":"m-spyratos","description":"Bootstrap 4 grid system and layout utilities.","archived":false,"fork":false,"pushed_at":"2022-05-25T23:13:08.000Z","size":188,"stargazers_count":243,"open_issues_count":7,"forks_count":250,"subscribers_count":16,"default_branch":"master","last_synced_at":"2025-04-12T10:59:49.292Z","etag":null,"topics":["bootstrap","css-files","flex","grid","sass-files"],"latest_commit_sha":null,"homepage":"","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/m-spyratos.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":"2017-01-25T10:16:02.000Z","updated_at":"2024-09-05T11:17:04.000Z","dependencies_parsed_at":"2022-08-07T08:15:24.023Z","dependency_job_id":null,"html_url":"https://github.com/m-spyratos/bootstrap-4-grid","commit_stats":null,"previous_names":[],"tags_count":19,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/m-spyratos%2Fbootstrap-4-grid","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/m-spyratos%2Fbootstrap-4-grid/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/m-spyratos%2Fbootstrap-4-grid/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/m-spyratos%2Fbootstrap-4-grid/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/m-spyratos","download_url":"https://codeload.github.com/m-spyratos/bootstrap-4-grid/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254544146,"owners_count":22088807,"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":["bootstrap","css-files","flex","grid","sass-files"],"created_at":"2024-11-14T11:09:36.467Z","updated_at":"2025-05-16T14:05:54.986Z","avatar_url":"https://github.com/m-spyratos.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Bootstrap 4 Grid System (Flex)\n\nBootstrap v4.4.1 grid system and layout utilities.\n\n## What's Included\n\n* [Grid](https://getbootstrap.com/docs/4.4/layout/grid/)\n* [Layout Utilities](https://getbootstrap.com/docs/4.4/layout/utilities-for-layout/)\n\n## Why?\n\nHere's what you get that Bootstrap 4 currently doesn't provide out of the box:\n\n* [Grid Equal-Width Multi-Row](https://getbootstrap.com/docs/4.4/layout/grid/#equal-width-multi-row)\n* [Sizing Utility](https://getbootstrap.com/docs/4.4/utilities/sizing/)\n* [Display Utility](https://getbootstrap.com/docs/4.4/utilities/display/)\n* [Spacing Utility](https://getbootstrap.com/docs/4.4/utilities/spacing/)\n* [Visibility Utility](https://getbootstrap.com/docs/4.4/utilities/visibility/)\n* [Position Utility](https://getbootstrap.com/docs/4.4/utilities/position/)\n* [Text Utility](https://getbootstrap.com/docs/4.4/utilities/text/)\n* [Screen Readers Utility](https://getbootstrap.com/docs/4.4/utilities/screen-readers/)\n\nIf you don't need any of the above, Bootstrap 4 already includes a grid only version with its\n[Bootstrap CSS and JS](https://getbootstrap.com/docs/4.4/getting-started/download/#compiled-css-and-js) bundle.\n\n## How to Use\nSass and CSS files are ready to be used in your project.\n\n### CSS\n\nPretty straightforward.\nJust get `css/grid.min.css` or `css/grid.css` and add it to your project.\n\n### Sass\n\nYou will need to include the whole `scss` folder contents to your project.\nThen, just import `grid.scss` into your project's sass file.\n\n### NPM\n\n````\nnpm install bootstrap-4-grid\n````\n\n### Yarn\n\n````\nyarn add bootstrap-4-grid\n````\n\n## Browser Support\n\nWe use [autoprefixer](https://github.com/postcss/autoprefixer) to add prefixes to the `css` files.\nBy default, the last 2 versions for each major browser is supported. To change this, follow the customization\ninstructions bellow.\n\n__NOTE:__ Sass files do not include any browser specific prefixes. If you include them in your project,\nyou will need to use your own post css tool to add prefixes for different browsers. If you are using\n[Angular CLI](https://github.com/angular/angular-cli) though, then `autoprefixer` is included by default\nand you don't need to worry.\n\n## Grid Options\n\nThe grid options are located inside the `scss/grid.scss` file. If you are going to be using the sass files in\nyour project, changing those will suffice. If you are going to be using the CSS files, then you will need to\nchange the options and then compile. For more details, see the customization instructions bellow.\n\n__NOTE:__ If you are using the sass files and you want to avoid your options getting overridden by an update,\nthen copy and paste the options to your own sass file and include them before the `grid` file.\n\n## Customization\n\nYou can roll your own build and/or change browser support.\n\n### Requirements\n\n* [NodeJS](https://nodejs.org/en/)\n* [Grunt CLI](http://gruntjs.com/getting-started)\n* [Sass](http://sass-lang.com/install) (not required for changing browser support)\n\nThen install the dependencies:\n\n````\nnpm install\n````\n\n### Change Browser Support\n\nTo change the default browser support (last 2 versions currently), you will need to first change the query\nin the `browserlist` file, located at the root of this project. Read more about the\n[supported queries](https://github.com/ai/browserslist#queries).\n\nThen, run:\n\n````\ngrunt browser\n````\n\n### Change Grid Options\n\nOpen `scss/grid.scss` and change the [default options](https://getbootstrap.com/docs/4.4/layout/grid/#customizing-the-grid).\nThen, run:\n\n````\ngrunt\n````","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fm-spyratos%2Fbootstrap-4-grid","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fm-spyratos%2Fbootstrap-4-grid","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fm-spyratos%2Fbootstrap-4-grid/lists"}