时间戳

首页 > 解决方案 > 有没有办法可以使用 2sxc 和 razor 模板创建（和更新）样式表？

css - 有没有办法可以使用 2sxc 和 razor 模板创建（和更新）样式表？

问题描述

DNN 9.3.2 / 2sxc 10.25.2

我有一个用于某种类型的子门户的 DNN 主题——我最终将拥有 8 个子门户。每个子门户都有相同的布局，但它们在各自的主题中会有不同的颜色。所以我必须创建一个样式表，其中包含 CSS 规则和每个主题的颜色。我知道有几种相对简单的方法可以做到这一点：

  1. 修改每个门户的portal.css 以覆盖主题或（简单但可能难以维护更新）
  2. 为每个门户构建自定义主题（矫枉过正）
  3. 使用 SCSS 创建包含 8 个不同变量文件的模板（工作正常，但不允许内容编辑器进行修改）

所以，我很好奇 2sxc 是否有更聪明的方法，不仅可以让我轻松维护，还可以让我的门户网站的内容编辑器轻松维护。

我想为颜色选择器创建带有几个不同字段的 2sxc 内容模块，这将允许我（和我的内容编辑器）简单地打开 2sxc 编辑模式（在主页上），填写所有颜色字段，然后是剃须刀template 将输出带有颜色的 CSS 模板，以覆盖 DNN 皮肤上的主题样式。我知道我可以使用内联 CSS 来做到这一点，但这意味着模块必须出现在每个页面上，而且我也更愿意避免使用内联 CSS。

所以我的想法是它会像这样工作：

  1. 在每个门户的单个页面上都有一个 2sxc 内容模块
  2. 编辑模式 > 字段将类似于：原色 (rgba)、辅助色 (rgba)、灰色 (rgba) 等
  3. 单击保存后，模板会修改由皮肤加载的门户级 theme.css 文件
  4. 对模块的任何更改都将导致 CSS 文件的重写。
  5. 我可以更新 c# razor 模板以添加、删除或修改规则或转换输入的值。

这是可能的还是太复杂了？有没有更好的方法来解决这个问题？

标签： cssdotnetnuke2sxc

解决方案

所以我已经离开了很长时间，我希望我的回答仍然可以帮助......

我们有一个非常简单的解决方案:)。如果您查看引导即时模板，您会看到我们向<body>标签添加了各种类。

https://github.com/2sic/dnn-theme-bootstrap4-instant/blob/master/controls/body-css-classes.ascx#L86-L91

这样我们就可以使用主题的普通 CSS 和基于 portal-27 等的规则来根据门户而变化。

推荐阅读