我正在尝试更新 Bulma 中主要字体系列的变量,但似乎什么也没发生。到目前为止,我所做的是:
$family-serif: "Grandstander", serif;$family-primary为等于 的值$family-serif;@import "../assets/bulma/bulma.sass";源代码可以在: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";
Run Code Online (Sandbox Code Playgroud)
<!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>
Run Code Online (Sandbox Code Playgroud)
我最近才开始使用 Bulma,并认为我可能对我需要包含的文件等有些混乱,任何见解都表示赞赏。
谢谢!
有点晚了,但是:在设置您想要自定义的所有变量之后,您必须从 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";
Run Code Online (Sandbox Code Playgroud)