{"_id":"@desinax/vertical-grid","_rev":"7-3df5a13189aebed7e145c57cb5262966","name":"@desinax/vertical-grid","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.2":{"name":"@desinax/vertical-grid","version":"1.0.2","description":"LESS/SASS vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"e86ddaabca15c51f99da34592f374ebdc2f56773","_id":"@desinax/vertical-grid@1.0.2","_npmVersion":"5.6.0","_nodeVersion":"8.9.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-Ol2b1c6qsMHB+ai0dihWdwWK8vMklKNDz08gTziJnOirbAYG9Mn5uDMOe/8kJzOf7Kplvz53Y1Hu8JhQZ7bZUw==","shasum":"e95b97a1c1c7bad03715d8d42776e09c9e7ad622","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.2.tgz","fileCount":17,"unpackedSize":24790,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa0n7ECRA9TVsSAnZWagAAfNsP/1wH4LSEqxqOD1aoxNAp\nI42rXqW4kn2dCiCblgQMaspiwIAlcE8dgqpnZcVM/AnoDb9wR8xbO5viGBRr\nXPPVsVlJehkZGJrH2prV6e8JGiW3hPpzSfshygxQkzu0tAkwB3d4vFPkGwqM\nh3JgZgOpjKdbC4b0oovw3gGj8xM1uvDcN4xtnXfKyf/BOtxEz8BMKFTc/twB\nSJnYgLOTcaUraet2sk4oOtUDgVboEQ3j/C81WFN84VoFg7MbvdiKp7gY6ZXf\nxnVCqHj/HX7rNb+eD+5odDhLRoshqXJSXyvidYUi+dPn5cqOIzrdn1u+/q2S\nPotqgAo9xRZr8z6QFKKOe4GsQxF+TJ2IkLTRE+ttKZxbPJotYGBpaLOTaxwR\nwEzhU+zyHYkhooWe9Uf17bf9dOYozot0aqdi23Cxolz990U5802klTq52ixe\n86pvuVux3TAyOefZnd8ujEAD/mbLYRnR+DYWoiqm+8F5izU1KY56c7iZ2ahO\ns4qav+leqiGSmWionCDL+W1fpFL0AdLgv0K3/GyVF/9eceSLYQlmPwFh6C/q\nfQJIvBZdpYOsfSWzM9K/ZrEQ5F6KOWQk8ME3clAuYAJ3RafhK3PBfvfE7U1x\nTgWz4i8Iu4Z39p9AfL/oADzVQS5PZdJAJbkfSTAZs4gyuilI3gF0wVJz8d4w\nCk0M\r\n=NCqR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE2NGHBy2jyN5rGBgykrY3i8ktxBIr/aQo/0e1wG3EBdAiAON00OHvt9z+FTkWWNQ0mkoPP47pFx4NxvHvqoPOeXWQ=="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.2_1523744451787_0.1487325411674456"},"_hasShrinkwrap":false},"1.0.3":{"name":"@desinax/vertical-grid","version":"1.0.3","description":"LESS/SASS vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"b18a5c04a51c7789905be3cf7ddca6970a4e9b44","_id":"@desinax/vertical-grid@1.0.3","_npmVersion":"5.6.0","_nodeVersion":"8.9.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-rIXD0rkDKuiwEe4YPQs9LcsrK7LIi6SQoMICdFRWGCK/0sGbf1R/d0GBOXHKZNsW7aj6AR/yIQLWRPdbnGVe3w==","shasum":"2d89a47f530138fff9bf900ccc163e06eace39b0","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.3.tgz","fileCount":17,"unpackedSize":25051,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa0oPKCRA9TVsSAnZWagAAEvcQAJSlqtS6BSQB/bfvnm4z\nxPtyszdDcZGcRg7GS4y67ET6EC1Y0zDq1kiyEi1o9b0erou+3vltEksk075k\nrDi8LJ+OSnQRW1/3+VI5U5MmgmcODFPe+zywrIAf6sFUJHuTRD/zXNOhuKKK\nhPqcaOl8bzX94u+ypApU6jp2390M3Pyd2t+xdryK1Nr3OoEzGkS8TUeGgZLu\ncTHFeHFVhUiIPpC91N8DrO31SKXTnZsQToUrLSGSYH4Qv/+4t6DW8DLgtr7Y\nUe9LJw4d89kfoLq/Z+pOe/yWiusSG7yjnHyqtUX8pFz0nzG6EM9qNldE42bF\nd4Yv9p5HgvfS0jPrNx8AE6BpGmhDxrfaI/iQ39L+Q5xlA17yFjJFMta8nLRt\nOiGLfbqtiZbHYppWha/uyPUnnOjgeUnWHFiZzoJS3FWHMff5wXtPE5ieG/ZC\nvQnzBgvlZPqzjN/UvrgpAMK+0hFiZFEgHFuID7qI6355Yl+5Io91dePBfbjk\nU0whZQUazMdtPl2W69FXhcCDdHxjNoWrKx4PfnZsyDewaay/VmqQfx+cpIp/\njDpTpWtgGHN0WaKTiqAZhQf/HZ2bq5GmfikU0Z3A/Ghg0tT/y3bq8k36ph7Y\nbUO+6T4it6hrS1BVOGclrCApW4vVrGAQmrb7w1RR2RHeW2edu0XKgEgTfTSM\nSXiU\r\n=reoX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFPYcCf7PrkZmNAe0Ex77a+G+KkUoLjZDYmjq7ShrS0YAiEA73fvDBJeCe1A778jBtPwR2fbVrWwIbPg4AxOKB+WJCc="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.3_1523745737492_0.12691053221043402"},"_hasShrinkwrap":false},"1.0.4":{"name":"@desinax/vertical-grid","version":"1.0.4","description":"LESS/SASS vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"b18a5c04a51c7789905be3cf7ddca6970a4e9b44","_id":"@desinax/vertical-grid@1.0.4","_shasum":"414ce5df7506da1ed0c1aa2d0bb35c6173c89790","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"shasum":"414ce5df7506da1ed0c1aa2d0bb35c6173c89790","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.4.tgz","integrity":"sha512-1LeEKOAsKehNr0gUhzde+IOXMnzL80t3tgx/KixOTeAz6w66dAsLpydciuSD2WhmJnDCUFxDqEiSJS3SWC1YhA==","fileCount":19,"unpackedSize":190489,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFnTmTjsyCsnROvczgsTEq1jwdJczItM70eMT5azze4hAiA1Hz64ZW3P91iTT179MLJqOJyyp8BQ557PQwsXCPVlOw=="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.4_1538666074071_0.3034049438314428"},"_hasShrinkwrap":false},"1.0.5":{"name":"@desinax/vertical-grid","version":"1.0.5","description":"LESS/SASS vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"da9e31edba8d9b4373db8449e7ad826f5031a261","_id":"@desinax/vertical-grid@1.0.5","_npmVersion":"5.6.0","_nodeVersion":"8.11.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-VZLnlSJ8Go+NTwLaYTiun0arwrbj9/6hjVShqLRubBLXPJr+qbwG1CmOHzfnjgHpTNahVi7qcOi9ZrhCyFbkIA==","shasum":"c633d5034a58d50c9c68050f8ac4d1fe4d55675f","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.5.tgz","fileCount":17,"unpackedSize":25708,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICPm3bZFvj+7yz4bfRb9WOM6sTjUA7hmyd6B3xKdbHFvAiAm2j0wxstmPZuDmN8GW+YO4xKBU0zU65F57KInCzpoaQ=="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.5_1538726351730_0.5074139300075977"},"_hasShrinkwrap":false},"1.0.6":{"name":"@desinax/vertical-grid","version":"1.0.6","description":"Desinax LESS/SASS module for vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"0642107b9bdc144d3de554889b823908bb9e67e1","_id":"@desinax/vertical-grid@1.0.6","_npmVersion":"5.6.0","_nodeVersion":"8.11.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-0fFbBKwWFWdq0/8+DRuD/phKB8XkmLZQH5JJmoqdchHWXlWYYtj8tOSUYH3X+ggXAihuNErCtfwug/OTEKJXWQ==","shasum":"139c1c4f9e07c90e28624a84f6638ceecf6b6bf3","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.6.tgz","fileCount":23,"unpackedSize":27545,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbtyKjCRA9TVsSAnZWagAAnRIP/i+K3Hr7EqGlNeS9/aRT\nMg7kZJng/eqX6loTDkurPiMfn/9DF6UHhs8qUZ9++KbGgum8AxI0l8Z4Ju+6\nig6psmM5MDeUDcB/CdtWsEBnXTIKoAiswN/nWDeZODcj59zxWuFQIJy1jDBz\nI/Ogb7ojvH88lZ2Fmc06/JLrS1MNurVmmr3deMQwy54AUtVA2j0Upem7yOOg\n6ampbXNeqNRIDl5eJlzBZ5YX8PB18NZ44ll0LRq8D9UVZtLOUIKEMaWRdciK\ngpOO4U8PcuutedbsRAT6oilLxWY29wjekQS7pVvWL0rNnWknnke4bhQZT3wz\nd5mV7RepWcqV/VhEalRelcqS6+TYI2YoYm9vDEfCQx5lbN/2yozeIbhQNDTi\nSK7lxtxzKNtiJiEmDFNKladiEpKIMVDOekux/a0VRMvC8xyw8f3oRGHwHRd+\nCmdHt2tpLasg4liMBiKgTgusbWaeqPCrSw087iORiQTvvwz7qvxm2LthgLaj\n7teTRs8T9d+G8fsusyNjhDHEInYdFLUZTcCBvxBqzGbbp6Xm94z9HwvhMlyP\nbtD5hvS6v/5fn0IksjPlOPvdDi3GBHx1bEuVc409TNv2KwNi8CohnrcrwKfv\nQWTTxoUEpU9qpMA9c7yOGmmDS4iGIwLxqlM+7kETHwlHQm/Yh2Sy74A4TEqN\nBq+U\r\n=GhLs\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICuH9IGh+Jax+SlFm8z1/3H0XfsTwXv2fUiyFYydh103AiEAtB7Cv21reYYVvo6Z6BZ7o1svhDeD1fOT44BwPYZy3v0="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.6_1538728610519_0.5115258485776619"},"_hasShrinkwrap":false},"1.0.7":{"name":"@desinax/vertical-grid","version":"1.0.7","description":"Desinax LESS/SASS module for vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.1.11","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.2.0"},"gitHead":"1ca76594f1d47166795b80812287fbd7270576b1","_id":"@desinax/vertical-grid@1.0.7","_npmVersion":"5.6.0","_nodeVersion":"8.11.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-wj0s2E2ruunNgOHybg8X9d8ByhHM1gFiLWb6orvLELs+7G6D4fv1EjV7004e6IPwJhQ5hRAqhyiNltdG6R3XKA==","shasum":"f4ffd039019adb53747e0ede40234e666a1e16df","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.0.7.tgz","fileCount":23,"unpackedSize":27825,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbt4vCCRA9TVsSAnZWagAA3hAP/jq1n2rZoGgFWptwbuyh\nr/8ClMg3MKpcurPK/weqH1MIG12PElZLAWLwedONfvUpF1wO1QSuPPJdyJVj\n/AcqVs5PTGjorltc9NF7qwSdbcYWf8DccMQee+RSvj8uycV0g9t1miF4x9f9\n0b3RtpYTZYyyLcBRsoqt4k+fY5yrZ9DlPeaOGAlQOpxjazxEGX3mLhtMvqGc\n946/2It8i+AgNvU1nz9aP16TjxRQh8bqO36RsAeqBrb0F/zMgCaXVofsMxkL\n00zO+DbCLI4PxNRbUW8AtshVeKxZ5jS94d45fvrxRJKM23aPhbFybewEjrHT\nXuMEOad/TOHZmEQGYZW8Hb0fHZaRLnvzkg5JMZycsy6tVTpDWB8HyS0yfC2W\nzaRphtWSg1QvUo5ev4EKGFzpyoPqpd/gM+R+CRPljMoZzNu5ie+oQNpzU4cN\nZcaHXLJeOCy6BV7MZSYPh8OHomq65trcHlw2gcYaZu+sZ/wbZGC8cJ0oN5hs\nYwJT4KnxdnHEkdU7MPDexfMYqAvto3E2jSm6x8Bi5yUTjxFPwzeWCn4zLuQO\nzGqkTKEggk5XhalxwqLv6U9rWdp2IHFqRz4ChvmQP2eHO2L0yHzzGWTG2OnW\nW4m1BihG2MvaJOPFLKWRGQ2FlNbhMJ30LLKsVvvLAqhrMw/X+KWtdC+37qTl\np5hm\r\n=hNfQ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDyGJsMRGwKnJf/Vph7VQJPHfoApx85aXKsTKmOviZkhwIgXY4VsiwmpsaT0AiCdTwzi/THOhvQkfPedFGB0EuaHwc="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.0.7_1538755522257_0.33812286414989656"},"_hasShrinkwrap":false},"1.1.0":{"name":"@desinax/vertical-grid","version":"1.1.0","description":"Desinax LESS/SASS module for vertical grid","main":"null","scripts":{"test":"make test"},"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"keywords":["less","sass","style","grid"],"author":{"name":"Mikael Roos"},"license":"MIT","bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"homepage":"https://github.com/desinax/vertical-grid#readme","devDependencies":{"clean-css":"^4.2.1","css-styleguide":"^0.9.6","eslint":"^4.19.1","less":"^2.7.1","less-plugin-clean-css":"^1.5.1","stylelint":"^9.6.0"},"gitHead":"9079b9a5967caf83f99a7103a0a6f4a334fe985c","_id":"@desinax/vertical-grid@1.1.0","_npmVersion":"5.6.0","_nodeVersion":"8.9.4","_npmUser":{"name":"mosbth","email":"me@mikaelroos.se"},"dist":{"integrity":"sha512-sSZBRDierqX9/pT7r7LP1Jrc8SUimB7UvqCzl3RjP0tTPjSaW7ntt3nWBI4/VacJdw+iIvuNMhdHxT2YbunfMg==","shasum":"dcff3d9713e11628817559ddc5688f85d02b2465","tarball":"https://registry.npmjs.org/@desinax/vertical-grid/-/vertical-grid-1.1.0.tgz","fileCount":66,"unpackedSize":391317,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb0I8bCRA9TVsSAnZWagAAGagP/jNxWRk1+AJY14FbA/tK\n7g3NuKutjbC2MCIVe0Ihf+oWdiE2m0HKUSD/SimolOVtMq/MGHobatgyOAZ2\nlDvXjHnY0bFHWNng88BorjpLAOYt1DE0hkqhOWhD92vlo7tF2i2e2ibj4yIa\nruRv+JnTY63G8JPtoS25WmYC8uZI0VICd780pU6bY46fNtf/uupk4Gv6/oTH\n2J8EeQbwG4DtZS42jWlIasJPPY0B0pM2OxImPbmrikgTQB9RDp7I0MpDUV9O\noVwLxLr2W1vOzSkd3yzmLKB8dJjbswNQJ2kxHvxUJJv9vERKiyX5CuIqrsLs\nA50biQQEKiVXCh3lUorKrT2gzm70zPnSplgYpPfsD0xvgHuiOipU9/4pEBnY\nM38wXyuZ/YYI5qtOwwlfSXCa9GZ8sec7Wa+7gmpLswzfsGnZfP6Q6VZea8JY\nUZbSUyWKq39vHI6kNMUEROniXFDapWNPTe6mb7tv+33QSTDoJVumwPJA4S55\nxDMCmUOgrEE/x+8eldXb9lemA1t0G8JN53iWDKUwb49ZwQn0sJ/I6386QgP/\nB8C0CjyiRg4VNk321vvGp7WI4HKu0LX2l15mw6JPmRMNSdYKg58mIbRCqcF1\nNKBB7nLld6vr9aUNBr5Btrjv4+0X5Zejg1tklNgDRPayftLdPQQYnC13rgVD\nrf54\r\n=ozii\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAUWUT0KMzlzuQ/HQ7O/ah4BznzKUQhiRQg7yxXoVpm4AiEAlfSArZaQ0kgVXF+Xp9xkfA7VmGkrAhf+XDCErNk+3V4="}]},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vertical-grid_1.1.0_1540394778597_0.9656222223809932"},"_hasShrinkwrap":false}},"time":{"created":"2018-04-14T22:20:51.732Z","1.0.2":"2018-04-14T22:20:51.955Z","modified":"2022-04-05T04:00:00.281Z","1.0.3":"2018-04-14T22:42:17.577Z","1.0.4":"2018-10-04T15:14:34.341Z","1.0.5":"2018-10-05T07:59:11.845Z","1.0.6":"2018-10-05T08:36:50.746Z","1.0.7":"2018-10-05T16:05:22.382Z","1.1.0":"2018-10-24T15:26:18.788Z"},"maintainers":[{"name":"mosbth","email":"me@mikaelroos.se"}],"description":"Desinax LESS/SASS module for vertical grid","homepage":"https://github.com/desinax/vertical-grid#readme","keywords":["less","sass","style","grid"],"repository":{"type":"git","url":"git+https://github.com/desinax/vertical-grid.git"},"author":{"name":"Mikael Roos"},"bugs":{"url":"https://github.com/desinax/vertical-grid/issues"},"license":"MIT","readme":"Desinax Vertical Grid (LESS)\n===============================\n\n[![npm version](https://badge.fury.io/js/%40desinax%2Fvertical-grid.svg)](https://badge.fury.io/js/%40desinax%2Fvertical-grid)\n[![Join the chat at https://gitter.im/desinax/vertical-grid](https://badges.gitter.im/desinax/vertical-grid.svg)](https://gitter.im/desinax/vertical-grid?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)\n\n[![Build Status](https://travis-ci.org/desinax/vertical-grid.svg?branch=master)](https://travis-ci.org/desinax/vertical-grid)\n[![CircleCI](https://circleci.com/gh/desinax/vertical-grid.svg?style=svg)](https://circleci.com/gh/desinax/vertical-grid)\n\nLESS module implementing a semantic, fluid and responsive vertical grid with options for max width.\n\nThe grid is meant to be applied using mixins, without fixed grid classes applied to the html. But those who prefer fixed css-classes, like `.column-3`, can adapt the grid and add style with that type of classes.\n\nThe basics for the grid is to wrap columns in rows and apply a max-width for each row.\n\nThis is how a testpage can look like when using the grid.\n\n![With showgrid](doc/img/showgrid.png)\n\n\n\nTable of content\n-------------------------------\n\n* [Documentation online](#documentation-online)\n* [Install](#install)\n* [About grid.less](#about-gridless)\n* [Configure grid.less](#configure-gridless)\n* [Using grid.less](#using-gridless)\n * [Prepare with HTML](#prepare-with-html)\n * [Style the row](#style-the-row)\n * [Style the columns](#style-the-columns)\n * [Grid wrapper](#grid-wrapper)\n * [Responsive grid](#responsive-grid)\n * [Show the grid](#show-the-grid)\n * [Avoid styling the grid row or grid column](#avoid-styling-the-grid-row-or-grid-column)\n* [More examples on usage](#more-examples-on-usage)\n* [History](#history)\n* [License](#license)\n\n\n\nDocumentation online\n-------------------------------\n\nYou can read this README and try out the example files `htdocs/*.html` by using GitHub Pages.\n\n* [GitHub Pages README](https://desinax.github.io/vertical-grid/).\n* [GitHub Pages examples in htdocs/](https://desinax.github.io/vertical-grid/htdocs).\n\nViewing this documentation on GitHub Pages makes it easier to both read this documentation and try out the examples on the same time.\n\n\n\nInstall\n-------------------------------\n\nYou can install using npm to take advantage of version management. Semantic versioning is used to label the various versions.\n\n```text\nnpm install @desinax/vertical-grid\n```\n\nOr clone this repo and use it as is.\n\n\n\nAbout grid.less\n-------------------------------\n\nThe actual grid is in [`src/less/grid.less`](src/less/grid.less).\n\nUse it by importing it into your own stylesheet, adapt the path to your own environment.\n\n```less\n/**\n * Import the vertical grid.\n */\n@import \"less/grid.less\";\n```\n\n\nConfigure grid.less\n-------------------------------\n\nYou can choose between a flex and a float implementation of the grid.\n\nYou can set up the grid width of the columns, the gutter and the number of columns.\n\nThe following are the same as the defaults which you can override to fit your own environment and liking.\n\n```less\n/**\n * Import the vertical grid.\n */\n@import \"less/grid.less\";\n\n// Default grid, change to fit your requirements.\n@columnWidth: 30;\n@gutterWidth: 10;\n@columns: 24;\n@gridType: \"float\"; // \"flex\"\n```\n\n\n\nUsing grid.less\n-------------------------------\n\nThis is how you can use and implement the grid into your own style. The example code can be tested by pointing a browser to [`htdocs/float.html`](htdocs/float.html) ([Less source](src/less/test_grid_float.less)). An equal example using \"flex\" is available in [`htdocs/flex.html`](htdocs/flex.html) ([Less source](src/less/test_grid_flex.less)).\n\n\n\n### Prepare with HTML\n\nPrepare your html code with some divs, some are really needed by the grid and some are useful for general styling together with the grid.\n\n```html\n
\n
\n
header1
\n
header2
\n
\n
\n\n
\n
\n
flash
\n
\n
\n\n
\n
\n
sidebar-left
\n
main
\n
sidebar-right
\n
\n
\n\n
\n
\n
footer
\n
\n
\n```\n\nAny columns must be wrapped in a div which we call \"row\". I prepared my html with a div that is wrapping all the columns. I gave it a class `.row` to make it easy to style all rows.\n\n\n\n### Style the row\n\nI style the rows, to prepare them to contain grid columns.\n\n```less\n.row {\n #desinax-vgrid.row();\n background-color: #0f0;\n margin-bottom: 12px;\n}\n```\n\nThe mixin `#desinax-vgrid.row();` sets the display, width and margins for left and right, do not overwrite them.\n\nFor now the testpage might look like this.\n\n![Row only](doc/img/row-only.png)\n\n\n\n### Style the columns\n\nI have some columns in my testpage. They all need to be styled as a columns to get a width and left/right margin. They also get a style of display/float or flex, depending on the type of grid you are using. Do not overwrite those properties.\n\nThis is how I can add grid style to the columns.\n\n```less\n.header1,\n.header2 {\n #desinax-vgrid.column(@columns / 2);\n}\n\n.flash {\n #desinax-vgrid.column(@columns - 4);\n #desinax-vgrid.push(2);\n}\n\n.sidebar-left,\n.sidebar-right {\n #desinax-vgrid.column(@columns / 4);\n}\n\n.main {\n #desinax-vgrid.column(@columns / 2);\n}\n\n.footer {\n #desinax-vgrid.column(@columns);\n}\n```\n\nEach row can have at most `@columns` column in it, otherwise it will wrap and continue on the next line within the current row.\n\nLets add som extra style, just to make the example look a bit better, this has nothing to do with the actual grid and is just for show.\n\n```less\n.region {\n height: 80px;\n background-color: lighten(#0f0, 20%);\n}\n```\n\nFor now the testpage might look like this.\n\n![Row with columns](doc/img/rows-columns.png)\n\n\n\n### Grid wrapper\n\nFor now the grid is fluid and wrapping 100% of the width. The grid contains a utility mixin that can set the max width on a row wrapper. In our example we have the `.inner-wrap` as the row-wrapper.\n\nLets say that the header and footer should be 100% wide and the other rows should have a max width of 1100px.\n\nLets apply that style.\n\n```less\n.inner-wrap {\n #desinax-vgrid.grid(1100px);\n}\n\n.inner-wrap-header,\n.inner-wrap-footer {\n #desinax-vgrid.grid(100%);\n}\n```\n\nFor now the testpage might look like this when the browser is wider than 1100px.\n\n![Larger than 1100](doc/img/width-larger-1100.png)\n\nWhen the width is less than 1100px then all rows appear to have the same size to 100%. We now have a fluid grid with a max width for some rows.\n\n\n\n### Responsive grid\n\nA fluid grid, like the one we have, adapts nicely to the width of the browser. To enhance its responsiveness one can add media queries to allow the columns to have different width. Well, different width means that they span a certain set of columns.\n\nLets look at an example which makes the grid more responsive.\n\n```less\n@media screen and (max-width: 700px) {\n .flash {\n #desinax-vgrid.column(@columns);\n }\n\n .sidebar-left,\n .sidebar-right {\n #desinax-vgrid.column(@columns / 2);\n }\n\n .main {\n #desinax-vgrid.column(@columns / 2);\n }\n}\n\n@media screen and (max-width: 600px) {\n .sidebar-left,\n .sidebar-right,\n .main {\n #desinax-vgrid.column(@columns);\n }\n}\n```\n\nThe idea is to wet the breakpoints where needed, however, this is not a grid issue, you can use whatever tactic you choose for setting the breakpoints.\n\nHere follows a couple of images that show how the grid adapts for the media queries.\n\nFirst how it looks like when no media query is active.\n\n![Width 800](doc/img/responsive-800.png)\n\nThen how it looks when the first media query is applied when the width is less than 700.\n\n![Width 650](doc/img/responsive-650.png)\n\nAnt then last, how it looks like when the second media query hits in. \n\n![Width 500](doc/img/responsive-500.png)\n\nWe now have a fluid grid, with a max width and the grid being responsive at selected breakpoints.\n\n\n\n### Show the grid\n\nWhen developing for the grid it might be helpful to show the grid to see that the rows and columns actually maps to the intended grid.\n\nHere are a couple of html pages where you can see the grid.\n\n* [Float with show grid (24 columns)](htdocs/float_showgrid.html) ([Less source](src/less/test_grid_float_showgrid.less))\n* [Float with show grid (12 columns)](htdocs/float_showgrid_12.html) ([Less source](src/less/test_grid_float_showgrid_12.less))\n* [Flex with show grid (24 columns)](htdocs/flex_showgrid.html) ([Less source](src/less/test_grid_flex_showgrid.less))\n* [Flex with show grid (12 columns)](htdocs/flex_showgrid_12.html) ([Less source](src/less/test_grid_flex_showgrid_12.less))\n\nThis is how its done.\n\nThe following style adds a background image that represents the grid.\n\n```less\n.vgrid .inner-wrap {\n @gridImage: \"../../img/grid_24x30x10-nomargin.png\";\n //@gridImage: \"../../img/grid_12x60x20-nomargin.png\";\n #desinax-vgrid.showGrid(@gridImage, 1100px);\n\n &.inner-wrap-header,\n &.inner-wrap-footer {\n #desinax-vgrid.showGrid(@gridImage);\n }\n}\n```\n\nThe grid images are just an image representing the grid.\n\nThis is the 24 column grid image.\n\n![grid 24](htdocs/img/grid_24x30x10-nomargin.png)\n\nThis is the 12 column grid image.\n\n![grid 12](htdocs/img/grid_12x60x20-nomargin.png)\n\nYou will need your own grid image if you have your own setup for the grid.\n\nThis is how it can look like when using a 24 column grid and applying the grid image.\n\n![With showgrid](doc/img/showgrid.png)\n\nThis is the same when using a 12 column grid.\n\n![With showgrid 12](doc/img/showgrid-12.png)\n\nThe grid image is added to the `.inner-wrap` and it can be added with an optional specific max width, the same max-width used for wrapping the row.\n\nThe intention is to add the class `.vgrid` to some parent element to make it easy to turn on or off the visible grid. For example adding the class to the html-element would activate that the grid is shown.\n\n```html\n\n```\n\nWhen using background images and colors it might be hard to see the grid. Here is some constructs that make it easier to see the grid in the example files.\n\n```less\n.row {\n // Add some style to make it easier to see the structure of the grid\n padding-top: 8px;\n padding-bottom: 8px;\n background-color: transparent;\n}\n\n.region {\n // Add some style to make it easier to see the structure of the grid\n opacity: 0.5;\n}\n```\n\nThe constructs for `.row` and `.region` are just to make the example more visible. \n\n\n\n### Avoid styling the grid row or grid column\n\nThe divs we now have applied the grid style to should we avoid to style further. This is a general recommendation to keep out of trouble and by mistake overriding the grid layout.\n\nAn easy way to avoid such mistakes is to add wrappers around the grid and a wrapper for the content. These can then be styled more freely.\n\nHere is an example.\n\n```html\n
\n
\n
\n
\n
\n
header1
\n
\n
\n
header2
\n
\n
\n
\n
\n
\n```\n\nThis might seem to be a lot of wrappers, but the intention is to prepare for several differente types of styles for the website. You can use less wrappers, but in the long run you might come to love wrappers. I do. It makes it easy to add (without messing with the grid divs) background-color, borders, padding, margins, different width and add content to all these div \"holders\", perhaps to use positioning to have items break out of the grid flow. \n\nAnother technique is to use `box-sizing` on the columns to allow styling with border and padding.\n\n```less\n* {\n box-sizing: border-box;\n}\n```\n\nBut still, I prefer a well structured amount of wrappers to allow for all kind of styling and having well defined regions where content can be inserted. This makes it easier to live up to the expectations of the designer and the customer.\n\n\n\nMore examples on usage\n-------------------------------\n\nThe followig examples contain more example on how to use the grid.\n\n* [Grid usage (float)](htdocs/usage-float.html)\n* [Grid usage (flex)](htdocs/usage-flex.html)\n\n\n\nHistory\n-------------------------------\n\nThe idea behind this grid was originally, to the best of my knowledge, implemented by Tyler Tate and it was called \"The Semantic Grid System\".\n\nThis is [how the website looked](http://dbwebb-se.github.io/semantic.gs/webroot/) when it was live and running (I saved it for educational purpose).\n\nThe first commit in the project [was made 2011](https://github.com/tylertate/semantic.gs/commit/45e0f363e39157ac9511f1efb237b1daa379ada0) according to GitHub. The [project now seems to be dead](https://github.com/tylertate/semantic.gs/issues/94). The latest commit was made in July 2015. The original license was Apache License 2.0.\n\nI was using the \"The Semantic Grid System\" for both educational purpose and for production purpose. I liked the smallness of the grid and that there was no need for specific html classes.\n\nSo, for personal use I took the code and the idea behind the grid and rewrote the code to become `src/less/grid.less`, now supporting \"float\" and \"flex\" and I did som other minor edits to the code. I added a grid-mixin to wrap rows at certain max widths and a showGrid mixin with grid images and a pull-right mixin. I removed the clearfix mixin and namespaced the module and versioned it and published it as a npm package. I rewrote the mixins for row() and column() to make it more readable what css-constructs are used.\n\nThe basic idea behind the code for the row() and column() mixin is still based on the same initial princip developed by Tyler.\n\n\n\nLicense\n-------------------------------\n\nThe license is MIT, review it in [LICENSE](LICENSE).\n\n\n\n```\n . \n..: Copyright (c) 2016-2018 Mikael Roos, mos@dbwebb.se \n```\n","readmeFilename":"README.md"}