Lumos Extension for Webflow

搜索者

此扩展专为在 Webflow.com 上使用而构建。它提供了在 Webflow 中更快工作的快捷方式。由 https://www.fri3nds.com/ 慷慨开发的扩展 V1

• 快速类命名
在类选择器字段中按右箭头键将返回具有组件类（包含下划线的类）的最近父级的类名称。

• 设计基类
按 Shift 键和向上箭头键选择基类。按 Shift 键和向下箭头键可返回所有课程。

• PX 至 REM
在任意样式面板字段中输入数字，然后按空格键。该数字将除以 16，并且 rem 单位将附在末尾。

• PX 至 %
将任意元素的宽度除以其父元素的宽度即可得到百分比宽度。示例：在任意样式面板字段中键入 562/1440，然后按空格键。 562 将除以 1440。结果将乘以 100，并在末尾附加一个 % 单位。

• 自动包装 var() 中的任何 --variable-name 和 calc() 中的任何数学
示例：在任何自定义属性值字段中键入 --grid-gap / 2，然后按 Tab 键。它将转换为 calc(var(--grid-gap) / 2)

• 自动将任何 --variable-name 包装在 color-mix() 中以获得透明度
示例：在任何自定义属性值字段中键入 --theme--text%60 并按 Tab 键。它将转换为颜色混合（在 srgb 中，var(--theme--text) 60%，透明）

• 组件字段上的自动数据属性按钮
使用“page_code_wrap”类在一个 div 内添加包含数据属性的任何嵌入。将这些属性应用于任何元素并将它们的值链接到组件字段。组件字段名称应包含属性名称。将为嵌入中的每个属性值自动创建按钮。

了解 Lumos 框架：https://lumos.timothyricks.com/