【问题标题】:Custom dynamic CSS for Aurelia applicationsAurelia 应用程序的自定义动态 CSS
【发布时间】:2016-06-28 01:17:42
【问题描述】:

我正在尝试制作一个可以根据访问网站的域名更改标题和 CSS 主题的白标网站。我一直无法找出将自定义主题 CSS 动态插入整个 Aurelia 应用程序的最佳方法。我希望允许组织更改主要和次要主题颜色及其图标图像,并根据他们用于访问应用程序的域名将其应用于 Aurelia 应用程序。我希望能够将这些值存储在数据库中并动态创建 CSS,以便在更改颜色/徽标值时更改主题。

我们将不胜感激有关如何解决此问题的建议。

【问题讨论】:

  • 这实际上可能更容易在服务器上处理,具体取决于您交付初始 index.html 页面的方式。您可以改为制作这个 index.php|aspx|js 并根据域动态包含正确的样式表导入。
  • 使用Aurelia PALinjectStyles(styles: string, destination?: Element, prepend?:boolean) 方法怎么样?我可以设置一个基于服务器的动态 index.html|php|...,但我希望保持网站静态并且只在服务器端处理 REST API。

标签: css aurelia


【解决方案1】:

我为此 https://jonathan-harrell.com/live-theming-with-css-variables/ 使用 CSS 变量

基本上,在你的 CSS 文件中使用 CSS 变量,然后

document.documentElement.style.setProperty(`--background`, value);

【讨论】:

  • 你在哪里设置这个属性?有没有一个好地方可以为每个 APP 定义一次?
猜你喜欢
  • 1970-01-01
  • 2017-07-09
  • 1970-01-01
  • 2017-03-24
  • 2016-06-20
  • 1970-01-01
  • 2018-07-09
  • 2016-11-30
  • 1970-01-01
相关资源
最近更新 更多