语义 UI / Meteor 更改默认字体答案

【问题标题】：Semantic UI / Meteor change default font语义 UI / Meteor 更改默认字体
【发布时间】：2017-02-22 17:44:47
【问题描述】：

我的 Meteor 应用程序（两个最新版本）使用 SUI 默认主题，语义 UI 工作得很好。我只想将字体从 Lato 更改为 Roboto - 仅此而已。

我尝试将@fontName: "Roboto" 添加到/site/globals/site.variables.import.less - 仍然，一切都出现在拉托语中。

文档不是很清楚（至少对我来说！），所以我进一步尝试将@fontName: "Roboto" 添加到每个不是以 DO NOT MODIFY 开头的文件中 - 仍然，Lato 无处不在。

还尝试在 SUI 变量中添加 body {font-family: "roboto"} 和 main.css - 仍然是拉托语。

我不知道我还能尝试什么 - SUI 非常好用，我认为更改字体之类的简单操作不会有任何问题。有什么想法吗？

【问题讨论】：

'使用 site.variables 修改页面容器大小、默认字体和颜色'，有帮助吗？ semantic-ui.com/usage/theming.html
@JanMellström 不幸的是没有——这就是我一直在追寻的，但无济于事
你是否在 CSS 中导入了roboto字体，例如：@import url('fonts.googleapis.com/…);
@Sarthak 不——这就是我认为更改 SUI fontName 应该做的事情——它当前正在下载 Lato，但它应该正在下载 Roboto。我会按照您的建议尝试，但这会绕过 SUI，不是吗？
您解决了这个问题吗？我也有同样的问题

标签： css meteor fonts semantic-ui

【解决方案1】：

SUI 确实会为您下载 Google 字体。但是您必须以特定方式让 SUI 知道您想要哪些字体。

这是来自here 的示例。

@headerFont        : 'Open Sans', 'Helvetica Neue', Arial, Helvetica, sans-serif;
@pageFont          : 'Oswald', 'Helvetica Neue', Arial, Helvetica, sans-serif;
@googleFontFamily  : 'Open+Sans:400italic,400|Oswald:400,700';

您可能只需要在 @googleFontFamily 变量中包含所需的 Google 字体以及适当的样式和粗细

附：您必须将其添加到您的 src/site/globals/site.variables

【讨论】：

感谢您的回答，但这是更改 fontName 变量应该做的 - 据我了解，所有其他 headerFont/pageFont 等均由 fontName 控制。然而，我确实尝试明确设置它，但仍然没有 - 只下载 Lato，没有 Roboto :(
无赖。添加 @googleFontFamily 变量并重新构建我的 SUI 对我有用。