logo标签列表

使用Bulma设置新的主要字体族。

cssbulma
7
我尝试更新Bulma中主要字体系列的变量，但好像没有任何反应。到目前为止，我所做的是：
  1. 导入初始变量和函数文件。
  2. 使用Google Fonts导入所需字体
  3. 设置一个新变量 $family-serif: "Grandstander", serif;
  4. 将 $family-primary 更新为 $family-serif 的值;
  5. 使用 @import "../assets/bulma/bulma.sass"; 导入Bulma；
源代码可以在此处找到：https://github.com/jacobcollinsdev/eponym，以下是相关代码片段：
@charset "utf-8";
@import url('../assets/bulma/sass/utilities/initial-variables.sass');
@import url('../assets/bulma/sass/utilities/functions.sass');

@import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@500;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Grandstander&display=swap');

$family-serif: "Grandstander", serif;
$family-primary: $family-serif;

@import "../assets/bulma/bulma.sass";


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="assets/css/styles.css">

    <title>Home | Eponym Mag</title>
</head>

我最近开始使用Bulma，我觉得可能需要包含一些文件，但不太确定。有任何见解都将受到赞赏。

谢谢！

2个回答
3
有点晚了，但是：在设置完想要自定义的所有变量后，您需要从Bulma中导入所需的所有内容（这在文档中已经提到了几次）。 此外，还有使用node-sass、Sass CLI和webpack进行自定义的示例。
@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Abhaya+Libre:wght@500;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Grandstander&display=swap');

$family-serif: "Grandstander", serif;
$family-primary: $family-serif;

@import "../assets/bulma/sass/utilities/initial-variables.sass";
@import "../assets/bulma/sass/utilities/functions.sass";
0

也许有点晚了，我曾经遇到过同样的问题。我正在使用带有--watch标志（在后台运行的捆绑包，监视JS / SCSS文件更改）的Rolllup JS。无论我尝试什么，主要文件都没有更新。

当我停止--watch时，我准备放弃了。重新启动Rollup，然后一切就更新了，包括主要文件和其他文件。所以我只需要重新启动我的Rollup。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接