weightless

该项目已达到其发展的终结。随时浏览代码。

高质量的网络组件，占地面积很小
_{非常感谢您对该项目表现出兴趣！如果您想帮助我们喂养我们的八角体，那么您绝对应该成为星际聚集器。这些Web组件被构建为用于使用。它们轻巧，具有简单的API，并且易于扩展和组成。在这里查看演示https://weightless.dev/elements。}

• 高质量：以最佳实践为中心。
• 可测试：数百个测试箱确保库稳定。
• 易于使用：但是具有简单易懂的API。
• 可访问：所有组件均已构建，并考虑到可访问性。
• 单一责任：每个组件做得很好。这使它们非常容易扩展和构图。

➤内容表

• ➤演示
• ➤安装
• ➤元素
• ➤路线图
• ➤贡献指南
• ➤贡献者
• ➤许可证

➤演示

去这里尝试演示。

➤安装

 $ npm i weightless

如果您想快速入门，则可以使用CLI。

 $ npm init web-config new my-project --lit

如果您喜欢使用umd捆绑包，则可以导入https://unpkg.com/weightless/umd/weightless.min.js 。请记住，这将导入所有元素，因此建议您仅将其用于测试目的。

 < script src =" https://unpkg.com/weightless/umd/weightless.min.js " > </ script > 

➤元素

姓名	标签	描述	文档	演示
背景	wl-backdrop	深色层用于叠加元素后面。	文档	演示
横幅	wl-banner	显示无中断的消息和相关的可选操作。	文档	演示
按钮	wl-button	允许用户单点采取行动并做出选择。	文档	演示
卡片	wl-card	小组相关的内容和动作。	文档	演示
复选框	wl-checkbox	打开或关闭选项。	文档	演示
对话	wl-dialog	高度打扰的消息。	文档	演示
分隔线	wl-divider	细线将列表和布局中的内容分组。	文档	演示
扩张	wl-expansion	提供可扩展的详细信息 - 夏季视图。	文档	演示
图标	wl-icon	常见动作和项目的符号。	文档	演示
标签	wl-label	使表单元素更容易访问。	文档	演示
列表项目	wl-list-item	在列表中显示项目。	文档	演示
导航	wl-nav	提供对应用程序中目的地的访问权限。	文档	演示
弹出	wl-popover	上下文锚定元素	文档	演示
弹出卡	wl-popover-card	赋予弹出窗口的能力。	文档	演示
进度栏	wl-progress-bar	将酒吧从0％到100％填充。	文档	演示
进度旋转器	wl-progress-spinner	将一个圆圈从0％到100％填充。	文档	演示
收音机	wl-radio	从集合中选择一个选项。	文档	演示
波纹	wl-ripple	指示触摸动作。	文档	演示
选择	wl-select	从一组选项中选择一个或多个值。	文档	演示
滑块	wl-slider	从一系列值中进行选择。	文档	演示
Snackbar	wl-snackbar	在屏幕底部提供简短的消息。	文档	演示
转变	wl-switch	打开或关闭选项。	文档	演示
选项卡	wl-tab	组织内容组之间的导航。	文档	演示
选项卡组	wl-tab-group	组织内容组之间的导航。	文档	演示
文本	wl-text	将文本分组为段落。	文档	演示
Textarea	wl-textarea	多行文本字段。	文档	演示
Textfield	wl-textfield	单线文本字段。	文档	演示
标题	wl-title	指示新部分的开始。	文档	演示
工具提示	wl-tooltip	信息性上下文相关文本。	文档	演示

➤路线图

路线图上有很多令人兴奋的事情。在v1.0.0之前，您可以期望API相当稳定，但重构可能仍会发生并破坏向后兼容性。非常欢迎您使用库，创建拉动请求或添加问题。

➤贡献指南

欢迎您为这个存储库做出贡献！以下是有关如何设置项目开发项目的一些说明。

1. 通过运行git clone https://github.com/andreasbm/weightless.git来克隆此存储库。
2. 运行npm i以安装所有依赖关系。
3. 使用npm run s旋转开发服务器。应在正确的URL下自动打开浏览器。如果没有，您可以打开浏览器，然后访问http://localhost:1350 。
4. 使用npm run test 。
5. 用npm run lint将文件提起。
6. 通过运行npm run docs来编译文档。

这些元素是用打字稿编写的，样式表是用sass编写的。所有的Web组件都使用LIT元件。

如果您想了解更多有关如何帮助您的信息，则绝对应该查看contruting.md文件。所有贡献者将添加到下面的贡献者部分中。

➤贡献者

安德烈亚斯·梅尔森（Andreas Mehlsen）	你？

➤许可证

根据麻省理工学院许可。