{"id":25309318,"url":"https://github.com/aadityataparia/minimal-grid","last_synced_at":"2026-01-20T03:34:04.236Z","repository":{"id":180667756,"uuid":"118864547","full_name":"aadityataparia/Minimal-Grid","owner":"aadityataparia","description":"Simple and highly customizable grid for building column based responsive websites","archived":false,"fork":false,"pushed_at":"2019-01-29T03:59:54.000Z","size":77,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-02-13T12:54:14.906Z","etag":null,"topics":["css-grid","grid","grid-framework","responsive-grid","responsive-web-design"],"latest_commit_sha":null,"homepage":"https://aadityataparia.github.io/Minimal-Grid/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aadityataparia.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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,"publiccode":null,"codemeta":null}},"created_at":"2018-01-25T04:59:39.000Z","updated_at":"2020-06-17T12:49:29.000Z","dependencies_parsed_at":null,"dependency_job_id":"bdf81d2b-3566-41b0-b34c-19cab9a2c1f7","html_url":"https://github.com/aadityataparia/Minimal-Grid","commit_stats":null,"previous_names":["aadityataparia/minimal-grid"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadityataparia%2FMinimal-Grid","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadityataparia%2FMinimal-Grid/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadityataparia%2FMinimal-Grid/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aadityataparia%2FMinimal-Grid/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aadityataparia","download_url":"https://codeload.github.com/aadityataparia/Minimal-Grid/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247631832,"owners_count":20970069,"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":["css-grid","grid","grid-framework","responsive-grid","responsive-web-design"],"created_at":"2025-02-13T12:53:02.828Z","updated_at":"2026-01-20T03:34:04.198Z","avatar_url":"https://github.com/aadityataparia.png","language":"HTML","readme":"# Minimal-Grid\nSimple grid for building column based responsive websites\n\nIncludes sass, css and minified css. (0.5KB minified + gzipped)\n\nExamples at https://aadityataparia.github.io/Minimal-Grid/\n\n![Example](./static/minimal-grid.png)\n\n## How to use css (with default values)\n- Simple grid is based on 12 column based design, i.e. \\*-1 means 100/12% width, \\*-2 means 100*2/12% and so on..\n- To use grid, add `grid` class to parent element and s-\\*, m-\\* or l-\\* classes to children elements.\n- There are three types of grid classes\n  - s (used on small devices with device width \u003c 480px)\n  - m (used on medium devices with device width \u003c 960px and \u003e 480px)\n  - l (used on large devices with device width \u003e 960px)\n- mar-\\* are margin classes and applies\n  - mar-0: 0px margin\n  - mar-s: small margin (8px)\n  - mar-m: medium margin (16px)\n  - mar-l: large margin (24px)\n- pad-\\* are padding classes and applies\n  - pad-0: 0px padding\n  - pad-s: small padding (8px)\n  - pad-m: medium padding (16px)\n  - pad-l: large padding (24px)\n- b-1s is border class: applies `1px solid black` border\n- hide-on-s class applies `display: none` when s classes are applied\n- hide-on-m class applies `display: none` when m classes are applied\n- hide-on-l class applies `display: none` when l classes are applied\n- f-right class applies `float: right` on element\n- f-left class applies `float: left` on element\n\n## How to use sass\n\nsass file is highly configurable, most of the things are based on variables\n\n### Variables\n\n| Variable  | Description | Default Value |\n| ------------- | ------------- | ------------ |\n| $small-break | Breakpoint for small classes (s-\\*) | 480px |\n| $medium-break | Breakpoint for medium classes (m-\\*) | 960px |\n| $border-color | Border color for b-1s class | black |\n| $grid-size | Size of grid | 12 |\n| $small-prefix | Prefix for small classes | s |\n| $medium-prefix | Prefix for medium classes | m |\n| $large-prefix | Prefix for large classes | l |\n| $margin-prefix | Prefix for margin classes | mar |\n| $padding-prefix | Prefix for padding classes | pad |\n| $gaps | Map for margin and padding classes with suffix and values | (0: 0, s: 8px, m: 16px, l: 24px) |\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faadityataparia%2Fminimal-grid","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faadityataparia%2Fminimal-grid","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faadityataparia%2Fminimal-grid/lists"}