gridly/package.json

The minimal (~100-170 bytes) grid system for modern browsers.

{
  "name": "gridly",
  "version": "1.5.2",
  "description": "The minimal (~100-170 bytes) grid system for modern browsers.",
  "main": "lib/gridly.css",
  "unpkg": "dist/gridly.min.css",
  "directories": {
    "example": "example"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "release": "npm run dist && npm run prefixed",
    "dist": "npm run dist-main && npm run dist-widths && npm run dist-gutters && npm run dist-all",
    "dist-main": " uglifycss lib/gridly.css > dist/gridly-core.min.css",
    "dist-widths": "uglifycss lib/gridly-col-widths.css > dist/gridly-col-widths.min.css",
    "dist-gutters": "uglifycss lib/gridly-gutters.css > dist/gridly-gutters.min.css",
    "dist-all": "uglifycss lib/gridly.css > dist/gridly.min.css && uglifycss lib/gridly-col-widths.css >> dist/gridly.min.css && uglifycss lib/gridly-gutters.css >> dist/gridly.min.css",
    "prefixed": "npm run prefixed-main && npm run prefixed-widths && npm run prefixed-gutters && npm run prefixed-all",
    "prefixed-main": "postcss -u autoprefixer -c postcss.json lib/gridly.css | uglifycss > dist/prefixed/gridly-core.min.css",
    "prefixed-widths": "postcss -u autoprefixer -c postcss.json lib/gridly-col-widths.css | uglifycss > dist/prefixed/gridly-col-widths.min.css",
    "prefixed-gutters": "postcss -u autoprefixer -c postcss.json lib/gridly-gutters.css | uglifycss > dist/prefixed/gridly-gutters.min.css",
    "prefixed-all": "postcss -u autoprefixer -c postcss.json lib/gridly.css | uglifycss > dist/prefixed/gridly.min.css && postcss -u autoprefixer -c postcss.json lib/gridly-col-widths.css | uglifycss >> dist/prefixed/gridly.min.css && postcss -u autoprefixer -c postcss.json lib/gridly-gutters.css | uglifycss >> dist/prefixed/gridly.min.css"
  },
  "repository": {
    "type": "git",
    "url": "git+ssh://git@github.com/IonicaBizau/gridly.git"
  },
  "keywords": [
    "gridly",
    "grid",
    "css",
    "modern",
    "browsers"
  ],
  "author": "Ionică Bizău <bizauionica@gmail.com> (https://ionicabizau.net)",
  "contributors": [
    "Oliver Pattison <oliverpattison@gmail.com> (http://olivermak.es)",
    "Phoenix Enero <phoenix.enero@gmail.com> (http://github.com/phoenixenero)",
    "Burak Can <neoberg@gmail.com> (http://github.com/burakcan)",
    "Danny B <dani_bejan2000@yahoo.com> (https://github.com/csanonymus)",
    "Silviu Bogan <silviubogan@gmail.com> (https://lumea-lui-silviu.blogspot.ro)"
  ],
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/IonicaBizau/gridly/issues"
  },
  "homepage": "https://github.com/IonicaBizau/gridly#readme",
  "devDependencies": {
    "uglifycss": "0.0.18",
    "autoprefixer": "~6.1.2",
    "postcss-cli": "~2.3.2"
  },
  "blah": {
    "description": [
      {
        "p": "You don't need monolithic CSS frameworks for simple grid systems. ~100 bytes of CSS can save your life. :dizzy:"
      },
      {
        "h2": "Usage"
      },
      {
        "p": "In the [`dist`](/dist) directory there are three minified files:"
      },
      {
        "ul": [
          "`gridly-core.min.css` (105 B): just the Gridly core including same-width column support and mobile responsive support.",
          "`gridly-col-widths.min.css` (115 B): the custom width columns",
          "`gridly.min.css` (165 B): the previous two files' content put together"
        ]
      },
      {
        "p": "If you need to support more browsers, you can use the prefixed versions. They're located in [`dist/prefixed`](/dist/prefixed). They're ~1.8× the size of their counterparts."
      },
      {
        "h3": "Browser Support"
      },
      {
        "p": [
          "Gridly supports browsers that implement the Flexible Box Layout Module.",
          "As of December 2015, [browser support for flexbox](http://caniuse.com/#feat=flexbox) is 81.27% for unprefixed, and 95.44% for prefixed."
        ]
      },
      {
        "h2": ":rocket: Available on CDN!"
      },
      {
        "p": "Gridly is available on cdnjs.com. [**Check it out**](https://cdnjs.com/libraries/gridly)."
      },
      {
        "blockquote": [
          "https://cdnjs.cloudflare.com/ajax/libs/gridly/1.1.0/gridly-core.min.css",
          "https://cdnjs.cloudflare.com/ajax/libs/gridly/1.1.0/gridly-col-widths.min.css",
          "https://cdnjs.cloudflare.com/ajax/libs/gridly/1.1.0/gridly.min.css"
        ]
      },
      {
        "p": "If you do not need custom width columns, you will probably want to use only `gridly-core.min.css` in your page. If you do need the custom width columns, you have to include `gridly.min.css` instead."
      },
      {
        "h2": "Example"
      },
      {
        "p": "Include the CSS file in your page:"
      },
      {
        "code": {
          "language": "html",
          "content": "<link rel=\"stylesheet\" href=\"gridly.min.css\" type=\"text/css\" charset=\"utf-8\">"
        }
      },
      {
        "p": "Then you can use the `.row` and `.col` classes:"
      },
      {
        "code": {
          "language": "html",
          "content": [
            "<div class=\"row\">",
            "    <div class=\"col\">Two</div>",
            "    <div class=\"col\">Column</div>",
            "</div>"
          ]
        }
      },
      {
        "p": "This will create two columns having equal widths."
      }
    ],
    "documentation": [
      {
        "p": "The `gridly-core.min.css` file handles two classes:"
      },
      {
        "ul": [
          "`row`: the row containing columns",
          "`col`: the column to put in the row"
        ]
      },
      {
        "p": "Because of the flexbox amazing power, the columns will have the same width (as many columns you want / row)."
      },
      {
        "p": "To extend this basic functionality, there is another file: `gridly-col-widths.min.css`. This adds the following classes:"
      },
      {
        "ul": [
          "`col-tenth` has `10%` width",
          "`col-fifth` has `20%` width",
          "`col-quarter` has `25%` width",
          "`col-third` has `33.3333334%` width",
          "`col-half` has `50%` width"
        ]
      },
      {
        "p": "Like specified above, the `gridly.min.css` contains both: the core and the custom widths."
      }
    ],
    "contributing": [
      {
        "p": "Run `npm i` to install the dependencies. Then, you can run the npm scripts using `npm run <script-name>`."
      },
      {
        "p": "Run `npm run release` to recreate all the `dist` files."
      }
    ],
    "h_img": "http://i.imgur.com/kPrOESX.png",
    "ex_img": "http://i.imgur.com/m4pwrnO.png",
    "h_url": "http://ionicabizau.github.io/gridly/example/",
    "ex_url": "http://ionicabizau.github.io/gridly/example/",
    "usages": {
      "ul": [
        "[showalicense.com](http://showalicense.com/)–A site to provide an easy way to show licenses and their human-readable explanations. ([source](https://github.com/IonicaBizau/showalicense.com))"
      ]
    },
    "buy": "https://market.bloggify.org/2-gridly"
  },
  "files": [
    "bin/",
    "app/",
    "lib/",
    "dist/",
    "src/",
    "scripts/",
    "resources/",
    "menu/",
    "cli.js",
    "index.js",
    "index.d.ts",
    "package-lock.json",
    "bloggify.js",
    "bloggify.json",
    "bloggify/"
  ]
}