从用户设置dynamic设置LESSvariables

这真是一个简单的事情来解释。 这是可能的或不是。

我有数据库中的用户设置，或至less有。 这些设置将包含字体大小，颜色和不透明度。 我需要从成员对象，并进入LESS样式。

在我继续之前，我应该让你知道我正在使用Node.js + Sails.js + MongoDB。

我的成员对象看起来类似于（截断数据）：

{ _id: ObjectId("52afc219c41e159808d41be5"), createdAt: ISODate("2013-12-17T03:16:41.947Z"), email: "[e-mail]", encryptedPassword: "$2a$10$TJ2vMgRpG1y/pYrHPWyDp.pd9u9lgHqNTOSV5fob2yckIFdQsxQea", firstName: "Firstname", lastName: "Lastname", updatedAt: ISODate("2013-12-27T22:40:34.057Z"), textSize: 14, textColor: "#333333", widgetOpacity: 0.7 } 

在LESS文件中，我需要能够使用这些数据在顶部设置@vars：

 @textSize: member.textSize; @textColor: member.textColor; @widgetOpacity: member.widgetOpacity; 

要么

 @textSize: <%- member.textSize %>; @textColor: <%- member.textColor %>; @widgetOpacity: <%- member.widgetOpacity %>; 

当然这一切都会引发错误。 请指出我在这里做不到的事情。 谢谢。

Answer 1

我认为这取决于当你阅读用户对象，并写你的less文件。 如果你编译你的LESS文件客户端，请参阅http://lesscss.org/#usage你将可以select实时操作variables，参见： 通过LESS和CSSdynamic地（在运行时）更改variables？ 。

在大多数情况下，您将LESS预编译为CSS，然后在浏览器中加载CSS。 我认为在这种情况下你有两个select：

1. 编写你的CSS，基于用户设置，然后再编写页面，例如http://twitterbootstrap3buttons.w3masters.nl/
2. 使用javascript / jquery操作你的css后，编译和laod，请参阅： 使用jquerydynamic修改CSS