如何创建自己的生活风格指南 UI
How to create a living style guide with your own UI
我使用 Angular2 创建了一个 website/application。基础设施已全部设置好,路由已完成,sass 正在处理等
我在这个网站上有部分(组件)将显示我们设计(按钮、表单、副本)的当前 Web 标准。该站点的目的是为我们的开发人员提供 copy/paste 标记和 sass.
解决方案
我们很可能会创建自己的 css 库,但他们仍然需要一个很好的视觉参考来了解每个 class 的功能以及 copy/paste 解决方案。
我知道如何制定所有标准,但我不知道如何为用户提供 DOM 显示选项以 copy/paste 代码。我可以手动将代码输入或标记,但这将很难维护而且不是很干净的方法。我想找到一些可以利用我的代码并在 运行 时间创建这些标签的解决方案。
谷歌搜索这个问题导致使用生活方式指南生成器的道路,我不想使用...为什么?我喜欢控制我自己的布局和缩放我的标准的功能,因为我认为适合我们自己的技术。
有什么想法吗?
在进一步探索之后,我再次在文档工具 (KSS) 上盘旋,我需要使用 markdown 和/或 JDOC 为该功能重建我的整个样式指南。
解决方案!
使用 CodePen,它可以免费注册,但是有一些不错的功能需要按月付费。我在这里使用 SASS、HTML 和 CSS 库轻松创建了我的代码。 CodePen 有一个很棒的 EMBED 功能,而我可以 copy/paste html 或 iframe 直接放在我的样式指南中。
问题现在已经解决了,我们有了一个动态 Web 和 UI 样式指南。
希望这个方法对我的情况有所帮助。
我使用 Angular2 创建了一个 website/application。基础设施已全部设置好,路由已完成,sass 正在处理等
我在这个网站上有部分(组件)将显示我们设计(按钮、表单、副本)的当前 Web 标准。该站点的目的是为我们的开发人员提供 copy/paste 标记和 sass.
解决方案我们很可能会创建自己的 css 库,但他们仍然需要一个很好的视觉参考来了解每个 class 的功能以及 copy/paste 解决方案。
我知道如何制定所有标准,但我不知道如何为用户提供 DOM 显示选项以 copy/paste 代码。我可以手动将代码输入或标记,但这将很难维护而且不是很干净的方法。我想找到一些可以利用我的代码并在 运行 时间创建这些标签的解决方案。
谷歌搜索这个问题导致使用生活方式指南生成器的道路,我不想使用...为什么?我喜欢控制我自己的布局和缩放我的标准的功能,因为我认为适合我们自己的技术。
有什么想法吗?
在进一步探索之后,我再次在文档工具 (KSS) 上盘旋,我需要使用 markdown 和/或 JDOC 为该功能重建我的整个样式指南。
解决方案!
使用 CodePen,它可以免费注册,但是有一些不错的功能需要按月付费。我在这里使用 SASS、HTML 和 CSS 库轻松创建了我的代码。 CodePen 有一个很棒的 EMBED 功能,而我可以 copy/paste html 或 iframe 直接放在我的样式指南中。
问题现在已经解决了,我们有了一个动态 Web 和 UI 样式指南。
希望这个方法对我的情况有所帮助。