TopUI Snippets 是一款专为Visual Studio Code设计的代码片段集合，旨在提升您在使用TopUI框架时的开发效率。每个片段均以"tu"为前缀，方便您快速调用和使用。

主要组件

• 按钮：使用tubutton快速创建基本按钮。
• Input Mask：通过tuinputmask实现输入掩码功能。
• 开关：tuswitch用于创建Checkbox切换效果。
• 面板：tupanel帮助您快速构建内容块。
• 自增高度的textarea输入框：tutextarea让textarea输入框自动调整高度。
• 日期选择器：tudatepicker提供便捷的日期选择功能。
• 布局：包括tugrid（基本布局样式）、tugrideq（基于div的等分布局样式）和tugridequl（基于ul的等分布局样式）。
• 进度条：tuprogress用于显示进度信息。
• Modal：tumodal创建基本的Modal对话框。
• 通知框：tunotify实现提示功能。
• 切换组件：tuswitcher用于创建切换效果。
• 单页多内容切换：tuslideset提供单页多内容切换功能。

如何获取和使用

您可以访问我们的Github页面获取TopUI和TopUI Snippets的源码，并参与到项目中来。我们欢迎您的贡献！

• TopUI Github
• TopUI Snippets For VSC Github

增加class自动提示功能

为了进一步提升开发体验，您可以按照以下步骤在Visual Studio Code中启用class自动提示功能：

1. 安装插件：在Visual Studio Code市场中搜索并安装HTML CSS Class Completion插件，该插件将自动分析您的项目目录下的CSS类。
2. 配置项目设置：在您的项目.vscode/settings.json文件中添加以下配置：

{
  "less.compile": {
    "compress": true,
    "sourceMap": true,
    "out": false
  }
}

3. 调整LESS文件：在引用TopUI的LESS文件顶部添加以下设置：

// out: ../temp/t.css, compress: false, sourceMap: false

完成以上步骤后，重新打开编辑器并加载HTML文件，您将在编写class属性时获得自动提示功能。

版权信息

TopUI Snippets基于MIT许可证发布，您可以自由使用、修改和分发该代码。

通过使用TopUI Snippets，您将在Visual Studio Code中体验到更高效的TopUI开发流程。立即加入我们的社区，贡献您的代码，共同提升TopUI的开发体验！