{"_id":"@_y/acss-vanilla","_rev":"5-fe7207f0b931d8e00d38b89bdf461d11","name":"@_y/acss-vanilla","dist-tags":{"latest":"0.0.5"},"versions":{"0.0.3":{"name":"@_y/acss-vanilla","version":"0.0.3","description":"atomic vanilla version","main":"css/acss.min.css","repository":{"type":"git","url":"git+https://github.com/yued-fe/acss-vanilla.git"},"keywords":["acss"],"author":{"name":"yfe-team"},"license":"MIT","bugs":{"url":"https://github.com/yued-fe/acss-vanilla/issues"},"homepage":"https://github.com/yued-fe/acss-vanilla/index.html","gitHead":"c37c7e7012f318c94217c17140199da598acaeba","_id":"@_y/acss-vanilla@0.0.3","_npmVersion":"5.6.0","_nodeVersion":"9.11.2","_npmUser":{"name":"ziven27","email":"ziven27@qq.com"},"dist":{"integrity":"sha512-bCwIDZQD9ZYTe8Bj2MD8sJmlX2oYSTuI6kRvyGtFNyshPar3tB17ejsUs337tHsVmF1kBCPx8DIlilQgovsSzw==","shasum":"9ca61506e843a77eb46d10edeccda75c66012d37","tarball":"https://registry.npmjs.org/@_y/acss-vanilla/-/acss-vanilla-0.0.3.tgz","fileCount":5,"unpackedSize":10805,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc1/XUCRA9TVsSAnZWagAAjnYP/1vtQ1xJHUl9RTzLkS+Y\nZ7kT0eh1DAzek9bY+xX2AD+vz+Pc9pcIRLqyEm2s88uMz+67yaxy1+0cJXOz\nrNMJMURGk1oM6tbxANdLlIjA0n6pnHtRL/CjR8RTisfUR8qKOekaj0rlgZgX\nviPiiEUkBMTVgKu6WqV82G3tKXDHjZg+iIIGvELr5+NiNEBH9kEheHF2znJT\nzSylRlUZxeVDjK8n2ww2XnkT7jhpGYOUMqR5KTfIdFs6yvtMIyhohV5qa90Y\n7juvRDOfoplGkLs0psSiCcnXQquxBTRG6uXTTXoOkRCeszeyF/WXssqVVHMq\numfh6oREmlkUA/CdTWWpdxXVuljp/yI5o384Bhs3ZMnzf2Iwr8KPtc1jKKcp\nTNuhFJ5l05xxikP29lrqayFr13M0bGXysM1QReoKbgXmHx6T0G+KVMr+i8Z8\nOxYlAHNBS88Yi/N7l8JIoKeLxkk9zcWDlsexVYb7S1jAb1AOdGw7YgICxVed\nCuIcr30x1RFvBq4B6NCnnVZ3qZiDEsskKqGw5b7rTT0o7Zf30rBZI3d0iQok\nlFDJHewOJrdVEoKGeTr21+y7In9QpqQTQeukBuZptHIECaUdH/PbVq27H5jv\n3uUdlOJhwla8d6YCIqmhy4SseR8bJk9osho+v1tCpvoNrFMJrS9vgrDc/8uc\nSH0t\r\n=gYSG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCsc27wtZYuJVT6EFTyR3KuhDwjYYTiqLtaEtGSmBr1BgIgSi32lewJTlgTfKB1TGgUo2+fwp2ZMa0Abv/J//du2gs="}]},"maintainers":[{"name":"ziven27","email":"ziven27@qq.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/acss-vanilla_0.0.3_1557657043680_0.12026678663314705"},"_hasShrinkwrap":false},"0.0.4":{"name":"@_y/acss-vanilla","version":"0.0.4","description":"atomic vanilla version","main":"css/acss.min.css","repository":{"type":"git","url":"git+https://github.com/yued-fe/acss-vanilla.git"},"keywords":["acss"],"author":{"name":"yfe-team"},"license":"MIT","bugs":{"url":"https://github.com/yued-fe/acss-vanilla/issues"},"homepage":"https://yued-fe.github.io/acss-vanilla/","gitHead":"621bfb1d9267d39445206f71d019d948797a3b1f","_id":"@_y/acss-vanilla@0.0.4","_npmVersion":"5.6.0","_nodeVersion":"9.11.2","_npmUser":{"name":"ziven27","email":"ziven27@qq.com"},"dist":{"integrity":"sha512-9XcAXDh/K4KK0Ft4hDORZNOGTq6Ptq4vQ9GS/saDgUL+tV+f52KcDL28Qmxvsa+2a7EdhQTZ/ETWDjmG4zdsXA==","shasum":"904dd2adc33b9f7ad7f2dc77a0cb5cf483178c7b","tarball":"https://registry.npmjs.org/@_y/acss-vanilla/-/acss-vanilla-0.0.4.tgz","fileCount":5,"unpackedSize":10827,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc1/bZCRA9TVsSAnZWagAAu4EQAJS8KQ3HfLxnArFaIWzX\nAgBdBx0iiSJg2sNyHcXX7bRq5yQ/ZONlFnGx/nLUAH0sW4i1wks5VP58SCRQ\nFxz9IEjMU0ZVTmH14WZ4RH2dX0GvIxCKicVozxpOV7StD8EOFutlWK8WVv1h\nYBLPD7Yh2gxnWYUYSO17iZLQ/AnIJuCD/SQAh0fn/v1P4EM/yd3PbXeFjMDU\nIOJ3JYiFODIGeoFW6rTb9GkJp+9Y69ItTjxPRNEXzDbHkdQjAM78e4HREBf/\nee5bT3wP9HrVTWsNsxJ1cs9iCHEFBTc9CE2Kh3afvhuWpWJ4gSV+b2fA1mOi\nSlvbHtflUawJDSczLhcxWmzRSZNQ0PCZd/NUvmdsAOcdBNUVRptLEqCqiXYr\nXQiglo9z9FaKj4tcZiViVQK3yaTuCu4LTXYsmchm42YFBCsbcFQHA3hqUjPF\n3Xm60pqVEWnmQTUfBDKyxDrkVcpvrjvOdG22PZsmvRwXF3Pnj41P6aBGmNiG\nHRh5g0OBWJBQxXH7GclH+IS2hdEP5v+R7QoShShPnfuJh7qTICPEYmKyGQIT\n1pv9+DXltLb3HnQTTWyFBI5VUDIdqHRvBWbj7zauroKipB45m97V9ZXPV6SH\nCXnop7ZGkcU8spRYRDufNLp6XuIX8kMwRMOkwgrbBTN6Fp8Y29uqKkvgwzzE\nDAdD\r\n=S7yG\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCvw5zaBYxTmoOaWPeY6cB0RT9EEL1ifIwZbAd+gR+3HgIhAIpmYPYe+N1111dE75Ad/uzQJqyoeuKS/d9YitIh8JNp"}]},"maintainers":[{"name":"ziven27","email":"ziven27@qq.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/acss-vanilla_0.0.4_1557657305146_0.19862401214000514"},"_hasShrinkwrap":false},"0.0.5":{"name":"@_y/acss-vanilla","version":"0.0.5","description":"atomic css vanilla version","main":"css/acss.min.css","repository":{"type":"git","url":"git+https://github.com/yued-fe/acss-vanilla.git"},"keywords":["acss","css","atomic","vanilla"],"author":{"name":"yfe-team"},"license":"MIT","bugs":{"url":"https://github.com/yued-fe/acss-vanilla/issues"},"homepage":"https://yued-fe.github.io/acss-vanilla/","gitHead":"03dde0e65b5369a46f0a608c5422774880234721","_id":"@_y/acss-vanilla@0.0.5","_npmVersion":"5.6.0","_nodeVersion":"9.11.2","_npmUser":{"name":"ziven27","email":"ziven27@qq.com"},"dist":{"integrity":"sha512-eiHsl7b8ok4eeWnus+4aWH9R7iFcd6wi1udiCWWl+Mo1ZuW+YB/rnR+MZWFC1XY8RvtxRCwgtBD7SoHl3SHcpQ==","shasum":"3dd9d9f01161c83b59e4a950aad8ccc81c29db93","tarball":"https://registry.npmjs.org/@_y/acss-vanilla/-/acss-vanilla-0.0.5.tgz","fileCount":5,"unpackedSize":10859,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc2AHHCRA9TVsSAnZWagAAbUMP/3e39/xbI/LMfDo1+GOe\nQYiaQ3F/lWZ8XIF5D46h7B3Pgd1+8wzL51xNKWQQTkQLtcdNVRMewUBYtGNZ\nK6XJJLxZhiSNVHZG+cmdjNPeOJSBZCp9aFLnYiuYtzeQXKncNHK18TH2XRRY\ngNcRgboep9WzYd31fcwWFAUs21Gvo9ZG20rSWuCbVpDcoeFHEvP+4wBw60vY\nnoU9krvaK6jFXC6nxX9/Pmcsi/isrAQimQQ0udqA9MG3XeWraPt8abo7dI2K\nchikvOCJXJZRjfdSQpDqocXBrNubef2rlew+nUH+K1iguuXyzKyAwl0Rzt9+\nVewzvBA8xlImaEnADgP8dzO0nB1AihkL/hY2WfPgDL7AxsFrgWEBAGgV/wCW\npQQhqviDELF2Ju7PiFq3KnoGBDERioUavd0VUNbszA3bacw3hHo8pvWuvDBD\nrj+vt03iBo9BcEowlfttd5AogPGGApYByBQtY6vmeYZ+1FiRqDGWKhrxpDTZ\nufNNFAIF8hI1H+Vvoduf5G1GMIlo+rnJqUResVUIzTPBJXk+aACO/kAQacIQ\nHOwDOcx1XIB3/RzZHNoY3uyx0F/lYtlm7haxdpUqWrenSemOMWbOMkWJiS6w\nrlCc9TVRXEakaqv7zDlPFtyACx0/iuoEE5WKTLgVCwTiMkI66cEDF+gRU6+R\nofL8\r\n=QKjC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDxs2KidUNgOqNjo0qp6jymV8egeIK09fp//gr72k93XQIhAN4pzdS3sh1BdmDD+r0A3ZMt+nQoOo066AdYD7tthdoS"}]},"maintainers":[{"name":"ziven27","email":"ziven27@qq.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/acss-vanilla_0.0.5_1557660103095_0.8633977444033294"},"_hasShrinkwrap":false}},"time":{"created":"2019-05-12T10:30:43.474Z","0.0.3":"2019-05-12T10:30:43.805Z","modified":"2022-04-04T10:51:44.324Z","0.0.4":"2019-05-12T10:35:05.335Z","0.0.5":"2019-05-12T11:21:43.218Z"},"maintainers":[{"email":"contrary.zhuo@gmail.com","name":"zhangdroid"},{"email":"1128yeye@sina.com","name":"nanasun"},{"email":"ziven27@qq.com","name":"ziven27"}],"description":"atomic css vanilla version","homepage":"https://yued-fe.github.io/acss-vanilla/","keywords":["acss","css","atomic","vanilla"],"repository":{"type":"git","url":"git+https://github.com/yued-fe/acss-vanilla.git"},"author":{"name":"yfe-team"},"bugs":{"url":"https://github.com/yued-fe/acss-vanilla/issues"},"license":"MIT","readme":"# acss-vanilla\n\nAtomic css 原生版本。\n\nAtomic 是一种极简，高效的 CSS 代码库。\n是目前唯一可以做到随着项目推进 CSS 代码越来越少的代码库。\n类似张老师的 [quicklayout.css](https://www.zhangxinxu.com/wordpress/2014/03/quicklayout-css-%E5%BF%AB%E9%80%9F%E6%9E%84%E5%BB%BA%E7%BB%93%E6%9E%84%E5%85%BC%E5%AE%B9%E7%9A%84web%E9%A1%B5%E9%9D%A2/ \"quicklayout.css\")。\n\n## 如何使用?\n\n```\nnpm i @_y/acss-vanilla\n```\n\n\n```html\n\n\n\n\n
\n hello world!\n
\n\n```\n表示： `text-align:center; color:#000;`\n\n## 命名规则\n\n- 只取首字母 .db{ display:block; };\n- 有数字直接连接 .mb10{ margin-bottom:10px; };\n- 百分号用p（percent）表示 .w100p{ width:100%; };\n- 小数点用d（dot）表示 .lh1d2{ line-height:1.2};\n- 想要自定义，用`_`分割单词，`pa_auto`;\n\n\n## API \n\nAPI 主要分为 结构，样式，和自定义三个部分。\n\n具体细则可以看未压缩CSS版本注释。\n\n```\ncss/acss.css\n```\n\n### API 结构\n\n结构主要包括 `display`，`position`，`float`，`flex` 和其它。\n\n可以看到这里并不包含间距部分。因为不同的项目对于 `margin` 和 `padding` 的规则不一样，所以需要按照自己的项目按照\n\n> 有数字直接连接 .mb10{ margin-bottom:10px; };\n\n这个规则自行拓展。如果觉得构建比较麻烦，建议采用 acss-less 和 acss-sass 内置的 mixin 进行生成。比如在 sass 中可以这样使用。\n\n```SCSS\n@include acss-p((2, 4, 8, 12, 16, 20, 24, 32));\n```\n\n会生成以上数字对应的4个方向代码。\n\n### API 样式\n\n样式主要包括 `字体`，`颜色`。\n在代码注释中可以看到 `acss.min.css` 只包含了黑白两个颜色。\n如果想要自定义按照以下规则推展。\n\n```CSS\n.c_xl{ color: #111; } /* 文字比深更深 */\n.c_l { color: #222; } /* 文字加深 */\n.c_m { color: #333; } /* 文字主色 */\n.c_s { color: #666; } /* 文字减比弱更弱 */\n```\n\n```\n.c_primary { color: blue; } /* 主色 */\n.c_secondary { color: blue; } /* 次级颜色 */\n.c_success { color: green; } /* 成功 */\n.c_danger { color: red; } /* 失败 */\n.c_warning { color: yellow; } /* 警告 */\n```\n\n### API 自定义样式\n\n|类名|作用|\n|:--|:--|\n| `.auto` | 带宽度的 block 元素水平居中对齐 |\n| `.clearfix` | 清除浮动 |\n| `.ell ` | 单行文字超出容器显示点点点 |\n| `.ell2row` | 两行文字超出容器显示点点点, 需要结合行高使用 |\n| `.i` | icon 图标基础方法 |\n| `.trans` | transition 动画 |\n| `.pa_middle` | 基于 `position:absolute` 上下居中 （兼容性） |\n| `.pa_center` | 基于 `position:absolute` 左右居中 （兼容性） |\n| `.pa_auto` | 基于 `position:absolute` 上下左右居中 （兼容性） |\n\n\n### DEMO\n\n\n\n\n\n### 相关阅读\n\n1. [「CSS思维」组件化VS原子化 ]( https://juejin.im/post/5b4063936fb9a04fb016b738 )\n2. [ 如何管理 CSS “内裤” ]( https://juejin.im/post/5ba862d9f265da0ae472868a )\n3. [quickLayout.css-快速构建结构兼容的web页面](https://link.juejin.im/?target=https%3A%2F%2Fwww.zhangxinxu.com%2Fwordpress%2F2014%2F03%2Fquicklayout-css-%25E5%25BF%25AB%25E9%2580%259F%25E6%259E%2584%25E5%25BB%25BA%25E7%25BB%2593%25E6%259E%2584%25E5%2585%25BC%25E5%25AE%25B9%25E7%259A%2584web%25E9%25A1%25B5%25E9%259D%25A2%2F) @张老师；\n4. 「英」[在组件化浪潮中重新思考CSS](https://link.juejin.im/?target=http%3A%2F%2Fjohnpolacek.com%2Frethinking%2F) @johnpolacek 虽然是英文，但是网页做得像PPT一样，通俗易懂，强推；\n5. [ACSS 官网](https://link.juejin.im/?target=https%3A%2F%2Facss.io%2F) @雅虎 这个思维最早应该是雅虎推出来的，最近他们有在推 React ACSS\n6. [关于HTML语义和前端架构](https://link.juejin.im/?target=http%3A%2F%2Fwww.w3cplus.com%2Fcss%2Fabout-html-semantics-front-end-architecture.html) @大漠；\n7. [「译」CSS通用类和“关注点分离”](https://link.juejin.im/?target=https%3A%2F%2Fwww.zcfy.cc%2Farticle%2Fcss-utility-classes-and-quote-separation-of-concerns-quote-4149.html%3Ft%3Dnew) @adamwathan；\n8. [「英」Styling React](https://link.juejin.im/?target=https%3A%2F%2Fsurvivejs.com%2Freact%2Fadvanced-techniques%2Fstyling-react%2F) @SURVIVEJS；\n9. [「英」CSS最佳实践探讨](https://link.juejin.im/?target=https%3A%2F%2Fwww.smashingmagazine.com%2F2013%2F10%2Fchallenging-css-best-practices-atomic-approach%2F) - Atomic CSS @smashingmagazine；\n","readmeFilename":"README.md"}