Yew Styles

Yew Styles是一个不依赖于JavaScript依赖项的yew样式框架

动机

开发这个项目的目的是首先，为yew提供一个不需要任何JavaScript依赖项的样式框架，其次，创建一个接近flexbox概念的布局系统，并且，利用Rust的优势，在大多数情况下通过枚举选择属性，这使得应用程序开发更快，并避免了试错的做法

工作原理

每个组件分为两部分，逻辑yew组件及其Sass模块，然而，只需要在项目中包含Sass模块，无需担心

注意：yew_styles项目的一个目标是无需依赖任何外部CSS文件即可将CSS包含在组件中。候选者选择了stylist-rs

如何安装

1. 安装Sass模块：npm install yew-styles
2. 在Cargo.toml文件中添加需要的yew_style crate功能

yew_styles = { version="0.11", features=["button", "text", "navbar"] }

3. 在您的main javascript/typescript文件项目中导入main.css文件

    import 'node_modules/yew-styles/main.css';

4. 准备好在项目中导入和使用 🚀

运行文档页面

1. git clone https://github.com/spielrs/yew_styles.git
2. cdyew_styles
3. npm start

在左侧有一个链接列表，每个链接都访问相应的组件文档，那里显示了如何使用它。

Rust文档

您还可以在这里查看所有Yew Style文档。它包括每个组件的描述和示例。

运行测试

在项目内部运行

cargo test --target wasm32-unknown-unknown --manifest-path=crate/yew_styles/Cargo.toml

开发阶段

Yew Styles 覆盖了在 Web 应用程序中使用的所有常见情况，但仍有许多工作要做和组件要实现。所有贡献都受到欢迎。

如何贡献

首先，打开一个问题，描述修复、改进或实现的方案，建议在讨论之前不要开始工作。如果贡献是一个组件的修复或小改进，只需要向 master 发起一个拉取请求，解释解决了什么或改进了什么。如果是实现，请遵循以下要求。

• 首先，打开一个问题，描述组件。
• 单元测试，检查组件是否创建及其逻辑是否工作，在实现它的同一个文件中（目前不需要测试事件）。
• 每个文件一个组件，如果多个组件之间存在连接，可以创建子文件夹。
• 组件中的文档展示了如何使用它的示例以及每个属性的简要描述。
• 在 /crate/src/page 中创建一个组件页面，结构与其他组件相同。

你喜欢 Yew Styles 吗？

如果你喜欢 Yew Styles，请帮助我支持这个项目。

• 如果你使用 Brave 浏览器，可以获得 BAT 奖励。
• 使用此链接在 Binance 创建账户（每次交易返佣 10%）。

如果你需要尚未涵盖的功能，请尽快在这里资助问题。

代码贡献者

路线图

• 按钮
• 布局
• 导航栏
• 表单
• 卡片
• 文本
• 下拉菜单
• 去除 CSS 文件
• 进度条
• 加载指示器
• 表格
• 分页
• 模态框
• 侧边栏
• 标签页
• 工具提示
• 折叠
• 轮播
• 日历
• 资产（在新库 yew_assets 中实现）