{"_id":"basscss-flexbox","_rev":"13-f4c27b81ed44bff5aee0a98ff98cd7f4","name":"basscss-flexbox","description":"Flexbox utilities","dist-tags":{"beta":"1.0.0-beta6","latest":"1.0.2"},"versions":{"1.0.0-beta1":{"name":"basscss-flexbox","version":"1.0.0-beta1","description":"Flexbox utilities","style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0-beta1","scripts":{},"_shasum":"dc2654ac4eb5864d7df9544ee840c2684a8b3cee","_from":".","_npmVersion":"3.3.6","_nodeVersion":"4.1.1","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"dc2654ac4eb5864d7df9544ee840c2684a8b3cee","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0-beta1.tgz","integrity":"sha512-coiqn2vF+e3RUqaNpuxa/xpUUiSuz39FRPRHo+HLVsQ+AqPhketOMzoo1gOy7zlbRcaA+o4MOmpVlc7N84vPhw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIB0aK+Kj9zXS9C8QgTTPN5Pk1IvdUsGTAm0fjcevQNyEAiBZgl6lIOsKNhjxNyHy0ff5qtWxgFkf+n42loWJLO3Ixw=="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"directories":{}},"1.0.0-beta2":{"name":"basscss-flexbox","version":"1.0.0-beta2","description":"Flexbox utilities","style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0-beta2","scripts":{},"_shasum":"6e62145f901cfffb13ee7bf4843fb1c5e96095aa","_from":".","_npmVersion":"3.3.6","_nodeVersion":"4.1.1","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"6e62145f901cfffb13ee7bf4843fb1c5e96095aa","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0-beta2.tgz","integrity":"sha512-LUX+77ZxJQ7eA4HVDF3nZ4+K1Lo53boN1h/0ceMjXz6a3Et8AFIa0DjeCTQqXeu0DlGDb7zucQe3wUUo3LI36g==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHOGEfFtn2TrkKhC70VQ5c5czbUrChxVkwE9BVbO7cVBAiEAnJeplITTRelx7zg6hkz7ez1J+uujgykoo+qp5XIYEpU="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-6-west.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.0-beta2.tgz_1454365982794_0.7731617589015514"},"directories":{}},"1.0.0-beta3":{"name":"basscss-flexbox","version":"1.0.0-beta3","description":"Flexbox utilities","style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0-beta3","scripts":{},"_shasum":"5ef318e1e80ed8b0c9fe7b9344c1993dcdf98a3a","_from":".","_npmVersion":"3.3.6","_nodeVersion":"4.1.1","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"5ef318e1e80ed8b0c9fe7b9344c1993dcdf98a3a","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0-beta3.tgz","integrity":"sha512-IsXGDERn6VFx25sqjEnFOQgPBDxczOppEFELVEnbUPQ11Nwpr42bMNdV2j8N+I41c5qspqAQw5wZdWf5xz2Z8w==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHoBnNd0vjD53A4ZL3rARP5DF16+jO5wZhJS0LbtBRsdAiAv5dOM4561spLP1ebF7N1Xy5C4sQ9qNpk2ls0tLOQ8rQ=="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-5-east.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.0-beta3.tgz_1454431966181_0.5120039831381291"},"directories":{}},"1.0.0-beta5":{"name":"basscss-flexbox","version":"1.0.0-beta5","description":"Flexbox utilities","style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0-beta5","scripts":{},"_shasum":"6941357dac6b283e6014e5dd2a5a0efa65ca15c0","_from":".","_npmVersion":"3.3.6","_nodeVersion":"4.1.1","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"6941357dac6b283e6014e5dd2a5a0efa65ca15c0","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0-beta5.tgz","integrity":"sha512-xBI2liIvZWUyDbAxWrlhh1o14Qm/eWgSdCY1nLirEz6IFOBI3hfaOPoFZWMO4Zw1BTrjHKJls1/G1/tWMTK6bA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICYpLjd83ya54fXwhqNiRGQIM0LQSvOChiQoGHVYj5f8AiBuBJCIw/YLOArB/26woAgRGEQMILhLplzuij4W4dLO1w=="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-5-east.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.0-beta5.tgz_1454513776334_0.684403310297057"},"directories":{}},"1.0.0-beta6":{"name":"basscss-flexbox","version":"1.0.0-beta6","description":"Flexbox utilities","style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0-beta6","scripts":{},"_shasum":"9d083a2ad9a78c12baed64e950bb5a67f8772f8d","_from":".","_npmVersion":"3.3.6","_nodeVersion":"4.1.1","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"9d083a2ad9a78c12baed64e950bb5a67f8772f8d","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0-beta6.tgz","integrity":"sha512-isGhIRvjyHsXdkqHA2Im+EdOt6FCU0kp2GXehgykh8i8Zfv45nFEeiaP6DZuxZVMDxT1NRPSrLbJUzJrnEUemA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBKSz8qbqsg94ki1n8Lkje6o6AakJucvMgedmYQEA2XIAiEA5WohKfV+VqeaX/A54xP3S82JL4DCrDX19e3LwhYKJ4k="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-6-west.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.0-beta6.tgz_1454706622935_0.45170652749948204"},"directories":{}},"1.0.0":{"name":"basscss-flexbox","version":"1.0.0","description":"Flexbox utilities","scripts":{"prepublish":"mkdir -p css && postcss index.css -u postcss-import -u postcss-custom-media -u postcss-custom-properties -u autoprefixer -o css/flexbox.css"},"devDependencies":{"autoprefixer":"^6.3.1","postcss-cli":"^2.5.0","postcss-custom-media":"^5.0.1","postcss-custom-properties":"^5.0.0","postcss-import":"^8.0.2"},"style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.0","_shasum":"849d6b6ceff8e8b154f33f99c79458092580e1bb","_from":".","_npmVersion":"3.6.0","_nodeVersion":"5.6.0","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"849d6b6ceff8e8b154f33f99c79458092580e1bb","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.0.tgz","integrity":"sha512-kDLRbP93DHZkzbt6WsPfecjf9F+S64dNHstPetk4lvb4Pj2/tpyOskZIATSStpoU8yVx1mjNgwVfZ62XGYt4VQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDy/4Btvi5T32Qghp9CDevFH/udzZbtQyqEl7Qt0lUZuAIgNN68wZv5yy7VBRfTJKT2SWcZYcmK8Vel81H+ea4Whb4="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-5-east.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.0.tgz_1455400907747_0.06612770748324692"},"directories":{}},"1.0.1":{"name":"basscss-flexbox","version":"1.0.1","description":"Flexbox utilities","scripts":{"prepublish":"mkdir -p css && postcss index.css -u postcss-import -u postcss-custom-media -u postcss-custom-properties -u autoprefixer -o css/flexbox.css"},"devDependencies":{"autoprefixer":"^6.3.1","postcss-cli":"^2.5.0","postcss-custom-media":"^5.0.1","postcss-custom-properties":"^5.0.0","postcss-import":"^8.0.2"},"style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.1","_shasum":"f64bc7607f97a7dfab74c1e011e1a77ad734f83a","_from":".","_npmVersion":"3.6.0","_nodeVersion":"5.6.0","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"shasum":"f64bc7607f97a7dfab74c1e011e1a77ad734f83a","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.1.tgz","integrity":"sha512-ZUiI6qThy82Pj4qmq87AVvr6cTkl6UEuQujAAPyybJ8JNPMnOAOMUOa5o8gdoBqm1VhdXQhui48GwGU4xE0gKg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIG4aKxfOXYwAxSeVlkvjoLyxM0ApIfU6dORXWJ+EaP71AiA6WbKacn7ST7redwZea7eXY1HyXMjFv8vjaWvQUzgCKg=="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"_npmOperationalInternal":{"host":"packages-5-east.internal.npmjs.com","tmp":"tmp/basscss-flexbox-1.0.1.tgz_1455556219637_0.23026208207011223"},"directories":{}},"1.0.2":{"name":"basscss-flexbox","version":"1.0.2","description":"Flexbox utilities","scripts":{"prepublish":"mkdir -p css && postcss index.css -u postcss-import -u postcss-custom-media -u postcss-custom-properties -u autoprefixer -o css/flexbox.css"},"devDependencies":{"autoprefixer":"^6.3.1","postcss-cli":"^2.5.0","postcss-custom-media":"^5.0.1","postcss-custom-properties":"^5.0.0","postcss-import":"^8.0.2"},"style":"index.css","author":{"name":"Brent Jackson"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"homepage":"https://github.com/basscss/basscss","_id":"basscss-flexbox@1.0.2","_npmVersion":"5.6.0","_nodeVersion":"8.1.2","_npmUser":{"name":"jxnblk","email":"jxnblk@gmail.com"},"dist":{"integrity":"sha512-AtG6yBmmza2nPo3x9X4/7rbW22gLmiSvYvirFs7Aspt1zp5FHwpRBz3BD2v/a3qPdmVM8OvOLVNWISGM6O50MA==","shasum":"0f85e8c50618c023c5cff1227e6b3538fc0d9a32","tarball":"https://registry.npmjs.org/basscss-flexbox/-/basscss-flexbox-1.0.2.tgz","fileCount":4,"unpackedSize":11489,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFS1n9m2KGB6d8uszY7wlhYaLfEz7VACQVLCKcfWPWA7AiEAqJQI2lgyB7rOUAHz1NnVb3WHewXxJX820K5mB6QemL8="}]},"maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/basscss-flexbox_1.0.2_1519263438561_0.6209268679774353"},"_hasShrinkwrap":false}},"readme":"\nThese flexbox-based utilities can replace the need for a grid system in many instances, and provide powerful constraint-based micro-layout solutions.\nTo learn more about the flexbox module, see [Using CSS flexible boxes](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes) and the [CSS Flexible Box Layout Module Specification](https://www.w3.org/TR/css-flexbox-1/).\n\nTo set a container to display flex, add the `.flex` class.\n\n```html\n<div class=\"flex\">\n  <div>Hamburger</div>\n  <div>Hot Dog</div>\n</div>\n```\n\nTo set a container to display flex at certain breakpoints, use the `.sm-flex`, `.md-flex`, and `.lg-flex` styles.\n\n```html\n<div class=\"sm-flex\">\n  <div>Hamburger</div>\n  <div>Hot Dog</div>\n</div>\n<div class=\"md-flex\">\n  <div>Hamburger</div>\n  <div>Hot Dog</div>\n</div>\n<div class=\"lg-flex\">\n  <div>Hamburger</div>\n  <div>Hot Dog</div>\n</div>\n```\n\nTo set a flexbox container to column direction, use `.flex-column`.\n\n```html\n<div class=\"flex flex-column\">\n  <span>Hamburger</span>\n  <span>Hot Dog</span>\n</div>\n```\n\nTo enable wrapping of flexbox containers, use `.flex-wrap`.\n\n```html\n<div class=\"flex flex-wrap\">\n  <div class=\"col-4\">Hamburger</div>\n  <div class=\"col-4\">Hamburger</div>\n  <div class=\"col-4\">Hamburger</div>\n  <div class=\"col-4\">Hamburger</div>\n  <div class=\"col-4\">Hamburger</div>\n</div>\n```\n\nTo set a flexbox item to automatically fill the available space, use the `flex-auto` utility.\n\n```html\n<div class=\"flex border\">\n  <div class=\"flex-auto border\">Hamburger</div>\n  <div class=\"border\">Hot Dog</div>\n</div>\n```\n\nTo prevent a flexbox item from growing or shrinking, use the `flex-none` utility.\n\n```html\n<div class=\"flex border\">\n  <div class=\"flex-none border\">Hamburger</div>\n  <div class=\"border\">Hot Dog</div>\n</div>\n```\n\nTo control alignment of flexbox items, use the `align-items` utilities. These styles uses a shorthand naming convention. `items` for the `align-items` property and `start` and `end` for the `flex-start` and `flex-end` values.\n\n```html\n<div class=\"flex items-start border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-end border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-center border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-baseline border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-stretch border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n```\n\nTo align flexbox items on an item-by-item basis, use the `align-self` utilities. These override values set by the `align-items` property. A shorthand naming convention of `self` for the `align-self` property is used.\n\n```html\n<div class=\"flex items-center border\">\n  <h1 class=\"self-start border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-center border\">\n  <h1 class=\"self-end border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-start border\">\n  <h1 class=\"self-center border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-center border\">\n  <h1 class=\"self-baseline border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex items-center border\">\n  <h1 class=\"self-stretch border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n```\n\nTo control the spacing for items on the main axis, use the `justify-content` utilities. These styles use a shorthand naming convention. `justify` for the `justify-content` property and `around` and `between` for the `space-around` and `space-between` values.\n\n```html\n<div class=\"flex justify-start border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex justify-end border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex justify-center border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex justify-between border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n<div class=\"flex justify-around border\">\n  <h1 class=\"border\">Hamburger</h1>\n  <div class=\"border\">Hot Dog</div>\n</div>\n```\n\nTo align items along the cross-axis, use the `align-content` utilities. A shorthand naming convention `content` is used for the `align-content` property.\n\n```html\n<div class=\"flex flex-wrap content-start border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\n```html\n<div class=\"flex flex-wrap content-end border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\n```html\n<div class=\"flex flex-wrap content-center border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\n```html\n<div class=\"flex flex-wrap content-between border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\n```html\n<div class=\"flex flex-wrap content-around border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\n```html\n<div class=\"flex flex-wrap content-stretch border\" style=\"min-height: 128px\">\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n  <div class=\"col-6 border\">Hamburger</div>\n</div>\n```\n\nTo change the order of flexbox items, use the `order` utilities.\n\n```html\n<div class=\"flex\">\n  <div class=\"order-2\">.order-2</div>\n  <div class=\"order-1\">.order-1</div>\n  <div class=\"order-last\">.order-last</div>\n  <div class=\"order-3\">.order-3</div>\n  <div class=\"order-0\">.order-0</div>\n</div>\n```\n\n","maintainers":[{"name":"jxnblk","email":"jxnblk@gmail.com"}],"time":{"modified":"2022-06-13T04:23:15.804Z","created":"2015-12-19T16:39:48.531Z","1.0.0-beta1":"2015-12-19T16:39:48.531Z","1.0.0-beta2":"2016-02-01T22:33:05.281Z","1.0.0-beta3":"2016-02-02T16:52:47.381Z","1.0.0-beta5":"2016-02-03T15:36:17.661Z","1.0.0-beta6":"2016-02-05T21:10:25.434Z","1.0.0":"2016-02-13T22:01:49.761Z","1.0.1":"2016-02-15T17:10:21.931Z","1.0.2":"2018-02-22T01:37:18.626Z"},"homepage":"https://github.com/basscss/basscss","repository":{"type":"git","url":"git+https://github.com/basscss/basscss.git"},"author":{"name":"Brent Jackson"},"bugs":{"url":"https://github.com/basscss/basscss/issues"},"license":"MIT","readmeFilename":"README.md"}